Chất lượng Web - Các yếu tố HTML quan trọng

Để nâng cao chất lượng web, <DOCTYPE>, <title> và <h1> đều là các thẻ quan trọng.

Phần tử <DOCTYPE>

Doctype có nghĩa là "tuyên bố loại tài liệu" (DTD).

Mọi trang HTML và XHTML nên sử dụng phần tử <Doctype> để xác định tuân thủ phiên bản HTML nào.

Tuyên bố doctype xác định phiên bản HTML bạn đang sử dụng và cung cấp thông tin quan trọng cho trình duyệt để hiển thị trang web của bạn nhanh chóng và nhất quán hơn.

Tuyên bố loại tài liệu cũng giúp phần mềm kiểm tra ngữ pháp của trang web:

HTML 4.01 Strict, Transitional, Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd"

XHTML 1.0 Strict, Transitional, Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"

DTD XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"

Xem thêm:Thẻ HTML <!DOCTYPE>

Yếu tố <title>

Điều này là một trong những yếu tố HTML quan trọng nhất. Chức năng chính của nó là mô tả nội dung của trang web.

Mặc dù tiêu đề không phải là phần có thể nhìn thấy của trang web, nó vẫn rất quan trọng để nâng cao chất lượng của trang web vì nó vẫn có thể nhìn thấy ở các vị trí sau:

  • Danh sách công cụ tìm kiếm
  • Thanh tiêu đề của cửa sổ
  • Trong dấu trang của người dùng

Tiêu đề nên càng ngắn càng tốt và có thể mô tả.

Khi một người dùng tìm kiếm trang web trên internet, hầu hết các công cụ tìm kiếm sẽ hiển thị tiêu đề của trang web trong kết quả tìm kiếm. Hãy đảm bảo rằng tiêu đề phù hợp với nội dung của trang web. Như vậy, người dùng có nhiều khả năng nhấp vào các liên kết này để truy cập trang web của bạn.

Khi người dùng truy cập vào trang web của bạn, tiêu đề trong thanh tiêu đề của cửa sổ là có thể nhìn thấy. Hãy đảm bảo rằng tiêu đề vẫn có thể mô tả nội dung của trang web ngay cả khi cửa sổ được nhỏ lại.

Sau khi người dùng truy cập vào trang web của bạn, tiêu đề của trang web sẽ được lưu trong thư mục lịch sử (người dùng thậm chí có thể thêm trang web vào thư mục yêu thích của họ). Để đảm bảo truy cập thành công sau này, hãy đảm bảo rằng tiêu đề có thể mô tả rõ ràng trang web của bạn.

Tiêu đề tốt:

<title>Hướng dẫn HTML</title>
<title>Giới thiệu XML</title>

Tiêu đề tồi tệ:

<title>Giới thiệu</title>
<title>Chương 1</title>
<title>CodeW3C.com có một bộ tài liệu tổ chức tốt, dễ hiểu về HTML, CSS, JavaScript,
Hướng dẫn DHTML, XML, XHTML, WAP, ASP, SQL, và bao gồm rất nhiều ví dụ và mã nguồn.</title>

Xem thêm:HTML <title> thẻ

Yếu tố <h1>

Yếu tố <h1> được sử dụng để mô tả tiêu đề cấp cao nhất của trang web.

Do một số trình duyệt sẽ hiển thị mặc định các yếu tố <h1> với font chữ lớn, vì vậy một số nhà phát triển web sẽ sử dụng yếu tố <h2> thay thế yếu tố <h1> để hiển thị tiêu đề cấp cao nhất. Việc này sẽ không ảnh hưởng đến người đọc, nhưng có thể làm rối loạn các công cụ tìm kiếm và phần mềm khác đang cố gắng 'hiểu cấu trúc trang web'.

Hãy đảm bảo sử dụng <h1> cho tiêu đề cấp cao nhất, <h2> và <h3> cho các cấp độ thấp hơn.

Bạn có thể thử xây dựng trang web của mình dựa trên mẫu này:

Nếu bạn không thích kích thước font tiêu đề mặc định, bạn có thể sử dụng phong cách hoặc bảng kiểu để thay đổi.

Xem thêm:HTML <h1> - <h6> thẻ