舉例說明HTML中META標籤的一些使用技巧_HTML/Xhtml_網頁製作

HTML meta 標籤

HTML meta 標籤可以用來提供網頁內容的資訊給瀏覽器或是搜尋引擎，例如網頁內容的描述、網頁重要關鍵字、網頁編碼等都是常用meta 來標示的網頁訊息，另外還有網頁作者、網頁發佈時間、所使用的編輯器等較不重要的信息，也可以透過META TAG 來標示，META 的功能僅是用來註明這些網頁信息，且提供給瀏覽器或是搜尋引擎，並非是要給寫給瀏覽網頁的＂人＂看的內容。

HTML meta 標籤寫在 head 範例

XML/HTML Code複製內容到剪貼簿

1. head>  
2. title>測試網頁>  
3. meta name=name 🎜> content="這裡是網頁的簡短描述">>
4. 🎜> meta name="keywords" content="關鍵字 1,關鍵字 2">
5. head>   

標準的 標籤沒有結尾，直接將參數寫在 內即可，一個網頁內可以有很多個不同的 標籤，全部都要寫在head 標籤內，範例中的title 標籤是用來標示網頁標題用的，可以寫在 標籤之前，也可以寫在 標籤之後。

一、顯示及排列中文

XML/HTML Code複製內容到剪貼簿

1. META http-equiv= content="text/html; charset=big5" 說明：Content-Type==>檔案內容格式
;==>CONTENT內要作的每件事" "，分別以分號區隔

text/html==>純文字/超文字

charset==>字元組為中文繁體大五碼，如用iso-2022-jp是指日文

二、讓搜尋引擎容易找到您

XML/HTML Code
複製內容到剪貼簿

1. META NAME=NAME=NAME=NAME 🎜> CONTENT=
2. "電腦教學'網路教學'Linux教學'CSS教學'HTML教學'軟體教學'發信教學'SEO教學」連結連結">   META NAME=NAME=NAME
=

NAME

=

NAME
=
NAME

> 🎜>

 CONTENT=

"css'HomePage'html'linux'seo"

1. 說明：網頁內文關鍵字，可使用中、英文皆可 三、關於網站的內容描述 XML/HTML Code複製內容到剪貼簿 META

 

NAME

🎜> 

CONTENT
=

"這是一個免費學習網頁製作的好地方，網路研究所"

>  

1. 說明：Description==>內容的主要描述 四、這個網頁的作者是誰 XML/HTML Code複製內容到剪貼簿 META 
NAME

🎜> 

CONTENT

=
"PCNET"
>

說明：標註本網頁作者姓名等資料

五、這是用何編輯器完成的網頁

1. XML/HTML Code複製內容到剪貼簿 META NAME=NAME=
NAME

=

NAME

> 🎜> 

CONTENT

=
"Mozilla/3.0Gold(Win95)[Netscape]"

>

說明：

標註本網頁作者姓名等資料
1. Generator==>編輯器Mozilla/3.0Gold(Win95)[Netscape]==>編輯器等版本說明 六、這個網頁何時完成 XML/HTML Code複製內容到剪貼簿 META NAME

> >

 

CONTENT

=

"01-jan-2003 20:40:01"
>

說明：Creation-Date==>創作日期01-jan-2003 20:40:01==>詳細日期時間

七、這個網頁有效時期及不被Cache所限制 XML/HTML Code複製內容到剪貼簿

1. META NAME 🎜> CONTENT="01-jan-2005 00:00:00"> META
2.  HTTP-EQUIV " CONTENT="no_cache"> 說明：Expired==>網頁終止期限01-jan-2005 00:00:00==>已過的日期時間，也可以用Mon,12 Jan 2007 00:00:00 GMTno_cache==>不會被Cache限制，也就是網頁沒有記憶功能。 八、網頁作者的網址與信箱

XML/HTML Code

複製內容到剪貼簿

link rev

=

1. rev=rev= href="mailto:pcnettw@yahoo.com.tw"> 🎜> link
 
2. rev="made" href="http://www.pcnet.idv.tw/">>   說明：網頁作者信箱或網址陳述rev==>正向關聯made=>網頁製造者
href==>您的信箱或網址

九、網頁能自動換頁

XML/HTML Code
複製內容到剪貼簿

META

 
1. HTTP-EQUIV=HTTP-EQUIV=" > CONTENT="15; url=http://www.pcnet.idv.tw/">   說明：refresh==>更新或重整
15==>15秒後執行下一動作

;==>CONTENT內要作的每件事" "，分別以分號區隔

url=http://www.pcnet.idv.tw/==>指定轉換到此網頁

十、進入或離開的特效(限IE使用)

XML/HTML Code
複製內容到剪貼簿

META

1.  http-equiv== content="特效模式(Duration=特效持續時間,Transition=代替的特效)""特效模式(Duration=特效持續時間,Transition=代替的特效)">  

說明：
http-equiv="Page-Enter是進入本頁、Page-Exit是離開本頁、Site-Enter是進入本站、Site-Exit是離開本站"。
content="revealTrans(指定換頁特效)、blendTrans(設定換頁特效為"混合")。
Duration=設定特效持續的時間(秒)，建議在3-5秒之間。


註：
它必須放於

與之間，主要用於本網頁的內容說明，以利自己或別人(搜尋引擎)使用，另外也可以製造出一些自動翻頁等特殊效果。 http-equiv或NAME屬性，必須搭配content屬性使用，兩者也可互替使用。

後設語法標籤(META description tag)的用法隨各搜尋引擎設定有所不同。
有無Meta標籤，不影響網頁正常顯示，其最大目的在於提供網頁各種資訊及產生特殊效果。
網頁運用，建議以本頁所述1.2.3.4.8項這些標籤為主，其餘視況自行增減。
您可使用檢視原始碼，來看本例實際安排。
更多的報導資料，歡迎蒞臨講師(作者)網站查看。