- Vue 3移動Web開發與性能調優實戰
- 呂鳴
- 495字
- 2024-12-27 22:46:37
2.7 語義化標簽總結
前面幾個小節介紹了HTML 5引入的一些新的語義化標簽,其中包括用來呈現頁面頭部的<header>標簽和頁面尾部的<footer>標簽、作為獨立模塊顯示的<section>標簽、頁面導航<nav>標簽和側邊欄<aside>標簽,這幾個標簽在頁面中的具體用法如圖2-4所示。

圖2-4 語義化標簽總結
HTML 5之所以引入這些新的語義化標簽,主要是為了讓HTML代碼更加規范和語義化。每當我們開始編寫一個前端頁面時,首先在心里應該有一個思路:如何將頁面進行功能劃分,劃分之后如何按照每個模塊的展示內容來選擇合適的HTML 5語義化標簽。
當然,有些程序員在網頁呈現任何內容都統一使用<div>標簽,我們稱這種現象為“標簽選擇困難癥”,雖然以這種方式使用標簽并不會影響網頁代碼的運行,但是當其他程序員來閱讀這些代碼時,就會感到很亂。
HTML 5語義化標簽的意義不僅在于更方便開發人員閱讀代碼文件和理清代碼結構,而且對瀏覽器而言,能夠更清晰地識別網頁的結構。同時良好語義化代碼的網站對于搜索引擎優化(Search Engine Optimization,SEO)功能更加友好,能夠讓搜索引擎清晰地捕捉到網頁的主、次模塊和內容,所以建議程序員盡可能使用語義化標簽來構建HTML頁面。
當然,上述所講解的標簽并不是所有的HTML 5新引入的標簽,而是與語義化概念關系比較緊密的一些標簽。
推薦閱讀
- Vue.js 3.x快速入門
- 程序設計與實踐(VB.NET)
- Spring Cloud Alibaba微服務架構設計與開發實戰
- iOS開發實戰:從零基礎到App Store上架
- Python零基礎快樂學習之旅(K12實戰訓練)
- 21天學通C++(第6版)
- 軟件測試技術指南
- FPGA Verilog開發實戰指南:基于Intel Cyclone IV(進階篇)
- Getting Started with Hazelcast(Second Edition)
- Mastering AWS Security
- Visual Studio Code 權威指南
- 玩轉.NET Micro Framework移植:基于STM32F10x處理器
- IBM DB2 9.7 Advanced Application Developer Cookbook
- 計算機軟件項目實訓指導
- Python 3.8編程快速入門