Tối ƣu hóa các thành phần HTML

Một phần của tài liệu luận văn thạc sỹ xây dựng công cụ hỗ trợ tối ưu hóa website cho các công cụ tìm kiếm (Trang 52 - 56)

Thẻ HTML bao gồm những thẻ quan trọng như: thẻ title, thẻ meta, thẻ heading, thẻ anchor, thẻ img, …

Thẻ title

Cú pháp: <title> tên tiêu đề của website</title>

Thẻ tiêu đề cho người dùng và công cụ tìm kiếm biết chủ đề của trang cụ thể là gì. Thẻ <title> phải được đặt trong thẻ <head> của tài liệu HTML. Tốt nhất nên tạo tiêu đề duy nhất cho mỗi trang của website.

Nếu trang web xuất hiện trong trang kết quả tìm kiếm, nội dung của thẻ tiêu đề thường sẽ xuất hiện tại dòng đầu tiên của kết quả. Các từ trong tiêu đề được in đậm nếu chúng xuất hiện trong truy vấn tìm kiếm của người dùng. Điều này có thể giúp người dùng nhận ra nếu trang liên quan đến tìm kiếm.

Tiêu đề trang chủ có thể liệt kê tên trang web/doanh nghiệp và có một số thông tin quan trọng như vị trí của doanh nghiệp hoặc một vài lĩnh vực hoạt động chính hay các mặt hàng được chào bán của doanh nghiệp. Các tiêu đề cho các trang sâu hơn trong website nên mô tả chính xác vấn đề trọng tâm của trang cụ thể đó và có thể bao gồm tên trang web hoặc tên doanh nghiệp.

Biện pháp tốt cho các thẻ tiêu đề trang:

-Mô tả chính xác nội dung trang – chọn tiêu đề truyền đạt hiệu quả chủ đề nội dung trang.

-Tránh: chọn tiêu đề không liên quan đến nội dung trang, sử dụng các tiêu đề mặc định hoặc không rõ ràng như “không có tiêu đề”.

-Tạo thẻ tiêu đề duy nhất cho mỗi trang, mỗi trang tốt nhất nên có thẻ tiêu để duy nhất, điều này giúp các công cụ tìm kiếm biết trang này không trùng lắp nội dung với các trang khác của website.

-Tránh: sử dụng thẻ tiêu đề duy nhất cho tất cả các trang web hoặc nhóm.

-Sử dụng các tiêu đề ngắn gọn, nhưng mang tính mô tả, tiêu đề có thể vừa ngắn gọn và giàu thông tin. Nếu tiêu đề quá dài, công cụ tìm kiếm chỉ hiển thì phần tiêu đề trong kết quả tìm kiếm.

-Tránh: sử dụng các tiêu đề quá dài không có ích cho người dùng, bổ sung các từ khóa không cần thiết trong các thẻ tiêu đề.

Thẻ Meta description

Thẻ meta descriptions của trang cung cấp cho công cụ tìm kiếm bản tóm tắt nội dung trang web. Trong khi tiêu đề trang có thể là một vài từ hoặc cụm từ, thẻ meta mô tả của trang có thể là một câu, hoặc một đoạn ngắn.

Cú pháp: <meta name="description" content="nội dung mô tả" />

Các thẻ meta mô tả rất quan trọng vì các cỗ máy tìm kiếm sử dụng chúng làm các đoạn trích cho trang web, để hiện thị ở kết quả tìm kiếm vì nó khớp với truy vấn người dùng. Thêm các thẻ meta vào mỗi trang web luôn luôn là biện pháp tốt trong trường hợp các cỗ máy tìm kiếm không thể tìm thấy lựa chọn văn bản tốt để sử dụng.

Biện pháp tốt cho thẻ meta description:

-Tóm tắt một cách chính xác nội dung của trang, viết mô tả vừa cung cấp thông tin vừa thu hút người dùng nếu họ nhìn thấy thẻ meta mô tả dưới dạng đoạn trích trong kết quả tìm kiếm.

-Tránh: viết thẻ meta description không liên quan đến nội dung trong trang, sử dụng các description chung chung như “đây là một trang web” hoặc “trang web về bóng chày”, chỉ điền các từ khóa vào description, sao chép và dán toàn bộ nội dung của tài liệu vào thẻ meta description.

-Sử dụng các description duy nhất cho mỗi trang, mỗi trang có một thẻ meta description khác nhau giúp cả người dùng lẫn công cụ tìm kiếm. Nếu trang web

có hàng nghìn hoặc thậm chí hàng triệu trang web, các thẻ meta description được tạo thủ công có lẽ không khả thi. Trong trường hợp này, có thể tạo tự động các thẻ meta description dựa trên nội dung của mỗi trang.

-Tránh: sử dụng thẻ meta description cho tất cả các trang trên trang web hoặc cho số lượng trang lớn.

Meta keyword

Cú pháp:<meta name="keywords" content="keyword" /> Là nơi khai báo các từ khóa của một trang.

Nên thêm vào một số từ khóa có thể xảy ra khi người dùng gõ vào công cụ tìm kiếm. đối với tiếng việt điển hình như có dấu hoặc không dấu, có khoảng trắng giữa hai chứ hoặc không có khoảng trắng.

Thẻ header

Có sáu thẻ header, cú pháp:

Hình 10 - Thẻ header

(Nguồn: http://blog.woorank.com/)

Thẻ header được sử dụng để trình bày cấu trúc trang đến người dùng. Có sáu kích thước của thẻ tiêu đề, bắt đầu từ <h1>, quan trọng nhất và kết thúc là <h6>, ít quan trọng hơn.

Vì thông thường, các thẻ header khiến cho phần văn bản được chứa trong chúng lớn hơn phần văn bản thường trên trang. Đây là dấu hiệu trực quan cho người dùng biết

rằng văn bản này quan trọng và có thể giúp họ hiểu mức nào đó về loại nội dung bên dưới phần tiêu đề. Nhiều kích thước tiêu đề được sử dụng để tạo ra cấu trúc phân cấp cho nội dung trang, giúp người dùng dễ dàng biết được những nội dung cần xem.

Các nguyên tắc hữu ích dành cho thẻ tiêu đề

Tưởng tượng rằng mình đang viết danh mục: tương tự việc viết danh mục cho một tờ báo lớn, hãy nghĩ về điểm chính và điểm phụ của nội dung trên trang và quyết định nơi sử dụng các thẻ header một cách thích hợp.

Thẻ Image

Cú pháp:

<img src="picture.jpg" alt="từ khóa" title=”từ khóa” width="100" height="100" />

Hình ảnh là thành phần rất quan trọng của trang web, để có thể tối ưu hóa việc sử dụng hình ảnh thì nên tập trung vào tất cả các thuộc tính “src”, “alt”, và “title”.

Thuộc tính “alt” cho phép người thiết kế chỉ định văn bản thay thế cho hình ảnh nếu hình ảnh đó không hiển thị vì một số lý do. Tại sao lại sử dụng thuộc tính này? Nếu người dùng đang xem trang web trên trình duyệt không hỗ trợ hình ảnh, các nội dung trong thuộc tính “alt” sẽ cung cấp thông tin về bức hình.

Một lý do khác là nếu sử dụng hình ảnh làm liên kết, văn bản thay thế cho hình ảnh đó sẽ được xử lý tương tự như anchor-text của liên kết. Tuy nhiên, lời khuyên của chúng tôi là không nên sử dụng quá nhiều hình ảnh cho các liên kết trong điều hướng trang web khi mà các liên kết văn bản có thể phục vụ cho cùng một mục đích. Cuối cùng, việc tối ưu hóa các tên tệp hình ảnh và alt text giúp các dự án tìm kiếm hình ảnh như Google Images thì nó sẽ dễ dàng hiểu các hình ảnh hơn. Thuộc tính “title” giúp tăng tính tương tác đối với người truy cập, khi họ rê chuột vào hình ảnh một tip nhỏ về nội dung bức ảnh sẽ hiện ra.

Thuộc tính Nofollow

Đặt giá trị thuộc tính “rel” của liên kết thành “nofollow” sẽ cho Google biết rằng không nên đi theo một số liên kết nhất định trên trang web hoặc không nên đưa danh tiếng trang đến những trang được liên kết tới. Không đi theo liên kết là thêm rel=”nofollow” vào trong thẻ liên kết của liên kết đó.

Trường hợp khác sử dụng thuộc tính nofollow là khi người thiết kế đang viết nội dung và muốn tham chiếu trang web nhưng không muốn chuyển danh tiếng của mình sang cho một trang web này. Ví dụ, hãy tưởng tượng rằng một nhà quản trị đang viết bài đăng trên blog về chủ đề spam nhận xét và anh ấy muốn chỉ ra những trang web gần đây đã spam nhận xét trên blog. Và muốn cảnh báo những người khác về những trang spam này, vì vậy anh ta sẽ đưa liên kết đến trang web đó vào nội dung của mình, chắc chắn nhà quản trị không muốn trao cho trang web này phần nào danh tiếng của mình từ những liên kết đó. Đây chính là lúc sử dụng thuộc tính nofollow.

Thuộc tính Strong và emphasis

Trong đoạn text ở mỗi trang, thường dùng thẻ <b> BOLD </b> cho kiểu chữ in đậm và <i> ITALICS </i> cho kiểu chữ in nghiêng. Nếu dùng CSS thì việc đó trở nên đơn giản hơn. Tuy nhiên với hai kiểu chữ đậm và chữ nghiêng, ta có thể thay thế bằng <strong> và <em> emphasis. Về mặt văn bản thì <strong> và <em> cho một định dạng giống với chữ in đậm và chữ nghiêng nhưng với kiểu như vậy sẽ giúp các công cụ tìm kiếm chú ý nhiều hơn với những từ đó.

Một phần của tài liệu luận văn thạc sỹ xây dựng công cụ hỗ trợ tối ưu hóa website cho các công cụ tìm kiếm (Trang 52 - 56)