Hướng dẫn HTML để viết nội dung & tối ưu onpage

18
HTML THỰC HÀNH [w] www.dgm.vn Giảng viên: Võ Minh Huy Hướng dẫn HTML để viết nội dung Và tối ưu onpage

description

Module hỗ trợ của Khóa học SEO hiệu quả (http://bit.ly/khoahocseodgm), hướng dẫn học viên sử dụng HTLM để viết nội dung và tối ưu onpage.

Transcript of Hướng dẫn HTML để viết nội dung & tối ưu onpage

Page 1: Hướng dẫn HTML để viết nội dung & tối ưu onpage

HTML THỰC HÀNH

[w] www.dgm.vnGiảng viên: Võ Minh Huy

Hướng dẫn HTML để viết nội dungVà tối ưu onpage

Page 2: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

CẤU TRÚC TRANG HTML

GHI CHÚ

Buổi học sẽ hướng dẫn các bạn cách dùng HTML để viết nội dung & tối ưu onpage, không phải để Thiết kế webiste.

Nội dung được rút gọn tối đa, chỉ hướng dẫn những kiến thức cơ bản đủ để bạn viết nội dung tốt mà không cần nhớ nhiều.

Những bạn đã biết HTML & CSS không cần tham gia buổi hướng dẫn này.

Giảng viên: Võ Minh Huy

Page 3: Hướng dẫn HTML để viết nội dung & tối ưu onpage

MỤC LỤC

Cấu trúc trang HTML

Định dạng văn bản

Liên kết

Hình ảnh

Bảng biểu

Tiêu chuẩn khi viết bài

Thực hành

1

2

3

4

5

6

[w] www.dgm.vnGiảng viên: Võ Minh Huy

7

Page 4: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

CẤU TRÚC TRANG HTML

<head>…</head>

<body><p>lorem isbum</p><a href=…>anchor</a><div…>

…</div><img src=… /></body>

• Chứa các khai báo ban• Khai báo tiêu đề, mô tả, tác giả,…• Các đoạn mã javascript

• Chứa nội dung hiển thị lên trình duyệt

Ghi chú: Với Firefox, Chrome, nhấn Ctrl+U để xem mã nguồn HTML của 1 trang web.

Giảng viên: Võ Minh Huy

Ví dụ: http://dgm.edu.vn/html-dgm.html

Page 5: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

<HEAD>

1. Thẻ <title>…</title>• Tiêu đề của trang web.• Tối đa 70 kí tự• Tiêu chuẩn SEO: Cao

Giảng viên: Võ Minh Huy

Page 6: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

<HEAD>

2. Thẻ <meta name="description" content=“…” />• Mô tả nội dung trang web.• Tối đa 156 kí tự• Tiêu chuẩn SEO: Cao

Giảng viên: Võ Minh Huy

Page 7: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

<BODY>

Những nhóm thẻ HTML cơ bản để định dạng nội dung

1. Thuộc tính style2. Định dạng văn bản3. Liên kết4. Hình ảnh5. Bảng biểu

Giảng viên: Võ Minh Huy

Page 8: Hướng dẫn HTML để viết nội dung & tối ưu onpage

THUỘC TÍNH STYLE

Style là một thuộc tính dùng để định dạng hiển thị của các thẻ.• Đoạn văn bản in nghiêng:

<p style=“text-style:italic”>Văn bản in nghiêng</p>• Hình ảnh thụt vô trái 20px:

<img src=“http://example.com/image.jpg” style=“margin-left: 20px” />

Thông thường, các định dạng sẽ được khai báo trong 1 file CSS để dễ quản lý, dễ sử dụng.

Tham khảo tất cả những định dạng CSS cho thuộc tính style tại địa chỉ: http://www.w3schools.com/css/. Khi Google thì gõ đại loại như “CSS chữ in nghiêng”

Giảng viên: Võ Minh Huy [w] www.dgm.vn

Page 9: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

ĐỊNH DẠNG VĂN BẢN

1. In đậm Sử dụng thẻ <strong>…</strong> style=“font-weight: bold” Bình thường: style=“font-weight: none”

2. In nghiêng Sử dung thẻ <em>…</em> style=“font-style:italic” Bình thường: style=“font-style:normal”

Page 10: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

ĐỊNH DẠNG VĂN BẢN

3. Canh tráistyle=“text-align: left”

4. Canh giữastyle=“text-align: center”

5. Canh phảistyle=“text-align: right”

6. Canh đềustyle=“text-align: justify”

Giảng viên: Võ Minh Huy

Page 11: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

ĐỊNH DẠNG VĂN BẢN

7. Gạch dướistyle=“decoration: underline”

8. Gạch ngangstyle=“decoration: line-through” (line-through)

9. Gạch trênstyle=“decoration: overline”

10. Bình thườngstyle=“decoration: none”

Giảng viên: Võ Minh Huy

Page 12: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

ĐỊNH DẠNG VĂN BẢN

12. Kích thước chữstyle=“font-size: 12px”style=“font-size: 8px”

13. Heading

<h1>Tiêu đề bài viết</h1><h2>Chuyên mục</h2><h3>Chuyên mục con</h3>…<h6>Nội dung nhỏ</h6>

Giảng viên: Võ Minh Huy

Page 13: Hướng dẫn HTML để viết nội dung & tối ưu onpage

[w] www.dgm.vn

LIÊN KẾT

<a href=“http://www.dgm.vn” target=“_blank” rel=“nofollow”>DGM Việt Nam</a>

href=“http://www.dgm.vn”: Liên kết đến đường link http://www.dgm.vn

target=“_blank”: Mở website ở 1 tab/cửa sổ web khác rel=“nofollow”: đặt thuộc tính nofollow cho đường dẫn DGM Việt Nam: anchor text, nội dung xuất hiện trên website

Ghi chú: Có thể kết hợp với thuộc tính style để định dạng cho anchor text:

in đậm, in nghiêng, gạch dưới, kích thước chữ,…

Ví dụ hiển thi:Học SEO tại DGM Việt Nam có chất lượng tốt.

Giảng viên: Võ Minh Huy

Page 14: Hướng dẫn HTML để viết nội dung & tối ưu onpage

HÌNH ẢNH

<img src=“http://example.com/image.jpg” alt=“Mô tả hình ảnh” width=“200” height=“150” />

src=“http://example.com/image.jpg”: đường dẫn đến hình. alt=“…”: mô tả hình ảnh, giúp Googlebot hiểu được hình. width: chiều ngang height: chiều ngang

Ghi chú:Có thể kết hợp với thuộc tính style để canh trái, phải cho hình.

Giảng viên: Võ Minh Huy [w] www.dgm.vn

Page 15: Hướng dẫn HTML để viết nội dung & tối ưu onpage

BẢNG BIỂU

<table border=“1”><tbody>

<tr><th>Tiêu đề 1</th><th>Tiêu đề 2</th>

</tr><td>Nội dung 1</td><td>Nội dung 2</td>

<tr></tr>

<td>Nội dung 3</td><td>Nội dung 4</td>

<tr></tr>

</tbody></table>

Tiêu đề 1 Tiều đề 2

Nội dung 1 Nội dung 2

Nội dung 3 Nội dung 4

Có thể kết hợp với style hoặc CSS để định dạng cho bảng biểu

Trong các nội dung có thể chèn hình ảnh, liên kết với định dạng như các slide trước.

Giảng viên: Võ Minh Huy [w] www.dgm.vn

Page 16: Hướng dẫn HTML để viết nội dung & tối ưu onpage

1 Từ khóa nằm trong title Tiêu đề giới hạn 70 ký tự

2 Từ khóa nằm trong description Description giớn hạn 160 ký tự

3 Từ khóa nằm trong URL Chứa từ khóa chính

4 Từ khóa nằm trong thẻ H1 <h1>Từ khóa...</h1>

5 Từ khóa nằm trong thẻ H2-H6 <h2>Từ khóa...<h2>

6 Từ khóa được in đậm <strong>từ khóa</strong>

7 Từ khóa được in nghiêng <i>từ khóa</i>

8 Từ khóa nằm trong tên ảnh Tên ảnh có định dạng "tu-khoa.jpg" (không dấu)

9 Từ khóa nằm trong thẻ mô tả ảnh ALT="Tu khoa" (không dấu)

10 Từ khóa nằm trong đoạn văn đầu tiên

11 Mật độ từ khóa 2-5% Kiểm tra mật độ từ khóa dựa trên nội dung trên trang

12 Có internal link sang sản phẩm liên quan

TIÊU CHUẨN KHI VIẾT BÀI

Giảng viên: Võ Minh Huy [w] www.dgm.vn

Page 17: Hướng dẫn HTML để viết nội dung & tối ưu onpage

BẠN ĐẶT CÂU HỎI

TÔI SẼ...

GOOGLE !

HỎI ĐÁP

[w] www.dgm.vnGiảng viên: Võ Minh Huy

Page 18: Hướng dẫn HTML để viết nội dung & tối ưu onpage

SEE YOU SOON

[w] www.dgm.vnGiảng viên: Võ Minh Huy