Tách nội dung khỏi thiết kế giúp quản lý trang web dễ dàng hơn
CSS (Cascading Style Sheets) đã trở thành cách thực tế để tạo kiểu và đặt ra các trang web. Nhà thiết kế sử dụng biểu định kiểu để cho trình duyệt biết cách trang web hiển thị dưới dạng giao diện, bao gồm các yếu tố như màu sắc, khoảng cách, phông chữ và nhiều thứ khác.
Các kiểu CSS có thể được triển khai theo hai cách:
- Nội dòng - bên trong mã hóa của trang web, trên cơ sở từng yếu tố từng phần tử
- Trong tài liệu CSS độc lập, trang web được liên kết
Thực tiễn tốt nhất cho CSS
"Các phương pháp hay nhất" là các phương pháp thiết kế và xây dựng các trang web đã được chứng minh là hiệu quả nhất và mang lại lợi nhuận cao nhất cho công việc liên quan. Theo dõi họ trong CSS trong thiết kế web giúp trang web trông và hoạt động tốt nhất có thể. Họ đã phát triển qua nhiều năm cùng với các ngôn ngữ và công nghệ web khác và biểu định kiểu CSS độc lập đã trở thành phương pháp được sử dụng ưu tiên.
Thực hiện tốt nhất cho CSS có thể cải thiện trang web của bạn theo các cách sau:
- Tách nội dung khỏi thiết kế. Một trong những mục tiêu chính của CSS là xóa các phần tử thiết kế khỏi HTML và đặt chúng ở vị trí khác để người thiết kế duy trì. Điều này cũng phục vụ cho các nhà thiết kế riêng biệt từ các nhà phát triển để mỗi người có thể tập trung vào các lĩnh vực chuyên môn của họ. Một nhà thiết kế không phải là nhà phát triển để duy trì giao diện của trang web.
- Làm cho bảo trì dễ dàng. Một trong những yếu tố bị bỏ qua nhất của thiết kế web là bảo trì. Không giống như các tài liệu in, một trang web không bao giờ là "một và thực hiện". Nội dung, thiết kế và chức năng có thể và nên phát triển theo thời gian. Có CSS ở một vị trí trung tâm, thay vì rắc khắp trang web, làm cho mọi thứ dễ dàng hơn nhiều để duy trì.
- Giúp trang web của bạn có thể truy cập được. Sử dụng các kiểu CSS giúp các công cụ tìm kiếm và các cá nhân bị vô hiệu tương tác với trang web của bạn.
- Giữ cho trang web của bạn tồn tại lâu hơn. Bằng cách sử dụng các phương pháp hay nhất với CSS, bạn tuân thủ các tiêu chuẩn đã được chứng minh là ổn định nhưng đủ linh hoạt để thích ứng với thay đổi trong môi trường thiết kế web.
Kiểu nội tuyến không phải là phương pháp hay nhất
Inline phong cách, trong khi họ có một mục đích, nói chung không phải là cách tốt nhất để duy trì trang web của bạn. Họ đi ngược lại tất cả các phương pháp hay nhất:
- Kiểu nội tuyến không tách nội dung khỏi thiết kế. Các kiểu nội tuyến chính xác giống như phông chữ được nhúng và các thẻ thiết kế clunky khác mà các nhà phát triển hiện đại chống lại. Các kiểu chỉ ảnh hưởng đến các phần tử riêng lẻ mà chúng được áp dụng; trong khi điều đó có thể cung cấp cho bạn quyền kiểm soát chi tiết hơn, nó cũng làm cho các khía cạnh khác của thiết kế và phát triển - chẳng hạn như tính nhất quán - khó khăn hơn.
- Kiểu nội tuyến gây ra nhức đầu bảo trì. Khi bạn đang làm việc với các bảng định kiểu, hãy tìm ra nơi một kiểu được thiết lập có thể khó khăn. Khi bạn đang đối phó với một hỗn hợp của phong cách nội tuyến, nhúng và bên ngoài , bạn có nhiều địa điểm để kiểm tra. Nếu bạn làm việc trên một nhóm thiết kế web hoặc phải thiết kế lại hoặc duy trì một trang web được xây dựng bởi người khác, thì bạn sẽ gặp nhiều rắc rối hơn. Một khi bạn tìm thấy phong cách và thay đổi nó, bạn sẽ phải làm như vậy trên mọi phần tử trên mỗi trang nơi nó được đặt. Điều đó làm tăng thời gian và ngân sách công việc một cách thiên văn.
- Các kiểu nội tuyến không thể truy cập được. Trong khi trình đọc màn hình hiện đại hoặc thiết bị trợ giúp khác có thể xử lý các thuộc tính và thẻ nội tuyến một cách hiệu quả, một số thiết bị cũ hơn không thể, điều này có thể dẫn đến một số trang web được hiển thị lạ. Các ký tự và văn bản bổ sung có thể ảnh hưởng đến cách trang của bạn được xem bởi rô bốt công cụ tìm kiếm, vì vậy trang của bạn không hoạt động tốt về mặt tối ưu hóa công cụ tìm kiếm (SEO).
- Kiểu nội tuyến làm cho trang của bạn lớn hơn. Nếu bạn muốn mọi đoạn trên trang web của mình xuất hiện theo một cách nhất định, bạn có thể làm điều đó một lần với sáu dòng hoặc nhiều mã trong một biểu định kiểu bên ngoài. Tuy nhiên, nếu bạn làm điều đó với kiểu nội tuyến, bạn phải thêm các kiểu đó vào mỗi đoạn của trang web của bạn. Nếu bạn có năm dòng CSS, đó là năm dòng nhân với mỗi đoạn trên trang web của bạn. Đó là băng thông và thời gian tải có thể tăng lên trong một vội vàng.
Giải pháp thay thế cho kiểu nội tuyến: Biểu định kiểu bên ngoài
Thay vì sử dụng kiểu nội tuyến, hãy sử dụng biểu định kiểu bên ngoài . Chúng cung cấp cho bạn tất cả các lợi ích của các phương pháp hay nhất của CSS và dễ sử dụng. Sử dụng theo cách này, tất cả các kiểu được sử dụng trên trang web của bạn đều nằm trong một tài liệu riêng biệt, sau đó được liên kết với tài liệu web bằng một dòng mã. Biểu định kiểu bên ngoài ảnh hưởng đến mọi tài liệu mà chúng được đính kèm. Điều đó có nghĩa là, nếu bạn có trang web 20 trang, trong đó mỗi trang sử dụng cùng một biểu định kiểu - thường là cách thực hiện - bạn có thể thực hiện thay đổi cho mỗi trang trong số đó bằng cách chỉnh sửa các kiểu đó một lần, tại một nơi. Thay đổi phong cách ở một vị trí vô cùng thuận tiện hơn tìm kiếm mã hóa đó trên mọi trang trong trang web của bạn. Điều này làm cho việc quản lý trang web dài hạn dễ dàng hơn nhiều.