6 lời khuyên từ Google khi thiết kế Website đa ngôn ngữ

Rất nhiều Website sử dụng hơn một ngôn ngữ làm ngôn ngữ chính của mình. Xây dựng và thiết kế website đa ngôn ngữ không đơn giản chỉ là dịch văn bản, chuyển đổi ngôn ngữ. Để đạt chuẩn Google, nó yêu cầu nhiều hơn thế và đòi hỏi bạn phải xử lý kỹ thuật một cách khéo léo đối với Website. Dưới đây là 6 lời khuyên từ Google dành cho các website đa ngôn ngữ.

1. Khai báo chính xác ngôn ngữ trên thẻ HTML

Luôn luôn sử dụng 2 tag @lang và @dir trong thẻ HTML ở đầu trang.

<html lang="vi" dir="ltr">

2. Sử dụng một tập tin CSS cho tất cả ngôn ngữ

Thay vì định dạng mỗi ngôn ngữ và cách căn lề vào mỗi tập tin CSS riêng biệt, bạn hãy gom hết tất cả vào một tập tin CSS duy nhất. Sau đó sử dụng các thẻ CSS để dịnh dạng.

3. Sử dụng thuộc tính [dir='rtl']

Khi sử dụng một tập tin CSS cho tất cả các ngôn ngữ như ở #2, đòi hỏi bạn phải xử lý lại đoạn mã CSS bằng cách thêm thuộc tính vào đầu mỗi CSS Tag muốn định dạng.

aside {
float: right;
margin: 0 0 1em 1em;
}

[dir='rtl'] aside {
float: left;
margin: 0 1em 1em 0;
}

4. Sử dụng :lang()

Thủ thuật nhỏ này trong CSS sẽ giúp bạn định dạng một CSS Tag chỉ áp dụng riêng với một ngôn ngữ mà bạn đã khai báo đầu trang trong thẻ HTML.

Ví dụ để định dạng từ đậm trong văn bản ở ngôn ngữ Tiếng Việt, bạn điều chỉnh đoạn mã CSS như sau:

:lang(vi) strong,
:lang(vi) b {
font-weight: normal;
color: #900;
}

5. Thay đổi cách đọc văn bản tương ứng

Đối với tiếng Việt và các ngôn ngữ khác sử dụng bảng ký tự Latin, chúng ta thường đọc từ trái sang phải, tuy nhiên một vài ngôn ngữ lại đọc ngược lại, điều này rất khó trong điều chỉnh CSS khi bạn định dạng bằng cách sử dụng text-align hoặc float, …

Google đề xuất sử dụng công cụ CSSJanus để tự động điều chỉnh phần này.

6. Truyền đạt hiệu quả nội dung

Sử dụng các ngôn ngữ khách nhau, bạn cần phải thiết kế các hình ảnh, sử dụng các hiệu ứng,… khác nhau và thay đổi phù hợp.
Kích thước và kiểu font chữ, đặc biệt các font chữ không thuộc Latin, tuỳ thuộc vào thiết kế của website mà điều chỉnh font chữ phù hợp.
Khi sử dụng [dir='rtl'] hoặc [dir='ltr'], một vài trình duyệt có thể không hoạt động, bạn cần phải kiểm tra và điều chỉnh.

Tin tức & Sự kiện

Hỗ trợ trực tuyến

Thống kê truy cập

6 lời khuyên từ Google khi thiết kế Website đa ngôn ngữ

Tin tức & Sự kiện khác