Tràn văn bản: Dấu ba chấm được coi là có hại

Được xuất bản lại bởi Plato

Người theo dõi: 0

Có một vài trường hợp sử dụng hợp pháp cho kỹ thuật này. Ví dụ: bạn có thể có một bảng với tiêu đề và mô tả. Để giữ thêm không gian cho tiêu đề, bạn giới hạn mô tả ở một dòng trên các cửa sổ xem nhỏ thành một dòng và bạn lặp lại mô tả trên trang chi tiết cho mục này.

Tuy nhiên, tôi thường thấy nó được sử dụng trên các mục như nút hoặc thậm chí nhãn biểu mẫu để làm cho chúng trông đẹp hơn (?) Hoặc khi căn chỉnh chúng theo chiều dọc. Nhưng một khi bạn thay đổi chế độ xem hoặc thay đổi kích thước văn bản, phần cuối của văn bản sẽ biến mất.

Tôi nghĩ rằng “… nếu được sử dụng trong một số tình huống nhất định” thuộc về nó, nhưng nó chắc chắn làm cho một tiêu đề bài đăng blog tốt hơn nếu không có nó. Như Eric nói, có những trường hợp sử dụng hợp pháp để cắt bớt văn bản. Có thể chỉ một số ít, nhưng dù sao cũng hợp pháp.

Mục tiêu cuối cùng là ngăn "mất" dữ liệu, một cái gì đó điều đó chắc chắn có thể xảy ra trong CSS. Văn bản vô tình tràn vào vùng chứa sẽ bị mất theo nghĩa đơn giản là nó không có ở đó. Và nếu văn bản đó chỉ đơn giản là không có ở đó, người dùng sẽ bỏ lỡ nó, ngay cả khi đó là lời kêu gọi hành động hay nhất và được xây dựng tốt nhất từng được xuất bản trên web.

Eric chỉ ra rằng không có cách nào để làm cho văn bản bị cắt bớt bởi text-overflow: ellipsis có thể nhìn thấy. Một khi nó biến mất, nó sẽ biến mất (mặc dù trình đọc màn hình dường như thông báo nó). Nó thực tế bị mất dữ liệu. Bạn có thể đồng ý với điều đó. Điều đó thật tuyệt miễn là bạn biết điều gì đang xảy ra và dự định của nó.

Nhưng đây là những gì Eric nói khiến tôi muốn chia sẻ điều này:

Đừng hạn chế nội dung để phù hợp với thiết kế của bạn, hãy làm cho CSS của bạn linh hoạt để xử lý các từ dài hơn một cách duyên dáng.

Một lần nữa, bạn Might muốn nội dung phù hợp với thiết kế. Nhưng tôi có thể tranh luận, giống như Eric, rằng thiết kế phải thích ứng với nội dung hơn là ngược lại. Tôi rất khó nhớ lại bất kỳ tình huống nào trong đó văn bản trên trang không quan trọng hoặc không có mục đích đến mức tôi sẽ rất tuyệt nếu cắt bỏ ở bất kỳ điểm tùy ý nào được xác định bởi thuộc tính CSS. Có thể là một kho lưu trữ các bài đăng trên blog trong đó mỗi bài đăng hiển thị một đoạn trích của nội dung bài đăng trước khi cắt bớt, nhưng đó không chính xác là một trường hợp sử dụng cho text-overflow: ellipse.

CSS có các công cụ để tạo một thiết kế linh hoạt có độ dài khác nhau của văn bản. Vì vậy, có thể sai lầm ở phía viết CSS phòng thủ… CSS dự đoán các vấn đề và biết cách xử lý các tình huống nội dung khác nhau một cách khéo léo. text-overflow: ellipsis có thể là một phần của kho vũ khí CSS của bạn cho điều đó. Nhưng nó cũng có thể làm em bé bị văng ra ngoài với nước tắm. Đáng hỏi liệu việc mất dữ liệu đó có xứng đáng với những gì mà nội dung đó phải làm trước khi cắt tóc hay không.

Trong khi chúng ta đang nói về việc cắt bớt văn bản…

liên kết vào ngày 1 tháng 2021 năm XNUMX