HTML5 基础知识(二)
<!DOCTYPE html>聲明頁面為HTML5文檔
<html lang="en">其中en是頁面內容默認語言的代碼
<meta charset="utf-8" /> 空格與斜杠是可選的,定義文檔編碼格式為utf-8
<title></title> 標簽之間將包含頁面的標題
</head>結束頁面文檔的頭部
<body></body>標簽之間存放頁面內容部分
</html> 結束頁面
在文檔head部分,通常要指明頁面標題,提供為搜索引擎準備的關于頁面本身的信息,加載樣式表,以及加載JavaScript文件(不過,出于性能考慮,多數時候在頁面底部</body>結束前加載JavaScript是更好的選擇)
title元素必須位于head部分,并且在指定字符編碼的meta元素后面。不能包含任何格式、html、圖像或其他頁面的鏈接
分級標題hn n是1~6的數字 h1是最重要的標題 h6是最不重要的標題
不要使用h1~h6標記副標題、標語、以及無法成為獨立標題的子標題。
1、創建頁眉header
如果頁面中有一塊包含一組介紹性或導航性內容的區域,應該用header元素對其進行標記。一個頁面可以有任意數量的header元素,他們的含義可以根據其上下文而有所不同。例如,處于頁面頂端或接近這個位置的header可能代表整個頁面的頁眉或頁頭。包括網站標志、主導航和其他全站鏈接,甚至搜索框。
只在必要時使用header,大多數情況下,如果使用分級標題h1~h6能滿足需求,就沒有必要用header將它包起來。
header標簽不可嵌套
2、標記導航nav
nav中的鏈接可以指向頁面中的內容,也可以指向其他頁面或資源。無論是哪種情況,應該僅對文檔中重要的鏈接群使用nav
如何判斷是否對一組鏈接使用nav呢?取決于內容的組織情況。至少,應該將網站全局導航標記為nav。這種nav通常出現在頁面級的header元素里面。
3、標記頁面的主要區域main
一個頁面中只有一個部分代表主要內容,可以將這樣的內容包在main元素中,該元素在一個頁面中僅使用一次。
如果創建的是web應用,則使用main包圍其主要的功能,不能將main放置在article、aside、footer、header或nav元素中。
最好在main的開始標簽中加上role=“main“,可以幫助屏幕閱讀器定位頁面的主要區域。
4、創建文章article
article元素表示文檔、頁面、應用或網站中一個獨立的容器,原則上是可以獨立分配或可再用的,就像聚合內容中的各部分。article元素可以嵌套使用,一個頁面中可以有多個article元素。
5、定義區塊section
section元素代表文檔或應用的一個一般的區塊。從語義上講,section標記的是頁面中的特定區域,而div則不傳達任何語義。
6、指定附注欄aside
盡管我們容易將aside元素看作側欄,但該元素其實可以用在頁面的很多地方,具體依上下文而定。在aside標簽中增加 role=“complementary”可以提高可訪問性
7、創建頁腳footer
footer元素代表嵌套它最近的article、aside、blockquote、body、details、fieldset、figure、nav、section或td元素的頁腳。只有當它最近的祖先是body時,才是整個頁面的頁腳。footer標簽只有頁面級頁腳中才可以使用role=“contentinfo”,且一個頁面只能使用一次。
8、創建通用容器div
div對使用JavaScript實現一些特定的交互行為或效果也是有幫助的。在頁面中展示一張圖片或一個對話框,同時讓背景頁面覆蓋一個半透明的層,通常這個層就是一個div
9、使用ARIA改善可訪問性
WAI-ARIA無障礙網頁倡議-無障礙的富互聯網應用,簡稱ARIA,是一種技術規范,自稱有橋梁作用的技術。之所以這樣說,是因為在html提供相應的語義功能之前,它會使用屬性來填補一些語義上的空白。
地標角色可以幫助用戶識別頁面區域,從而讓屏幕閱讀器用戶可以直接跳轉到這些區域。對這些區域指定role屬性就可以了。
role=“banner" 橫幅 可添加在頁面級header標簽中,且只可用一次
role=”navigation“ 導航 可添加在nav標簽中
role=”main“ 主體 添加在main標簽中,只可使用一次
role=”complementary“ 補充性內容 可添加在aside或div元素
role=”contentinfo“內容信息 可添加在頁面級footer標簽中,僅可使用一次
注意:不要在頁面上過多使用地標角色。過多的地標角色會讓屏幕閱讀器用戶感到累贅,從而降低地標的作用,影響整體體驗。
10、為元素指定類別或ID名稱
在元素的開始標簽中輸入 id=”name“,其中name是唯一標識該元素的名稱。name可以是任何字符,只要不是以數字開頭,不包含空格。
在元素的開始標簽中輸入 class=”name“ name是類別的名稱,如果指定多個類別,用空格將不同的類別名稱分開即可。
html文檔中每個id都必須是唯一的。class可以分配給頁面中的任意數量的元素,并且一個元素可以有一個以上的class。在class和id名稱中,通常使用短橫線分割多個單詞。
11、為元素添加title屬性
在要添加的標簽中 添加title元素,輸入title=”label".其中label是訪問者將鼠標移到這個元素上時希望出現在提示框里的文本。
12、添加注釋<!-- ? ? ? ? ? ? ? ? ?-->
總結
以上是生活随笔為你收集整理的HTML5 基础知识(二)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 根据文件路径检测文件大小并检测是否正在被
- 下一篇: 设置开机自启动函数