HTML標(biāo)簽10個(gè)最容易犯的錯(cuò)誤
保持良好的代碼風(fēng)格是每個(gè)Coder必學(xué)的課程,同樣在HTML設(shè)計(jì)的時(shí)候也要特別注意代碼的規(guī)范性,雖然說(shuō)不規(guī)范的代碼不會(huì)直接造成嚴(yán)重的后果,但很有可能對(duì)用戶體驗(yàn)造成一定的干擾,同時(shí)也會(huì)降低搜索引擎對(duì)網(wǎng)站的好感度.這份列表包含了10個(gè)最容易犯的HTML標(biāo)簽錯(cuò)誤,記下他們,能夠讓我們避免犯此常見(jiàn)錯(cuò)誤,讓我們的HTML標(biāo)簽符合語(yǔ)義,和標(biāo)準(zhǔn)的要求.
罪行1:把塊級(jí)元素放入了行內(nèi)元素內(nèi)
HTML 元素的表現(xiàn)方式不外乎就兩種:塊級(jí)和行內(nèi).每一個(gè)標(biāo)簽都有默認(rèn)的表現(xiàn)方式不是塊級(jí)就是行內(nèi).像P和p 就是塊級(jí)元素,他們用來(lái)形成文檔結(jié)構(gòu).行內(nèi)元素只能在快級(jí)元素內(nèi).
罪行2: img 標(biāo)簽沒(méi)有包含alt屬性
alt屬性是所有顯示在網(wǎng)頁(yè)中圖片的必須屬性,它能夠幫助人們知道這是什么圖片.或者在網(wǎng)速比較慢的時(shí)候顯示圖片的含義是什么.它的主要目的是,說(shuō) 明圖片的含義,想這樣的說(shuō)明 alt=”image”是很糟糕的.如果,有些圖片的確只是裝飾作用而已,那么建議你寫(xiě)成 alt=”".
罪行3:在必要的時(shí)候沒(méi)使用list
犯罪4:使用<b>和<i>顯示黑體字和斜體
可以用css樣式定義 font-weight 和 font-style. 如果必須在頁(yè)面中寫(xiě)標(biāo)簽的話,用 <strong> 或 <em>標(biāo)簽來(lái)替換.<b><i>的沒(méi)有任何語(yǔ)義可言, 但是,為了更簡(jiǎn)潔的頁(yè)面,還是選擇 css定義樣式吧
犯罪5:使用太多<br/>
<br />換行標(biāo)記只應(yīng)該用于插入是在第一個(gè)文本流換行符敲到一個(gè)新行一個(gè)特別字了。它不應(yīng)該被用來(lái)制造元素之間的差距,而是分裂成不同的段落,或調(diào)整的幅度CSS樣式的文本。
罪行6: 使用錯(cuò)誤的 Strikethrough 標(biāo)簽
在昔日,<S>和<strike>允許用來(lái)定義網(wǎng)站文字。不過(guò),現(xiàn)在他們被定義為不推薦使用的標(biāo)簽,當(dāng)他們?nèi)稳豢梢杂行Ч?現(xiàn)在用新的標(biāo)記集- <del>和<ins>。來(lái)替換<s><strike>
罪行 7: 使用內(nèi)聯(lián)樣式
css最重要的目的只是為了區(qū)分文檔和樣式,如果,你把style寫(xiě)到頁(yè)面里面,那么完全沒(méi)有css的作用可言.所以,記住把你的樣式放在它該放的位子
罪行 8: 把border添加到HTML中
罪行 9: 沒(méi)有使用header標(biāo)簽<h1>-<h6>
罪行10: 沒(méi)有語(yǔ)義的 <blink> 或<marquee>
不被w3推薦,<blink>和<marquee> (閃動(dòng),滾動(dòng))標(biāo)簽是純粹的丑陋。
不要使用這個(gè)標(biāo)簽,如果一定要用這樣的效果,相信,你會(huì)有其他更好的效果
本文地址:http://m.likemindfilms.com/tutorial/wd2197.html
您可能還喜歡
- jquery Jcrop圖像裁切插件中文api文檔
- @media適配不同尺寸的手機(jī)
- 返回上一頁(yè)代碼的幾種寫(xiě)法
- Dreamweaver CC 2014新功能介紹
- 深入了解viewport和px
- 優(yōu)秀CSS代碼書(shū)寫(xiě)的10個(gè)規(guī)范
- 畫(huà)出你的風(fēng)格:HTML5創(chuàng)意畫(huà)板的設(shè)計(jì)教程
- Div中height:100%無(wú)效的解決辦法
- 網(wǎng)頁(yè)前端-網(wǎng)頁(yè)切圖命名規(guī)范
- 為網(wǎng)頁(yè)設(shè)計(jì)師而生的14個(gè)文本編輯器
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏