W3C - World Wide Web Consortium là một trong những tổ chức khai sáng ra môi trường Internet hiện nay mà đứng đầu là Tim Berners-Lee - ngườ...
W3C - World Wide Web Consortium là một trong những tổ chức khai sáng ra môi trường Internet hiện nay mà đứng đầu là Tim Berners-Lee - người đã sáng tạo ra WWW, giao thức HTTP, và HTML. Tổ chức này thường xuyên đưa ra những định hướng cho sự phát triển lâu dài của Internet mà tiêu biểu là các chuẩn mực liên quan đến website và thiết kế website – nền tảng nội dung trên internet.
Mỗi tiêu chuẩn của W3C đều đi qua 4 giai đoạn trước khi trở thànhChuẩn Chính thức (Recommendation):
- Phác thảo (Working Draft).
- Chỉnh sửa Cuối cùng (Last Call)
- Trình chuẩn (Proposed Recommendation)
- Chuẩn đủ Tư cách Ứng cử (Candidate Recommendation)
Tuy nhiên, W3C không phải là người quyết định có hoặc không việc áp dụng các tiêu chuẩn lên môi trường Internet, mà các tiêu chuẩn do W3C đưa ra chỉ mang tính định hướng. Các nhà sản xuất phần mềm sẽ quyết định họ có đi theo những tiêu chuẩn đó hay không.
Trong thiết kế website, chuẩn W3C được khá nhiều nhà sản xuất browser và người viết web ứng dụng cho sản phẩm của mình. Đứng ở phía người thiết kế website, do mỗi browser khác nhau, tuy nhiên chúng đều hỗ trợ tốt những website viết theo chuẩn W3C nên khi thiết kế họ cố gắng hướng sản phẩm của mình theo chuẩn W3C. Tương tự như vậy, một khi một browser ra đời, nó phải đáp ứng được việc hiển thị website một cách thống nhất giống như trên các trình duyệt khác. Điều đó bắt buộc nó phải hỗ trợ chuẩn W3C. Mối quan hệ cộng hưởng này giúp cho W3C ngày càng trở thành một tiêu chuẩn phổ biến trong thiết kế website.
W3C trong thiết kế website là một hệ thống các tiêu chí đánh giá website dựa trên các chuẩn mực liên quan đến HTML, XHTML, SMIL, MathML, CSS … Việc ứng dụng các tiêu chuẩn W3C đem lại cho bạn các lợi ích sau khi thiết kế website :
- Website của bạn sẽ thân thiện hơn với các Search Engine
- Website của bạn được hỗ trợ tốt trên nhiều trình duyệt, bạn không mất nhiều thời gian để chỉnh sửa và tối ưu hóa cho từng trình duyệt.
- Chạy nhanh hơn
- Các thiết bị hiển thị website di động như điện thoại IPad đều dựa trên chuẩn W3C. Do đó, Website của bạn sẽ hiển thị tốt hơn.
Để kiểm tra website của bạn có đạt chuẩn W3C hay không, bạn có thể sử dụng tính năng W3C Validator. Tính năng này cho phép bạn tìm kiếm những lỗi liên quan đến chuẩn W3C mà website bạn mặc phải.
Từ những lợi ích trên, hôm nay iTechPlus sẽ hướng dẫn các bạn một vài mẹo nhỏ, tuy không xử lý được triệt để ( hiện nay có vẻ điều này là không thể bởi ngay cả trang google.com.vn cũng mắc 41 lỗi ) nhưng sẽ hạn chế lỗi tối đa nhằm giúp trang của bạn hợp qui chuẩn hơn.
Trong khuôn khổ bài viết này, iTechPlus sẽ sử dụng Minima template ( 58 lỗi, 23 cảnh báo lúc “sơ khai”) làm mẫu.
Bước 1 : Vào Thiết kế > Chỉnh sửa HTML > Mở rộng mẫu tiện ích
Bước 2 : Chỉnh sửa DOCTYPE
Tìm trong template đoạn code sau :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
và thay thế nó với :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='/atom.xml' rel='alternate' title=' YOUR BLOG TITLE - Atom' type='application/atom+xml'/>
<link href='/rss.xml' rel='alternate' title= 'YOUR BLOG TITLE - RSS' type='application/rss+xml'/>
Đoạn code trên đã chèn thêm một số thẻ meta và thay đổi cách hiển thị của tiêu đề blog & tiêu đề bài đăng nhằm giúp thân thiện hơn với các bộ máy tìm kiếm.
Bước 3 : Tìm và sửa ( xóa ) tất cả dấu “-” của các code dạng mô tả trong CSS, như ví dụ bên dưới :
- Trước khi chỉnh sửa :
/ *
-----------------------------------------------
Blogger Template Style
Name: Minima
Date: February 26, 2004
Updated by: Blogger Team
----------------------------------------------- * /
- Sau khi chỉnh sửa :
/ *
Blogger Template Style
Name: Minima
Date: February 26, 2004
Updated by: Blogger Team
* /
Bước 4 : Xóa thanh Navbar bằng cách chèn đoạn code sau vào giữa thẻ <body> và </head> :
<!-- <body><div></div> –>
Bước 5 : Tìm và xóa đoạn code sau trong template ( biểu tượng chỉnh sửa nhanh tại mỗi widget ) :
<b:include data='post' name='postQuickEdit'/>
Bước 6 : Save template & check ( giờ chỉ còn 2 lỗi + 2 cảnh báo ).
* Lời khuyên :
- Luôn sử dụng Alt cho các hình ảnh
- Nếu sử dụng widget Archive, hãy nhớ đừng sử dụng kiểu hiển thị dạng Thứ bậc
- Luôn check với W3C khi tạo mới một widget để phát hiện và sửa lỗi theo hướng dẫn
Chúc các bạn thành công !
No comments: