HTML標(biāo)簽的設(shè)計(jì)都是有語(yǔ)義考慮的,下表是部分標(biāo)簽的全稱和中文翻譯。
標(biāo)簽名 |
英文全拼 |
中文翻譯 |
div |
division |
分隔 |
span |
span |
范圍 |
ol |
ordered list |
排序列表 |
ul |
unordered list |
不排序列表 |
li |
list item |
列表項(xiàng)目 |
dl |
definition list |
定義列表 |
dt |
definition term |
定義術(shù)語(yǔ) |
dd |
definitiion description |
定義描述 |
del |
deleted |
刪除 |
ins |
inserted |
插入 |
h1~h6 |
header 1 to header 6 |
標(biāo)題1到標(biāo)題6 |
p |
paragraph |
段落 |
hr |
horizontal rule |
水平尺 |
a |
anchor |
錨 |
abbr |
abbreviation |
縮寫詞 |
acronym |
acronym |
取首字母的縮寫詞 |
address |
address |
地址 |
var |
variable |
變量 |
pre |
preformatted |
預(yù)定義格式 |
blockquote |
block quotation |
區(qū)塊引用語(yǔ) |
strong |
strong |
加重 |
em |
emphasized |
加重 |
b |
bold |
粗體 |
i |
italic |
斜體 |
big |
big |
變大 |
small |
small |
變小 |
sup |
superscripted |
上標(biāo) |
sub |
subscripted |
下標(biāo) |
br |
break |
換行 |
center |
center |
居中 |
font |
font |
字體 |
u |
underlined |
下劃線 |
s |
strikethrough |
刪除線 |
fieldset |
fieldset |
城集 |
legend |
legend |
圖標(biāo) |
caption |
caption |
標(biāo)題 |
其中,div和soan其實(shí)是沒有語(yǔ)義的,它們只是分別用作塊級(jí)元素和行內(nèi)元素的區(qū)域分隔符。
如何確定你的標(biāo)簽是否語(yǔ)義良好
判斷網(wǎng)頁(yè)標(biāo)簽語(yǔ)義是否良好的一個(gè)簡(jiǎn)單方法就是:
去掉樣式,看網(wǎng)頁(yè)結(jié)構(gòu)是否組織良好有序,是否仍然有很好的可讀性。 語(yǔ)義良好的網(wǎng)頁(yè)去掉樣式后結(jié)構(gòu)依然很清晰。
同樣的設(shè)計(jì)圖,不同的HTML標(biāo)簽可以通過不同的CSS實(shí)現(xiàn)同樣的頁(yè)面,但語(yǔ)義不好的CSS布局和語(yǔ)義良好的CSS布局在去樣式后的表現(xiàn)卻可能截然不同。
如果選用的標(biāo)簽幾乎全是不帶語(yǔ)義的,那么在去樣式后網(wǎng)頁(yè)中幾乎看不到任何結(jié)構(gòu)信息,可讀性非常差;如果選用的都是語(yǔ)義適合的標(biāo)簽,去樣式后網(wǎng)頁(yè)依然具有非常好的可讀性。
所以我們的開發(fā)過程中,不要拿到一個(gè)任務(wù)后就馬上開始寫代碼,在拿到設(shè)計(jì)稿后不要急于馬上進(jìn)行開發(fā),而是先根據(jù)頁(yè)面結(jié)構(gòu)進(jìn)行分析,先考慮好框架,適用的標(biāo)簽等,會(huì)讓整個(gè)開發(fā)過程更有規(guī)劃、更順暢,是一個(gè)先慢后快的過程。反之就可能出現(xiàn)先快后慢的局面,越到后期開發(fā)速度越慢,反復(fù)修改bug、打補(bǔ)丁。
如沒特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請(qǐng)注明來自http://pdcharm.com/news/4956.html