Định dạng chuẩn và quy ước viết code trong HTML5


Quy ước viết code của HTML

Các nhà lập trình web thường không liên hoàn cách viết code và cú pháp quá trình luyện tập HTML. Vào giai đoạn từ thời điểm năm 2000 đến 2010, nhiều lập trình viên đã chuyển cách viết từ HTML sang XHTML – ngôn ngữ nhu muốn cú pháp được viết một cách đúng các bước thực hiện thế nào để dán nghiêm ngặt (well-formed).

HTML5 có hình thức viết tự tại hơn, nên để trở thành một lập trình viên sáng dạ, bạn phải phải nhân tạo cho mình các việc thường xuyên làm viết code theo như đúng các bước thực hiện thế nào để dán để người khác rất có khả năng dễ chơi hiểu và sử dụng code HTML của bạn.

Hơn thế nữa, trong sau này, những bộ máy search kiếm tìm và nghiên cứu và nói rõ dạng như trình đọc XML rất có khả năng sẽ muốn đọc các trang HTML của bạn. Sử dụng cú pháp gần với chuẩn XHTML sẽ dành được đánh giá là 1 trong những sự tuyển lựa sáng dạ của số đông lập trình viên.

Hãy nhớ luôn giữ cho mã của bạn gọn gàng, thật sạch, và đúng ra.

Sử dụng đúng DOCÔNG TYPE

Luôn luôn khai báo kiểu tư liệu DOCÔNG TYPE ở dòng đầu tiên trong đoạn code của bạn:

Nếu muốn có sự đồng bộ với những thẻ bên dưới khác, bạn rất có khả năng sử dụng:

Viết thường cho tên các phần tử

HTML5 cũng có thể đồng ý được dùng kết vừa lòng cả chữ hoa và chữ thường trong những tên phần tử.

Tuy nhiên chúng ta nên sử dụng tên phần tử chữ thường, chính vì:

  • Kết vừa lòng cả chữ hoa và chữ thường sẽ gây ra rối mắt.
  • Các lập trình viên thường được dùng chữ viết thường (giống chuẩn XHTML).
  • Viết thường nhìn đoạn code sẽ cụ thể hơn.
  • Viết thường sẽ nhanh và dễ chơi hơn.

Không nên:


Quantrimang được cập nhật hay gặp và liên hoàn.



Quantrimang được cập nhật hay gặp và liên hoàn.


Nên:


Quantrimang được cập nhật hay gặp và liên hoàn.


Luôn đóng toàn trang và toàn diện các phần tử HTML

Trong HTML5, bạn không cần thiết phải đóng toàn trang và toàn diện các phần tử (thí dụ như phần tử

).

Nhưng khuyến nghị chúng ta nên sử dụng thẻ đóng sau khoản thời gian làm xong hoàn thành xong phần tử.

Không nên:


Quantrimang được cập nhật hay gặp và liên hoàn.

Quantrimang được cập nhật hay gặp và liên hoàn.

Nên:


Quantrimang được cập nhật hay gặp và liên hoàn.


Quantrimang được cập nhật hay gặp và liên hoàn.


Đóng các phần tử HTML rỗng

Trong HTML5, phần tử rỗng rất có khả năng dùng thẻ đóng hoặc không.

Bạn rất có khả năng sử dụng 1 trong những hai cách viết:

Tuy nhiên, dấu gạch chéo đóng (/) là cần phải có trong XHTML và XML.

Nếu muốn những ứng dụng đọc XML rất có khả năng hiểu được trang của bạn, chúng ta nên sử dụng thẻ đóng sau khoản thời gian làm xong hoàn thành xong phần tử.

Viết thường cho tên các thuộc tính

HTML5 cũng có thể đồng ý được dùng cả chữ hoa và chữ thường với tên thuộc tính. Tuy nhiên chúng ta nên sử dụng chữ thường vì:

  • Sử dụng cả chữ hoa và chữ thường nhìn rất lộn xộn
  • Các lập trình viên chuyên sử dụng các tên viết thường (như trong XHTML)
  • Viết thường nhìn đoạn code sẽ cụ thể hơn.
  • Viết thường sẽ nhanh và dễ chơi hơn.

Không nên:

Nên:

Sử dụng nháy kép cho các độ quý và hiếm thuộc tính

HTML5 cũng có thể đồng ý được những độ quý và hiếm thuộc tính không cần dấu ngoặc kép. Tuy nhiên tốt hơn hết chúng ta nên cho thêm lần nữa dấu ngoặc kép vì:

  • Giá trị trong dấu ngoặc sẽ đọc dễ và dễ phân minh hơn.
  • Bạn cần sử dụng dấu nháy kép nếu độ quý và hiếm chứa dấu cách.

Không nên:

Nên:

Thuộc tính hình ảnh sản phẩm

Luôn sử dụng thuộc tính alt với những ảnh chèn vào trang web. Đây là sự việc rất cần khi hình ảnh sản phẩm chèn không hiển thị và cũng chính là cách để hệ thống máy search kiếm tìm rất có khả năng dễ chơi kiếm được mô tả ảnh bạn định nói gì.

Ngoài ra, mãi mãi khai báo chiều rộng và độ cao hình ảnh sản phẩm. Nó sẽ khiến trang web của bạn không bị lập loè vì trình duyệt rất có khả năng dự phòng khoản không gian cho hình ảnh sản phẩm trước khi tải.

Không nên:

Nên:

HTML5

Khoảng trắng và dấu bằng

HTML5 cũng có thể đồng ý được dấu cách đặt ở cả hai đầu dấu bằng.

Nhưng khi viết liền sẽ có mặt trên thị trường cảm xúc đọc dễ hơn.

Tránh code dài trên một dòng

Khi bạn sử dụng một trình soạn thảo HTML, nếu đã có một dòng code quá dài bạn phải phải trượt thanh cuộn sang phải hoặc sang trái để rất có khả năng đọc hết dòng code đó.

Vì thế hãy phấn đấu tránh mọi dòng mã dài ra hơn 80 ký tự.

Dòng trống và lùi đầu dòng

  • Không thêm các loại trống mà đang không có duyên do.
  • Để đọc dễ, thêm dòng trống để tách các đoạn dài hoặc phân cách hài hòa giữa các thẻ.
  • Nên lùi đầu dòng một khoảng nhưng chúng ta không nên sử dụng phím tab.
  • Không thêm dòng trống hoặc rất có khả năng dấu cách khi không cần có.

Cách dòng và thụt lề như thí dụ dưới này là không cần có: 

 

Chuyện Công nghệ



Giá Bitcoin hạ kịch sàn, thấp nhất trong năm




Tờ CNBC cung cấp tin đồng bạc ảo này giảm khoảng 9%,
xuống chỉ còn $5.640,36 và vẫn chưa được hiện ra dấu hiệu dừng lại.
Tại thời điểm soạn thảo này, giá chỉ với $5.307,52.
Đây là lần đầu tiên giá bitcoin giảm xuống dưới $6 Nghìn đồng
khi đó nhận cú giáng kỉ lục vào tháng 12 năm ngoái.



Nên viết như sau:



Chuyện Công nghệ



Giá Bitcoin hạ kịch sàn, thấp nhất trong năm/h2>

Tờ CNBC cung cấp tin đồng bạc ảo này giảm khoảng 9%,
xuống chỉ còn $5.640,36 và vẫn chưa được hiện ra dấu hiệu dừng lại.
Tại thời điểm soạn thảo này, giá chỉ với $5.307,52.
Đây là lần đầu tiên giá bitcoin giảm xuống dưới $6 Nghìn đồng
khi đó nhận cú giáng kỉ lục vào tháng 12 năm ngoái.



Ví dụ về bảng:



 
 


 






</table>

Vi dụ về bản kê:


     
  1. Làng Công nghệ

  2.  
  3. Khoa học

  4.  
  5. Cuộc sống

Thiếu thẻ và

Trong HTML5, thẻ và thẻ rất có khả năng bị bỏ mất.

Đoạn code dưới đây vẫn hoàn toàn vừa lòng lệ



Quantrimang


giới thiệu Quantrimang


Quantrimang được cập nhật hay gặp và liên hoàn.

Tuy nhiên, bạn chúng ta không nên bỏ thẻ và thẻ .

Phần tử là khung của trang. Trong đó bạn rất có khả năng khai báo ngôn ngữ mà bạn đang dùng trong trang:


Việc khai báo một ngôn ngữ rất cần khái niệm các công cụ search kiếm tìm và những ứng dụng khi truy nhập trang web của bạn.

Việc bỏ mất hoặc rất có khả năng làm hỏng DOM và ứng dụng XML, rất có khả năng lỗi khi hiển thị trên trình duyệt cũ hơn (IE9).

Thiếu thẻ

Trong chuẩn HTML5, thẻ cũng rất có khả năng bị bỏ mất.

Theo nguyên hình, trình duyệt sẽ tự động thêm thẻ trước thẻ .

Bạn rất có khả năng giảm độ khó hiểu của HTML, bằng phương pháp bỏ mất thẻ :

Ví dụ:



Quantrimang


giới thiệu Quantrimang


Quantrimang được cập nhật hay gặp và liên hoàn.




Tuy nhiên, tốt hơn hết bạn chúng ta không nên bỏ mất thẻ . Việc bỏ bớt các thẻ có vẻ không quen thuộc với những lập trình viên.

Thẻ </h2> <p>Phần tử <em><title></em> là cần phải có trong HTML5. Bạn hãy đặt tên tiêu đề càng ý nghĩa càng cao.</p> <pre><code><title>Định dạng chuẩn và quy ước viết code trong HTML5

Để bảo hiểm an toàn giải thích đúng ra và đúng chỉ mục với những công cụ search kiếm tìm khi cần tìm trang web của bạn, hãy tùy chỉnh ngôn ngữ và các kí tự mã hóa mà trang sử dụng ở ngay các loại đầu tiên:





Định dạng chuẩn và quy ước mã hóa trong HTML5

Cài đặt hình thức xem

HTML5 đã giới thiệu một phương pháp dễ chơi cho các chuyên gia kiến thiết web kiểm soát hình thức xem trải qua thẻ .

Chế độ xem là độ rộng hoạt động hiển thị với những người dùng trên trang web. Nó hít thở tùy theo thiết bị, sẽ bé thêm hơn trên sdt sdt và to nhiều hơn trên ảnh nền (LCD) máy pc.

Phần tử viewport huấn luyện cho trình duyệt cách kiểm soát form size và tỷ lệ của trang. Vì vậy, chúng ta nên sử dụng

phần tử viewport trong toàn trang và toàn diện các trang web của bản thân mình:





Định dạng chuẩn và quy ước mã hóa trong HTML5

Các chú giải trong HTML

Comment ngắn nên được viết trên một dòng, như sau:

Comment dài nhiều dòng nên được viết như sau:

Những chú giải dài sẽ dễ thương hơn nếu khách hàng lùi đầu dòng bằng hai dấu cách.

Style Sheets

Bạn rất có khả năng sử dụng các cú pháp dễ chơi để liên minh với CSS (không cần có phải sử dụng thuộc tính type):

Các đoạn code ngắn rất có khả năng được viết lại trên một dòng, như sau:

p.intro {font-family: Verdana; font-size: 16em;}

Các đoạn code dài viết trên rất nhiều dòng, như sau:

body {
background-color: lightgrey;
font-family: "Arial Black", Helvetica, sans-serif;
font-size: 16em;
color: black;
}
  • Đặt dấu mở ngoặc trên cùng dòng với thẻ cần tô điểm.
  • Sử dụng một dấu cách trước dấu ngoặc mở.
  • Sử dụng 2 dấu cách để lùi đầu dòng các thuộc tính phía bên trong.
  • Sử dụng dấu chấm phẩy sau mỗi cặp “thuộc tính/độ quý và hiếm”.
  • Chỉ sử dụng dấu ngoặc cho độ quý và hiếm nếu trong độ quý và hiếm có chứa dấu cách.
  • Đặt dấu đóng ngoặc tại 1 dòng riêng biệt, phía trước không có dấu cách.
  • Không nên sử dụng quá 80 ký tự trên cùng một dòng.

Liên kết JavaScript trong HTML

Bạn rất có khả năng sử dụng các cú pháp dễ chơi để liên minh với JavaScript (không cần có phải sử dụng thuộc tính type):

Truy cập các nguyên tố HTML bằng JavaScript

Hậu quả của sự sử dụng các kiểu HTML không ổn định các bước thực hiện thế nào để dán rất có khả năng kéo đến lỗi JavaScript.

Hai câu lệnh JavaScript đó sẽ có mặt trên thị trường thành kết quả sự kì khôi:

var obj = getElementById("Demo")
var obj = getElementById("demo")

Ví dụ:





This is paragraph 1.


This is paragraph 2.




// Only paragraph 2 will be overwritten
document.getElementById("demo").innerHTML = "HELLO.";



Nếu rất có khả năng, hãy sử dụng các quy ước đặt tên giống nhau (như JavaScript) trong HTML.

Viết thường tên thư mục

Một số máy server web (Apache, Unix) phân minh chữ hoa chữ thường với tên tập tin: “london.jpg” chẳng thể truy nhập là “London.jpg”.

Nhưng có các máy server web (Microsoft, IIS) không phân minh chữ hoa và chữ thường: london.jpg rất có khả năng truy nhập bằng tên London.jpg hoặc london.jpg.

Vì vậy, nếu khách hàng sử dụng kết vừa lòng giữa chữ hoa và chữ thường, bạn phải rất là đồng bộ để tránh diễn ra lỗi khi chuyển máy server.

Để tránh dẫn tới các lỗi này, hãy luôn sử dụng chữ thường cho tên tệp tin.

Phần không ngừng mở rộng của tệp tin

  • Các tệp tin HTML nên có chỗ không ngừng mở rộng là .html (hoặc .htm).
  • Các tệp tin CSS nên có chỗ không ngừng mở rộng là .css
  • Các tệp tin JavaScript nên có chỗ không ngừng mở rộng là .js

Sự sự kì khôi giữa .htm và .html

Không có sự kì khôi nào giữa hai phần không ngừng mở rộng .htm.html. Cả hai sẽ dành được nghĩ là HTML khi làm việc với bất kỳ trình duyệt và máy server nào.

  • .htm: của số đông hệ điều hành DOS ban đầu, nơi hệ thống giới hạn phần không ngừng mở rộng là 3 ký tự.
  • .html: của hệ điều hành Unix, không có giới hạn này.

Sự kì khôi về hàng ngũ chuyên môn

Khi URL không những định tên tệp (như https://www.quantrimang.com/html/), máy server sẽ tự động trả về tên tệp nguyên hình. Tệp tin nguyên hình phổ cập là index.html, index.htm, default.htmldefault.htm.

Nếu trang web của bạn từng và đang rất được thông số kỹ thuật tên tệp tin nguyên hình là “index.html”, bạn phải đặt tên tệp tin là “index.html”, chưa được đặt là “index.htm.” Tuy nhiên, máy server rất có khả năng được thông số kỹ thuật với ko phải ít tệp tin nguyên hình, và tiền lệ bạn rất có khả năng tùy chỉnh nhiều tập tin nguyên hình nếu thích.

Dù sao, phần không ngừng mở rộng đầy đủ cho các tập tin HTML là .html, và không có duyên do gì mà bạn không luyện tập tên này.

Tạm vậy thôi. Hãy trở thành một lập trình viên sáng dạ bằng hình thức viết code gọn gàng, thật sạch và đúng các bước thực hiện thế nào để dán định hình như này nhé.

Chúc bạn thành công!

Link hữu ích: 

  • Cách chuyển từ HTML4 sang HTML5
  • Các phần tử mới trong HTML5

Bài trước: Semantic Element (Yếu tố ngữ nghĩa) trong HTML5

Bài tiếp: Phần tử Canvas trong HTML5

Sưu Tầm: Internet – Kênh Tin: TT39

Danh Sách Trang Web Báo Công Nghệ - Web Sửa Máy Tính Đang top

List Trang Báo Công Nghệ - Tech

DANH SÁCH CÁC TRANG WEB BÁO CÔNG NGHỆ HÀNG ĐẦU

Tin công nghệ 24h - Tin tức công nghệ cập nhật mới nhất

24h.com.vn/tin-tuc-cong-nghe-c453.html

TechZ: Trang tin Công nghệ, Khoa học & Thủ thuật máy tính

techz.vn

Thủ thuật máy tính - Thủ thuật Công nghệ thông tin - ICTNews

ictnews.vn/the-gioi-so/thu-thuat

Tin tức công nghệ - Thông tin thế giới số internet - Số Hóa VnExpress

vnexpress.net/so-hoa

Tin tức công nghệ, khoa học, ô tô, tư vấn tiêu dùng 24h | CafeBiz

cafebiz.vn/cong-nghe.chn

2 Tek - Cập nhật thông tin công nghệ mới nhất - Kenh14.vn

kenh14.vn/2-tek.chn

Trang Công Nghệ: Cập nhật tin tức Công Nghệ mới nhất

trangcongnghe.com

Tạp Chí Công Nghệ | Tapchicongnghe.vn

tapchicongnghe.vn

CÔNG NGHỆ - Tin tức điện thoại, máy tính, laptop sieu hot - ZING.VN

news.zing.vn/cong-nghe.html

Tin công nghệ - Tin tức khoa học, ứng dụng và sản phẩm - VietNamNet

vietnamnet.vn/vn/cong-nghe/

Công nghệ - Thanhnien.vn

thanhnien.vn/cong-nghe/

Công nghệ – Wikipedia tiếng Việt

vi.wikipedia.org/wiki/Công_nghệ

Tin khoa học, công nghệ trong nước và thế giới - BAOMOI.COM

baomoi.com/khoa-hoc-cong-nghe.epi

Công nghệ - Thanhnien.vn

thanhnien.vn/cong-nghe/

VnReview - Đánh giá, tin tức, tư vấn sản phẩm công nghệ

vnreview.vn

Công nghệ: Tin tức điện thoại, SIÊU máy tính, máy móc mới nhất - Soha

soha.vn/cong-nghe.htm

Danh sách các công ty sửa máy tính Tphcm

LIST 10 TRANG WEB SỬA MÁY TÍNH TỐT NHẤT

【TOP】 Dịch Vụ Sửa Máy Tính HCM 【Uy Tín】Giá Rẻ™ ITS

suamaytinhits.com

Dịch Vụ ✅✅ Sửa Máy Tính Tphcm ☆ Sửa Chữa PC ◢◣ Laptop ✓ ◤Giá Rẻ◥ Có VAT ✚ BH Uy Tín ✈ Tại HCM ™【19OO636343】☝LH Ngay.

Top các công ty sửa chữa máy tính uy tín tại Tp.HCM - Top10tphcm.com

1️⃣ Công Ty Sửa Máy Tính Tại Nhà TPHCM 【 Giá Rẻ 】 ™

suamaytinhvn.net

【 HOT 】 Công Ty Sửa Máy Tính Tại Nhà 【 Giá Rẻ 】 Uy Tín PCI

suamaytinhpci.com

Top 10 trung tâm sửa chữa máy tính/laptop uy tín nhất ... - Hồ Chí Minh

toplist.vn trung-tam-sua-chua-may-tinhlaptop-uy-tin-nhat-tai-tphcm

Sửa chữa máy tính tại nhà HCM sau 20 phút - SaiGon Computer

saigoncomputer.vn › Dịch vụ

Dịch vụ sửa chữa máy tính TP.HCM - iCare Center

icare.center/ sua-chua-may-tinh-tp.hcm-t234.html

Những địa chỉ sửa chữa máy tính uy tín ở Hà Nội - Quantrimang.com

quantrimang.com Công nghệ Tư vấn mua máy

【Công Ty】Sửa Chữa Máy Tính – Máy In – Bình Dân

suamaytinhbinhdan.com

Sửa Máy Tính Sài Gòn

suamaytinhsg.com

Sửa máy tính uy tín ở TPHCM uy tín, đảm bảo - Capcuulaptop.com

capcuulaptop.com sua-may-tinh-uy-tin-o-tphcm-uy-tin-dam-bao/

Sửa máy tính tại nhà tphcm giá rẻ | Công ty Tin Học Viễn Thông VHB

suamaytinhcntt.com sua-may-tinh-tai-nha-hcm-sua-may-vi-tinh-hcm

Dịch Vụ Sửa Máy Tính Tại Nhà Giá Rẻ TP Hồ Chí Minh [ 30P CÓ MẶT ]

Tungphatcomputer.com sua-may-tinh

Top 5 địa chỉ sửa laptop uy tín tại TP. Hồ Chí Minh - Thủ thuật

thuthuat.taimienphi.vn top-5-dia-chi-sua-laptop-uy-tin-tai-tp-ho-chi-minh

IT VIỆT: Sửa máy tính tại nhà tphcm, Máy Tính Bàn, Laptop, Máy In

suamaytinhviet.com

Sửa Máy Tính Tại Nhà | Máy Tính Xanh | Uy Tín Nhất Tphcm

maytinhxanh.vn

Dịch vụ sửa chữa - PhongVu.vn

phongvu.vn landing/dich-vu-sua-chua.html

Dịch vụ sửa máy tính bàn, laptop uy tín tại nhà rẻ tốt HCM

incare.vn sua-chua-may-tinh-hcm-sai-gon/

SỬA MÁY TÍNH BÀN (PC) UY TÍN NHẤT TPHCM - captocviet

captocviet.com/may-pc/sua-may-tinh-ban--pc--uy-tin-tphcm/

Sửa máy tính - Công Ty Máy Tính Phong Phú

suamaytinhtotnhat.com/sua-may-tinh

Sửa máy tính tại nhà Hcm - Vi tính quận 7

vitinhquan7.com Sửa máy tính tại nhà Tphcm

HÌNH ẢNH HOẠT ĐỘNG TRƯỜNG THỊNH GROUP

Uy tín hàng đầu

Thành lập Hơn 6 Năm, Phục vụ hơn 300.000 KH

DV Tận Nơi Nhanh

Triển Khai Tới Nơi Làm Tại Chỗ 30-60 Phút...

Sản phẩm và DV đa dạng

Cung cấp tất cả SP Và dịch vụ nghành CNTT

CAM KẾT HÀI LÒNG

Đặt Chữ "TÍN" Lên Cao Nhất

Xu Hướng Tìm Kiếm:Sơ Đồ Site thay màn hình laptop - pin laptop - thay bàn phím laptop - sạc laptop - Dcom phát wifi - máy tính cũ - nạp mực in - Sửa máy tính tại nhà




 

Với 22 Kỹ Thuật Nhận Phục Vụ Tận Nơi Các Quận HCM

Địa Chỉ trên GPĐKKD: 1264/47/17 Lê Đức Thọ, P.13, GV

Email: lienhe@truongthinh.info | MST: 0312179313

Hotline: 1900 63 63 43 - 028.7300.7898 - 0984.966.552 - 0938.169.138

Dịch Vụ: sửa máy tính | Cài Win Tận Nơi | Nạp mực máy in | Cứu dữ liệu

PHƯƠNG THỨC THANH TOÁN

DỊCH VỤ TẬN NƠI - GIAO HÀNG NHANH

KÊNH TRUYỀN THÔNG

Tên phân mụcGiới thiệu
Công nghệGiới thiệu
Khoa họcGiới thiệu