萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 網頁設計的W3C標准

網頁設計的W3C標准


W3C要求
必須有DOCTYPE
必須指定字符編碼
語言
每個頁面的html標簽要指定lang屬性,< html xml:lang="zh" lang="zh" >
線性閱讀
不以表格作為布局使用
采用定位的時候,將css去除,查看內容的閱讀順序是否符合有意義
標題
頁面中必須包含一個title元素,並且不應為空
title中的內容應該少於60個字
title應該包含網站名字和頁面的主題
頁面中必須包含至少一個h1,並且不能為空
h1和title中應該包含有相同的某些詞匯
h1和title應該使用相同的詞序(詞序) 鏈接鏈接...鏈接這種吧)
h1的內容不應該僅僅來自於圖片的alt屬性值
hn
所有的hn應該在h1後面適當的嵌套
從h2開始,每一個hn前面至少有一個h(n-1),比如:h3前面至少有一個h2;h5前面至少有一個h4
頁面中至少並只能包含一個h1。(html5中已經提倡可以使用多個hn)
h1..h6元素應該在頁面中用於構建信息
h1..h6 或者 作用等於 (heading|region|main|secondary|navigation|banner|contentinfo|definition|note|seealso|search)的元素應該在頁面中用於構建信息
每一個h1...h6必須有文字內容
hn中的內容通常少於65個字
h2...h6中除了img的alt屬性外,還應該包含文字內容
相同級別的標題內容應該是唯一的。(比如:不能有兩個h1的內容都是“百度”)
菜單和導航
ul是用來作為導航的最合適的元素,其次是ol
推薦的導航結構:

< h2 class="offscreen" >< /h2 >< !--h2~h6後面緊挨著ul或者ol,這樣才會被認為是navigation bar,並且這裡的hn出現在h1前面被視為符合要求的-- >

< ul >

< a href="#" >欄目1
< a href="#" >欄目2
< /ul >

/*css style*/

.offscreen {
position: absolute;
top: -30em;
left: -300em;
}

絕大多數的網頁應該至少含有一個導航欄
每個map,ul,ol元素不要在最後一個h1之前,如果必須有個導航在標題之前,這個標題請用h2。(參見推薦的導航結構)
每一個嵌套的table,熱點區域,ol,ul作為導航的話,他們的頭部要有一個h2(或者是h2~h6,參見推薦的導航結構)
文本樣式
請勿使用blink(閃啊閃的)和marquee(移動移動的)!!!會引發癫痫和視覺損傷
禁止使用font和center元素,請用css實現
斜體樣式禁用i元素,標題用h1...h6,要強調的詞、短語和句子,請用em實現
加粗字體樣式禁用b元素,標題用h1...h6,要強調的詞、短語和句子,請用em實現
下劃線樣式禁用u元素,標題用h1...h6,要強調的詞、短語和句子,請用strong實現
列表
如果將p一行行的有順序的排列,就該考慮是不是應該用有序列表了(ol)
如果將p一行行的排列,就該考慮是不是應該用無序列表了(ul)
如果列表嵌套深度大於5層的話,應該考慮用h1...h6這樣的元素來進行轉換。尤其是屏幕閱讀器的用戶
列表嵌套別超過5層
鏈接
避免使用脫離文章上下文無法理解的文字鏈接(比如最常用的“詳細”的文字)
如果一個鏈接包含一個圖片和文字,並且alt中的內容和文字匹配(相同),那麼alt的屬性應該為空
避免使用小於16*16的圖片作為鏈接
避免把鏈接密密麻麻的放在一起(指的是
確保不同的鏈接地址用不同的鏈接文字(也就是說最好避免重復的錨(鏈接)文字)
確保相同的鏈接地址用相同的鏈接文字(如果多個鏈接都指向http://www.hblangnuo.com,那麼這些鏈接都應該使用相同的錨(鏈接)文字。如果有的是“卡套接頭”,有的是“不銹鋼卡套接頭”,有的是“卡套式接頭”,這樣就不合適了,況且對SEO也不合適)
避免文字鏈接少於四個字(在中文網站中這一點很難避免)
內部的錨點目標要有tabindex="-1"。這是由於當內部鏈接被激活時,IE可以移動焦點
如果錨點目標是a或者表單等可以獲得焦點的元素,如果使用tabindex="1",在使用tab鍵切換的時候就會被跳過
最安全的tabindex屬性是0
圖片
寬或高不到8px或者沒有alt的圖片(特別是裝飾性的圖片)應該被移除,css技術可以用來控制樣式
alt是用來描述圖片的,而非單純的新聞標題或者名詞
alt屬性不應包含圖片的文件名
alt值不應包含冗長的信息
每個img要有alt
不能只依賴圖片上的文字信息
banner、頭圖上的文字信息必須在代碼中有所體現
Objects
每個applet元素應有alt值
每個embed元素應有alt值
每個object應包含文字內容
表單
ID必須唯一,特別是表單
每一個fieldset應該有一個legend元素
每個label必須有文字內容
每個legend必須有文字內容
每一個有效的label (legend + label)必須是唯一的(也就是說
label不應該包裹select和textarea元素

copyright © 萬盛學電腦網 all rights reserved