Tin tức và phân tích của tất cả các thiết bị di động

8 đoạn mã để làm cho trang của bạn nổi bật

Tìm kiếm là một trong những nhu cầu thiết kế nhỏ thường bị bỏ qua. Nhưng đối với blog và các trang web giàu nội dung khác, đó là một cách quan trọng để điều hướng. Một menu được thiết kế tốt có thể khuyến khích người dùng khám phá những gì nó cung cấp.

Tin hay không, có những nhà thiết kế dám đưa phân trang lên một tầm cao mới. Dưới đây là một số đoạn mã rất sáng tạo mà bạn có thể sử dụng để cải thiện trang web của riêng mình.

Hiệu ứng cuộn đơn giản và trực quan

Ví dụ đầu tiên của chúng tôi cho thấy một số hiệu ứng cuộn cơ bản có thể cải thiện phân trang chuẩn như thế nào. Các siêu gạch chân đi kèm với con trỏ của bạn làm cho nó trở thành một trải nghiệm trực quan hơn nhiều. Toàn bộ menu cũng rất dễ đọc. Đây là một cách dễ dàng để giúp người dùng.

Tài khoản trực tiếp

Một trong những phần khó chịu nhất của tìm kiếm có thể là cách các menu xử lý một số lượng lớn các trang. Đoạn trích này sử dụng jQuery để tự động xóa chính nó để hiển thị số trang liền kề khi bạn nhấp. Đó là một cách dễ dàng hơn nhiều để đào sâu vào một trang web.

Bồn rửa

Đây là một khái niệm rất thú vị. Được thiết kế để phản ứng nhanh và dễ truy cập hơn, giao diện người dùng này bao gồm một số cách để điều hướng, bao gồm cả thông qua bàn phím. Thanh dòng thời gian ở trên cùng đánh dấu rõ ràng trang hiện tại và cung cấp một cái nhìn tổng quan tuyệt vời về mọi thứ có sẵn.

Hãy để Yeti chăm sóc nó

Họ nói rằng sự giúp đỡ tốt là khó tìm. Nhưng đoạn trích này cung cấp sự giúp đỡ của Yeti (ít nhất là bàn tay của Yeti) bằng cách nhấp vào số trang. Mặc dù Yeti có thể không phù hợp với động cơ của anh ấy, đây là một ví dụ về cách chúng tôi có thể thêm yếu tố vui nhộn (và bất ngờ).

Cải thiện cho màn hình di động

Trên màn hình nhỏ hơn, tìm kiếm có thể rất khó sử dụng. Các yếu tố điều hướng thường quá nhỏ và khó đọc. Đoạn trích này cung cấp một sự thay thế tuyệt vời cho các thiết bị di động. Mỗi phần tử lớn hơn bởi vì điều hướng mở rộng theo chiều dọc. Kết quả là người dùng thiết bị di động có thể di chuyển mà không cần phác thảo hoặc phóng to.

Không cần số

Đôi khi chúng ta không cần đánh số mọi yếu tố phân trang. Ví dụ này hấp dẫn tối thiểu với việc sử dụng điểm chứ không phải số. Đó là một giải pháp tuyệt vời để trình chiếu hoặc điều hướng qua nhiều bảng nội dung.

Liên lạc thân thiện

Giao diện người dùng di động hoạt động tốt nhất khi phản hồi với cảm ứng của người dùng. Ở đây chúng tôi có một phân trang cho phép người dùng kéo để đến mục tiếp theo hoặc trước đó. Sự tiện lợi nhỏ này có thể tạo ra sự khác biệt về khả năng sử dụng.

Kết hợp cuộn / tìm kiếm vô tận

Các nhà thiết kế thường sử dụng cuộn vô tận để thay thế phân trang. Nhưng đây là một khái niệm rõ ràng về cách chúng có thể được kết hợp. Sự thất vọng của cuộn vô tận là có thể khó quay lại và tìm mục cụ thể trong một danh sách dài. Tập lệnh này thêm số trang mới vào điều hướng khi bạn tiếp tục cuộn xuống, giúp việc quay trở lại dễ dàng hơn.

Di chuyển trang về phía trước

Một thiết kế web tốt không bỏ qua các yếu tố khác nhau tạo nên một trang. Các chuyên gia trước đây cho thấy rằng phân trang có nhiều hơn để cung cấp khi bạn cố gắng cải thiện nó. Vì vậy, hãy lấy cảm hứng từ những ví dụ này và tạo các menu ngắt trang trông và hoạt động tốt hơn.

Mục lục