前面我們學習了不少標簽,很多同學在學習的過程中,由於標簽語義不熟練,常常用某一個標簽代替另外一個標簽來實現相同的效果,例如對於實現HTML有序列表的效果,有些同學就可能用以下代碼實現:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body> <div>1.HTML</div> <div>2.CSS</div> <div>3.JavaScript</div> <div>4.jQuery</div> <div>5.Ajax</div> <div>6.SEO</div> <div>7.ASP.NET</div> </body> </html>
在浏覽器預覽效果如下:
咋一看,代碼不同,但是在浏覽器實現的效果跟有序列表實現的效果都差不多咧!可能某些初學者還會自诩:哎呀,這個方法真的是太聰明了,這個世界上也真的是只有我才想得到!(哎,哥曾經也自诩過,實在慚愧)。正是因為這種錯誤的想法導致初學者在HTML學習的過程中,沒有認真把每一個標簽的語義弄懂,糊裡糊塗地就過去了,能用某一個學過的標簽代替這個新的標簽,我就懶得學這個新的標簽。
某一個標簽代替另外一個標簽來實現相同的效果,這是大多數初學者會遇到的問題。但是很多人就會有一個疑問:對於很多標簽(如列表標簽和p標簽)實現的效果,我們可以用div標簽和span標簽(我們在HTML進階會講到這個span標簽)這兩個就可以實現呀,干嘛那麼費心費力地去學習那麼多的標簽呢?
這一點正好戳中HTML的精髓了。說得沒錯,你可以用div標簽和span標簽這兩個無語義的標簽代替大部分語義標簽,或者用多個p標簽代替列表標簽都行。但是這樣,你就違背了HTML這門語言的初衷。HTML每一個標簽都有它自身的語義,例如p標簽,表示的是“paragraph”,標記的是一個段落。如果你用div標簽來代替p標簽,那這段文字就沒有任何語義了。語義這種東西非常重要,編寫一個語義結構良好清晰的網頁,這正是你學習HTML的目的。在建站時期,往往你編寫的代碼是成千上萬行的。上萬行,跟你現在的幾行代碼相比,那是一個怎樣的概念,你可想而知了。如果你全部用div和span來實現,我相信你看得頭都暈,要是在某一行代碼出錯了怎麼辦,你怎麼找到錯誤的那一行代碼?此外,網頁語義結構良好,對於搜索引擎來說也是極其重要的一點,這一點我們會在SEO教程中見識到。
很多人覺得HTML很簡單,不就是幾個標簽嗎?正是它簡單,你往往忽略了它的目的和重要性。
現在大家知道學習HTML的目的是什麼了吧。我們學習HTML不是僅僅看自己學了多少標簽,更重要的是在你需要的地方能不能用到對的語義化標簽。把標簽用在對的地方,這是HTML入門教程的目的所在。在“HTML進階教程”(即將上線)裡面,我們會深入了解語義化標簽,教你怎麼在整站設計的過程中怎樣編寫一個語言結構清晰良好而搜索引擎喜歡的語義化頁面。