萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 初學網頁標准應該注意:有害的標簽

初學網頁標准應該注意:有害的標簽

  這篇文章注意以前完美童話中的html標簽,有害的,糟糕的,明顯丑陋的,應該被排除在標准html之外的標簽,要想只有一半工作量要麼顛覆浏覽器要麼使用更加簡單推薦的新標簽。

  盡管前面的基礎教程已經提出了符合標准的建議,但初學者基礎不同或者練習不對,這裡進行總結。

  html正嘗試從表現轉向語意,進而分離語意(HTML)和表現(CSS)。這個已經大范圍運用於網頁,因為這樣一個單一的表現指令(CSS文件)可以使用在許多的頁面。這樣,網站更利於管理,想改變全站只需改變一個簡單的代碼。

  一些有害的標簽其實是簡單的表現標簽(比如small),它們可以用CSS裡面相同意思的代碼取代。其他一些不是表現的標簽,但卻沒必要(比如font標簽)或者對可用性不利(比如blink)。

  標簽 Tags

  下面列舉的標簽可以用更好的選擇:

  b標簽的是加粗的意思,這裡可以用strong代替,或在在css裡面添加font-weight:bold。

  i表示斜體字元素,可以使用em代替,或是在css裡面添加font-style:italic。

  big用來表現大文字,標題上可以使用h1,h2等等代替,其他可以在cssfont-size裡具體控制。

  small用來表現小文字,可以在cssfont-size裡控制。

  hr表示水平線,可以在CSS裡用border-top或border-bottom代替,也可用圖片表現。

  上面提及的標簽都適應最近的HTML標准,但是它們沒有賦予語意給內容。它們也許有更多用處但它們沒有顯著的害處,當站在下面糟糠的標簽上可能非常容易犯錯。

  u表示下劃線元素。它讓文本像連接一樣保持下劃線,這也許就是這個標簽消失的原因,人們真的不喜歡沒有連接的文本有下劃線。

  center可以讓元素居中。CSS屬性text-align不僅可以居中center還有left,right和justify。 menu用來制作一個菜單列表,它比ul干的漂亮,但是無序列表更加普遍,ul取代menu。

  layer和div元素很像,但只工作在老版本netscape浏覽器,用處不大。

  blink或marquee。對它們堅決說不。

  font,可以用來定義字體的名稱、大小、顏色。舊的網站(甚至現在的)在整個頁面連續不斷的使用font標簽,就像白蟻災禍。一些來自網頁創建軟件,布置font標簽環繞在每個元素控制文字顏色或大小。用font標簽應用到每一個元素,用CSS表示的話只需簡單的一句即可,而且可以全站實現更改。使用這個方法,不僅可以減輕網頁體積,改變簡單的一句css語句就可改變font所表示的內容。這樣保持了網站風格的一致。font標簽和濫用表格是網頁體積臃腫的主要原因。

  屬性 Attributes

  現在你可能正確使用標簽,但它們有一些令人煩惱的寄生屬性,可能導致變味。

  name分配一個name給元素,在form元素比如input中表現完美,但在別處,name的工作被id屬性代替。

  text和bgcolor用來指定基礎的文字顏色和擁有開放body標簽的背景顏色。css中color和background-color屬性可以很好的應用在body選擇器。

  background可以為body標簽指定背景圖片。css可以提供更好的背景圖片屬性,比如background-image。

  link,alink,vlink可以為body標簽指定鏈接顏色。CSS屬性::link,:active,:visited同樣作用。 align可以控制元素排列,比如

Stuff

,但是像center標簽,可以在css裡用text-align屬性。

  target鏈接以不同狀態打開,比如開新窗口 Help me。聽起來不錯,但對網站沒有親切感。用戶不會期望這些(如新開窗口)如魔術一樣的出現方式,大部分用戶喜歡使用“後退”按鈕,打開新窗口意味著這個功能失效。標簽的表現屬性比如圖片的width和height表格的cellpadding和cellspacing決定了不同的屬性應用在不同的元素。它們不是完美的解決方案,但如果你的頁面有很多圖片或表格,你可能沒有其他可行的選擇。

  大部分莫名其妙的表現屬性屬於textarea標簽,它不僅只有cols和rows有效屬性,最新的HTML標准需要它們。

  好的標簽,壞的應用。

  進入你的房子,你可能跪下鑽狗洞,但是等下,有一個專門為人設計的門裝飾——把手,呵呵,看看,門才擁有讓人通過的正確大小。

  HTML標簽正是為細節設計,信任或不信任,當你正確使用它們,你能取得最佳結果。

  當html是語意的,網頁對殘障用戶帶來更多的易用性,比如屏幕讀者經常強調列表它使用到ul標簽或一個標題它使用到h1或h2標簽。

  html最嚴重的濫用就是表格,表格被用來布局,但它們僅僅只是用來表示表格數據。不用表格布局的想法不是像佛教徒一樣尋求啟迪,它有真正的益處,不僅減輕網頁體積,同時可以容易的維護和重新設計網頁。

  有時一些設計者使用一些標簽和屬性完成過渡性的設計(特別是表格布局),一是可以支持老版本浏覽器(Netscape 4)。在Netscape 4表格比CSS的表現好,但它的用戶非常少而且正在減少,現在移動用戶正在增多,表格布局就顯的非常糟糕。上面提到的表格優點遠超缺點,原因在於在盡量少的風格下頁面需要考慮所有浏覽器的功能。

  框架 Frames

  金發姑娘認為這是一個非常不錯的主意為一碗稀飯幫助她,但是隨後三個大型食肉動物出現把她扔出了窗戶。框架就像是屬於熊的一碗稀飯。它們看起來不錯,但是危險時刻存在。

  大部分網站都不用框架,大部分網站用戶只使用單一的頁面。

  但是如果,由於一些原因,你需要防止用戶添加一個指定的頁面到它們的書簽,或者你想防止經由email或即時信息介紹的指定頁面,或者你想添加另外一個級別的整體復雜性給使用屏幕閱讀器的殘疾用戶,他們需要在框架間導航,或者你想進入搜索引擎地獄,就用框架吧。

  基本上,框架什麼也不做,只增加了復雜性和失去可用性。

  最後如果你跟循下面的規則,不會錯的太離譜。

  1)如果標簽或屬性的名稱比較生僻,建議注釋下,或不用它。這樣使用css的效率會提高。

  2)讓標簽做符合它名稱的工作。表格就用在表格數據。標題就用標題,等等。

  3)當你有明確的內容,使用適當的標簽。列表用列表,標題用標題,等等。

copyright © 萬盛學電腦網 all rights reserved