# 103: Khu vực Đoạn mã Chụp ảnh - Thủ thuật CSS

Anonim

Đã đến lúc đi sâu vào khu vực Đoạn mã! Đó là, khu vực nội dung thực tế của nó. Chúng tôi đã có tiêu đề tại chỗ. Khu vực đoạn trích khá phổ biến. Không cần đi sâu vào phân tích, tôi biết từ việc xem mạng xã hội và nghe từ những người trong cuộc sống thực rằng họ tìm thấy rất nhiều thứ hữu ích trong lĩnh vực này.

Trong v9, một lời phê bình rất phổ biến và chính đáng là nó rất khó để duyệt. Đó là một chiếc đàn accordion có màu đậm và mỗi đoạn mã là một "liên kết bong bóng" (vì thiếu bộ mô tả tốt hơn) phù hợp với màu chính của phần phụ đoạn trích đó. Tệ hơn nữa, chúng được căn chỉnh hợp lý mà tôi nghĩ sẽ là một cách gọn gàng để cho chúng một khoảng không gian và phóng tầm mắt ra xung quanh một chút, nhưng cuối cùng lại trông thật kỳ cục và luộm thuộm.

Hãy tự đổi lấy ở đây và làm cho khu vực Đoạn mã đẹp hơn để duyệt. Mặc dù vậy, một lần nữa, hầu hết nội dung này được tìm thấy thông qua tìm kiếm. Tuy nhiên, cũng có thể làm cho nó tốt hơn khi duyệt.

Ngay lập tức, chúng tôi quyết định không đặt trường tìm kiếm ngay trong vùng nội dung. Trước đây đã có, nhưng đây là một bản thiết kế lại và chúng tôi đang đưa ra quyết định hợp nhất tìm kiếm vào một khu vực. Khi bạn học cách sử dụng tìm kiếm một lần, bạn sẽ biết cách nó hoạt động mãi mãi.

Đối với thiết kế, chúng tôi đi với một điều hai cột. Ở bên trái, các danh mục Đoạn trích chính, mỗi danh mục có một màu duy nhất. Thời gian cầu vồng! Chúng tôi duyệt qua phòng trưng bày của riêng mình để tìm cảm hứng.

Cột bên phải sẽ chỉ là danh sách các đoạn trích trong danh mục đó. Đơn giản, dễ duyệt. Giống như các liên kết chân trang. Mọi người biết cách quét và sử dụng danh sách các liên kết. Đó là mẫu thiết kế đơn giản hoàn hảo nhất có.

Mặc dù vậy, chúng tôi vẫn lo lắng về một số quyết định thiết kế. Các liên kết nên phù hợp với màu của phần hay chỉ có màu xám? Chúng ta có nên “vạch sọc ngựa vằn” cho các liên kết có phiên bản mờ nhạt của màu chính không? Chúng ta có nên bao gồm ngày xuất bản hoặc ngày cập nhật hay không? Những điều thú vị và quan trọng cần phải suy nghĩ, nhưng chúng ta luôn có thể đưa ra những quyết định như vậy khi chúng ta truy cập vào trình duyệt và đang làm việc với dữ liệu thực.