Html上的介紹

1. Meta keywords

用法:<meta name=”keywords” content=”your keyword or keywords”/>
這個在過去曾被大力推廣的meta優化重點部分,如今已不再流行,甚至來自google的有關人士也已證實:“由於過去對meta keywords標籤的濫用,使得google不得不把keywords排除在影響排名的考慮因素之外以確保排名的公正性”。

2. Meta discription

用法:<meta name=”description” content=”Your company name provides what services or products”/>
與keywords標籤相反,Meta discription標籤在現今的排名中被賦予更高的權重。合理的長度加上合理的關鍵詞密度,清晰地表達你網站的主題,無論是對於讀者還是搜索引擎來說,都是百利而無一害。通常情況下,meta keywords標籤的長度應保持在200個字符,關鍵詞合理出現四次即可。

3. Meta robots

用法:<meta name=”Robots” content=”INDEX, FOLLOW”>
<meta name=”Robots” content=”INDEX, NOFOLLOW”>
<meta name=”Robots” content=”NOINDEX, FOLLOW”>
<meta name=”Robots” content=”NOINDEX, NOFOLLOW”>
meta robots標籤是用來告知搜索引擎蜘蛛,對於當前頁面是否收錄和是否爬行。有的網站有些頁面可能不希望蜘蛛來收錄和爬行由於隱私要求或其他,那麼在html的head部加上對應的meta robots描述就可以實現。

4. Meta Revisit-after

用法:<meta name=”Revisit-after” content=”1 Day”>
Revisit-after是 用來告訴蜘蛛何時再來訪問當前頁面。你可以自定義是1天,一週,一個月或是任何你希望的訪問頻率。

5. Meta page-topic

用法:<meta name=”page-topic” content=”your page topic”/>
page-topic顧名思義是介紹當前頁面的主題。你可以用你當前頁面的關鍵詞作爲網頁主題。

6. Meta Distribution

用法:<meta name=”Distribution” content=”Global”>
這個用語聲明你網站的發佈對象是面向全球,還是僅僅針對當地。

7. Meta Rating

用法:<meta name=”Rating” content=”General”>
Meta rating是對當前頁面一個等級衡量,告訴蜘蛛當前頁面在整個網站中的權重到底是多少。General是一般頁面,Mature是比較成熟的頁面,Restricted代表受限制的。

8. Meta Charset

用法:<meta name=”Charset” content=”GB2312″>
定義在用戶瀏覽器上的用來顯示的字符集,一般是選用GB2312.

9. Meta expires

用法:<meta name=”expires” content=”1 year”>
定義當前頁面的使用期限,過期作廢。

10. Meta copyright

用法: <meta name=”copyright” content=”Copyright YourCompany – 2010″>

定義版權所屬,一般公司都會採用這個標籤,對於網站上所有內容進行版權保護

11. Meta viewport

<meta id="viewport" name="viewport"content="width=320; initial-scale=1.0;maximum-scale=1.0;user-scalable=no;"/>//屏幕的縮放


1. viewport:

也就是可視區域。對於桌面瀏覽器,我們都很清楚viewport是什麼,就是出去了所有工具欄、狀態欄、滾動條等等之後用於看網頁的區域,

這是真正有效的區域。由於移動設備屏幕寬度不同於傳統web,因此我們需要改變viewport;

實際上我們可以操作的屬性有4 個:

width -           //  viewport 的寬度 (範圍從200到10,000,默認爲980 像素)

height -          //  viewport 的高度 (範圍從223到10,000)
 
initial-scale -     // 初始的縮放比例 (範圍從>0 到10)
 
minimum-scale -    //  允許用戶縮放到的最小比例

maximum-scale -    //  允許用戶縮放到的最大比例
 
user-scalable -    //  用戶是否可以手動縮 (no,yes)

<meta content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0;"name="viewport" >

第一個meta標籤表示:

    強制讓文檔與設備的寬度保持1:1;

   文檔最大的寬度比列是1.0(initial-scale初始刻度值和maximum-scale最大刻度值);


   user-scalable定義是否可縮放(0爲不縮放),使頁面固定設備上面的大小。

(注意:實際測試中發現,HTCG7自身系統瀏覽器不支持這一條規則,能夠對頁面進行放大,一旦放大響應的box也隨之放大,導致俄頁面出現錯亂問題,解決方法:定義頁面的最小寬度

 min-width,body{min-width: 300px;})

11. Meta Format-detection

<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />//將不識別郵箱
告訴設備將網頁中的電話號碼不顯示爲撥號的超鏈接
12.

<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-touch-fullscreen" content="yes"/>

1這meta的作用就是刪除默認的蘋果工具欄和菜單欄。content有兩個值”yes”和”no”,當我們需要顯示工具欄和菜單欄時,這個行meta就不用加了,默認就是顯示。
2全屏顯示

在iOS中有兩個meta值,apple-mobile-web-app-capable和apple-mobile-web-app-status-bar-style,這兩個會讓網頁內容以應用程序風格顯示,並使狀態欄透明。
<meta name="apple-mobile-web-app-capable" content="yes">   //網站開啓對web app程序的支持
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

說明:11和12可參照http://blog.sina.com.cn/s/blog_6d48e77101015kqr.html和http://www.cnblogs.com/yuzhongwusan/archive/2011/11/29/2267568.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章