Mẹo thiết kế trang web đa ngôn ngữ với ConveyThis

Nhiều trang web hiện nay có nhiều tùy chọn ngôn ngữ để khách truy cập từ khắp nơi trên thế giới có thể thoải mái duyệt qua. Internet đã giúp thị trường trở thành một trải nghiệm toàn cầu, do đó, khi có một trang web, bạn đã mở ra cánh cửa kinh doanh của mình cho tất cả mọi người có kết nối Internet. Tuy nhiên, nếu họ không hiểu ngôn ngữ, họ sẽ không ở lại. Trang web đa ngôn ngữ thật dễ dàng.

May mắn thay, quá trình biến trang web của bạn thành đa ngôn ngữ khá đơn giản. ConveyĐiều này có thể tạo phiên bản đã dịch của trang web của bạn trong vài phút và sau đó bạn có thể tùy chỉnh giao diện và vị trí của trình chuyển đổi ngôn ngữ, thực hiện một số thay đổi về bố cục để phù hợp với các ngôn ngữ dài dòng hơn hoặc từ phải sang trái và thay đổi màu sắc cũng như hình ảnh trong những trường hợp có bản gốc không phù hợp với nền văn hóa mục tiêu.

Quá trình này không hoàn toàn tự động, bạn sẽ cần thực hiện một số nghiên cứu trước. Hướng dẫn này giải thích một số khía cạnh của thiết kế trang web để giúp bạn thoải mái bước vào thế giới của các trang web đa ngôn ngữ và thiết kế tuyệt vời.

Thương hiệu nhất quán

Trải nghiệm người dùng cần nhất quán bất kể phiên bản ngôn ngữ họ đang truy cập. Giao diện phải rất giống nhau trong tất cả các phiên bản, một số khác biệt có thể cần thiết do sự khác biệt về ngôn ngữ hoặc văn hóa, nhưng nếu bạn chuyển đổi giữa các ngôn ngữ, bạn sẽ không cảm thấy như mình đã được chuyển hướng đến một trang web hoàn toàn khác.

Do đó, các yếu tố thiết kế như bố cục và phong cách xây dựng thương hiệu cụ thể của doanh nghiệp bạn phải giống nhau trên tất cả các ngôn ngữ.

Điều này cực kỳ dễ thực hiện trong WordPress với ConveyThis, giúp xác định hoàn hảo văn bản bất kể chủ đề bạn đã chọn (ngay cả khi nó được tùy chỉnh!) Và tự động dịch nó, ngay cả khi bạn đang làm việc với các plugin khác.

Điều này sẽ giúp bạn có một mẫu toàn cầu có cùng chủ đề cho tất cả các ngôn ngữ và do đó, trải nghiệm người dùng giống nhau.

Trang chủ của Airbnb hoạt động rất tốt là một ví dụ, chúng ta hãy xem phiên bản Úc:

Và đây là bản tiếng Nhật:

Không còn nghi ngờ gì nữa, đây là cùng một trang web. Nền là như nhau và chức năng tìm kiếm cũng vậy. Có một thiết kế thống nhất giúp nhận dạng thương hiệu của bạn, đồng thời tiết kiệm thời gian và công sức khi thêm ngôn ngữ mới hoặc cập nhật.

Xóa trình chuyển đổi ngôn ngữ

Chọn một vị trí nổi bật cho trình chuyển đổi ngôn ngữ, chẳng hạn như bất kỳ góc nào trong bốn góc của trang web của bạn và đặt nó trên mọi trang, không chỉ trang chủ. Nó phải dễ tìm, không ai muốn tìm một nút ẩn.

Rất nên đặt tên ngôn ngữ bằng ngôn ngữ riêng của họ. Ví dụ: “Español” thay vì “Spanish” sẽ rất hiệu quả. Asana làm điều này, trang web của họ có hộp thả xuống với các tùy chọn ngôn ngữ có sẵn.

Bằng cách này, nó giúp du khách cảm thấy được chào đón. Nếu trang web của bạn được dịch, thì danh sách ngôn ngữ sẽ phản ánh điều đó. Đọc “Đức, Pháp, Nhật” trên một trang web tiếng Anh không giúp mọi người điều hướng dễ dàng hơn và nó tạo ấn tượng rằng phiên bản tiếng Anh là phiên bản quan trọng nhất.

'Ngôn ngữ' tốt hơn 'Khu vực'

Nhiều thương hiệu quốc tế lớn yêu cầu bạn chuyển vùng để có thể đọc trang web bằng ngôn ngữ của bạn. Đây là một ý tưởng tồi tệ khiến cho việc duyệt web trở nên khó khăn hơn đối với khách truy cập. Các trang web này đang hoạt động với giả định rằng bạn đang duyệt ở khu vực sử dụng ngôn ngữ đó, vì vậy bạn nhận được văn bản bằng ngôn ngữ của mình nhưng bạn có thể không nhận được nội dung cho khu vực mà bạn quan tâm.

Hình ảnh sau đây được lấy từ trang web Adobe:

Ngôn ngữ không nên tách rời khỏi khu vực của họ. Lấy ví dụ tất cả những thành phố quốc tế như New York, London và Paris. Có thể một người Bỉ sống ở Vương quốc Anh muốn mua hàng từ trang web của Vương quốc Anh nhưng duyệt bằng tiếng Pháp. Họ phải lựa chọn giữa việc mua hàng từ trang web của Bỉ bằng ngôn ngữ của họ hoặc mua hàng từ trang web của Vương quốc Anh bằng tiếng Anh và họ không muốn làm như vậy. Do đó, bạn đã vô tình tạo ra một rào cản. Chúng ta hãy xem một trang web cho phép bạn chỉ định ngôn ngữ và khu vực riêng biệt, trang web Uber.

Đây là thiết kế tuyệt vời. Trong trường hợp này, tùy chọn chuyển đổi ngôn ngữ đã được đặt ở chân trang bên trái và thay vì hộp thả xuống, bạn có một phương thức do có nhiều tùy chọn. Tên ngôn ngữ cũng được gọi bằng ngôn ngữ riêng của họ.

Như một phần thưởng, bạn có thể “nhớ” ngôn ngữ mà người dùng đã chọn để từ lần truy cập đầu tiên trở đi, họ không phải chuyển đổi nữa.

Tự động phát hiện vị trí

Tính năng này cực kỳ hữu ích để khách truy cập của bạn không truy cập sai ngôn ngữ. Và để tiết kiệm thời gian cho người dùng để họ không phải tìm kiếm trình chuyển đổi ngôn ngữ. Đây là cách nó hoạt động: trang web xác định ngôn ngữ của trình duyệt hoặc vị trí của chúng.

Nhưng hãy cẩn thận trong trường hợp người dùng là khách du lịch và không quen với ngôn ngữ địa phương vì họ sẽ cần nút ngôn ngữ để họ có thể chuyển đổi, vì lý do này, công cụ không phải lúc nào cũng chính xác.

Khi thiết kế trang web đa ngôn ngữ của bạn, đừng chọn giữa ngôn ngữ tự động phát hiện và trình chuyển đổi ngôn ngữ, ngôn ngữ sau là bắt buộc trong khi ngôn ngữ trước là tùy chọn.

Cờ không phải là sự thay thế phù hợp cho tên ngôn ngữ

Có 21 quốc gia nói tiếng Tây Ban Nha và 18 quốc gia nói tiếng Anh và ở Trung Quốc, có 8 phương ngữ chính, vì vậy cờ không phải là sự thay thế tuyệt vời cho tên ngôn ngữ. Ngoài ra, cờ có thể không phải là chỉ báo hữu ích vì chúng có thể gây nhầm lẫn cho những người không nhận ra chúng.

Hãy linh hoạt với không gian văn bản

Đây có thể là một thách thức, nhưng không thể phủ nhận rằng các bản dịch không chiếm cùng một không gian với văn bản gốc, một số có thể ngắn hơn, một số khác có thể dài hơn, một số thậm chí có thể cần thêm không gian theo chiều dọc!

Các ký tự tiếng Trung chứa nhiều thông tin nên không cần nhiều khoảng trống, trong khi tiếng Ý và tiếng Hy Lạp dài dòng hơn và cần gấp đôi số dòng. Một nguyên tắc chung là giả định rằng một số bản dịch có thể cần thêm hơn 30% không gian, vì vậy hãy linh hoạt với bố cục và chỉ định nhiều khoảng trống cho văn bản. Những chỗ chật hẹp đó trong trang web gốc có thể không có đủ chỗ cho bản dịch, tiếng Anh là một ngôn ngữ đặc biệt nhỏ gọn và nếu bạn thấy cần phải viết tắt bằng tiếng Anh để nội dung phù hợp, chắc chắn bạn sẽ gặp một số rắc rối khi nó thời gian để dịch.

Bên cạnh việc có khoảng trống để kéo dài văn bản, bạn cũng nên có các phần tử giao diện người dùng thích ứng để các nút và trường nhập liệu cũng có thể phát triển, bạn cũng có thể giảm kích thước phông chữ, nhưng không quá nhiều.

Trang web Flickr đa ngôn ngữ, chúng ta hãy xem nút “lượt xem” ban đầu:

Nó trông tuyệt vời, mọi thứ đều tuyệt vời, nhưng 'lượt xem' hóa ra lại là một từ dài hơn trong các ngôn ngữ khác, cần nhiều không gian hơn.

Trong tiếng Ý, nó cần nhiều không gian gấp ba lần!

Nhiều chữ viết không phải tiếng Latinh, chẳng hạn như tiếng Ả Rập, yêu cầu độ cao cao hơn để bản dịch phù hợp. Vì vậy, tóm lại, bố cục trang web của bạn phải đủ linh hoạt để thích ứng với các yêu cầu ngôn ngữ khác nhau để khi chuyển đổi, giao diện bóng bẩy của bản gốc không bị mất đi.

Khả năng tương thích phông chữ web và mã hóa trang web

Theo W3C, bạn nên mã hóa trang web của mình bằng UTF-8 , cho phép các ký tự đặc biệt.

Nó khá đơn giản, khai báo UTF trông như thế này

Ngoài ra, hãy đảm bảo rằng các phông chữ tương thích với các ngôn ngữ khác nhau, nếu không, văn bản có thể trông không đọc được. Về cơ bản, trước khi quyết định chọn bất kỳ phông chữ nào, hãy kiểm tra khả năng tương thích của nó với tất cả các tập lệnh bạn cần. Nếu bạn muốn thâm nhập thị trường Nga, hãy kiểm tra xem tập lệnh Cyrillic có được hỗ trợ hay không.

Hình ảnh sau đây được lấy từ Google Fonts và như bạn có thể thấy, bạn có thể chọn tải xuống bất kỳ phiên bản tập lệnh nào bạn cần. Những ngôn ngữ có số lượng ký tự lớn hơn sẽ tạo ra các tệp phông chữ lớn hơn, vì vậy hãy tính đến điều đó khi chọn và trộn các phông chữ.

Về các ngôn ngữ từ phải sang trái

Khi thị trường Trung Đông phát triển, bạn có thể xem xét việc tạo một phiên bản trang web của mình để thu hút khách truy cập từ khu vực này, điều này có nghĩa là điều chỉnh bố cục sao cho tương thích với ngôn ngữ của họ. Một tính năng đặc trưng của hầu hết các ngôn ngữ Trung Đông là chúng được đọc từ phải sang trái! Đây là một thách thức lớn và giải pháp bắt đầu bằng việc phản chiếu giao diện.

Đây là thiết kế của Facebook dành cho các ngôn ngữ từ trái sang phải, chẳng hạn như tiếng Anh.

Và đây là thiết kế lộn ngược cho các ngôn ngữ từ phải sang trái, chẳng hạn như tiếng Ả Rập.

Nhìn kỹ, vị trí của mọi thứ trong thiết kế đã được nhân đôi.

Xem bài viết của Robert Dodis về thiết kế cho ngôn ngữ Right to Left để biết thêm thông tin về cách thực hiện việc này.

Một số ngôn ngữ từ phải sang trái là tiếng Ả Rập, tiếng Do Thái, tiếng Ba Tư và tiếng Urdu và ConveyĐiều này dễ dàng điều chỉnh trang web của bạn để đáp ứng các yêu cầu ngôn ngữ của họ và đảm bảo trải nghiệm người dùng tuyệt vời. Và điều tốt nhất là bạn có thể tùy chỉnh giao diện của từng ngôn ngữ và thay đổi loại phông chữ hoặc kích thước của nó, và nếu cần, hãy chỉnh sửa chiều cao của dòng.

Chọn biểu tượng và hình ảnh phù hợp

Hình ảnh có một thành phần văn hóa rất nặng nề và là yếu tố chính của thiết kế trang web phù hợp. Mỗi nền văn hóa gán ý nghĩa cho các hình ảnh và biểu tượng khác nhau, một số cách giải thích là tích cực và một số hoàn toàn ngược lại. Một số hình ảnh phản ánh những trải nghiệm về lý tưởng của một nền văn hóa nhưng trong một bối cảnh khác sẽ khiến người dùng cảm thấy xa lạ.

Đây là một ví dụ về một hình ảnh phải được thay thế vì nó không phù hợp về mặt văn hóa. Xin lưu ý, không phải hình ảnh nào cũng gây phản cảm cho người khác, có thể nó chỉ tạo ra sự thờ ơ khi bạn muốn mọi người tò mò và quan tâm đến sản phẩm của mình.

Đây là trang chủ của Clarin bằng tiếng Pháp, có hình một phụ nữ da trắng. Và đây là phiên bản Hàn Quốc, với một phụ nữ Hàn Quốc làm đại sứ thương hiệu.

Loại hình ảnh có thể gây khó chịu là những hình ảnh có vẻ vô tội đối với một số nền văn hóa, nhưng trong mắt của một nền văn hóa khác, chúng đang thể hiện những hành vi bất hợp pháp hoặc cấm kỵ, chẳng hạn như mô tả về đồng tính luyến ái hoặc trao quyền cho phụ nữ.

Điều này cũng áp dụng cho các biểu tượng, trong khi ở Hoa Kỳ, biểu tượng có hai ly rượu sâm panh đang nâng cốc thể hiện lễ kỷ niệm, ở Ả Rập Xê Út, việc uống rượu là bất hợp pháp nên biểu tượng đó sẽ phải được thay thế bằng biểu tượng phù hợp với văn hóa.

Do đó, cần phải nghiên cứu để đảm bảo rằng các biểu tượng bạn đã chọn phù hợp với thị trường mục tiêu. Nếu bạn không chắc chắn, bạn luôn có thể chơi an toàn.

Ví dụ: ba biểu tượng này có Trái đất, biểu tượng đầu tiên được thiết kế cho khán giả Úc; cái thứ hai, dành cho khán giả châu Phi; và cái cuối cùng phù hợp với lượng khán giả lớn hơn và toàn cầu vì không có khu vực cụ thể nào được giới thiệu.

Cuối cùng nhưng không kém phần quan trọng, ConveyThis có thể dịch bất kỳ văn bản nào, miễn là văn bản đó không được nhúng trong hình ảnh. Phần mềm sẽ không thể xác định nội dung được viết trên đó nên phần mềm sẽ giữ nguyên ngôn ngữ gốc, vì vậy hãy tránh nhúng văn bản.

Lựa chọn màu sắc

Như đã đề cập trong phần trước, các nền văn hóa diễn giải hình ảnh theo cách khác nhau và điều tương tự cũng xảy ra với màu sắc. Ý nghĩa của chúng là chủ quan.

Ví dụ, ở một số nền văn hóa, màu trắng là màu của sự ngây thơ, nhưng những nền văn hóa khác sẽ không đồng ý, đó là màu của cái chết. Điều tương tự cũng xảy ra với màu đỏ, ở các nền văn hóa châu Á, nó được sử dụng trong các lễ kỷ niệm nhưng đối với một số quốc gia châu Phi, nó không mang ý nghĩa tích cực vì nó có liên quan đến bạo lực.

Tuy nhiên, có vẻ như màu xanh lam là màu an toàn nhất trong tất cả các màu, thường được gắn với những ý nghĩa tích cực như bình tĩnh và hòa bình. Nhiều ngân hàng sử dụng màu xanh lam trong logo của họ vì nó cũng có thể có nghĩa là sự tin cậy và an toàn.

Bài viết này chỉ ra sự khác biệt về ý nghĩa màu sắc trên toàn thế giới , rất hữu ích để bạn bắt đầu nghiên cứu về màu sắc tốt nhất cho trang web đa ngôn ngữ của mình.

Điều chỉnh định dạng

Cân nhắc tránh chỉ sử dụng số khi viết ngày vì có nhiều cách khác nhau để viết chúng, ở Hoa Kỳ, định dạng chính thức là mm/dd/yyyy và nếu bạn chỉ có thể nhìn thấy số thì một số người dùng từ các quốc gia khác sử dụng các hệ thống khác nhau (chẳng hạn như dd/mm/yyyy) có thể bị nhầm lẫn. Vì vậy, các lựa chọn của bạn là: đảm bảo rằng các phiên bản đã dịch có định dạng ngày tháng phù hợp hoặc viết tháng bằng chữ cái để ConveyThis luôn ghi ngày tháng chính xác.

Ngoài ra, trong khi ở Hoa Kỳ sử dụng hệ thống đo lường, hầu hết các quốc gia sử dụng hệ thống số liệu, vì vậy bạn sẽ cần phải quyết định xem trang web của mình có phù hợp để chuyển đổi các phép đo hay không.

Plugin dịch thuật tốt nhất cho WordPress

Có rất nhiều tùy chọn khi thêm plugin dịch thuật vào trang web WordPress của bạn và không phải tất cả chúng đều hoạt động theo cùng một cách, kết quả sẽ khác nhau. Với ConveyThis, bạn được đảm bảo tích hợp hoàn hảo bất kể thiết kế trang web của bạn.

ConveyĐây là lựa chọn tốt nhất để dịch trang web với 92 ngôn ngữ có sẵn. Đó là một plugin WordPress đáng tin cậy sẽ cho phép bạn có một phiên bản đa ngôn ngữ vững chắc cho trang web của mình một cách nhanh chóng. Nó có thể hiểu bố cục của trang web, phát hiện tất cả văn bản và dịch nó. ConveyThis cũng bao gồm một trình chỉnh sửa trực quan để tùy chỉnh văn bản.

ConveyĐiều này bao gồm nút chuyển đổi ngôn ngữ một kích thước phù hợp với tất cả, hoạt động với bất kỳ trang web nào theo mặc định, nhưng bạn cũng có thể chỉnh sửa nó bao nhiêu tùy thích. Chúng tôi cũng tuân theo các nguyên tắc thiết kế được nêu trong bài viết này:

• Thương hiệu nhất quán trên tất cả các phiên bản ngôn ngữ của trang web.
• Xóa trình chuyển đổi ngôn ngữ và tùy chọn để chọn ngôn ngữ ưu tiên.
• Các trang web được mã hóa bằng UTF-8 tự động.
• Giao diện phù hợp cho các ngôn ngữ từ phải sang trái

ConveyThis: một giải pháp trang web đa ngôn ngữ mà bạn có thể tin tưởng

Người ta thường tin rằng dịch trang web là một quá trình phức tạp. Nhưng không cần phải hoãn lại vì bạn không muốn giải quyết những vấn đề đau đầu. Nó không khó chút nào! Với ConveyThis, nó trở thành một chuyển đổi đơn giản. Nó là liền mạch và nhanh chóng.

Sau khi cài đặt nhanh, tất cả nội dung của bạn giờ đây có thể được dịch mà không ảnh hưởng đến định dạng và nội dung đó bao gồm nội dung do các ứng dụng khác và quy trình thanh toán tạo ra. ConveyĐây là một công cụ dễ dàng để dịch trang web đa ngôn ngữ mà sẽ không làm rối mã của bạn, giống như những công cụ khác.

Tùy chọn đặt hàng các bản dịch chuyên nghiệp cho trang web của bạn cũng có sẵn! Họ sẽ giúp bạn chuyển đổi hoàn toàn trang web đa ngôn ngữ thành trang web đa văn hóa, cải thiện đáng kể trải nghiệm của khách hàng. Hãy nhớ rằng nếu bạn dịch một trang web, bạn cũng phải có bộ phận hỗ trợ khách hàng bằng ngôn ngữ của khách hàng mới của bạn. Cân nhắc đầu tư vào bản địa hóa và điều chỉnh nội dung để đảm bảo trải nghiệm người dùng tuyệt vời cho khách truy cập của bạn.