Thẻ xác định một tập hợp các liên kết điều hướng. Ví dụ sau là về một tập hợp các liên kết điều hướng:
HTML |
CSS |
JavaScript |
Python
Lưu ý rằng KHÔNG phải tất cả các liên kết của tài liệu đều phải nằm trong phần tử . Phần tử chỉ dành cho các khối liên kết điều hướng chính.
Các trình duyệt, chẳng hạn như trình đọc màn hình dành cho người dùng bị vô hiệu hóa, có thể sử dụng phần tử này để xác định xem có nên bỏ qua phần hiển thị ban đầu của nội dung này hay không.
Notice that NOT all links of a document should be inside a element. The element is intended only for major blocks of navigation links.
Browsers, such as screen readers for disabled users, can use this element to determine whether to omit the initial rendering of this content.
Semantic HTML là cách viết HTML mà sử dụng các thẻ HTML ứng với nội dung được chứa trong nó chứ không phải sử dụng các thẻ theo cách mà chúng ta muốn nội dung trong đó được hiển thị. Ví dụ như không thể sử dụng thẻ để bọc 1 đoạn văn chỉ vì ta muốn đoạn văn đó có font chữ to ra. và biểu diễn cho các nội dung rất khác nhau nên không thể sử dụng như thế
Một số thẻ HTML để phân chia nội dung trang:
1.Thẻ
Thẻ section dùng để phân chia các phần riêng biệt của trang HTML, ví dụ trong trang có các phần như About, Contact,... thì các phần này sẽ được bọc trong các thẻ
2. Thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
0
Thẻ article dùng để chứa các nội dung độc lập trong trang. Những nội dung này có thể được cắt ra mang đi nơi khác mà người dùng ở nơi khác đọc vẫn có thể hiểu được, không phụ thuộc vào nội dung chứa trong trang.
Ví dụ như trong trang có chứa phần giới thiệu về 1 quyển sách. Nội dung phần giới thiệu này bao gồm tiêu đề sách, tác giả, tóm tắt, giá,... những nội dung này có thể được trích dẫn ra rồi đem đi trang khác chia sẻ mà người dùng ở trang khác đọc vẫn có thể hiểu được nội dung này là gì. Ở đây, nội dung giới thiệu về trang sách này nên được bọc trong thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
0
3. Thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
2
Thẻ nav khá dễ hiểu, nó dùng để chứa các thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
3 dẫn đến những nội dung chính của website, nên lưu ý là của website chứ không phải của trang HTML hiện tại, nav thường được bọc trong
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
4 hoặc
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
5.
Ví dụ:
HTML
CSS
JavaScript
jQuery
Lưu ý: Trong 1 trang có thể có 2 thẻ nav, 1 thẻ nav dẫn đến nội dung chính của website nằm ở phía trên header. 1 thẻ nav khác nằm ở phía footer, chứa đường link dẫn đến 1 số địa chỉ liên kết với website.
4. Thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
6
Thẻ aside chứa 1 số thông tin bên lề nội dung chính của trang. Những nội dung chứa trong
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
6 có thể bị xóa đi mà không làm ảnh hưởng đến nội dung chính của trang. Lưu ý, nếu
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
6 nằm trong thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
0 thì nội dung nằm trong thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
6 đó chỉ chứa thông tin bên lề nội dung chính của
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
0 chứ không phải của toàn trang.
Ví dụ ta có 1 trang với nội dung chính là giới thiệu về công nghệ VR, sau đó ta muốn dẫn thêm 1 vài thông tin bên lề về VR cho người xem:
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
5. Thẻ
Đối với thẻ ``, nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
2
Thẻ dùng để chứa nội dung chính của trang, nó sẽ không chứa các thông tin như
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
4,
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
5,
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
6,... hoặc những gì thuộc phần intro,...
Trong 1 trang chỉ có 1 thẻ
Đối với thẻ ``, nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
2 duy nhất
6. Thẻ
Đối với thẻ ``, nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
7
Thẻ
Đối với thẻ ``, nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
7 là thẻ không hề có Semantic meaning. Nó chỉ dùng để bọc những nội dung có liên quan đến nhau lại. Khi không tìm được thẻ thích hợp để bọc phần nội dung đó thì ta sẽ sử dụng thẻ div.
Ví dụ như phần intro của trang web, nó không thể nằm trên header cũng không thể nằm trong main, khi ấy ta sử dụng thẻ div để bọc các thông tin đó lại.
Ngoài ra, người ta còn sử dụng thẻ
Đối với thẻ ``, nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
9> để bọc những nội dung cần format giống nhau bằng CSS, cũng như tách trang thành từng phần nhỏ, để trình duyệt có thể render từng phần 1, tăng tốc độ hiển thị đến người dùng thay vì phải load toàn bộ trang mới render.
7. Thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
4 và
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
5
- Thẻ
`More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."- Mark Zuckerberg
`4 bọc những thông tin giới thiệu về toàn trang web hoặc navigation bar
`
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
5 bọc những thông tin về trang web, thẻ footer của toàn trang thường chứa contact information, copyright information,... **Lưu ý về thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
4 và
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
5: Có thể sử dụng nhiều thẻ
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
4 và
More Article About VR
- Make a VR Game
- Learn VR in Unity
- Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
`
5 trong trang theo nhiều trường hợp:
Đối với thẻ , nó có thể chứa thông tin giới thiệu về element chứa nó [thường là các section]
Đối với thẻ , nó có thể chứa những thông tin mở rộng cũng cho element chứa nó, tùy thuộc element đó là gì
Ví dụ một trang web cụ thể:
VR Article
Experience VR
A simple blog about virtual reality experience
- Home
- About
- Articles
- Contact
Make a VR Game
Learn VR in Unity
Build Users Interfaces in VR
"Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming."
- Mark Zuckerberg
©2018 Experience VR, The Blog
Tổng kết:
Trên đây mình đã nói sơ qua về Semantic HTML và cách dùng của một số thẻ nhằm đảm bảo Semantic HTML. Hy vọng qua bài viết này các bạn có thể viết HTML một cách chuẩn mực hơn, không còn sử dụng các tag một cách tràn lan nhằm chỉnh font chữ hay xuống dòng,...