Hướng dẫn cơ bản Cách thiết kế nút chuyển đổi ngôn ngữ Squarespace của bạn

bởi Aorinka Anendya
20 tháng 2 năm 2024

Blog > Hướng dẫn > Hướng dẫn cơ bản Cách thiết kế nút chuyển đổi ngôn ngữ Squarespace

Khi tạo một trang web đa ngôn ngữ, việc chú ý đến các yếu tố chuyển đổi ngôn ngữ là rất quan trọng. Người dùng thường xuyên truy cập vào phần này khi muốn chuyển đổi ngôn ngữ.

Điều tương tự cũng xảy ra với bạn với tư cách là chủ sở hữu trang web đa ngôn ngữ Squarespace . Do đó, điều quan trọng là tạo một trình chuyển đổi ngôn ngữ cho Squarespace thân thiện, dễ truy cập và thân thiện với người dùng.

Bài viết này sẽ thảo luận về cách thiết kế trình chuyển đổi ngôn ngữ cho Squarespace, kèm theo các mẹo thiết kế và lý do tại sao bạn nên làm điều đó.

Tại sao nút ngôn ngữ lại quan trọng đối với trang web đa ngôn ngữ Squarespace?

Trước khi thảo luận về cách thiết kế Squarespace , bạn cũng cần hiểu tại sao nút ngôn ngữ lại quan trọng đối với Squarespace đa ngôn ngữ .

Phục vụ khán giả toàn cầu: Một trang web đa ngôn ngữ rất quan trọng đối với các doanh nghiệp muốn mở rộng phạm vi hoạt động ra ngoài biên giới quốc gia. Các nút ngôn ngữ cho phép bạn trình bày nội dung bằng ngôn ngữ ưa thích của đối tượng mục tiêu, giúp trang web của bạn có thể truy cập và hấp dẫn đối với phân khúc thị trường toàn cầu.
Nâng cao trải nghiệm và mức độ tương tác của người dùng: Rào cản ngôn ngữ có thể cản trở đáng kể trải nghiệm của người dùng, dẫn đến nhầm lẫn và tăng tỷ lệ thoát. Các nút ngôn ngữ được thiết kế tốt và triển khai đầy đủ giúp hợp lý hóa việc chuyển đổi giữa các phiên bản ngôn ngữ, đảm bảo trải nghiệm mượt mà và thân thiện với người dùng. Bằng cách cung cấp nội dung bằng ngôn ngữ ưa thích của khách truy cập, bạn có thể tăng mức độ tương tác và cải thiện thời gian dành cho trang web.
Cải thiện khả năng truy cập và tính toàn diện: Tính năng đơn giản nhưng mạnh mẽ này có thể làm cho trang web của bạn trở nên thân thiện và toàn diện hơn, thúc đẩy cảm giác sở hữu đối với những khách truy cập có thể không thành thạo ngôn ngữ chính. Nó cũng giúp tuân thủ các nguyên tắc và quy định về khả năng tiếp cận, thường nhấn mạnh đến việc cung cấp nội dung bằng nhiều ngôn ngữ.
Nâng cao SEO và khả năng hiển thị trực tuyến: Dịch trang web của bạn sang nhiều ngôn ngữ có thể cải thiện thứ hạng và khả năng hiển thị của công cụ tìm kiếm ở nhiều khu vực hoặc thị trường khác nhau. Các nút ngôn ngữ giúp công cụ tìm kiếm hiểu các biến thể ngôn ngữ trên trang web của bạn, đảm bảo rằng nội dung có liên quan được cung cấp cho người dùng dựa trên tùy chọn ngôn ngữ của họ.
Củng cố nhận diện thương hiệu và xây dựng niềm tin: Các nút ngôn ngữ được thiết kế tốt phù hợp với nhận dạng và tông màu hình ảnh thương hiệu của bạn có thể củng cố hình ảnh thương hiệu của bạn. Bằng cách giải quyết nhu cầu ngôn ngữ của khán giả, bạn thể hiện cam kết cung cấp trải nghiệm cá nhân hóa và nhạy cảm về văn hóa, điều này có thể tạo dựng niềm tin và lòng trung thành. Việc chú ý đến những chi tiết này có thể khiến bạn khác biệt với các đối thủ cạnh tranh.
Hỗ trợ quản lý và bản địa hóa nội dung: Với tính năng đa ngôn ngữ của Squarespace Điều này cho phép điều hướng dễ dàng giữa các biến thể ngôn ngữ, hợp lý hóa quy trình quản lý nội dung và bản địa hóa. Nó có thể tiết kiệm thời gian và tài nguyên vì bạn có thể duy trì và cập nhật nội dung đa ngôn ngữ của mình một cách hiệu quả từ một nền tảng tập trung.

Bằng cách đưa các nút ngôn ngữ được thiết kế khôn ngoan vào trang web Squarespace , bạn không chỉ đáp ứng nhu cầu của khán giả đa ngôn ngữ mà còn thể hiện cam kết cung cấp trải nghiệm người dùng vượt trội, thúc đẩy tính toàn diện và định vị thương hiệu của bạn như một đối thủ cạnh tranh toàn cầu trong ngành của bạn.

Tôi nên đặt nút ngôn ngữ Squarespace ở đâu?

Trước khi thảo luận sâu hơn về cách thiết kế nút ngôn ngữ Squarespace , điều quan trọng là phải hiểu vị trí của nút ngôn ngữ để người dùng dễ dàng tiếp cận.

Dưới đây là một số vị trí được đề xuất và ví dụ về các trang web có liên quan sử dụng vị trí nút ngôn ngữ.

tiêu đề

Đặt nút ngôn ngữ trong khu vực tiêu đề là tùy chọn được khuyên dùng nhất. Tiêu đề là yếu tố đầu tiên mà khách truy cập nhìn thấy khi duyệt một trang web.

Bằng cách có nút ngôn ngữ trong khu vực này, mức độ hiển thị và khả năng truy cập từ bất kỳ trang nào trong trang web sẽ trở nên rất cao. Vị trí này cũng phù hợp với thực tiễn thiết kế web tiêu chuẩn, nơi người dùng mong đợi tìm thấy các chức năng quan trọng cho toàn bộ trang web, chẳng hạn như lựa chọn ngôn ngữ, trong tiêu đề.

Một ví dụ về nút ngôn ngữ trong tiêu đề được lấy từ trang web chính thức của Dell.

Chân trang

Mặc dù ít nổi bật hơn đầu trang nhưng chân trang có thể là vị trí thay thế thích hợp cho nút ngôn ngữ trong một số trường hợp nhất định. Giả sử vùng tiêu đề đã chứa đầy các phần tử quan trọng khác. Trong trường hợp đó, chân trang có thể được sử dụng làm nơi đặt nút ngôn ngữ để tránh sự lộn xộn trong điều hướng chính.

Ngoài ra, đối với các trang web có luồng nội dung tuyến tính chủ yếu, nơi khách truy cập có xu hướng cuộn xuống cuối trang, việc đặt nút ngôn ngữ ở chân trang sẽ đảm bảo rằng tùy chọn này vẫn hiển thị và có thể truy cập được sau khi đọc toàn bộ nội dung. Chân trang cũng có thể là lựa chọn phù hợp nếu nút ngôn ngữ là tùy chọn phụ hoặc bổ sung trong khi nút chính nằm trong menu tiêu đề hoặc điều hướng.

Trang Feel Unique đặt nút ngôn ngữ ở chân trang cùng với biểu tượng lá cờ và tên quốc gia.

Thanh bên

Các trang web có bố cục thanh bên có thể sử dụng khu vực đó để đặt nút ngôn ngữ. Bằng cách nằm trong thanh bên, nút ngôn ngữ sẽ luôn hiển thị trong quá trình trải nghiệm duyệt web của người dùng vì thanh bên thường vẫn hiển thị vĩnh viễn trên trang. Điều này đảm bảo sự dễ dàng truy cập cho người dùng bất cứ khi nào cần thiết.

Vị trí trong thanh bên cũng có thể là một giải pháp tốt nếu tiêu đề hoặc menu điều hướng đã chứa đầy các yếu tố quan trọng khác, vì vậy việc thêm nút ngôn ngữ vào khu vực đó sẽ chỉ tạo ra sự lộn xộn. Đối với các trang web có nhiều nội dung hoặc chức năng ở khu vực trung tâm, thanh bên có thể là vị trí lý tưởng cho nút ngôn ngữ, giữ cho nút hiển thị nhưng vẫn dễ dàng truy cập mà không cản trở khu vực nội dung chính.

Dưới đây là ví dụ về trang Lulu Lemon với các nút ngôn ngữ trong menu thanh bên ở bên phải.

Nút nổi hoặc phần tử dính

Tùy chọn cuối cùng là nút ngôn ngữ nổi hoặc dính, đặc biệt dành cho thiết bị di động hoặc trang web có thiết kế tối giản. Trên màn hình nhỏ như thiết bị di động, các nút nổi hoặc nút cố định hiển thị và dễ truy cập hơn so với đặt ở đầu trang hoặc chân trang. Các nút này có thể bị ẩn hoặc yêu cầu cuộn thêm.

Tuy nhiên, cách tiếp cận này cần được thực hiện cẩn thận để tránh làm gián đoạn việc hiển thị nội dung hoặc tạo ra trải nghiệm người dùng khó chịu. Vị trí, kích thước và kiểu dáng của nút phải được xem xét để đảm bảo tích hợp trơn tru với thiết kế trang web tổng thể.

Như bên dưới có một trang Patagonia với các nút ngôn ngữ sử dụng các yếu tố cố định. Bạn có thể tìm thấy nút ở góc dưới bên phải, sau đó một hộp hiển thị sẽ xuất hiện như sau để chọn quốc gia và ngôn ngữ.

Phá vỡ rào cản ngôn ngữ

Nói lời tạm biệt với rào cản ngôn ngữ và chào đón sự phát triển không giới hạn! Hãy thử dịch vụ dịch tự động của chúng tôi ngay hôm nay.

Bắt đầu dịch ngay bây giờ

Bạn thiết kế nút ngôn ngữ Squarespace như thế nào?

Cho đến thời điểm này, bạn đã hiểu tầm quan trọng của nút ngôn ngữ đối với trang web Squarespace đa ngôn ngữ và các đề xuất về vị trí của nút ngôn ngữ. Vì vậy, việc tìm kiếm một dịch vụ dịch thuật cung cấp các tùy chọn tùy chỉnh dễ dàng cho nút ngôn ngữ là điều quan trọng.

Mặc dù các dịch vụ dịch thuật thường cung cấp trình chuyển đổi ngôn ngữ nhưng không phải tất cả đều cung cấp các tùy chọn linh hoạt và dễ dàng tùy chỉnh với nhiều điều chỉnh khác nhau. Tuy nhiên, dịch vụ dịch thuật Linguise là giải pháp dành cho những ai đang tìm kiếm Squarespace .

Đừng lo lắng vì Linguise không áp đặt những hạn chế như vậy. Đây là một dịch vụ dịch tự động cung cấp khả năng tùy chỉnh của người dùng trên nút ngôn ngữ. Dưới đây là một số lợi ích khác mà bạn sẽ nhận được khi sử dụng Linguise trong việc tạo nút ngôn ngữ Squarespace :

Linguise được tích hợp với hơn 40 nền tảng CMS và trình tạo web, bao gồm cả trình tạo web Squarespace
Việc dịch sang nhiều ngôn ngữ khác nhau được thực hiện tự động trong vòng vài giây sau khi bạn thêm chúng vào nút ngôn ngữ trên trang web của mình.
Có hơn 80 ngôn ngữ có thể được thêm vào nút ngôn ngữ.
Linguise tự động tạo các URL duy nhất theo ngôn ngữ dịch đích. Ví dụ: bao gồm mã hreflang, linguise .com/fr/ cho các trang được dịch sang tiếng Pháp.
Nó tự động tạo các URL chuẩn để giúp tránh trùng lặp nội dung trên các công cụ tìm kiếm khi bạn có các biến thể ngôn ngữ trên các trang. Đây là một trong những yếu tố trong SEO đa ngôn ngữ.
Bạn có thể tùy chỉnh nút ngôn ngữ theo nhu cầu trang web của mình, từ biểu tượng, màu sắc cho đến hiển thị tên ngôn ngữ.
Bạn có thể xem số liệu thống kê trang theo ngôn ngữ cho từng ngôn ngữ được thêm vào nút ngôn ngữ.

Không cần phải chờ đợi thêm nữa, đây là các bước để thiết kế nút ngôn ngữ Squarespace của bạn bằng Linguise theo một vài giai đoạn.

Bước 1: Đăng ký tài khoản Linguise

Để thiết kế nút chuyển đổi ngôn ngữ cho trang web Squarespace của bạn bằng Linguise, bước đầu tiên là đăng ký tài khoản trên nền tảng Linguise . Bạn có thể đăng ký miễn phí và sử dụng bản dùng thử miễn phí một tháng, cho phép bạn truy cập nhiều tính năng khác nhau có sẵn trong dịch vụ này.

Bước 2: Thêm trang web miền Squarespace của bạn

Bước tiếp theo là thêm miền trang web vào Linguise . Một số dữ liệu cần phải nhập, bao gồm thông tin tài khoản, URL, lựa chọn nền tảng ( Squarespace ), ngôn ngữ bản địa, ngôn ngữ cần dịch và cài đặt URL dịch.

Bạn có thể xem Linguise dịch tự động trong Squarespace để biết các bước hoàn chỉnh nhằm thêm miền.

Bước 3: Tích hợp nút ngôn ngữ trên Squarespace

Bước tiếp theo là tích hợp Linguise vào trang web Squarespace của bạn bằng cách thêm mã tập lệnh được cung cấp vào trang tổng quan như thế này.

Sau đó, truy cập Squarespace , chọn trang web bạn muốn tạo đa ngôn ngữ, điều hướng xuống dưới và chọn Công cụ trang web.

Tiếp theo, trong menu Công cụ trang web, chọn tùy chọn Chèn mã.

Sau đó là HEADER và FOOTER . Nếu bạn muốn nút ngôn ngữ trong tiêu đề, hãy đặt mã vào HEADER . Tương tự như vậy nếu bạn để ở footer thì nhập mã code vào FOOTER .

Bước 4: Thiết lập cờ ngôn ngữ hiển thị Squarespace

Sau khi tích hợp Linguise và Squarespace, Linguise sẽ tự động tạo nút ngôn ngữ trên trang web Squarespace . Tuy nhiên, ngoại hình vẫn là mặc định.

Do đó, bạn có thể tùy chỉnh thiết kế của nút ngôn ngữ trong một vài bước.

Đảm bảo bạn đã đăng nhập vào Linguise rồi chọn Cài đặt > Hiển thị cờ ngôn ngữ. Sau đó, một số phần sẽ xuất hiện, phần đầu tiên như sau.

Trong phần này có một số cài đặt:

Hiển thị danh sách
Chức vụ
xem trước ngôn ngữ

Các tùy chọn hiển thị danh sách có 3 tùy chọn là cạnh nhau, thả xuống và bật lên. Dưới đây là bản xem trước của ba tùy chọn.

Sau đó, đối với vị trí của nút ngôn ngữ, Linguise cung cấp một số vị trí mà bạn có thể chọn.

Tiếp theo là điều chỉnh vị trí, nơi bạn có thể chọn vị trí đặt trình chuyển đổi ngôn ngữ. Bạn có nhiều tùy chọn vị trí để lựa chọn. Đảm bảo bạn chọn một vị trí mà khách truy cập có thể dễ dàng tiếp cận.

Cuối cùng, chọn kết hợp cờ + tên ngôn ngữ, cờ + tên viết tắt hoặc chỉ cờ.

Bước 5: Đặt thiết kế cờ trên nút ngôn ngữ

Bên dưới giao diện chính có phần cài đặt thiết kế cờ. Một số tùy chọn cài đặt được hiển thị trong hình ảnh bên dưới.

Hiển thị tên ngôn ngữ: Bạn có thể chọn hiển thị tên dựa trên quốc gia hoặc ngôn ngữ, ví dụ: “Đức” hoặc “Tiếng Đức”.
Loại cờ tiếng Anh: Tùy chọn này được sử dụng cho các ngôn ngữ có nhiều loại, chẳng hạn như “Tiếng Anh Hoa Kỳ” hoặc “Tiếng Anh nước Anh” (tương tự như tiếng Tây Ban Nha, tiếng Đài Loan, tiếng Đức và tiếng Bồ Đào Nha).
Kiểu cờ: Dùng để xác định hình dạng của biểu tượng lá cờ, hình tròn hay hình vuông (hình chữ nhật).

Bước 6: Tùy chỉnh cờ màu sắc và kích thước

Sau khi định cấu hình thiết kế cờ, bước tiếp theo là điều chỉnh màu sắc, kích thước và nhiều yếu tố khác. Trong màn hình sau đây, có một số cài đặt có thể tùy chỉnh, chẳng hạn như:

Bán kính đường viền cờ: Điều chỉnh bán kính đường viền theo pixel khi sử dụng hình chữ nhật.
Màu tên ngôn ngữ: Chọn màu văn bản mặc định cho tên ngôn ngữ.
Màu ngôn ngữ bật lên: Màu của tiêu đề ngôn ngữ trong khu vực bật lên hoặc thả xuống.
Kích thước cờ: Điều chỉnh kích thước của cờ.
Màu tên ngôn ngữ di chuột: Màu văn bản khi di chuột qua tên ngôn ngữ.
Màu ngôn ngữ bật lên khi di chuột: Văn bản khi chuột di chuột qua tiêu đề ngôn ngữ trong cửa sổ bật lên hoặc thả xuống.

Bước 7: Điều chỉnh nút bóng hộp cờ

Ở giai đoạn cuối, bạn có thể định cấu hình cài đặt bóng cho cờ. Cài đặt đầu tiên cho phép bạn chỉ định bóng cho từng cờ trên trang web của mình và cài đặt tiếp theo dành cho bóng trên cờ ngôn ngữ khi được di chuột qua.

Nếu bạn hài lòng, đừng quên chọn Lưu để giữ lại các tùy chỉnh trình chuyển đổi ngôn ngữ của bạn.

Bạn có thể sử dụng các tính năng thiết kế nút chuyển đổi ngôn ngữ Squarespace này trong Linguise. Bạn có thể điều chỉnh các cài đặt ở trên cho phù hợp với nhu cầu trang web của mình.

Dưới đây là ví dụ về giao diện của trang web Squarespace với các nút ngôn ngữ thiết kế tùy chỉnh.

Thật dễ dàng phải không? Một số người có thể thắc mắc nút ngôn ngữ Squarespace bên phải nằm ở đâu để người dùng có thể dễ dàng tiếp cận. Chúng ta sẽ thảo luận thêm về vấn đề này.

Sẵn sàng để khám phá thị trường mới? Dùng thử miễn phí dịch vụ dịch tự động của chúng tôi với 1 tháng dùng thử không rủi ro. Không cần thẻ tín dụng!

Yêu cầu bản dùng thử miễn phí 1 tháng của bạn

Mẹo thiết kế nút chuyển đổi ngôn ngữ Squarespace

Bây giờ bạn đã biết cách tạo nút ngôn ngữ Squarespace , tiếp theo là hoàn thiện nó bằng cách thực hiện các mẹo sau:

Vị trí chiến lược – Xác định vị trí để đặt nút chuyển đổi ngôn ngữ trên Squarespace . Đặt nút ở khu vực mà khách truy cập dễ dàng tìm thấy, chẳng hạn như đầu trang, menu điều hướng, chân trang hoặc thanh bên. Xem xét luồng của khách truy cập khi duyệt trang web của bạn và đảm bảo nút vẫn hiển thị và có thể truy cập dễ dàng trên tất cả các trang của trang web.
Lựa chọn kiểu phù hợp – Chọn kiểu cho trình chuyển đổi ngôn ngữ thiết lập phù hợp với đặc điểm và thiết kế tổng thể của trang web của bạn. Bạn có thể sử dụng văn bản, cờ hoặc biểu tượng chung để thể hiện các tùy chọn ngôn ngữ. Tùy chỉnh kiểu nút để phù hợp với thương hiệu trang web của bạn nhằm mang lại sự nhất quán và hấp dẫn trực quan. Ngoài ra, hãy chọn kiểu dễ nhận biết và phổ biến để khách truy cập có thể nhanh chóng xác định và sử dụng nút.
Đặt tên rõ ràng – Đảm bảo tên ngôn ngữ hiển thị trên nút chuyển đổi ngôn ngữ rõ ràng và dễ hiểu đối với khách truy cập. Tránh sử dụng các chữ viết tắt hoặc mã có thể gây nhầm lẫn cho người dùng. Sử dụng tên ngôn ngữ mà đa số người dùng trang web của bạn thường hiểu. Ngoài ra, hãy cân nhắc việc cung cấp văn bản hoặc chú giải công cụ thay thế nhằm cung cấp thông tin bổ sung về từng ngôn ngữ để nâng cao hiểu biết của người dùng.
Chuyển tiếp mượt mà – Thực hiện chuyển đổi ngôn ngữ mượt mà mà không cần tải lại toàn bộ trang. Bạn có thể sử dụng các công nghệ như AJAX hoặc JavaScript để tạo chuyển tiếp liền mạch giữa các ngôn ngữ mà không làm gián đoạn trải nghiệm người dùng. Ngoài ra, còn cung cấp tín hiệu trực quan cho người dùng trong quá trình chuyển đổi ngôn ngữ, chẳng hạn như hoạt ảnh hoặc thông báo rõ ràng.
Khả năng phản hồi trên thiết bị di động – Thiết kế nút chuyển đổi ngôn ngữ để phản hồi nhanh và có thể thích ứng về kích thước cũng như hình thức cho các thiết bị di động khác nhau. Hãy xem xét một cách tiếp cận nhỏ gọn hoặc sử dụng các biểu tượng phản hồi để đảm bảo nút vẫn dễ dàng truy cập và sử dụng ngay cả trên màn hình nhỏ hơn. Đảm bảo nút vẫn hiển thị và hoạt động phù hợp trên nhiều thiết bị và kích thước màn hình khác nhau.
Tính nhất quán trên các trang – Duy trì tính nhất quán về kiểu dáng, vị trí và chức năng của nút chuyển đổi ngôn ngữ trên trang web của bạn. Điều này sẽ giúp tạo trải nghiệm người dùng mượt mà và gắn kết hơn khi điều hướng giữa các trang trên trang web. Đảm bảo nút chuyển đổi ngôn ngữ có hình thức và hoạt động nhất quán trên tất cả các trang của trang web để tránh nhầm lẫn cho người dùng.
Kiểm tra và sàng lọc – Tiến hành kiểm tra kỹ lưỡng nút chuyển đổi ngôn ngữ trên nhiều thiết bị, trình duyệt và kịch bản người dùng khác nhau. Điều này bao gồm kiểm tra chức năng chuyển đổi ngôn ngữ, khả năng phản hồi của nút và độ rõ ràng của cách đặt tên ngôn ngữ. Sử dụng phản hồi từ quá trình kiểm tra của người dùng để điều chỉnh cũng như tinh chỉnh thiết kế và chức năng của nút nhằm đáp ứng nhu cầu và sở thích của người dùng.

Hãy thiết kế nút ngôn ngữ Squarespace của bạn bằng Linguise ngay từ bây giờ!

Bây giờ bạn đã hiểu tại sao nút ngôn ngữ lại quan trọng đối với trang web Squarespace đa ngôn ngữ, cách thiết kế nút ngôn ngữ Squarespace và mẹo tạo nút đó.

Bằng cách thiết kế chính xác nút chuyển đổi ngôn ngữ, bạn có thể nâng cao đáng kể trải nghiệm người dùng trên trang web Squarespace của mình. Điều này sẽ có nhiều tác động khác nhau, như đã giải thích trước đó.

Vậy còn chờ gì nữa? Đăng ký Linguise , đăng ký Squarespace và tùy chỉnh cấu hình nút chuyển đổi ngôn ngữ để mang lại trải nghiệm tốt hơn cho người dùng.