2012年5月16日 星期三

[HTML5學習筆記]新的網頁語法架構

標籤:

資訊進步得越來越快,學的永遠都追不完新的發展,當然,網頁也不例外,最新的網頁技術HTML5+CSS3,相信略懂什麼是「網頁」的朋友一定都知道,甚至已經從很久前就開始玩了,鼻涕最近才剛起步,快快做下筆記吧!

網頁宣告

與過去html4.01第一個不同點,當然就是「語法宣告」囉~~以前鼻涕總是用DW開新網頁,直接套用那一串「長得要命」的網頁宣告,現在就不用了~~十分之簡單,只要寫上「!DOCTYPE html」即宣告完畢。

新的語意結構標籤

一般網頁架構,都會分為所謂的「頁首」、「導覽」、「主要內容」、「頁尾」、「邊欄」等部分,以前必須使用很多「div浮動框架」做區分,容易顯得混亂;而現在,他們則有各自專屬的獨立標籤囉~
html5網頁架構 

  • header標籤(頁首)

頁首通常包含了網頁標題或甚至副標題,也可以加入標籤放入導航選單。

  • nav標籤(導覽列)

通常搭配「ul」、「li」標籤,放入導航的選單。

  • article標籤(主要內容)
  • section標籤(群組)

可以將「article」主要內容群組化,行程在不同位置的各個區塊,例如一般常見的部落格,在首頁絕不會放置任何一篇完整的內文,而是一篇一篇簡短的描述說明。

  • aside標籤(邊欄)

顧名思義,即為aside「邊欄」,也就是一個網頁如果有其他附屬功能(如本站右側的「最新文章」等),可以利用aside挪出一個區塊放置這些附屬的功能;當然,並非每一個網站都需要這個「邊欄」。

  • footer標籤(頁尾)

通常都是在網站最底部,多用來宣告著作版權或是聯絡方式等資訊。

網頁測試

沒有留言:

張貼留言