04 October 2019

Hướng dẫn tạo thẻ HTML 5 thân thiện, thẻ meta chuẩn Seo

Việc tạo ra Blog đối với mình cũng không phải là khó khăn, khó khăn nhất ở đây là bạn tạo ra một blog trong các vô vàng điều kiện áp dụng sau này đăng ký Google adsense. Khi bạn bước chân vào adsense là bạn nên hiểu làm sao để vượt qua vòng tuyển sinh. Làm sao để blog bạn đạt yêu cầu. Mình không nói đến nội dung. Bài này mình chia sẻ đến các bạn các thẻ meta sử dụng HTML5 thân thiện. You are readly!



Hướng dẫn tạo thẻ HTML 5 thân thiện, thẻ meta chuẩn Seo

Thẻ meta trong blog và bài viết phải có danh tính rõ ràng. Để google tìm kiếm nhanh hơn, xác định dễ dàng hơn. Chức năng thẻ meta về cơ bản bao gồm một số yếu tố quan trọng:

1. Mô tả: Thẻ meta Mô tả thẻ meta được sử dụng để cung cấp mô tả chung về nội dung của trang blog của bạn. Kích thước được đề xuất là không quá 200 ký tự
<meta content='Viết mô tả ở đây <=200 ký tự'  name='description'/>

2. Từ khóa thẻ meta Từ khóa thẻ:
Meta rất quan trọng, vì chúng xác định từ khóa nào có thể tìm thấy trang blog của bạn trên các công cụ tìm kiếm.
<meta content="từ khóa 1, từ khóa 2, từ khóa 3,... name="keywords"/>

3. Thẻ meta robot:
Mục đích chính của việc sử dụng thẻ meta robot là để xác định trang blog nào sẽ được lập chỉ mục bởi tìm kiếm và trang blog nào sẽ không được tìm kiếm. Thẻ này rất hữu ích đặc biệt nếu một blog sử dụng khung để điều hướng.
<meta content="index follow" name="robots"/>

Ba thành phần của thẻ meta này nếu được kết hợp, hình dạng như sau:
<meta content='viết mô tả ở đây dưới hoặc bằng 200 ký tự' name='description'/>
<meta content='từ khóa 1, từ khóa 2, từ khóa 3,...' name='keywords'/>
<meta content='index, follow' name='robots'/>

Vậy là đã xong các phần cơ bản, có thể áp dụng cho template blogger chuẩn seo của các bạn rồi!

Thẻ HTML thân thiện và thẻ meta HTML5

Ở đây mình thẻ thân thiện HTML5 meta mình đã áp dụng cho template blogger này rồi.  Các bạn có thể cài đặt bằng cách copy chúng vào dưới thẻ mở <head> và trên thẻ đóng </head>
<!-- [ Meta Tag SEO ] -->
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<script type='application/ld+json'>{ &quot;@context&quot;: &quot;http://schema.org&quot;, &quot;@type&quot;: &quot;WebSite&quot;, &quot;url&quot;: &quot;<data:blog.homepageUrl/>&quot;, &quot;potentialAction&quot;: { &quot;@type&quot;: &quot;SearchAction&quot;, &quot;target&quot;: &quot;<data:blog.homepageUrl/>?q={search_term}&quot;, &quot;query-input&quot;: &quot;required name=search_term&quot; } }</script>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + &quot;, &quot; + data:blog.pageTitle + &quot;, &quot; + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='DESKRIPSI-BLOG' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<meta content='GOOGLE-WEBMASTER' name='google-site-verification'/>
<meta content='WEBMASTER' name='msvalidate.01'/>
<meta content='Viet Nam' name='geo.placename'/>
<meta content='Ten ban' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<!-- [ Social Media Meta Tag ] -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Silakan kunjungi &quot; + data:blog.pageTitle + &quot; Untuk membaca postingan menarik.&quot;' property='og:description'/>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='URL Đường dẫn logo blogger của bạn' property='og:image'/>
</b:if>
</b:if>
<meta content='https://www.facebook.com/PROFIL-FACEBOOK' property='article:author'/>
<meta content='https://www.facebook.com/FAN-PAGE-FACEBOOK' property='article:publisher'/>
<meta content='MÃ-ỨNG DỤNG-FACEBOOK' property='fb:app_id'/>
<meta content='MÃ-ỨNG DỤNG-FACEBOOK CỦA ADMIN' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='USER-TWITTER' name='twitter:site'/>
<meta content='USER-TWITTER' name='twitter:creator'/>
<meta content='summary_large_image' name='twitter:card'/>

Các bạn có thể copy và chỉnh lại phù hợp với blogger của các bạn. Các bạn có thể xem qua bài cài đặt mô tả bài viết trong blogger . Chúc các bạn thành công!


EmoticonEmoticon