優(yōu)惠活動 - 12周年慶本月新客福利
優(yōu)惠活動 - 12周年慶本月新客福利
優(yōu)惠活動 - 12周年慶本月新客福利

網(wǎng)站HTML文檔結構

結構良好的HTML (或者XHTML)文檔可能包含如下元素:
 
●HTML文檔結構(<head>、 <body>、 <div>、 <span>)。
 
●文字內容。
 
●傳達含義和內容結構的語義標注(標題、段落文字、列表和引用)。
 
●讓內容以一種特定的方式來顯示的可視化展示(CSS)。
 
●與視昕內容相連的鏈接( gif jpeg或png圖形,QuickTime或者其他媒介文件)。
 
●交互行為(JavaScript、 Ajax 元素,或者其他編輯技法)。


 
1. 文檔結構
 
在結構嚴格的HTML中,所有的Web頁面代碼都要放在以下這兩個基礎元素之中:
 
●Head (<head>...</head>)
●Body (<body...</body>)
 
在過去,頁面代碼結構的這些基本要求是良好結構的基礎:完全正確但是功能可選,且對于用戶是可見的。在今天的更為復雜和更具挑戰(zhàn)性的萬維網(wǎng)中,復雜的頁面代碼、很多不同的顯示可能、復雜的樣式表以及交互腳本已經(jīng)非常常見,因此正確地構建分割元素十分重要。
 
<head>區(qū)域是Web頁向顯示設備( Web瀏覽器、手機、iPod Touch)聲明代碼標準和文檔類型的區(qū)域,它也是所有重要的頁面標題放置的地方。頁面標題區(qū)域也可以包含那些與網(wǎng)站很多頁共享的外部樣式表和JavaScript代碼相連的鏈接。
 
<body>區(qū)域包含所有頁面內容,也是重要的對可視樣式、編程和語義內容標注的CSS控制。通常,位于頁面body內的區(qū)域使用分區(qū)(<div>) 或范圍(<span>)標簽來進行功能分割。例如,絕大多數(shù)Web頁都有頁眉、頁腳、內容和導航區(qū)域,它們全部使用可以被尋址和使用css進行可視樣式化處理的已命名的<div>標簽來指定。
 
HTML文檔類型聲明了HTML文檔采用的是哪個版本和標準,文檔類型對于估算HTML標注和CSS的品質和技術有效性至關重要。Web開發(fā)技術團隊應該告訴你將在頁面編碼中使用什么版本的HTML(例如,HTML4和XHTMLI),以及會在網(wǎng)站中使用哪種文檔類型聲明。HTML是Web頁面標注的通用基本標準。XhTML與HTML非常相似,但是XHTML是XML的子集,并且有更為嚴格的要求。盡管HTML是使用最廣的Web標注標準,將XHTML用做頁面標注有以下更為強大的優(yōu)勢:
 
●與XML技術、XML內容以及諸如Ajax之類的混合JavaScript/XML技術兼容。
 
●與非HTML Web標注標準兼容,諸如用于科學文檔Mathml、用于交互視聽內容的同步化多媒體整合語言(Synchronized Multimedia Integration Language, SMIL) 以及可伸縮矢量圖形(Scalable Vector Graphics, SVG)。
 
●與更新的XML內容技術、內容管理體系和其他正在發(fā)展之中的Web技術的未來兼容性,這些Web技術可以從XHTML標注標準更好的一致性和更大的結構中獲益。
 
2.內容標注
 
語義標注是常見HTML使用的一種優(yōu)質界標:如果你編寫了一個標題,可以使用標題標簽(<h1>, <h2>) 來標注;如果你編寫的是基本的段落文字,可以將該文字放在段落標簽之中(<>...</p >); 如果你希望強調某個重要短語,可以使用加粗強調(<strong...</strong>) 來標注它:如果你引用了另一個作者的內容可以使用<blockquote>標簽來標識該文本是引用的。永遠不要根據(jù)Web瀏覽器中的顯示方式來選擇HTML標簽。你可以在稍后使用CSS來調整內容的可視化效果以制作理想的標題、引用、強調文字以及其他排版效果的外觀。
 
因為個別可能需要某些視覺效果的原因,例如,用斜體顯示某個科學名稱,如Homo sapiens (智人),HTML中還保留了少許諸如<b> (粗體)和<i> (斜體)的專用可視HTML標簽。如果你使用類似<b>或<i>的語義含義的標簽,不妨思考一下適當?shù)臉邮綇娬{(<em>) 或者加粗強調(strong>) 能否表示出更多的含義。HTML也包含不為瀏覽者所見的語義元素,但是它對于網(wǎng)站開發(fā)團隊的幕后工作非常有用。諸如lass ID、 division. span和met標簽等元素都可以讓團隊成員更方便地理解、使用、可視化樣式和從程序上控制頁面元素。很多樣式表和編程技術都要求對頁面元素進行細致的語義命名,以便讓內容的訪問性和靈話性更為通用。
 
3.層疊樣式表
 
層疊樣式表(CsS)允許Web發(fā)布者在給予圖形設計師對每個HTML元素可視化顯,示細節(jié)完全控制權的同時,保留使用語義htML傳遞邏輯文檔結構和含義的巨大優(yōu)勢。CSS的作用就像是諸如Microsoft Word之類的文檔處理程序中的樣式表。換而言之,就是你可以使用分級的標題和其他樣式來構造文檔,接著只通過更改樣式便可全局更改所有的樣式。css 的工作方式相同,尤其是當你使用網(wǎng)站所有頁面共享的外部樣式表時。例如,如果所有頁面都鏈接了同--主CSS文件,那么你只需更改主樣式表中的<h1>樣式即可更改所有<h1>標題的字體、字號和顏色。
 
4.視昕內容
 
Web頁面文件不直接包含圖形和視聽素材,但是使用圖像和其他指示鏈接在瀏覽器中將圖形和媒介合并到最終的Web頁面組合中。它們包含的這些鏈接以及替代文字(“alt”文本)或者長描述性(longdesc) 鏈接對于通用可用性和搜索引擎可視性而言非常重要。Web用戶不只會搜索文字。搜索引擎會使用帶關鍵字的標簽圖像所對應的替代文字描述,存在視障的用戶會基于替代文字來描述圖像內容。適當?shù)恼Z義標往能確保你的視聽媒介為瀏覽者中的每個人以及搜索引擎最大范圍地使用。
 
5.交互腳本
 
JavaScript是通常用來創(chuàng)建交互行為的語言。JavaScript 也是諸如Ajax之類原Web頁面內容交付策略中的關鍵技術。所有的JavaScript代碼都應歸于Web頁面的“頭部”(head)區(qū)域,但是如果你的代碼很復雜并且非常長,“真實的”頁面內容就被擠到了幾十行代碼的下方,無法被搜索引擎找到。如果你使用頁面級別的JavaScript腳本(也被稱為客戶端腳本),則應該將所有的代碼以最短的字節(jié)數(shù)放在某個鏈接文件中。應用此種方式,當使用長而復雜的JavaScript時就不會錯失搜索頁面排名。
 
6.其他文檔格式
 
除了HTML外,Web還支持很多文檔格式。PDF、Flash 和Shockwave是經(jīng)常用來提供基礎HTML無法提供的功能的格式。PDF文件深受那些使用文字處理和頁面市同程序制作的文檔的喜愛,它能保持源文檔的外見,F(xiàn)lash和Shockwave提供了使用標準HTML無法提供的交互性。通常,最好的方式是以無格式的HTML形式提供文檔,這是因為標注可以提供更大的靈活性,井且被設計為支持通用可用性,然而有時,在必質果用其他格式提供的附加特色和功能之時,要確保能m到軟件的可訪問性功能,Adobe花了大力氣通過支持語義標注、文本等價和關鍵宇川訪問性,專門將可訪問性功能合并到它的Web格式之中。
 
注意瀏覽器的不同
 
用于表格、表單、定位和排列的HTML及CSS有時在針對不同品牌和版本的Web瀏覽器時,其使用會稍有區(qū)別。這些細微的不同通常不會被注意到,但是在更為精準和復雜的Web頁面布局中,也有可能會造成意想不到的結果。不要過于相信HTML、CSS、JavaScript、 Java 或任何插件的效果,除非你使用每個主流Web瀏覽器并且跨平臺查看過你的Web頁面的顯示。
 
查看Web日志,或者使用諸如Google Analytics 之類的服務,來了解在讀者群中最普遍使用的是什么瀏覽器品牌、瀏覽器版本以及操作系統(tǒng)(Mac、Windows 和移動)。并非每個瀏覽器都支持CSS的所有的功能,尤其是如果那個功能很少使用或者近期才添加到CSS代碼的官方標準中。例如,盡管帶陰影的文字是有效的CSS選項,但是所有的瀏覽器都不支持它。
 
關于語義標注的小結
 
基于語義標注技術和標準的網(wǎng)站建設HTML文檔類型仔細設置標注和編輯標準,井且在整個開發(fā)過程中堅持使用這些標準。當今的Web環(huán)境遠不止桌面計算機上的Internet Explorer或者Firefox-成百 上千的移動計算機設備在為人們使用,每天都有很多查看和使用Web內容的全新方式出現(xiàn)。基本上,遵循語言Web標注的慣例做法和審慎使用已經(jīng)驗證的頁面代碼和樣式表的做法,是確保Web內容最好策略,它們能確保你的Web內容在未來使用性最廣、可見性更強。

本文地址:http://blackside-inc.com//article/4301.html
相關文章:
最新文章: