Web 品質(zhì) – 重要的HTML元素

2022-03-02 15:14 更新

Web 品質(zhì) - 重要的 HTML 元素


對于提升 web 品質(zhì),<DOCTYPE>、<title> 以及 <h1> 都是重要的標(biāo)簽。


<!DOCTYPE> 元素

所有的 HTML 和 XHTML 頁面都應(yīng)當(dāng)使用 <Doctype> 元素來定義遵照何種 HTML 版本。

doctype 定義了您正在使用的 HTML 版本,并為瀏覽器提供重要的信息以便其更快速一致地呈現(xiàn)您的頁面。

文檔類型聲明同時也使驗證軟件可以對頁面的語法進行檢查:

HTML 5

<!DOCTYPE html>

HTML 4.01 Strict, Transitional, Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict, Transitional, Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">


<title> 元素

<title> 元素是最重要的 HTML 元素之一。它的主要功能是描述網(wǎng)頁的內(nèi)容。

即使標(biāo)題不是網(wǎng)頁的一個可見的部分,它對于提升網(wǎng)站的品質(zhì)依然是重要的,這是因為它在以下位置都是可見的:

  • 搜索引擎列表
  • 窗口的標(biāo)題欄
  • 用戶的書簽中

標(biāo)題應(yīng)當(dāng)盡可能地短,并具有可描述性。

當(dāng)某個用戶在 internet 上搜索網(wǎng)站時,大部分搜索引擎都會在搜索結(jié)果中顯示出網(wǎng)站的標(biāo)題。請確保標(biāo)題與網(wǎng)頁的內(nèi)容是吻合的。這樣的話用戶有更多的可能通過點擊這些鏈接來訪問到你的網(wǎng)站。

當(dāng)用戶訪問您的網(wǎng)站時,在窗口的標(biāo)題欄中標(biāo)題是可見的。請確保即使窗口被最小化,標(biāo)題同樣能起到描述網(wǎng)站內(nèi)容的作用。

在用戶訪問你的網(wǎng)站之后,網(wǎng)頁的標(biāo)題會存儲于歷史文件夾(用戶甚至?xí)丫W(wǎng)頁收藏到他的收藏夾中)。為了后續(xù)的成功訪問,同樣請確保標(biāo)題可以清楚地描述您的網(wǎng)站。

優(yōu)秀的標(biāo)題:

<title>HTML Tutorial</title>

<title>XML Introduction</title>

差距的標(biāo)題的例子::

<title>Introduction</title>

<title>Chapter 1</title>

W3Cschool擁有一整套組織良好、易于理解的 HTML、CSS、JavaScript、 DHTML、XML、XHTML、WAP、ASP、SQL 教程,并包含非常多實例和源代碼。


<h1> 元素

<h1> 元素用來描述網(wǎng)頁中最上層的標(biāo)題。

由于一些瀏覽器會默認地把 <h1> 元素顯示為很大的字體,因此會有一些 web 開發(fā)者使用 <h2> 元素代替 <h1> 元素來顯示最上層的標(biāo)題。這樣做不會對讀者產(chǎn)生影響,但會使那些試圖"理解網(wǎng)頁結(jié)構(gòu)"的搜索引擎和其他軟件感到迷惑。

請確保把 <h1> 用于最頂層的標(biāo)題,<h2> 和 <h3> 用于較低的層級。

可以試著根據(jù)此模版來構(gòu)造您的網(wǎng)頁:

This is the main heading

Some initial text

This is a level 2 heading

This is some text. This is some text. This is some text.

This is a level 3 heading

This is some text. This is some text. This is some text.

This is a level 3 heading

This is some text. This is some text. This is some text.

如果您不喜歡默認的標(biāo)題字體尺寸,可以使用樣式或樣式表來改變。

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號