Những Tag HTML ảnh hưởng đến chất lượng SEO On-Page

Trong quá trình làm SEO cho website thì chúng ta cần phải biết về HTML để tối ưu website. Để đáp ứng nhu cầu công việc, xTraffic.pep.vn đã nghiên cứu và liệt kê những Tag HTML ảnh hưởng đến chất lượng SEO On-Page và ý nghĩa của chúng.

Những Tag HTML ảnh hưởng đến chất lượng SEO On-Page - HTML seo SEO On-Page - SEO - Search Engine Optimization Search Engine Marketing Digital Marketing Marketing
Tag HTML SEO Friendly

Những tag HTML quan trọng nhất trong SEO On-Page

Tag Title (<title>)

Tag <title> là tag chứa tiêu đề bài viết và là một tag rất quan trọng để giúp cách Search Engine như Google hiểu về nội dung chính của web page (trang web). Đó là một câu tóm lược súc tích nhất về chủ đề của trang web mà bạn muốn truyền tải cho người xem trước khi họ nhấn vào để xem trang web của bạn trên trang kết quả của Google (hình 1).

Những Tag HTML ảnh hưởng đến chất lượng SEO On-Page - HTML seo SEO On-Page - SEO - Search Engine Optimization Search Engine Marketing Digital Marketing Marketing
Kết quả tìm kiếm trên Google (Hình 1)

Cũng giống như bạn đang tìm mua 1 cuốn sách trong hàng ngàn cuốn sách ở nhà sách, cuốn nào có tiêu đề hấp dẫn và liên quan (có từ khoá quan tâm) sẽ được bạn chú ý để xem xét mua.

Do đó đây là Tag HTML quan trọng bậc nhất ảnh hưởng đến SEO cũng như kết quả click vào trang web của bạn. Để đáp ứng được việc tối ưu Tag Title bạn cần thực hiện theo các chuẩn sau :

  • Sử dụng tiêu đề cho bài viết ngắn gọn và súc tích theo trọng tâm của bài viết;
  • Thêm những từ khoá có liên quan và trọng tâm mà bài viết muốn trình bày. Nếu thiếu những từ khoá quan trọng của bài viết trong tiêu đề thì sẽ là một bất lợi cho website trong việc SEO.
  • Tốt nhất là sử dụng tiêu đề có tối đa là 60 ký tự (bao gồm khoảng trắng). Trong trường hợp bất khả kháng mà bạn phải viết tiêu đề dài thì Google sẽ tự động giảm bớt tiêu đề của bạn xuống dưới 60 ký tự trong trang kết quả tìm kiếm của Google. Bạn cũng không nên viết tiêu đề quá ngắn làm người dùng khó hiểu về chủ đề của trang web.
  • Nếu hợp lý thì hãy đưa những từ khoá quan trọng ở phía trước của tiêu đề bài viết (tính từ trái sang phải). Nguyên tắc này sẽ giúp các từ khoá quan trọng của bài viết được hiển thị đầy đủ trên trang kết quả của Google, như vậy sẽ làm tăng khả năng người dùng click vào trang web của bạn do có những từ khoá mà họ quan tâm.

Tag <title> có cấu trúc như sau :

<head>
	...
	<title>Những Tag HTML ảnh hưởng đến chất lượng SEO On-Page</title>
	...
</head>
<body>
	...
</body>

Tag Meta Description

Nếu tag Title bên trên thể hiện súc tích nhất nội dung bài viết thì Tag Meta Description là phần thể hiện chi tiết hơn nội dung muốn nói. Tuy nhiên chi tiết hơn không có nghĩa là dài dòng mà vẫn phải theo nguyên tắc súc tích và trọng tâm. Tuy tag Meta Description không quan trọng bằng tag Title nhưng vẫn là một tag hết sức quan trọng giúp Search Engine hiểu rõ hơn về nội dung bạn muốn nói đến. Ngoài ra, các Search Engine cũng thường hay sử dụng tag Meta Description để thể hiện trong phần Description của trang web (Hình 1 bên trên) trong trang kết quả tìm kiếm, do đó bạn cũng cần chú trọng đến nội dung này để tối ưu theo nguyên tắc :

  • Sử dụng nội dung súc tích và trọng tâm nhằm thể hiện chi tiết hơn của phần tiêu đề bài viết;
  • Thêm từ khoá trọng tâm một cách khéo léo và tự nhiên vào Description nhằm tăng lợi thế SEO cho website;
  • Nếu hợp lý thì ưu tiên những từ khoá quan trọng nhất vào phía trước của Description (tính từ trái sang phải);
  • Tốt nhất là sử dụng Tag Meta Description có tối đa là 150 ký tự (bao gồm khoảng trắng);

Tag <a> (hyperlink – hypertext anchor)

Tag <a> là một siêu liên kết giúp một trang web này kết nối đến 1 trang khác. Do tầm quan trọng đặc biệt của hyperlink nên xTraffic.pep.vn sẽ có một bài viết riêng chuyên sâu về vấn đề này như việc xây dựng liên kết nội bộ & xây dựng liên kết bên ngoài trỏ về website (hay còn gọi là backlink & External Links); còn trong bài này, chúng ta sẽ chỉ bàn vấn đề cơ bản của tag <a>.

Tag <a> bao gồm các thuộc tính quan trọng sau :

  • href : chứa đường dẫn (url) của trang web mà nó liên kết đến. url ở đây có thể ở dạng tuyệt đối như http://blog-xtraffic.pep.vn/top-tu-khoa-duoc-tim-kiem-nhieu-nhat-tren-google-trong-thang/ hoặc ở dạng tương đối như /top-tu-khoa-duoc-tim-kiem-nhieu-nhat-tren-google-trong-thang/ , tuy nhiên xTraffic.pep.vn khuyến cáo bạn luôn sử dụng dạng tuyệt đối để mang lại nhiều lợi ích nhất.
  • rel : được viết tắt từ Relationship, là mối quan hệ giữa trang web chứa hyperlink và trang web (đích) trỏ đến.
  • target : để mở trang web đích bằng cửa sổ mới hoặc bằng cửa sổ hiện tại.

Heading content (h1, h2, h3, h4, h5, h6)

Tag Heading content bao gồm các tag html từ <h1> đến <h6> nhằm xác định tiêu đề của từng phần trong bài viết.

Tag heading content <h1>

Tag <h1> là phần quan trọng nhất trong số các tag heading content. Tag <h1> thường được sử dụng cho tiêu đề của bài viết (thông thường là cùng nội dung với tag <title>). Như vậy mỗi 1 trang web (url) chỉ nên sử dụng duy nhất 1 tag <h1>, và bạn nên đưa những từ khoá quan trọng vào trong tag <h1> này.

Tag heading content <h2> đến <h6>

Đây là những tag heading content sử dụng làm tiêu đề cho các mục con trong bài viết. Việc chia bài viết ra thành nhiều phần với việc sử dụng tag <h2> đến <h6> hợp lý sẽ làm cho website dễ nhìn và dễ hiểu hơn với người dùng, đồng thời sẽ giúp các search engine hiểu rõ nội dung trong trang web hơn khi biết bạn đang nhấn mạnh vào phần nào.

Nguyên tắc sử dụng là tag <h2> sẽ sử dụng cho tiêu đề các mục lớn hoặc quan trọng hơn, và các tiêu đề sử dụng cho các mục con sẽ sử dụng các tag nhỏ hơn <h3>,…,<h6>. Như vậy có thể hiểu là tag <h3> là “cha” của <h4> và là “ông nội” của tag <h5>.

Tag heading content có cấu trúc như sau :

<body>
  ...
  <h1 itemprop="headline">Những Tag HTML ảnh hưởng đến chất lượng SEO On-Page</h1>
  ...
</body>

Tag link canonical (avoid duplicate or similar content)

Tag link canonical là tag giúp bạn tránh lỗi trùng lặp nội dung do vô ý hay cố ý. Google xem mỗi url là 1 trang web riêng biệt, do đó nếu vô tình Google truy cập và index (lập chỉ mục) được các url khác nhau của cùng website nhưng lại có nội dung giống nhau thì đó là một điểm trừ lớn ảnh hưởng xấu đến chất lượng SEO của website.

Xét ví dụ link http://blog-xtraffic.pep.vn/nhung-tag-html-anh-huong-den-chat-luong-seo-on-page/ là link chính của bài viết. Nhưng vô tình Google Index được link http://blog-xtraffic.pep.vn/nhung-tag-html-anh-huong-den-chat-luong-seo-on-page/?utm_content=blog-xtraffic&utm_medium=social&utm_source=facebook.com&utm_campaign=fbads (thường dùng trong các chiến dịch quảng cáo để đo lường hiệu quả), lúc này nếu trang web của bạn không sử dụng tag link canonical thì Google sẽ xem 2 url này là khác nhau nhưng lại trùng lặp nội dung (lỗi nghiêm trọng trong chất lượng SEO). Để tránh trường hợp đáng tiếc này, bạn cần định nghĩa link cho mỗi bài viết. Ví dụ trong bài này thì xTraffic.pep.vn sẽ định nghĩa tag link canonical như sau :

<head>
    ...
    <link rel="canonical" href="http://blog-xtraffic.pep.vn/nhung-tag-html-anh-huong-den-chat-luong-seo-on-page/" />
    ...
</head>
<body>
    ...
</body>

Đây không phải là tag HTML theo chuẩn của w3.org nhưng lại là tag html rất quan trọng nếu bạn muốn nâng cao chất lượng SEO cho website theo chuẩn của Google

Lưu ý url trong tag link canonical phải là duy nhất do bạn định nghĩa chứ không phải dựa theo url do người dùng truy cập, nếu nó không duy nhất thì sẽ không còn ý nghĩa nữa.

Tag <img>

Hình ảnh là nội dung thường xuyên nhất gặp nhất trong website và làm trang web của chúng ta sinh động và hấp dẫn hơn trong mắt người dùng. Với tầm quan trọng của hình ảnh liên quan đến chất lượng nội dung, Google đã sớm ra mắt công cụ tìm kiếm hình ảnh nhằm đáp ứng nhu cầu càng cao của người dùng. Do đó, mỗi bài viết cần có hình ảnh minh hoạ là điều gần như bắt buộc hiện nay, nó giúp website sinh động hơn và kiếm thêm nhiều lượt truy vấn từ công cụ tìm kiếm hình ảnh của các search engine.

Tag <img> có cấu trúc như sau :

<head>
    ...
    <link rel="canonical" href="http://blog-xtraffic.pep.vn/nhung-tag-html-anh-huong-den-chat-luong-seo-on-page/" />
    ...
</head>
<body>
    ...
    <img src="http://blog-xtraffic.pep.vn/wp-content/uploads/pep-vn/1acf7ec8/google-pagespeed-insights-score-100-100-1024x518.jpg" height="518" width="1024" title="Điểm tuyệt đối 100/100 Google PageSpeed Insights" alt="Điểm tuyệt đối 100/100 Google PageSpeed Insights" />
    ...
</body>

Theo cấu trúc bên trên thì những thuộc tính quan trọng của tag <img> :

  • src : url của hình ảnh, nếu thiếu thuộc tính này thì tag <img> sẽ không hiển thị được và gây lỗi nghiêm trọng;
  • alt : theo định nghĩa của w3.org thì thuộc tính này được dùng để chứa văn bản nhằm mô tả hình ảnh khi hình ảnh không hiển thị được (gặp lỗi hoặc do người dùng tắt chức năng hiển thị hình ảnh trên trình duyệt). Và thuộc tính này cũng được các search engine sử dụng để xác định hình ảnh này mô tả điều gì, do đó bạn hãy chắc chắn là thêm thuộc tính alt này cho tag <img> để tăng chất lượng SEO cho hình ảnh;
  • height : chiều cao của hình ảnh tính theo pixel của hình ảnh, thuộc tính này sẽ giúp hình ảnh hiển thị nhanh hơn khi mà trình duyệt không cần phải tải hình ảnh để biết được chiều cao. Thuộc tính này tuy không bắt buộc nhưng xTraffic.pep.vn khuyến cáo bạn nên sử dụng nó trong tag <img> để trình duyệt render trang web nhanh hơn;
  • width : chiều rộng của hình ảnh tính theo pixel và tương tự như thuộc tính height;
  • title : chứa nội dung hiển thị cho người dùng xem khi họ rê chuột lên hình ảnh. Tuy thuộc tính này không quan trọng như alt nhưng xTraffic.pep.vn khuyến cáo bạn cũng nên sử dụng trong tag <img>;

Tag <strong> & tag <b>

Mặc dù khi hiển thị cho người dùng xem thì 2 tag này đều in đậm chữ bên trong. Tuy nhiên việc sử dụng 2 Tag <strong> & tag <b> là khác nhau theo chuẩn của w3.org.

Tag <b> chỉ có ý nghĩa làm nổi bật văn bản chứa trong nó mà không mang ý nghĩa nhấn mạnh tầm quan trọng của văn bản như tag <strong>. Theo khuyến cáo của w3.org thì bạn hết sức hạn chế dùng tag <b> trừ khi không còn tag nào phù hợp với ngữ cảnh trong bài viết.

Tag <strong> là một tag hết sức quan trọng, đối với hiển thị cho người dùng xem thì tag <strong> sẽ làm đậm văn bản chứa trong nó, còn đối với tiêu chuẩn của w3.org hay Google thì nó có ý nghĩa là tầm quan trọng (hơn) của phần văn bản chứa trong nó so với các phần còn lại. Do đó, nếu bạn muốn nói điều gì quan trọng như từ khoá chính thì hãy sử dụng tag <strong> chứ không nên dùng tag <b>.

Tag <em> & tag <i>

Tương tự như với tag <strong> & tag <b>, cả 2 tag <em> & tag <i> đều làm văn bản in nghiêng, nhưng tag <em> mang ý nghĩa khẳng định điều bạn muốn nói. Do đó hãy sử dụng tag <em> thay cho tag <i> để nhấn mạnh những điều bạn nói là đúng.

Trong một số trường hợp cần phải dùng tag <i> như theo quy định của một số quy ước thể hiện văn bản trên các báo & tạp chí là phải in nghiêng tên các tác phẩm văn học nghệ thuật, báo chí,… thì bạn phải dùng tag <i> thay vì tag <em>, vì đây không phải nhấn mạnh điều bạn nói là đúng, đơn giản chỉ là quy định.

Như vậy qua trình bày ở trên, chúng ta nên sử dụng tag <strong> & <em> khi bạn muốn nhấn mạnh hoặc thể hiện tầm quan trọng của một cụm từ nào đó thay vì sử dụng tag <b> hay <i> vì nó sẽ ảnh hưởng đến chất lượng SEO của website.

Những tag HTML thường dùng khác

Tag <header>

Tag <header> thường được dùng để chứa các thông tin mở đầu của nội dung hoặc chứa các link điều hướng (navigation) như menu của website. Tag <header> cũng được dùng trong các tag <section> và <article> để mở đầu cho một phần nội dung trong trang web.

Tag <header> thường chứa các thông tin sau :

  • Một hoặc nhiều tag heading content <h1> đến <h6>
  • Logo hoặc icon của website
  • Thông tin về tác giả

Bạn có thể sử dụng nhiều Tag <header> trong 1 trang web, nhưng bạn không được đặt tag <header> bên trong các tag : <footer>, <address> hoặc tag <header> khác.

Bạn có thể tham khảo ví dụ bên trên để biết cách sử dụng tag <header> chứa các link điều hướng của menu

Tag <main>

Tag <main> là tag dùng để xác định nội dung chính của 1 trang web. Tag <main> thường sử dụng kết hợp với tag <header> & tag <footer>để tạo thành cấu trúc của 1 trang web hoàn chỉnh.

Ví dụ :

<head>
...
</head>
<body>
<header>
    ...
</header>
<main>
    ...
</main>
<footer>
    ...
</footer>
</body>

Do mỗi trang web chỉ có 1 nội dung chính nên bạn chỉ được sử dụng 1 tag <main> duy nhất và nên sử dụng theo cấu trúc ở ví dụ bên trên.

Tag <footer>

Tag <footer> thông thường được dùng để chứa các thông tin sau :

  • Thông tin về tác giả
  • Thông tin bản quyền
  • Thông tin liên hệ
  • Các link của những mục quan trọng

Mặc dù w3.org không yêu cầu bạn phải đặt Tag <footer> ở đầu hay ở cuối, nhưng thông thường thì các website hay đặt Tag <footer> ở phía cuối.

Ví dụ : Sử dụng Tag <footer> để chứa thông tin của website

<head>
...
</head>
<body>
...
<footer>
    <nav>
        <ul>
            <li><a href="/about">About us...</a></li>
            <li><a href="/feedback">Send feedback!</a></li>
            <li><a href="/sitemap">Sitemap</a></li>
        </ul>
    </nav>
    <p><small>Copyright © 2015 xTraffic.pep.vn — <a href="/tos">Terms of Service</a></small></p>
</footer>
</body>

Tag <nav> (navigation – điều hướng)

Tag <nav> thường được dùng để chứa các thông tin điều hướng của toàn trang hoặc của 1 trang nào đó. Theo định nghĩa này thì tag <nav> thường hay dùng nhất để chứa menu (thuộc phần header và footer) của toàn website.

Ví dụ đây sau là cách dùng tag <nav> để chứa menu trên phần header :

<head>
...
</head>
<body>
...
<header id="header" role="banner">
    ...
    <div id="main-menu">
        <nav>
            <ul>
                <li><a href="http://blog-xtraffic.pep.vn/">Home</a></li>
                <li><a href="http://blog-xtraffic.pep.vn/category/phat-trien-website/blog/wordpress/">WordPress</a></li>
                <li><a href="http://blog-xtraffic.pep.vn/category/phat-trien-website/hosting/">Hosting</a></li>
                <li><a href="http://blog-xtraffic.pep.vn/category/phat-trien-website/webmasters-tools/">Webmasters Tools</a></li>
                <li><a href="http://blog-xtraffic.pep.vn/category/phat-trien-website/co-so-du-lieu-database/">Cơ sở dữ liệu – Database</a></li>
            </ul>
        </nav>
    </div>
    ...
</header>
...
</body>

Ngoài ra, tag <nav> cũng còn đảm nhận chứa các link điều hướng của trong nội bộ trang :

<head>
...
</head>
<body>
...
<nav>
    <ul>
        <li><a href="#Tag-Title">Tag Title (<title>)</a></li>
        <li><a href="#Tag-Meta-Description">Tag Meta Description</a></li>
        ...more...
    </ul>
</nav>
...
</body>

Tag <article> & Tag <section>

Tag <article> là tag định nghĩa các bài viết trong trang web. Tag <article> thường được sử dụng như là bài viết trên forum, bài viết trên blog, bài viết trên trang tin tức, bài bình luận của người dùng, widget hoặc bất kỳ mục nào độc lập trong 1 website.

Tag <section> nên được dùng để tạo nhóm các thông tin giống nhau, và tag <article> nên được sử dụng cho các thông tin như một bài viết hoặc một blog mà chúng có thể bị gỡ bỏ và được đặt trong một ngữ cảnh mới mà không ảnh hưởng đến ý nghĩa của nội dung. Tag <article> như tên gọi của nó, cung cấp một gói thông tin đầy đủ. Ngược lại, tag <section> chứa thông tin liên quan, trừ thông tin không thể được đặt trong một ngữ cảnh khác với chính nó, do nghĩa của nó sẽ bị mất.

Tag <section> cũng có thể chứa các tag <article>, cũng giống như tag <article> có thể chứa các tag <section>. Nội dung cho cả hai tag <section> và tag <article> thường bắt đầu bằng một <header> và kết thúc bằng một <footer>, với nội dung cho các tag này ở giữa.

Ví dụ sau đây sẽ sử dụng tag <article> cùng với các thuộc tính khác để trình bày 1 bình luận của 1 người dùng nào đó trong 1 bài viết trên website :

<head>
    ...
</head>
<body>
    ...
<article itemscope itemtype="http://schema.org/BlogPosting">
	<header>
		<h1 itemprop="headline">Tiêu đề của bài viết</h1>
		<p><time itemprop="datePublished" datetime="2015-05-15">1 ngày trước</time></p>
		<link itemprop="url" href="#comments=0">
	</header>
	<p>Đoạn văn bản chứa nội dung của bài viết...</p>
	<section>
		<h2>Comments</h2>
		<article itemprop="comment" itemscope itemtype="http://schema.org/UserComments" id="c1">
			<link itemprop="url" href="#c1" />
			<footer>
				<p>Posted by : 
					<span itemprop="creator" itemscope itemtype="http://schema.org/Person">
						<span itemprop="name">xTraffic.pep.vn</span>
					</span>
				</p>
				<p><time itemprop="commentTime" datetime="2015-05-16">5 phút trước</time></p>
			</footer>
			<p>Nội dung bình luận của xTraffic.pep.vn</p>
		</article>
		
		<article itemprop="comment" itemscope itemtype="http://schema.org/UserComments" id="c2">
			<link itemprop="url" href="#c2">
			<footer>
				<p>Posted by: 
					<span itemprop="creator" itemscope itemtype="http://schema.org/Person">
						<span itemprop="name">Nguyễn Minh</span>
					</span>
				</p>
				<p><time itemprop="commentTime" datetime="2015-05-16">15 phút trước</time></p>
			</footer>
			<p>Hey, you have the same first name as me.</p>
		</article>
	</section>
</article>
    ...
</body>

Tag <p> (paragraph)

Tag <p> thường được dùng để chứa các đoạn văn trong bài viết của trang web. Đây là tag quan trọng giúp các đoạn văn có khoảng cách hợp lý nhằm giúp người dùng dễ đọc. Bạn có thể xem ví dụ bên trên để biết cách sử dụng tag <p>

Tag <ul> & <ol>

Đây là 2 tag thường dùng để liệt kê danh sách các hạng mục. Điều khác biệt giữa tag <ul> & tag <ol> là với tag <ul> không quan trọng thứ tự thể hiện các hạng mục, còn tag <ol> thể hiện mức độ liên quan giữa các hạng mục.

Ví dụ, khi bạn muốn thể hiện danh sách những nhà cung cấp dịch vụ VPS/Server mà không đưa ra các tiêu chí so sánh giữa các nhà cung cấp này thì bạn có thể dùng tag <ul> để thể hiện :

<head>
    ...
</head>
<body>
    ...
    <h1>Danh sách các nhà cung cấp dịch vụ Hosting/VPS/Server tại Việt Nam</h1>
    <ul>
        <li>https://www.matbao.net/</li>
        <li>http://vhost.vn/</li>
        <li>http://vinahost.vn/</li>
        <li>https://www.pavietnam.vn/</li>
        <li>...</li>
    </ul>
    ...
</body>

Nhưng nếu bạn muốn thể hiện tầm quan trọng giữa các hạng mục thông qua thứ tự của nó, bạn sẽ cần dùng đến tag

<head>
...
</head>
<body>
...
<h1>Những tag HTML quan trọng nhất ảnh hưởng đến SEO</h1>
<ol>
    <li>Tag Title (<title>)</li>
    <li>Tag Meta Description</li>
    <li>Tag <a> (hyperlink - hypertext anchor)</li>
    <li>Heading content (h1, h2, h3, h4, h5, h6)</li>
    <li>Tag <img></li>
    <li>...</li>
</ol>
...
</body>

Theo như ví dụ trên thì Tag Title (<title>) là tag quan trọng nhất ảnh hưởng đến chất lượng SEO On-Page của trang web, tiếp theo đến các tag như Tag Meta Description,… theo mức độ ảnh hưởng giảm dần.

Tag <cite>

Đối với HTML5 thì tag <cite> thường được dùng để chứa tiêu đề của một tác phẩm nào đó như : tựa của cuốn sách, tên của bài hát, tựa đề của bộ phim, tên của bước tranh, tên của một tác phẩm điêu khắc, một website,  web page, blog post hoặc comment, forum post hoặc comment, tweet….

Còn đối với HTML4 thì <cite> được dùng để xác định một trích dẫn (citation).

Cách dùng của <cite> đối với trường hợp trích dẫn tựa 1 cuốn sách

<head>
...
</head>
<body>
...
<h1>5 cuốn sách bạn nên đọc trước tuổi 30</h1>
...
<p>Trong "<cite>Thuyết phục bằng tâm lý</cite>", nhà tâm lý học <cite>Robert Cialdini</cite> đã chỉ ra và phân tích sáu nguyên tắc tâm lý của nghệ thuật thuyết phục bao gồm: sự nhất quán, sự đáp trả, bằng chứng xã hội, uy thế, thiện cảm và sự khan hiếm.</p>
...
</body>

Tag <figure> & Tag <figcaption>

Tag <figure> được dùng để chứa các phần tử hình ảnh, sơ đồ, audio, video trong website. Tag <figure> sử dụng chung với tag <figcaption> để chú thích cho nội dung của hình ảnh, video,…

Ví dụ cách sử dụng Tag <figure> & Tag <figcaption> :

<head>
...
</head>
<body>
...

<figure>
    <img src="/figure.jpg" width="304" height="228" alt="Picture">
    <figcaption>Caption for the figure</figcaption>
</figure>
...
</body>

Tag <blockquote>

Tag <blockquote> được dùng để trích dẫn nguồn từ 1 trang web khác với thuộc tính cite chứa url của trang web mà bạn muốn dẫn nguồn.

Ví dụ cách sử dụng tag <blockquote> :

<blockquote cite="http://www.worldwildlife.org/about">
    WWF's mission is to conserve nature and reduce the most pressing threats to the diversity of life on Earth.
</blockquote>

Các <meta> Tags khác

Tag <meta> author dùng để chứa thông tin tên tác giả của bài viết. Bạn có thể đặt tên cá nhân hoặc domain vào đây. Ví dụ :

<head>
...
<meta name="author" content="xTraffic.pep.vn">
...
</head>
<body>
...
</body>

Tag <meta> charset dùng để chứa thông tin bảng mã ký tự (character encoding) dùng trên website. Đây là tag meta rất quan trọng giúp browser hiển thị đúng văn bản trên website. Bảng mã utf-8 được đa số các ngôn ngữ trên thế giới sử dụng trong đó có cả Tiếng Việt. Bạn nên đặt thẻ meta này ngay phía sau <head>. Ví dụ :

<head>
<meta name="charset" content="utf-8">
...
</head>
<body>
...
</body>

Social Meta Tags

Mạng xã hội là một phần không thể thiếu đối với internet hiện nay. Do đó website của bạn cũng cần phải bắt kịp xu thế hiện nay để đạt chất lượng SEO cao. Bạn có thể xem chi tiết bài viết về Social Meta Tags cho website tại đây.

Leave a Comment