Plugin siêu cuộn vô hạn của WordPress. Trong trường hợp nào nên sử dụng. Ưu điểm và nhược điểm của cuộn vô hạn

Bạn đã bao giờ nghiên cứu cách mọi người tiêu thụ nội dung web chưa? Họ xem hàng trăm trang mỗi ngày. Đọc khi đang di chuyển, tập trung vào hình ảnh và văn bản được đánh dấu in đậm. Hơn nữa, họ quét trang nhiều hơn là đọc.

Đây là lý do tại sao việc cuộn vô hạn đã trở nên phổ biến; nó tiết kiệm thời gian khi đọc các trang web. Bị thúc đẩy bởi nỗi sợ hãi thường trực về việc bỏ lỡ điều gì đó, mọi người thích nhận tất cả nội dung một cách nhanh chóng trong một trang.

Trong bài viết này, chúng ta sẽ đi sâu vào một phương pháp sử dụng nội dung cụ thể, cuộn vô hạn và xem xét một số ví dụ thú vị.

Cuộn vô hạn là gì?

Cuộn vô hạn là một kỹ thuật cho phép bạn tải Nội dung mới vào trang khi bạn cuộn qua nó. Tùy thuộc vào tình huống, nội dung có thể được tải xuống ngay lập tức hoặc chia thành các phần phụ xuất hiện theo yêu cầu chỉ bằng một nút bấm.
Người ta cho rằng tính năng cuộn vô hạn được phát triển như một giải pháp thay thế nhanh hơn, thân thiện hơn với người dùng cho việc phân trang. Nhưng điều này có đúng không?
Trong thực tế, tất cả phụ thuộc vào tình hình. Không có lý do gì để tải hàng trăm trang nội dung cùng một lúc để điều hướng dễ dàng; rất có thể nhiều người sẽ bỏ cuộc giữa chừng. Do đó, có vẻ đáng để phân tách các trường hợp sử dụng thành những trường hợp phù hợp cho việc cuộn vô hạn và những trường hợp cần một giải pháp thay thế.

Sử dụng tính năng cuộn vô hạn ở đâu?

Lý do chính để sử dụng tính năng cuộn vô hạn trên một trang là dành cho nội dung dài cần thu hút sự chú ý của khách truy cập. Mọi thứ có vẻ đơn giản nhưng nội dung phải lớn và có hệ thống phân cấp phẳng. Nếu không, các lựa chọn thay thế cần được xem xét.

Đối với mạng xã hội

Trên mạng xã hội và blog, tất cả các bài viết đều tương đối bình đẳng. Chà, một số trong số chúng có thể ít nhiều thú vị, nhưng sẽ quá chủ quan nếu chia chúng thành các danh mục phụ. Các nền tảng như Facebook hay Twitter cập nhật theo thời gian thực và rời đi Câu chuyện trước tin nhắn. Điều này làm cho họ thực sự không đáy.

Không kém nội dung quan trọng

Giả sử có một trang web (một phòng trưng bày nghệ thuật tương tác) có mục đích truyền cảm hứng cho người xem về những hình ảnh được trình bày trên đó. Trong tình huống như vậy, theo quy luật, mọi người không tìm kiếm điều gì đó cụ thể. Thay vào đó, họ sẽ cuộn đi cuộn lại cho đến khi tìm thấy thứ gì đó bắt mắt. Ở đây, điều bạn có thể làm nhiều nhất là để họ sắp xếp kết quả dựa trên mức độ gần đây hoặc mức độ phổ biến.

giao diện di động

Điện thoại thông minh và máy tính bảng đã biến việc cuộn vô hạn thành một hành động trực quan cho người dùng di động. Nó cho phép người dùng không phải tải xuống tất cả nội dung cùng một lúc, do đó làm cho ứng dụng hoặc trang web di động nhẹ hơn.

Để kể chuyện

Vì vậy, cách cuộn vô hạn là điều cần thiết để thu hút sự quan tâm và tương tác của người dùng. Tuy nhiên, nó phải được sử dụng một cách khôn ngoan, chỉ khi thực sự cần thiết.

Chào mọi người. Hôm nay tôi muốn nói chuyện với các bạn về cách tổ chức" lười tải» nội dung trên trang đích.

Thông thường, nó còn được gọi là “cuộn vô hạn”. Bạn có thể đã thấy hiệu ứng tương tự khi nội dung ban đầu không xuất hiện trên trang web, nhưng khi bạn cuộn trang, nội dung đó sẽ được tải một cách mượt mà.

Cách đây rất lâu, chúng tôi đã viết thư cho phần “Đề xuất của bạn” với yêu cầu viết một bài về cách triển khai hiệu ứng như vậy:


Vì vậy tôi quyết định bắt đầu thực hiện nó. Cảm ơn đã cho tôi ý tưởng. Bắt đầu nào...



Như trong hầu hết các trường hợp, chúng tôi bắt đầu bằng cách đưa thư viện jQuery vào:

Và bây giờ bạn cần lạc đề một chút và tôi sẽ giải thích cho bạn bản chất của phương pháp. Tất cả điều này được bắt đầu không phải để tải tất cả các thành phần của trang web (danh mục đầu tư hoặc bài đánh giá của bạn) mà để tải chúng khi cần. Ví dụ: khi người dùng nhấp vào nút “Hiển thị thêm”. Bằng cách này, trang sẽ tải nhanh hơn nhiều. Và bây giờ vấn đề là, khi trợ giúp về ajax công nghệ, chúng tôi sẽ tải phần tử cần thiết (div) và tập tin của bên thứ ba tới trang đích của chúng tôi. Điều đó thật đơn giản, cả về lý thuyết lẫn thực tế, và bạn sẽ sớm thấy được điều đó.

Bây giờ, hãy tạo một khối chính, chẳng hạn như với các hình ảnh về các tác phẩm của chúng ta. Giả sử chúng ta vẽ biểu tượng và tải chúng khi nhấp vào nút. Tôi đã tạo cấu trúc này:

danh mục đầu tư Cho xem nhiều hơn...

Như bạn có thể thấy, mọi thứ đều đơn giản. Nhưng bạn nên chú ý điều gì? Và bạn cần chú ý đến div có id="smartPortfolio", id="moreButton" và id="loadingDiv", vì chúng được sử dụng trong tập lệnh, giúp chúng ta tải nội dung từ các trang khác. SmartPortfolio là một “vùng chứa” cho danh mục đầu tư của chúng tôi. MoreButton - đây sẽ là nút của chúng tôi, khi được nhấp vào, một phần khác của danh mục đầu tư sẽ được tải. LoadingDiv - khu vực mà văn bản sẽ được hiển thị khi danh mục đầu tư được mở hoàn toàn hoặc xảy ra một số lỗi.

Ví dụ: một số độc giả vẫn sẽ thử kiểm tra tập lệnh này không phải trên máy chủ mà chỉ mở tập tin chỉ mục trong trình duyệt. Nếu vậy, họ sẽ thấy một thông báo lỗi. Ngoài ra, nếu kết nối rất chậm, có thể mất thời gian để tải xuống tệp và để người dùng hiểu rằng quá trình đang diễn ra, bạn có thể nhập thông báo vào đó đang tải dữ liệu hoặc địa điểm (hình ảnh, chỉ báo tiến trình hoặc thứ gì khác).

Tôi không viết kịch bản mà tìm thấy nó trên một trong các trang web, tác giả được liệt kê trong mã nguồn, nếu bạn quan tâm, hãy xem qua. Vì anh ấy cũng không quá size lớn, thì tôi sẽ cung cấp tất cả, nhưng nếu bạn định sử dụng cùng tên ID và đường dẫn tệp như của tôi thì bạn thậm chí không cần phải nhìn vào nó mà chỉ cần kết nối nó trước khi đóng thẻ cơ thể(ở chân trang).

Đối với những người dự định chỉnh sửa, đây là tập lệnh:

Var lười tải = lười tải || (); (function($, lườiload) ("use strict"; var page = 2, ButtonId = "#moreButton", loadingId = "#loadingDiv", container = "#smartPortfolio"; lườiload.load = function() ( var url = "./pages/" + page + ".html"; $(buttonId).hide(); $(loadingId).show(); !response || reply.trim() == "NONE") ( $(buttonId).fadeOut(); $(loadingId).text("Portfolio đã được tải đầy đủ"); return; )appendContests(response); reply) ( $(loadingId).text("Xin lỗi, đã xảy ra lỗi với yêu cầu. Vui lòng làm mới trang."); ) )); $(buttonId); ).appendTo($(container));

Vì vậy, bây giờ cần nói về các tệp mà chúng ta sẽ tải thông tin. Tập lệnh giả định rằng đây sẽ là các tệp có tên 2.html...5.html, v.v. Trong đó có chứa thông tin của chúng tôi. Ví dụ: tệp đầu tiên tôi tải là 2.html và nó có nội dung sau:

Trong cấu trúc trang web của tôi, các trang mà thông tin sẽ được lấy để tải tiếp theo khi được nhấp vào đều nằm trong thư mục trang. Có ba tệp, hai trong số đó đã đầy và tệp cuối cùng trống. Đây là những gì logic kịch bản giả định.

Đường dẫn trong tập lệnh được chỉ định như sau:

Var url = "./pages/" + trang + ".html";

Nếu bạn dự định sử dụng một đường dẫn khác, hãy đảm bảo thay thế nó trong tập lệnh. Ngoài ra, nếu bạn đã sử dụng các ID khác thì chúng sẽ phải được xác định lại trong tập lệnh. Ngay chỗ này:

ButtonId = "#moreButton", loadingId = "#loadingDiv", container = "#smartPortfolio";

Và, như tôi đã nói, trước thẻ body đóng, chúng ta đưa vào chính đoạn script:

Thích cái này trên trang đích Bạn có thể thực hiện tải chậm. Gửi cho chúng tôi nhiều chủ đề hơn mà bạn muốn đọc một bài viết trên blog. Trong khả năng có thể, tôi sẽ cố gắng xuất bản không phải tài liệu theo kế hoạch mà là tài liệu bạn hỏi trong phần “Đề xuất của bạn”. Và đó là tất cả cho ngày hôm nay. Tạm biệt!

Khi viết bài này, tôi nhận ra rằng có hai loại người luôn được tranh luận: những người thích phân trang và những người ủng hộ việc sử dụng cuộn vô hạn - cả hai "gia tộc" này đều cung cấp bằng chứng thuyết phục ủng hộ quan điểm của họ .

Theo tôi, cả phân trang và cuộn vô hạn đều có ưu điểm. Việc lựa chọn phương pháp nào trong số này tùy thuộc vào tiêu chí của từng nhà phát triển.

Ví dụ: Google sử dụng phân trang thay vì cuộn vô hạn, điều này rất thuận tiện. MỘT truyền thông xã hội Những người như Twitter và Facebook sẽ luôn thích sử dụng tính năng cuộn vô hạn vì không ai thích nhấp chuột mỗi lần chỉ để cuộn qua nguồn cấp tin tức của họ.

Phương pháp cuộn vô hạn là gì?

Trong phát triển web, cuộn vô hạn là một kỹ thuật giúp tự động tải nội dung khi người dùng đến cuối nội dung hiển thị và cuộn trang.

Những cách sử dụng tốt nhất của kỹ thuật này có thể được tìm thấy trên Twitter, Facebook và nhiều nơi khác.

Dưới đây là danh sách 10 plugin cuộn vô hạn jQuery tốt nhất.

10 plugin cuộn vô hạn jQuery tốt nhất:

Nếu bạn quyết định sử dụng plugin cuộn vô hạn jQuery, chúng tôi sẽ giúp bạn thực hiện dễ dàng. 10 plugin cuộn vô hạn jQuery được thảo luận bên dưới hỗ trợ tất cả các tính năng bạn có thể cần—chỉ cần chọn một plugin phù hợp nhất với trang web của bạn để giúp trải nghiệm người dùng của bạn hiệu quả và thuận tiện hơn.

jQuery xây dựng


Khối xây đặt các phần tử trong không gian thẳng đứng có sẵn. Một plugin rất phổ biến với gần 13.000 sao trên github.

Phiên bản demo Tải xuống

iScroll


Bạn muốn tạo cuộn vô hạn mượt mà? iScroll chắc chắn sẽ giúp bạn tạo một cách mượt mà cuộn jquery. Nhờ vào hệ thống thông minh bộ nhớ đệm, bạn có thể tạo cuộn vô hạn để triển khai đáng tin cậy giao diện người dùng. Ngoài jQuery, nó còn hỗ trợ javascript.

Phiên bản demo Tải xuống

WayPoints


WayPoints giúp dễ dàng triển khai chức năng cuộn trang. Với sự giúp đỡ của điều này plugin đơn giản Bạn có thể chuyển đổi điều hướng Trước/Tiếp theo của mình thành giao diện AJAX có thể cuộn vô hạn. Tài liệu chi tiết có sẵn cho WayPoints, vì vậy công dụng thực tế sẽ không phải là một nhiệm vụ khó khăn

Phiên bản demo Tải xuống

Infinite-Scroll.js


Một plugin cuộn vô hạn jQuery rất nhỏ gọn. Infinite Scroll tự động thêm trang tiếp theo, loại bỏ nhu cầu tải tất cả các trang cùng một lúc.

Phiên bản demo Tải xuống

jScroll


jScroll là một plugin cuộn vô hạn jQuery dễ sử dụng, cho phép tùy chỉnh linh hoạt.

Phiên bản demo Tải xuống

jQuery-Cuộn vô tận


Plugin này sẽ không bao giờ để người dùng của bạn bị kẹt khi chờ tải trang mới. jQuery-Endless-Scroll rất linh hoạt, nó thực sự bao gồm tính năng độc đáo, chẳng hạn như thêm URL thân thiện, cắt bớt dữ liệu, khả năng cuộn và thêm nội dung lên đầu trang.

Phiên bản demo Tải xuống

Cuộn AJAX vô hạn


Infinite AJAX Scroll là một plugin cuộn vô hạn jQuery thông minh. Anh ấy có thể biến hình hệ thống hiện có phân trang thành một hệ thống cuộn vô hạn. Plugin nàyđọc các liên kết “tiếp theo/trước” trên máy chủ trang hiện có và khi người dùng đến cuối trang, hãy tải các trang đó bằng AJAX.

Cách tiếp cận này cũng được tối ưu hóa SEO và rất dễ thực hiện.

Phiên bản demo Tải xuống

JQuery-ESN-Tự động duyệt


Một plugin cuộn vô hạn jQuery được sử dụng rộng rãi mà bạn có thể sử dụng dễ dàng. Nó tự động thêm nội dung trang bằng cách sử dụng AJAX khi người dùng xem trang từ bộ đệm tích hợp của trình duyệt. Plugin rất dễ học và sử dụng thực tế.

Phiên bản demo Tải xuống

Cuộn vô hạn jQuery


Một plugin cuộn vô hạn jQuery đơn giản khác cho phép bạn cuộn qua văn bản hoặc hình ảnh.

Phiên bản demo Tải xuống

Vô tận.JS


Endless.js là một plugin jQuery giúp bạn tạo các cuộn vô hạn cho các phần tử HTML. Nó kết nối phần dưới với phần trên hoặc phần bên trái sang bên phải, từ đó tạo ra ảo giác cuộn vô tận.

Khi Chúng ta đang nói về về tiếp thị trực tuyến hoặc thiết kế web, điều cực kỳ quan trọng là phải là người khởi xướng những ý tưởng và hình thành thành công trong quả cầu riêng. Hôm nay chúng ta sẽ nói về một trong những xu hướng này - cuộn trang vô tận trên một trang web: nó mang lại những cơ hội gì cho doanh nghiệp? Cách tốt nhất để triển khai là gì và khi nào nên bỏ tính năng này? Tài liệu được viết dựa trên bản dịch một bài viết về Infinite Scrolling của SpeckyBoy.

Các phần chính của bài viết:

Millennials được biết đến với thói quen lướt qua các trang web chỉ trong vài giây, quyết định nên ở lại hay rời đi. Các dự án cạnh tranh phải biết chính xác cách thu thập và giữ chân khán giả, nếu không họ có nguy cơ bị bỏ lại trong bóng tối. Trong nỗ lực thu hút sự chú ý của công chúng, chẳng hạn như sử dụng hiệu ứng thị sai, nhiều người cũng đã quyết định giới thiệu tính năng cuộn vô hạn. Cách tiếp cận nàyđã được sử dụng tích cực trong nhiều năm những năm gần đây, và chính những ví dụ như Facebook, Twitter và Instagram chỉ xác nhận tính hiệu quả của nó.

Tuy nhiên, việc cuộn vô hạn phù hợp với các trang web này không có nghĩa là nó sẽ phù hợp với tài nguyên web của bạn. Tính năng này khá hữu ích khi thực hiện một số nhiệm vụ nhất định, nhưng ngược lại, đối với một số dự án, nó có thể cản trở việc đạt được mục tiêu.

Cuộn vô hạn là gì?

Vì thuật ngữ này có thể được sử dụng để biểu thị các đặc điểm và chức năng, V trong trường hợp này nghĩa cuộn vô tận với tải xuống tự động nội dung khi người dùng cuộn xuống trang. Có vẻ như trang này là vô tận và người dùng có thể cuộn bao nhiêu tùy ý.

Khả năng cuộn vô hạn

Cuộn vô hạn hoạt động tốt nhất với một số loại nội dung. Ví dụ: nó lý tưởng cho các trang web có cấp thấp tương tác, chẳng hạn như Twitter. Vì tài nguyên web này chứa đầy các khối văn bản ngắn nên khách truy cập sẽ nhanh chóng xem qua nội dung.

Thông thường, cuộn trang vô hạn hoạt động tốt với lượng lớn nội dung dễ tiêu hóa. Nếu nó phù hợp với mục tiêu của công ty bạn, Chức năng này Nó cũng sẽ phù hợp với bạn.

Đặc điểm tích cực của phương pháp:

  • Giữ chân người dùng. Đây là một trong những chính tính năng đặc trưng cuộn vô tận, ngoài ra nó còn cho phép bạn nhanh chóng thu hút khách truy cập. Ngoài ra, nó cũng thúc đẩy người dùng ở lại trang vì họ có thể cuộn xuống nội dung không ngừng nghỉ.
  • Dễ dàng điều hướng/dễ sử dụng. Cuộn - dễ hiểu và phương pháp phổ quát, không yêu cầu nỗ lực đặc biệtđể thi hành. Nó ngay lập tức cung cấp cho khách truy cập quyền truy cập vào thông tin chính của trang web.
  • Thích hợp để xem các tài liệu minh họa cũng như cho người dùng thiêt bị di động. Cuộn vô hạn – cách tốt cung cấp khả năng xem nhiều đơn giản Các yếu tố hình ảnh. Cũng tốt cho các thiết bị di động nơi cách tốt nhấtĐiều hướng được coi là cuộn bằng một ngón tay.

Đây là lý do tại sao cách tiếp cận này rất phù hợp với Instagram, mục tiêu chính của Instagram là nhanh chóng giới thiệu một loạt các tệp . Không cần phải nán lại lâu trên từng hình ảnh, hơn nữa hầu hết người truy cập dịch vụ đều sử dụng thiết bị di động.

Những lý do nên tránh cuộn vô hạn

Bất chấp những lợi thế, tốt nhất chủ sở hữu của một số loại dự án web nên từ chối thực hiện hoàn toàn cơ chế như vậy:

  • Các trang web thương mại. Chúng giúp bạn dễ dàng tìm kiếm và mua các sản phẩm đáp ứng các đặc điểm nhất định. Các tài nguyên web dành cho việc bán hàng phải cung cấp những thông tin đơn giản và các công cụ chính xác. Nếu mục tiêu chính của công ty bạn là bán hàng thì không nên sử dụng cuộn vô hạn. Phát triển một cách đơn giản và thiết kế thân thiện với người dùng Với khuyết tậtđể người tiêu dùng có thể tập trung mua hàng.

  • Bất kỳ trang web nào cung cấp tìm kiếm cho các sản phẩm hoặc dịch vụ cụ thể. Khi người dùng truy cập vào một dự án cuộn vô hạn, họ sẽ phải đối mặt với rất nhiều lựa chọn. Điều này không phải lúc nào cũng phù hợp với những người có mục tiêu cụ thể. Quá nhiều một số lượng lớn các tùy chọn rất có thể sẽ buộc khách truy cập rời khỏi tài nguyên web.
  • Các trang web có nội dung tập trung vào một khoảng thời gian dài. Các tạp chí và tài nguyên web nơi các bài viết yêu cầu nghiên cứu chuyên sâu sẽ không được hưởng lợi từ việc sử dụng thao tác cuộn vô hạn. Việc tải nội dung liên tục có thể khiến người dùng cảm thấy quá tải và sẽ rời khỏi trang web thay vì tiếp tục đọc.
  • Khó khăn trong việc điều hướng nghiên cứu thông tin cụ thể. Một trong những lý do chính không chuyển sang chức năng này là khó lặp lại thông tin cụ thể. Điều này có thể có tác động tiêu cực trong các ngóc ngách thương mại. Ví dụ, do phải cuộn liên tục nên việc tạo dấu trang gần như không thể thực hiện được. Nhiều người dùng Pinterest đã gặp phải vấn đề tương tự, khi, quay trở lại nguồn cấp tin tức, không thể tìm thấy mục nhập mong muốn, hiện diện trên trang chỉ vài giây trước.
  • Tác động đến việc tối ưu hóa công cụ tìm kiếm. Một trong những vấn đề được thảo luận nhiều nhất trong chủ đề này là tác động tiêu cực đến Tối ưu hóa SEO. Các trang cuộn vô hạn về cơ bản là một trang duy nhất, nghĩa là lượng nội dung có sẵn cho kết quả tìm kiếm, là giảm. Hơn nữa, chỉ có một mô tả meta sẽ được nhập và do đó, khả năng chỉ định thông tin liên quan về đứa con tinh thần của bạn sẽ bị loại trừ. Tình hình cũng tương tự nhưng họ không quan tâm nhiều đến SEO.
  • Sự tiện lợi của người dùng. Một số tính năng của trang web đơn giản là không tương thích với tính năng cuộn vô hạn. Ví dụ: nếu bạn có chú thích cuối trang và tiêu đề. Mọi người sẽ cuộn xuống trang để tìm chú thích cuối trang nhưng họ sẽ không thể tìm được chúng. Do đó, rất có thể chúng sẽ không còn trên tài nguyên web của bạn. Họ cũng sẽ gặp khó khăn khi tiếp cận phần chân trang và thông tin trong đó.
  • Thiếu cơ hội lựa chọn. Hiện tại, kiểu cuộn này không hướng đến sở thích của khách truy cập vì họ không có tùy chọn để chọn nội dung. Ngay cả khi người dùng muốn bỏ qua một số khối thông tin, anh ấy sẽ không thể làm được điều đó. Điều này gây khó chịu cho những người thích xem văn bản với số lượng hạn chế hơn.

Nhân tiện, liên quan đến các trang web thương mại. Các mẹo trên có tác dụng tốt nếu bạn cần bán một hoặc nhiều sản phẩm. Trong trường hợp trang lớn, khó có thể đặt tất cả thông tin trên một trang. Bạn có thể kết hợp cuộn vô hạn với các tùy chọn điều hướng khác.

Nghĩa là, trong ví dụ trên, nếu muốn, bạn có thể tải sản phẩm bằng cách nhấp vào hoặc sử dụng điều hướng. Việc có một menu cho phép bạn giải quyết một phần vấn đề khi tìm kiếm các sản phẩm cụ thể và không thể loại trừ một số thông tin nhất định.

Nếu bạn quyết định thêm tính năng cuộn vô hạn vào trang web của mình, các kỹ thuật sau có thể cải thiện trải nghiệm người dùng:

  • Phát triển một kế hoạch dự phòng. Vì chức năng này được thực hiện với sử dụng JavaScript, một số người sẽ không thể truy cập tính năng cuộn. Các nhà phát triển nên lường trước tình huống này và thêm phân trang.
  • Giữ điều hướng hiển thị. Nếu khách truy cập phải cuộn qua vô số bài viết để quay lại trang trước, có thể họ sẽ không làm điều đó.
  • Không sử dụng thanh cuộn. Một số nhà phát triển không khuyên bạn nên kết hợp cuộn vô hạn với thanh cuộn hiển thị cho người dùng lượng thông tin còn lại trên trang. Điều này khiến họ lầm tưởng rằng bài viết đã gần hoàn thành khi nội dung tiếp tục được bổ sung.
  • Cung cấp màn hình tải. Đó là một trải nghiệm khó chịu khi khách truy cập duyệt qua một luồng dữ liệu dường như vô tận và thấy mình bối rối. Đảm bảo thêm biểu tượng tải để cho biết quá trình đang diễn ra.
Tổng cộng

Tương tự như những cách khác, việc cuộn liên tục trên một trang có thể dẫn đến cả kết quả tích cực và tiêu cực. Tất cả phụ thuộc vào mục tiêu và loại dự án của bạn. Chủ sở hữu các trang web định hướng bán hàng cũng như các tài nguyên web có nội dung yêu cầu Nghiên cứu chi tiết, bạn nên suy nghĩ kỹ trước khi triển khai tính năng như vậy. Tối thiểu, thêm lựa chọn thay thế dẫn đường. Hãy nhớ rằng việc sử dụng bừa bãi xu hướng này có thể khiến du khách mất đi.

Hãy viết những bổ sung và suy nghĩ của bạn về chủ đề dưới đây.

, sử dụng các ví dụ để chứng minh ưu điểm và nhược điểm của một kỹ thuật phổ biến - cuộn vô tận.

Việc trình bày một lượng lớn thông tin, chẳng hạn như kết quả tìm kiếm, liên kết, bài viết hoặc hình ảnh, theo cách thân thiện với người dùng có thể khá khó khăn. khó. Trước đây, vấn đề này đã được giải quyết nhờ cơ chế phân trang đáng tin cậy. Tuy nhiên, trong vài năm qua, nhiều trang web đã chuyển sang chế độ cuộn vô hạn. Cuộn vô hạn là một cơ chế trong đó “trang” dữ liệu tiếp theo sẽ tự động được tải khi người dùng cuộn đến cuối khối trước đó.

Cách này đôi khi rất hiệu quả, đôi khi lại cực kỳ không thành công. Dưới đây là một số ưu điểm và nhược điểm của việc cuộn vô hạn:

Thuận lợi

Sử dụng hiệu quả không gian màn hình. Không còn những nút bấm hoặc liên kết số trang rườm rà nữa.

Hơn thiết kế trực quanthiết bị cảm ứng. Cuộn một trang bằng cách di chuyển ngón tay lên trên màn hình là một kỹ thuật phổ biến trên các thiết bị cảm ứng. Hành động này đòi hỏi độ chính xác thấp hơn so với việc nhấp vào liên kết hoặc nút.

Sự tham gia lớn hơn. Liên quan đến điểm thứ hai sự thật tiếp theo: Người dùng, bất kể thiết bị nào, có xu hướng tìm hiểu sâu hơn về tài liệu nếu nó không đòi hỏi họ phải nỗ lực nhiều. Nếu bạn từng quên mất thời gian khi lướt qua các bản cập nhật trên Twitter hoặc Facebook, bạn sẽ hiểu chúng ta đang nói về điều gì.

sai sót

Điều khoản sử dụng hạn chế. Cuộn vô hạn không phù hợp với mọi trang web và không phù hợp với mọi loại nội dung. Ví dụ: danh sách sản phẩm trong cửa hàng trực tuyến là nơi không phù hợp để thực hiện thao tác cuộn vô tận. Người dùng có thể muốn chuyển đổi giữa danh sách và mô tả sản phẩm mà không làm mất vị trí của họ trên trang.

Sự phức tạp bổ sung. Cùng với các tập lệnh tiêu chuẩn từ nhiều thư viện JavaScript thực hiện một cơ chế duy nhất có thể yêu cầu mã duy nhất. Sẽ cần phải đảm bảo rằng ngay cả những người dùng có KHÔNG JavaScript. Thà không sử dụng nó còn hơn là sử dụng nó để gây tổn hại đến tài nguyên.

Các yêu cầu bổ sung tới khách hàng. Do tính năng cuộn vô hạn yêu cầu JavaScript, bạn có nguy cơ mất người dùng trình điều khiển game, hộp giải mã tín hiệu số hoặc các thiết bị khác chạy trình duyệt có khả năng tạo tập lệnh hạn chế.

Tạm biệt chân trang! Cuộn vô tận hoặc chân trang - không có tùy chọn thứ ba. Nếu bạn (hoặc quan trọng hơn là người dùng của bạn) cần chân trang thì bạn nên xem xét một mẫu thông thường hơn. Đừng trêu chọc người dùng bằng chân trang không thể nhấp vào: ngay khi nó xuất hiện trước mắt bạn, nội dung mới ngay lập tức xuất hiện ở vị trí của nó (LinkedIn và Facebook, tôi đang nói về bạn!)

SEO. Mặc dù Google lưu ý rằng thuật toán của họ tính đến các trang chứa nhiều phiên bản (ví dụ: nó tính đến “Trang-1”, “Trang-2” cùng với trang “Xem tất cả”, v.v.), từ chối kiểm tra, bạn có nguy cơ bị rớt trang web của mình trong công cụ tìm kiếm.

Giảm số lần hiển thị. Điều này có thể không ảnh hưởng đến trải nghiệm người dùng nhưng nếu mô hình kinh doanh của bạn liên quan trực tiếp đến số lần hiển thị biểu ngữ quảng cáo, việc cuộn vô tận khó có thể giúp đạt được thành công.

Hãy ghi nhớ những đặc thù của việc cuộn vô tận, chúng ta hãy xem xét hai trang web mà theo tôi, nó khá phù hợp.