開始我們先說說meta標簽的作用:
meta標簽是HTML標記head區的一個關鍵標簽,它位于HTML文檔的 head 和 title 之間(有些也不是在 head 和 title 之間)。它提供的信息雖然對用戶不可見,但卻是文檔的最基本的信息。HTML meta 除了提供文檔字符集、使用語言、作者等基本信息外,還涉及對關鍵詞和網頁等級的設定。
在查閱w3school中,第一句話中的“元數據”就讓我開始了Google之旅。然后很順利的在英文版的w3school找到了想要的結果。(中文w3school說的是元信息,Google和百度都沒有相關的詞條。但元數據在Google就有詳細解釋。所以這兒采用英文版W3school的解釋。)
不難看出,其中的關鍵是metadata,中文名叫元數據,是用于描述數據的數據。它不會顯示在頁面上,但是機器卻可以識別。這么一來meta標簽的作用方式就很好理解了。
meta常用于定義頁面的說明,關鍵字,最后修改日期,和其它的元數據。這些元數據將服務于瀏覽器(如何布局或重載頁面),搜索引擎和其它網絡服務。
HTML中meta標簽的使用方法介紹:
head ! - 聲明文檔使用的字符編碼 - meta charset =“utf-8”/ ! - 頁面關鍵詞 - meta name =“keywords”content =“個人活動發布,會辦app,活動管理,會議管理,社群管理“/ ! - 頁面描述 - meta name =”description“content =”發布個人會議,發布公司會議,w我們都可以幫你找到合適的會議地點和參會觀眾“ ! - 網頁作者 - meta name =”author“content =”xin1642868874@163.com“ ! - 搜索引擎抓取robotterms是一組使用逗號(, )分割的值,通常有如下幾種取值:none,noindex,nofollow,all,index和follow。 - meta name =“機器人“content =”索引,按照“ ! - 頁面重定向和刷新 - meta http-equiv =”refresh“content =”0; url =“/ ! - 禁止Chrome瀏覽器中自動提示翻譯 - meta name =“google”value =“notranslate” ! - - 禁止百度轉碼 - meta http-equiv =“Cache-Control”content =“no-siteapp” ! - 自定義標簽:app版本號說明 - meta name =“app-version”content =“1.13.3” title php /title /head
以上都是關于HTML meta標簽的作用和使用方法,還有很多屬性,不過那些對現在的我們來說學這些還有點早。
再來分享幾個著名網站的首頁的meta文件:
京東首頁的meta設置:
meta charset= gbk meta name= description content= 京東JD.COM-專業的綜合網上購物商城,銷售家電、數碼通訊、電腦、家居百貨、服裝服飾、母嬰、圖書、食品等數萬個品牌優質商品.便捷、誠信的服務,為您提供愉悅的網上購物體驗! meta name= Keywords content= 網上購物,網上商城,手機,筆記本,電腦,MP3,CD,VCD,DV,相機,數碼,配件,手表,存儲卡,京東
淘寶首頁的meta設置:
meta charset= utf-8 meta http-equiv= X-UA-Compatible content= IE=edge,chrome=1 meta name= renderer content= webkit meta name= spm-id content= a21bo meta name= description content= 淘寶網 - 亞洲最大、最安全的網上交易平臺,提供各類服飾、美容、家居、數碼、話費/點卡充值… 8億優質特價商品,同時提供擔保交易(先收貨后付款)、先行賠付、假一賠三、七天無理由退換貨、數碼免費維修等安全交易保障服務,讓你全面安心享受網上購物樂趣! meta name= keyword content=
優酷首頁的meta設置:
meta charset= utf-8 meta http-equiv= X-UA-Compatible content= IE=Edge meta name= title content= 優酷-中國領先視頻網站,提供視頻播放,視頻發布,視頻搜索 - 優酷視頻 / meta name= keywords content= 視頻,視頻分享,視頻搜索,視頻播放,優酷視頻 / meta name= description content= 視頻服務平臺,提供視頻播放,視頻發布,視頻搜索,視頻分享 /
除了上面的解釋的那些,這在補一個也是常用的meta標簽里的屬性
X-UA-Compatible IE8的專用標記,用來指定IE8瀏覽器去模擬某個特定版本的IE瀏覽器的渲染方式,以此來解決部分兼容問題。
meta http-equiv= X-UA-Compatible content= IE=7
以上代碼告訴IE瀏覽器,無論是否用DTD聲明文檔標準,IE8/9都會以IE7引擎來渲染頁面。
通過看到大網站對于meta的設置,我們可以看到常用的有:X-UA-Compatible、keywords、description這三種,我們要好好學會用。
【小編推薦】
HTML中head標簽是什么意思?一篇文章教你正確地使用head標簽
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。
新聞熱點
疑難解答