Điều hướng trang html
|
Nếu khách hàng không thể tìm thấy trang mình muốn truy cập trên trang web Điều hướng (Menu Navigation) của bạn. Thì hãy chắc chắn rằng tỷ lệ thoát sẽ tăng lên và thời gian họ dành cho trang web của bạn sẽ ít đi Show Những điều này sẽ gây ảnh hưởng tiêu cực đến lợi nhuận và doanh thu của bạn. Vì vậy, làm cách nào để cải thiện Menu Website? Trong bài viết này, các phương pháp thực hiện Điều hướng web là gì sẽ được liệt kê chi tiết, đa dạng và chính xác nhất. Bạn có thể tạo nên Navigation Web hoàn hảo cho trang web của mình. Please start the same nhé Web Navigation (điều hướng trang web) là quá trình điều hướng trang, được ứng dụng vào hầu hết các trang web trên Internet. Nói đơn giản, nó là quá trình liên kết các trang nội bộ lại với nhau Web Navigation sử dụng menu chứa các Internal Link của website nhằm giúp khách hàng dễ dàng tìm thấy trang họ cần. Chuyển hướng tốt sẽ ảnh hướng đến mức độ thân thiện của trang web đối với người dùng Menu Navigation (menu điều hướng) là một tập hợp các liên kết được tổ chức thành một menu. Thông thường, menu sẽ được đặt ở đầu trang Một số trang phổ biến trong danh mục Trang web điều hướng thường là
Bạn sẽ có nhiều liên kết trang khác tùy thuộc vào mục đích và loại hình Trang web của mình Cấu hình điều hướng cấu trúc (Navigation Structure) của Website mô tả cách mà các trang khác nhau trên Website bạn được tổ chức và kết nối với nhau Các nhà thiết kế và phát triển Web thường lập kế hoạch Cấu trúc điều hướng trước khi tạo một trang web mới. Ví dụ. Bạn chỉ truy nhập một số trang và nội dung đã truy nhập một trang cụ thể rồi. Kế hoạch trong hình dưới đây, nếu bạn muốn truy cập trang Nhiệm vụ, bạn cần phải truy cập trang About before Như đã nói ở phần giới thiệu, việc khách truy cập gặp khó khăn trong quá trình tìm kiếm website họ cần trong menu Navigation Web Việc xây dựng danh mục một cách dễ hiểu và sắp đặt sẽ giúp trải nghiệm khách hàng cải thiện tốt hơn. Từ đó, thời gian họ dành cho trang web sẽ nhiều hơn và tỷ lệ chuyển đổi cũng sẽ cao hơn Điều hướng web là gì, có bao nhiêu loại?
Khi kết hợp đúng cách, những loại Web Navigation này sẽ giúp khách hàng đến được Website họ cần dễ dàng hơn Đối chiếu với loại Web Navigation toàn cục bộ. Thanh menu và các kết nối được thiết kế giống nhau trên tất cả các trang. Hầu hết các website hiện nay đều phát triển theo hướng này. Dù cho khách hàng có click vào trang con nào của Website thì thanh Menu này đều đi theo. Khi người dùng cuộn trang thì thanh menu này vẫn được hiển thị Trong ảnh chụp màn hình ở đây, bạn sẽ thấy menu thanh của GTV SEO rất đơn giản và dễ hiểu. Thanh Menu này hoạt động trong hầu hết các trang, chúng bao gồm những phần quan trọng nhất. Từ đó người dùng sẽ tìm thấy và chuyển hướng bất cứ khi nào họ muốn Tương tự như thanh menu đầu trang, cuối trang cũng được thiết lập theo loại web Điều hướng toàn cục. Bạn sẽ thấy các thông tin quan trọng ở đây Global Menu is the most standard type. WordPress cũng cung cấp các Chủ đề cho phép bạn tạo điều hướng Web theo yêu cầu. Bạn cũng có thể thêm Plugin để có thêm nhiều tùy chọn hơn Hierarchical Navigation Web có nghĩa là các menu sẽ thay đổi tùy chọn theo ngữ cảnh của từng trang. Hầu hết các tờ báo và Website chuyên về Nội dung đều sử dụng loại chuyển hướng này. Ví dụ. Nếu bạn nhấp vào trang đầu của một tờ báo. Bạn sẽ thường thấy các liên kết đến các mục tin tức hàng đầu trong menu tiêu đề Nếu Menu được thiết kế theo dạng chuyển hướng toàn cục, nó sẽ giữ nguyên sau khi bạn nhấn vào danh mục. Ví dụ như mục Thế giới của Kênh14. Sau khi vào mục thế giới, thanh menu vẫn không thay đổi  Tuy nhiên, nếu bạn nhấn vào mục Video. Menu đầu trang này sẽ biến mất thay vào đó là menu nhỏ hơn với các mục như Tin tức video, Xem mua luôn, Thư giãn, Đời sống xã hội… Và phần mở rộng đến các mục khác mà bạn sẽ quan tâm. Left ngược với chuyển hướng phân cấp và chuyển hướng toàn cục. Local Navigation Web là các Liên kết nội bộ (Internal Link) được gài khéo léo vào bài viết Bạn sẽ dễ dàng bắt gặp loại Điều hướng Web này trên các trang tạp chí, Blog chuyên về nội dung số (GTV SEO là một điển hình ví dụ). Nó giúp người đọc dễ dàng tìm hiểu sâu hơn về vấn đề mà họ đang thực sự quan tâm Điều hướng trang web là gì tùy chỉnh màu sắc, kiểu chữ tùy theo người thiết lập. Trong trường hợp này nó được tô màu xanh da trời để phân biệt với các chủ đề thông thường khác Thay vì tập trung vào lý thuyết, chúng ta hãy đi sâu vào ví dụ Web Navigation là gì. Tôi sẽ trình bày xoay quanh Website tin tức. Thời báo New York (NYT) Nhìn có vẻ như The New York Times chủ yếu sử dụng Menu tiêu đề toàn cầu duy nhất cho các danh mục. Nhưng đó không phải. NYT sử dụng tất cả các loại Web điều hướng trên hàng trăm trang mục và hàng triệu bài báo Các loại web Navigation is anything used to Bây giờ, chúng ta cùng xem các Header Navigation khác nhau cho mỗi Page nào Ví dụ 1. Trang chủIn Header Section of Website NYT bao gồm hai Menu. Một Menu toàn cục (Menu Toàn cầu) và một phân cấp (Menu Phân cấp). Về bản chất, nó giống như cách bạn thiết lập Header và Sub-Header vậy Nếu bạn nhấp vào biểu tượng hình bánh Hamburger (Biểu tượng 3 dấu gạch ngang) trên Tiêu đề. Lúc này trang web sẽ hiển thị một Web điều hướng ở phía bên trái, nơi có khoảng cách đủ rộng và phù hợp với hầu hết các thiết bị hiện đại. Thanh Navigation Web này không hề che khuất đi bất kỳ chủ đề nào trên Website Ví dụ 2. Trang chủ (Di động)Phần lớn người dùng Internet truy cập các Trang web thông tin tức thời qua điện thoại của họ. Vì trải nghiệm Mobile quan trọng hơn trải nghiệm trên Desktop Menu tiêu đề phụ của mục tin tức không phải là một phần của trang chủ trên thiết bị di động. Thay vào đó, bạn chỉ có tùy chọn mở rộng có sẵn. Khi được mở rộng, nó sẽ trở thành Menu toàn màn hình và che đi tất cả nội dung trên trang chủ Bao gồm mọi tùy chọn từ menu chính trên Máy tính để bàn và các Liên kết được sắp xếp gọn gàng theo mục Ví dụ 3. Trang danh mụcTrên trang danh mục, bên dưới Header Hamburger Menu. Bạn sẽ thấy liên kết đến một tập hợp các mục khác Nó giúp những người chỉ quan tâm đến một lĩnh vực cụ thể trong chủ đề rộng lớn hơn. Và dễ dàng tìm thấy các bài viết phù hợp hơn với sở thích của họ Ví dụ 4. Trang danh mục (Di động)Trên thiết bị Di động, các trang danh mục này bao gồm cùng một Menu và cấu trúc Header Hamburger giống như phiên bản dành cho Desktop. Menu Tiêu đề Phụ hoàn toàn không bị ẩn để giúp Điều hướng Web và khám phá nội dung dễ dàng hơn Một lý do khác là nhiều trải nghiệm Di động bắt đầu thông qua tìm kiếm Tìm kiếm hoặc Mạng xã hội. Thay vì vào trực tiếp trang chủ NYT Ví dụ 5. Điều duy nhấtĐối chiếu với các Single Article, Header floating để biết phần mà bạn hiện đang tham gia. Nhưng nó chỉ có Global Menu là mở rộng (cùng với Search Box – hộp tìm kiếm) Ví dụ 6. Single Article (Di động)Trên thiết bị Di động, Điều hướng web rõ ràng được duy trì vì Menu duy nhất là Menu Hamburger tiêu đề Menu Footer of NYT giống nhau trên trang chủ, các trang mục và các Bài viết đơn Trên thiết bị Mobile, Footer Menu chỉ hiển thị 5 mục Menu. Tất cả đều mở rộng thành các phần phụ sau khi được nhấp vào. Ví dụ. nếu nhấp vào phần Arts, bạn sẽ duyệt qua các phần phụ sau Vì Trang web sử dụng JavaScript để tải xuống nhiều nội dung hơn là khi cuộn xuống, Chân trang sẽ hoàn toàn không tồn tại. Đó là một thủ thuật thu gọn giúp chỉnh sửa thời gian trên Trang web. Và thu hút người đọc đọc nhiều bài viết hơn, nhưng nó khiến Website khó Navigation Web hơn một chút Một số người sẽ tranh luận Công cụ điều hướng mà Báo và Blog sử dụng không chỉ là Menu. Chính bố cục tuyên bố đã cung cấp Web điều hướng xương sống cho NYT và các trang tương tự khác Tất cả các yếu tố được đánh dấu đều được nhấp và đến các trang nội bộ khác nhau trong Trang web của New York Time. Bố cục nội dung cục bộ là một yếu tố quan trọng khác của Điều hướng web là thứ mà chúng khai thác trên trang chủ và các mục khác Dù bạn có là một người hoàn toàn không biết Web Navigation là gì thì. Sau khi tìm hiểu 8 mẹo được giới thiệu dưới đây, bạn cũng sẽ học được phương pháp ứng dụng đúng cách cho Website của mình Trước khi bạn viết Nội dung cho Website của mình. Please up plan to Page Structure (cấu trúc trang) and Web Navigation is what before. Đây là một bước quan trọng, nó ảnh hưởng đến mức độ hài lòng của khách hàng vào Website sau này Để tạo cấu trúc trang và Web điều hướng. Bạn có thể sử dụng cách thủ công hoặc sử dụng trình tạo sơ đồ trang Web để tạo mô hình một cách nhanh chóng hơn. Có nhiều chương trình tạo mà bạn có thể lựa chọn, ví dụ như GlooMaps, Octopus, VisualSitemaps, Creately Đừng cố gắng tạo ra một điều gì đó quá khác biệt. Phải biết Điều hướng web là gì và chú trọng khả năng sử dụng chứ không phải là tính sáng tạo Các tiêu chuẩn thông thường như vị trí đặt Menu, dấu hiệu mở rộng Menu phải được thực thi theo. Ví dụ. Ba sọc ngang ☰ (hoặc ba chấm, chữ V) là tiêu chuẩn xác định một Menu mở rộng. Nếu bạn áp dụng cho Website của mình thì nên giữ nguyên như cũ để khách hàng dễ dàng nhận biết. nút 3. Sử dụng từ ngữ dễ hiểu với khách truy cậpThay vì dùng những từ ngữ quá chuyên ngành, tối nghĩa. Vui lòng đặt mình vào vị trí là người đầu tiên vào Trang web để tìm cách sử dụng từ ngữ thích hợp mẹo này không giữ khách lại lâu hơn mà nó còn giúp ích cho quá trình SEO của bạn. Hãy chắc chắn rằng trang của bạn có thể hiển thị kết quả cho những câu hỏi. Cũng giống như từ ngữ mà khách hàng thường xuyên tìm kiếm trực tuyến Hiện nay lượng người sử dụng Mobile để tìm kiếm trên Google ngày càng lớn (hơn 50% trực tuyến). Vì thế, việc sử dụng Responsive Menu là điều kiện cần thiết Responsive Menu có khả năng thay đổi tùy thuộc vào kích thước màn hình của thiết bị. Các phông chữ sẽ không bị lung tung hoặc Menu sắp xếp lộn xộn chèn ép trong khung hình. Sự thay đổi nhanh của Responsive Menu sẽ mang lại trải nghiệm tốt và mượt mà hơn cho khách hàng Khách truy cập đọc và cuộn đến trang web cuối cùng là những người có dấu hiệu muốn tương tác nhiều hơn với trang web của bạn. Hãy tận hưởng khoảng trống cuối mỗi trang để tận hưởng khoảng trống để đặt những nội dung có giá trị Vì vị trí Footer Menu không chiếm không gian của bài viết mà ở một khu vực riêng biệt. Bạn sẽ dễ dàng thêm vào nhiều mục, chủ đề tài nguyên nóng của trang mà không sợ tạo cảm giác lộn ngược. Xem ví dụ sau. Trong cấu hình là Footer trang của GTV SEO, các thông tin quan trọng như Dịch vụ SEO, Dịch vụ SEO tại Hà Nội, Đào tạo SEO sắp được xếp hạng rất rõ ràng ở phần Footer. Bạn sẽ chuyển hướng đến các trang con này một cách nhanh chóng chỉ bằng cú nhấp chuột Sử dụng màu sắc, phông chữ khác biệt và khoảng trắng để tách Menu khỏi nội dung chính và thanh phụ của bạn. Hãy phân chia rõ ràng khu vực của Web Navigation là gì để khách hàng dễ dàng nhận ra Ngoại trừ trường hợp trang Web của bạn có quá nhiều trang mang các tính chất khác nhau. Hãy giới hạn chế độ sử dụng Menu thả xuống, khi người dùng nhìn thấy một liên kết trong Menu, họ sẽ mặc định rằng nó có thể nhấp một lần được. Vì thế để tránh nhầm lẫn, hãy giảm xen kẽ số lượng Menu thả xuống. Hoặc đặt dấu hiệu nhận biết cho chúng tôi như thêm dấu ba chấm ngang hoặc chữ V như GTV SEO Việc có quá nhiều đường Link trên thanh Menu chính có thể gây tác động tiêu cực đến người dùng. Trình đơn khai báo Dropdown lúc này sẽ là một phương án tốt để thanh menu không bị rối mắt. Tuy nhiên hãy nhớ đừng quá lạm dụng chúng nhé Nếu bạn muốn giúp khách truy cập khám phá tất cả các trang trên Web của mình một cách dễ dàng nhất. Hãy duy trì cấu trúc điều hướng cấu trúc càng đơn giản càng tốt. Thay vì liên kết hàng loạt trang, trang con của chúng tôi thông qua Trang chủ, hãy giữ mọi thứ đơn giản Bạn cần đảm bảo rằng các danh mục quan trọng được liên kết đến trang chủ trước tiên. Sau đó mới đặt các liên kết nhỏ hơn trong mục phụ Kết luậnBài viết này chắc chắn đã mang đến cho bạn một cái nhìn rõ ràng hơn về Web Navigation là gì. Và các nguyên tắc cần thiết khi xây dựng Web điều hướng Bạn nên nhớ, chuyển hướng trang cần được thiết kế một cách đơn giản và rõ ràng. Cố gắng làm theo các phương pháp hay nhất mà bạn có và dành thời gian lựa chọn từ ngữ thích hợp. Chúng sẽ giúp bạn làm cho khách truy cập và công cụ tìm kiếm có thể tìm thấy trang web nội dung một cách dễ dàng hơn |
