iT邦幫忙

1

新手HTML 語意標籤問題

  • 分享至 

  • xImage

新手目前開始複習和實作網頁切版,Udemy基礎課時老師都說要用語意標籤,
讓瀏覽器或其他讀者,讀懂網頁架構,header,main,section等..當然也可以使用一堆div,但就要詳讀下游子內容才知道實際結構。

是有個稍微蠢的疑問,
1.這些後來發展出的語意標籤,是不是只是除讓設計者了解架構外,本質上都是類似block區塊的container,因為查預設值只有dispaly:block屬性,高度和寬度預設值都是0,然後隨著後續放入的物件高度和寬度撐大container。

所以有沒有可能我必須放主內容的main,設定區塊大小會比section還小?
當然實務排版上這樣很蠢XD,只是有可能發生?。

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
1
Felix
iT邦研究生 2 級 ‧ 2022-04-08 19:16:52

您可以把語意標籤想成是有意義的 div 標籤。

瀏覽器和搜尋引擎是透過語意標籤來解析網頁的結構,因此只要內容能符合語意標籤的用法,就沒有問題了,面積大小完全不是重點。

1

語意是給開發者與瀏覽器看的
這樣能夠更快速的開發達成目的
功能方面跟 div 類似(之後是否更改功能不一定),
只是將功能劃分為一個個區塊

就像大家最熟悉的 h1 標籤
在某意義上也是語意標籤
因為瀏覽器會把它視為一個該網頁的標誌進行抓取

ok~謝謝各位大大,大致上了解
像是常見熟悉的 h1 標籤,都會有字體預設值,其他後續區塊的排列設定如inline-block or block特性再依照排版裁切

1
greenriver
iT邦研究生 5 級 ‧ 2022-04-11 08:41:03

標籤是要給google爬蟲爬的。

google規定,如果想在google搜尋結果中有較好的曝光率,
換句話就是,網頁能在google搜尋結果裡排在越前面,讓使用者能搜尋到,
就必須參照google規定的方法去寫,headermainsection...等等,
俗稱SEO。

如果沒有要做SEO,只是個人使用的網站,不須曝光率,就無所謂。
全部都div即可。(不過通常作網站就是為了賺錢,曝光率是很重要的)
/images/emoticon/emoticon39.gif

我要發表回答

立即登入回答