Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
TML5方興未艾,但也有不少遺憾。下面提了10點(diǎn)希望在HTML6中看到的特性,歡迎評(píng)論。
我們可能永遠(yuǎn)不會(huì)解決與壓縮編解碼器的爭(zhēng)斗,但我們可以與之配合。不同的壓縮算法可能需要更多的工作來實(shí)現(xiàn),但是它們提供競(jìng)爭(zhēng)。能對(duì)展現(xiàn)在頁(yè)面上的視頻幀提供更多控制的方式會(huì)是更好的方案。當(dāng)前的標(biāo)準(zhǔn)是使用視頻中的一系列幀填充一個(gè)矩形。然后提供了一個(gè)帶有注釋,字幕和其他內(nèi)容的文本軌道的控制。一些聰明的人已經(jīng)開始將注釋與其他DOM對(duì)象同步。但是如果有回調(diào)鉤子和同步機(jī)制是不是更好?例如,DOM與視頻混合的能力如何?
照片在屏幕上看起來要漂亮,需要多少像素?這個(gè)答案根據(jù)根據(jù)設(shè)備的不同而不同。即使窗口的大小也會(huì)改變最小分辨率。但HTML標(biāo)準(zhǔn)
<img>
標(biāo)簽只能獲得一個(gè)SRC,它指向一個(gè)可能有太多或太少像素的圖像文件。如果它太多,瀏覽器必須降級(jí)圖像才能顯示,這就浪費(fèi)網(wǎng)絡(luò)帶寬和時(shí)間。如果像素太少,效果又太差。更好的HTML協(xié)議應(yīng)該為圖像提出所需的寬度或高度,以便服務(wù)器可以提供最佳分辨率。
標(biāo)準(zhǔn)的HTML瀏覽器使用且只是用JavaScript。但由于某些原因,我們需要用script標(biāo)簽的type屬性設(shè)定為text/javascript來指定語(yǔ)言類型。從html4開始,type一直就沒有默認(rèn)值。
HTML4的建議稿覺得有人可能會(huì)使用像text/tcl或text/vbscript這樣的類型,但是實(shí)際上有沒有人使用這些?微軟已經(jīng)棄用了IE11的text/vbscript,而且近年來Sun在使用tcl。
Google正在慢慢推Dart,但包括Dart的Chromium(Chrome的開發(fā)版)確有一個(gè)不祥的警告 :“不要使用Dartium作為主瀏覽器,不要將Dartium分發(fā)給用戶!”說明Google對(duì)Dart也不是很有信心。
但在未來,我們可以擁有更強(qiáng)大的可插拔語(yǔ)言。它將為開發(fā)人員增加更多的靈活性和設(shè)計(jì)選擇。會(huì)不會(huì)把互聯(lián)網(wǎng)弄壞?如果有一個(gè)穩(wěn)固的開源實(shí)現(xiàn),它就可以被所有瀏覽器采用??赡芎茈y讓網(wǎng)站使用可插入語(yǔ)言來為廣泛的受眾提供內(nèi)容 - JavaScript會(huì)可以繼續(xù)擁有廣泛的網(wǎng)絡(luò)基礎(chǔ) - 但是對(duì)于使用專門語(yǔ)言的更專業(yè)的擴(kuò)展來說,這可能是一個(gè)很好的選擇。
想超越JavaScript的開發(fā)人員可以有另外一個(gè)解決方案,就是將其他語(yǔ)言轉(zhuǎn)換為JavaScript。許多開發(fā)人員已經(jīng)使用一些翻譯語(yǔ)言(如CoffeeScript)的預(yù)處理器。
杰里米·阿什肯納斯(Jeremy Ashkenas) 列出來了可以編譯成JavaScript的語(yǔ)言列表,范圍很廣。Lisp,Python,Ruby,Erlang,Scala - 列表還在繼續(xù)擴(kuò)大。
這樣的提案將會(huì)付出代價(jià)。當(dāng)一種語(yǔ)言被交叉編譯成JavaScript時(shí),通常會(huì)在同一時(shí)間進(jìn)行細(xì)化,生成一個(gè)更小的更容易通過互聯(lián)網(wǎng)傳輸?shù)陌姹?。在部署過程中執(zhí)行此操作比在每個(gè)人的瀏覽器上執(zhí)行的效率要高得多。
但是,縮小的版本有其缺點(diǎn)。開放一直是網(wǎng)絡(luò)的巨大優(yōu)勢(shì)之一。我們能夠通過閱讀通常仍然以人類可讀的形式寫的JavaScript代碼來學(xué)習(xí)和調(diào)試。交叉編譯和縮小的代碼對(duì)于其他人是無價(jià)值的。它正在慢慢打破Web的開放性。
在瀏覽器中執(zhí)行此轉(zhuǎn)換還有其他優(yōu)點(diǎn)。每臺(tái)機(jī)器都有不同,轉(zhuǎn)換過程需要利用到RAM大小、視頻卡庫(kù)等知識(shí)。當(dāng)前版本的HTML假定采用JavaScript的一般版本,這使得為本地機(jī)器優(yōu)化代碼變得更難。
JavaScript編程的世界已經(jīng)被jQuery以及其他標(biāo)準(zhǔn)庫(kù)改造了。然而,幾乎每個(gè)網(wǎng)站仍然要加載自己加載某個(gè)版本的副本。在加載jQuery時(shí)浪費(fèi)的能量可能足以照亮一個(gè)小國(guó)家,治愈癌癥或兩者兼而有之。
一些網(wǎng)站使用像Google或Yahoo這樣的公司托管的標(biāo)準(zhǔn)緩存版本,這樣可以節(jié)省帶寬,但下一個(gè)HTML標(biāo)準(zhǔn)應(yīng)該比這更好。如果大量設(shè)計(jì)人員同意,則可以使用瀏覽器進(jìn)行分發(fā)。這將節(jié)省更多時(shí)間再次刷新jQuery的緩存版本。
瀏覽器已經(jīng)可以共享位置信息。期待更多國(guó)家加入。人們通常希望在自己設(shè)備的聯(lián)系信息庫(kù)里面放入電子郵件地址或電話號(hào)碼?,F(xiàn)在他們必須剪切和粘貼。為什么不讓JavaScript挖掘并保存所有的剪切和粘貼?這對(duì)移動(dòng)設(shè)備來說是非常棒的。在交互上可以提供細(xì)粒度的控制,允許人們來自某些域的代碼可以自動(dòng)訪問到聯(lián)系信息,而其他域不行。
在網(wǎng)絡(luò)攝像頭和手機(jī)的多攝像頭提供的設(shè)備基礎(chǔ)上,用戶與瀏覽器交互的場(chǎng)景少不了鏡頭和麥克風(fēng)。W3C已經(jīng)在探索一種向表單添加照片或視頻捕獲的方法 。一些瀏覽器已經(jīng)支持自己的版本,如
webkitGetUserMedia
。很容易想到更多。表單元素還可以訪問存儲(chǔ)在設(shè)備中的存儲(chǔ)空間,并且該設(shè)備可以更好地控制攝像機(jī)和捕獲速率。這將讓網(wǎng)站與專門的應(yīng)用程序競(jìng)爭(zhēng)。
鑒于構(gòu)建可信硬件是多么困難的事情,因此我們可能會(huì)提供很多硬性和快速認(rèn)證的方式。而瀏覽器可以為此提供更多的功能。瀏覽器可以使用嵌入式Key進(jìn)行簽名,而不是Cookie。這些可以以硬化的芯片存儲(chǔ)在設(shè)備之外,以防止人們提取密鑰。向?yàn)g覽器添加API將允許網(wǎng)站要求更好的數(shù)字簽名。如果把太多的信任放在其中,這可能是危險(xiǎn)的,但這將是cookie和會(huì)話身份驗(yàn)證的一個(gè)步驟。
文章底部的注釋部分只是我們?nèi)绾巫⑨屛恼碌拈_始,但是一個(gè)標(biāo)準(zhǔn)的結(jié)構(gòu)可以添加與段落、句子、甚至單詞相關(guān)的注釋。復(fù)雜的版本甚至可以允許對(duì)視頻內(nèi)的圖像或某個(gè)時(shí)間點(diǎn)進(jìn)行注釋。有些網(wǎng)站正在開始提供這些功能,但在標(biāo)準(zhǔn)化API方面會(huì)使所有網(wǎng)站和瀏覽器都以相同的方式處理基本注釋。W3C有一個(gè)研究該領(lǐng)域并提供基本標(biāo)準(zhǔn)的小組。
HTML標(biāo)簽區(qū)分標(biāo)題,段落和頁(yè)腳,但還不夠多。為什么不創(chuàng)建一個(gè)標(biāo)準(zhǔn)的方法來指定其他常見的細(xì)節(jié),例如地址或電話號(hào)碼的部分?當(dāng)然,用于描繪電子郵件地址的標(biāo)準(zhǔn)標(biāo)簽可以使垃圾郵件發(fā)送者的生活變得更輕松,但標(biāo)準(zhǔn)的一組標(biāo)簽可以加速網(wǎng)頁(yè)抓取工具和搜索引擎,這將有利于我們所有人。W3C一直在探索微格式來標(biāo)記數(shù)據(jù),并曾經(jīng)認(rèn)為它們是HTML5的一部分,盡管它們不是。我們可以為地點(diǎn),時(shí)間,日期,出售物品,參考書目以及所有標(biāo)準(zhǔn)數(shù)據(jù)使用更全面的標(biāo)記。
周二,微軟詳細(xì)披露了目前仍在進(jìn)行中的大規(guī)模網(wǎng)絡(luò)釣魚活動(dòng)。即便用戶賬號(hào)啟用了多因素身份認(rèn)證保護(hù)措施,該活動(dòng)依然可以劫持用戶賬戶。自去年 9 月以來,這項(xiàng)活動(dòng)已針對(duì) 10000 個(gè)組織進(jìn)行了攻擊,通過訪問受害者電子郵件賬號(hào)來誘騙員工向黑客匯款。
多因素身份驗(yàn)證(也稱為雙因素身份驗(yàn)證、MFA 或 2FA)是帳戶安全的黃金標(biāo)準(zhǔn)。除了密碼之外,它還要求帳戶用戶以他們擁有或控制的東西(物理安全密鑰、指紋、面部或視網(wǎng)膜掃描)的形式證明他們的身份。MFA 技術(shù)的廣泛使用增加了攻擊難度,但攻擊者已經(jīng)找到了反擊的方法。
微軟觀察到一個(gè)活動(dòng),該活動(dòng)在帳戶用戶和他們嘗試登錄的工作服務(wù)器之間插入了一個(gè)攻擊者控制的代理站點(diǎn)。當(dāng)用戶向代理站點(diǎn)輸入密碼時(shí),代理站點(diǎn)將其發(fā)送到真實(shí)服務(wù)器,然后將真實(shí)服務(wù)器的響應(yīng)轉(zhuǎn)發(fā)回用戶。身份驗(yàn)證完成后,攻擊者竊取了合法站點(diǎn)發(fā)送的會(huì)話 cookie,因此用戶無需在訪問每個(gè)新頁(yè)面時(shí)都重新進(jìn)行身份驗(yàn)證。該活動(dòng)始于一封帶有指向代理服務(wù)器的 HTML 附件的網(wǎng)絡(luò)釣魚電子郵件。
釣魚網(wǎng)站攔截身份驗(yàn)證過程。
在一篇博文中,Microsoft 365 Defender 研究團(tuán)隊(duì)的成員和微軟威脅情報(bào)中心寫道:“根據(jù)我們的觀察,在首次登錄網(wǎng)絡(luò)釣魚站點(diǎn)的被盜帳戶后,攻擊者使用被盜的會(huì)話 cookie 對(duì) Outlook 在線 (outlook.Office.com) 進(jìn)行身份驗(yàn)證。在多種情況下,cookie 都有 MFA 聲明,這意味著即使組織有 MFA 策略,攻擊者也會(huì)使用會(huì)話 cookie 代表受感染的帳戶獲得訪問權(quán)限”。
在 cookie 被盜后的幾天里,威脅行為者訪問了員工的電子郵件帳戶并尋找用于商業(yè)電子郵件泄露詐騙的消息,這會(huì)欺騙目標(biāo)將大筆資金匯入他們認(rèn)為屬于同事或業(yè)務(wù)合作伙伴的帳戶。攻擊者使用這些電子郵件線程和被黑員工的偽造身份來說服對(duì)方付款。
為了防止被黑員工發(fā)現(xiàn)漏洞,威脅參與者創(chuàng)建了收件箱規(guī)則,自動(dòng)將特定電子郵件移動(dòng)到存檔文件夾并將其標(biāo)記為已讀。在接下來的幾天里,攻擊者定期登錄以檢查新電子郵件。
該博客文章顯示了員工很容易陷入此類騙局。大量的電子郵件和工作量通常使我們很難知道消息何時(shí)是真實(shí)的。使用 MFA 已經(jīng)表明用戶或組織正在實(shí)施良好的安全衛(wèi)生。騙局中為數(shù)不多的視覺可疑元素之一是代理站點(diǎn)登錄頁(yè)面中使用的域名。盡管如此,鑒于大多數(shù)組織特定登錄頁(yè)面的不透明性,即使是粗略的域名也可能會(huì)讓人中招。
小推薦
下面是基本的、最低限度的網(wǎng)站基本標(biāo)簽:
<meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><!-- 以上 3 個(gè) meta 標(biāo)簽 *必須* 放在 head 的最前面;其他任何的 head 內(nèi)容必須在這些標(biāo)簽的 *后面* --><title>頁(yè)面標(biāo)題</title>
網(wǎng)頁(yè)元素
<!-- 文檔標(biāo)題 --><title>頁(yè)面標(biāo)題</title><!-- 基本 URL 作用于文檔中所包含的所有相對(duì) URL --><base ><!-- 外部的 CSS --><link rel="stylesheet" href="styles.css"><!-- 文檔內(nèi)的 CSS --><style> /* ... */</style><!-- JavaScript --><script src="script.js"></script> <noscript><!--無 JS 時(shí)的替代--></noscript>
Meta 標(biāo)簽
<!-- 設(shè)置文檔的字符編碼 --><meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><!-- 以上 3 個(gè) meta 標(biāo)簽 *必須* 放在 head 的最前面;其他任何的 head 內(nèi)容必須在這些標(biāo)簽的 *后面* --><!-- 允許控制資源的過度加載 --><meta http-equiv="Content-Security-Policy" content="default-src 'self'"><!-- 盡早地放置在文檔中 --><!-- 僅應(yīng)用于該標(biāo)簽下的內(nèi)容 --><!-- Web 應(yīng)用的名稱(僅當(dāng)網(wǎng)站被用作為一個(gè)應(yīng)用時(shí)才使用)--><meta name="application-name" content="應(yīng)用名稱"><!-- 針對(duì)頁(yè)面的簡(jiǎn)短描述(限制 150 字符)--><!-- 在*某些*情況下,該描述是被用作搜索結(jié)果展示片段的一部分 --><meta name="description" content="一個(gè)頁(yè)面描述"><!-- 控制搜索引擎的抓取和索引行為 --><meta name="robots" content="index,follow"><!-- 所有搜索引擎 --><meta name="googlebot" content="index,follow"><!-- 僅對(duì) Google 有效 --><!-- 告訴 Google 不顯示網(wǎng)站鏈接的搜索框 --><meta name="google" content="nositelinkssearchbox"><!-- 告訴 Google 不提供此頁(yè)面的翻譯 --><meta name="google" content="notranslate"><!-- 驗(yàn)證 Google 搜索控制臺(tái)的所有權(quán) --><meta name="google-site-verification" content="verification_token"><!-- 驗(yàn)證 Yandex 網(wǎng)站管理員的所有權(quán) --><meta name="yandex-verification" content="verification_token"><!-- 驗(yàn)證 Bing 網(wǎng)站管理員中心的所有權(quán) --><meta name="msvalidate.01" content="verification_token"><!-- 驗(yàn)證 Alexa 控制臺(tái)的所有權(quán) --><meta name="alexaVerifyID" content="verification_token"><!-- 驗(yàn)證 Pinterest 控制臺(tái)的所有權(quán) --><meta name="p:domain_verify" content="code from pinterest"><!-- 驗(yàn)證 Norton 安全站點(diǎn)的所有權(quán) --><meta name="norton-safeweb-site-verification" content="norton code"><!-- 用來命名軟件或用于構(gòu)建網(wǎng)頁(yè)(如 - WordPress、Dreamweaver)--><meta name="generator" content="program"><!-- 關(guān)于你的網(wǎng)站主題的簡(jiǎn)短描述 --><meta name="subject" content="你的網(wǎng)站主題"><!-- 基于網(wǎng)站內(nèi)容給出一般的年齡分級(jí) --><meta name="rating" content="General"><!-- 允許控制 referrer 信息如何傳遞 --><meta name="referrer" content="no-referrer"><!-- 禁用自動(dòng)檢測(cè)和格式化可能的電話號(hào)碼 --><meta name="format-detection" content="telephone=no"><!-- 通過設(shè)置為 “off” 完全退出 DNS 預(yù)取 --><meta http-equiv="x-dns-prefetch-control" content="off"><!-- 在客戶端存儲(chǔ) cookie,web 瀏覽器的客戶端識(shí)別 --><meta http-equiv="set-cookie" content="name=value; expires=date; path=url"><!-- 指定要顯示在一個(gè)特定框架中的頁(yè)面 --><meta http-equiv="Window-Target" content="_value"><!-- 地理標(biāo)簽 --><meta name="ICBM" content="latitude, longitude"> <meta name="geo.position" content="latitude;longitude"> <meta name="geo.region" content="country[-state]"><!-- 國(guó)家代碼 (ISO 3166-1): 強(qiáng)制性, 州代碼 (ISO 3166-2): 可選; 如 content="US" / content="US-NY" --><meta name="geo.placename" content="city/town"><!-- 如 content="New York City" -->
鏈接
<!-- 表明一個(gè) CSS 樣式表 --><link rel="stylesheet" ><!-- 有助于防止出現(xiàn)內(nèi)容重復(fù)的問題 --><link rel="canonical" ><!-- 之前用于包含 icon 鏈接,但已被廢棄并不再使用 --><link rel="shortlink" ><!-- 鏈接到當(dāng)前文檔的一個(gè) AMP HTML 版本 --><link rel="amphtml" ><!-- 鏈接到一個(gè)指定 Web 應(yīng)用程序“安裝”證書的 JSON 文件 --><link rel="manifest" href="manifest.json"><!-- 鏈接到文檔的作者 --><link rel="author" href="humans.txt"><!-- 指向一個(gè)適用于鏈接內(nèi)容的版權(quán)申明 --><link rel="license" href="copyright.html"><!-- 給出可能的你的另一種語(yǔ)言的文檔位置參考 --><link rel="alternate" hreflang="es"><!-- 提供了關(guān)于作者或其他人的信息 --><link rel="me" type="text/html"> <link rel="me" href="mailto:name@example.com"> <link rel="me" href="sms:+15035550125"><!-- 鏈接到一個(gè)描述歷史記錄、文檔或其他具有歷史意義的材料的集合的文檔。 --><link rel="archives" ><!-- 鏈接到層次結(jié)構(gòu)中的頂級(jí)資源 --><link rel="index" ><!-- 給出一個(gè)自我參考 - 當(dāng)文檔有多個(gè)可能的參考時(shí)非常有用 --><link rel="self" type="application/atom+xml" ><!-- 分別是在一系列文件中的第一個(gè)、下一個(gè)、上一個(gè)和最后一個(gè) --><link rel="first" > <link rel="next" > <link rel="prev" > <link rel="last" ><!-- 當(dāng)使用第三方服務(wù)來維護(hù) blog 時(shí)使用 --><link rel="EditURI" type="application/rsd+xml" title="RSD"><!-- 當(dāng)另一個(gè) WordPress 博客鏈接到你的 WordPress 博客或文章時(shí)形成一個(gè)自動(dòng)化的評(píng)論 --><link rel="pingback" ><!-- 當(dāng)你在自己的頁(yè)面上鏈接到一個(gè) url 時(shí)通知它 --><link rel="webmention" ><!-- 加載一個(gè)外部的 HTML 文件到當(dāng)前 HTML 文件中 --><link rel="import" href="/path/to/component.html"><!-- 打開搜索 --><link rel="search" href="/open-search.xml" type="application/opensearchdescription+xml" title="Search Title"><!-- Feeds --><link rel="alternate" type="application/rss+xml" title="RSS"> <link rel="alternate" type="application/atom+xml" title="Atom 0.3"><!-- 預(yù)取,預(yù)載,預(yù)瀏覽 --><link rel="dns-prefetch" > <link rel="preconnect" > <link rel="prefetch" > <link rel="prerender" > <link rel="preload" href="image.png" as="image"><!-- 更多信息:https://css-tricks.com/prefetching-preloading-prebrowsing/ -->
網(wǎng)站圖標(biāo)
<!-- 針對(duì) IE 10 及以下版本 --><!-- 如果將 `favicon.ico` 放在根目錄下,則無需標(biāo)簽 --><!-- 對(duì)于 IE 11、Chrome、Firefox、Safari 和 Opera --><link rel="icon" type="image/png" sizes="16x16" href="/path/to/favicon-16x16.png"> <link rel="icon" type="image/png" sizes="32x32" href="/path/to/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="/path/to/favicon-96x96.png"><!-- 更多信息: https://bitsofco.de/all-about-favicons-and-touch-icons/ -->
社交
Facebook Open Graph
<meta property="fb:app_id" content="123456789"> <meta property="og:url" content="https://example.com/page.html"> <meta property="og:type" content="website"> <meta property="og:title" content="Content Title"> <meta property="og:image" content="https://example.com/image.jpg"> <meta property="og:description" content="Description Here"> <meta property="og:site_name" content="Site Name"> <meta property="og:locale" content="en_US"> <meta property="article:author" content="">
Facebook Instant Articles
<meta charset="utf-8"> <meta property="op:markup_version" content="v1.0"><!-- 你的文章的 Web 版網(wǎng)址 --><link rel="canonical" ><!-- 用于該文章的樣式 --><meta property="fb:article_style" content="myarticlestyle">
Twitter Cards
<meta name="twitter:card" content="summary"> <meta name="twitter:site" content="@site_account"> <meta name="twitter:creator" content="@individual_account"> <meta name="twitter:url" content="https://example.com/page.html"> <meta name="twitter:title" content="Content Title"> <meta name="twitter:description" content="Content description less than 200 characters"> <meta name="twitter:image" content="https://example.com/image.jpg">
Google+ / Schema.org
<link rel="publisher"> <meta itemprop="name" content="內(nèi)容標(biāo)題"> <meta itemprop="description" content="內(nèi)容描述少于 200 個(gè)字符"> <meta itemprop="image" content="https://example.com/image.jpg">
根據(jù)他們的幫助中心可知,Pinterest 允許你禁止他人保存你網(wǎng)站里的內(nèi)容。description
為可選。
<meta name="pinterest" content="nopin" description="Sorry, you can't save from my website!">
OEmbed
<link rel="alternate" type="application/json+oembed" title="oEmbed Profile: JSON"> <link rel="alternate" type="text/xml+oembed" title="oEmbed Profile: XML">
瀏覽器 / 平臺(tái)
Apple iOS
<!-- 智能應(yīng)用 Banner --><meta name="apple-itunes-app" content="app-id=APP_ID,affiliate-data=AFFILIATE_ID,app-argument=SOME_TEXT"><!-- 禁用自動(dòng)檢測(cè)和格式化可能的電話號(hào)碼 --><meta name="format-detection" content="telephone=no"><!-- 添加到主屏幕 --><meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-title" content="應(yīng)用標(biāo)題"><!-- 觸摸圖標(biāo) --><!-- 在大多數(shù)情況下,在 `<head>` 中,一個(gè) 180×180px 觸摸圖標(biāo)就已經(jīng)足夠了 --><link rel="apple-touch-icon" href="/path/to/apple-touch-icon.png"><!-- 注意:iOS 7 上的 Safari 不會(huì)對(duì)圖標(biāo)產(chǎn)生效果。 --><!-- 較早版本的 Safari 不會(huì)對(duì)以 `-precomposed.png` 后綴命名的圖標(biāo)文件產(chǎn)生效果。 --><!-- 啟動(dòng)畫面(已無效) --><link rel="apple-touch-startup-image" href="path/to/startup.png"><!-- iOS 應(yīng)用深層鏈接 --><meta name="apple-itunes-app" content="app-id=APP-ID, app-argument=http/url-sample.com"> <link rel="alternate" href="ios-app://APP-ID/http/url-sample.com">
Apple Safari
<!-- 固定網(wǎng)站 --><link rel="mask-icon" href="path/to/icon.svg" color="red">
Google Android
<meta name="theme-color" content="#E64545"><!-- 添加到主屏幕 --><meta name="mobile-web-app-capable" content="yes"><!-- 更多信息:https://developer.chrome.com/multidevice/android/installtohomescreen -->
Google Chrome
<link rel="chrome-webstore-item" ><!-- 禁用翻譯提示 --><meta name="google" content="notranslate">
Google Chrome Mobile (只針對(duì) Android)
從 Chrome 31 開始,你可以設(shè)置你的 Web 應(yīng)用為“app mode”,如 Safari。
<!-- 鏈接到一個(gè) manifest 并定義 manifest 的元數(shù)據(jù)。--><!-- manifest.json 中的例子也可以通過以下鏈接找到。--><link rel="manifest" href="manifest.json"><!-- 定義你的網(wǎng)頁(yè)為 Web 應(yīng)用 --><meta name="mobile-web-app-capable" content="yes"><!-- 主屏幕圖標(biāo) --><link rel="icon" sizes="192x192" href="highres-icon.png">
Microsoft Internet Explorer
<meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="skype_toolbar" content="skype_toolbar_parser_compatible"><!-- IE10: 禁用鏈接點(diǎn)擊高亮 (https://blogs.windows.com/buildingapps/2012/11/15/adapting-your-webkit-optimized-site-for-internet-explorer-10/) --><meta name="msapplication-tap-highlight" content="no"><!-- 固定網(wǎng)站 (https://msdn.microsoft.com/en-us/library/dn255024(v=vs.85).aspx) --><meta name="application-name" content="Sample Title"> <meta name="msapplication-tooltip" content="A description of what this site does."> <meta name="msapplication-starturl" content="http://example.com/index.html?pinned=true"> <meta name="msapplication-navbutton-color" content="#FF3300"> <meta name="msapplication-window" content="width=800;height=600"> <meta name="msapplication-task" content="name=Task 1;action-uri=http://host/Page1.html;icon-uri=http://host/icon1.ico"> <meta name="msapplication-task" content="name=Task 2;action-uri=http://microsoft.com/Page2.html;icon-uri=http://host/icon2.ico"> <meta name="msapplication-badge" value="frequency=NUMBER_IN_MINUTES;polling-uri=http://example.com/path/to/file.xml"> <meta name="msapplication-TileColor" content="#FF3300"> <meta name="msapplication-TileImage" content="path/to/tileimage.jpg"> <meta name="msapplication-config" content="http://example.com/browserconfig.xml"> <meta name="msapplication-notification" content="frequency=60;polling-uri=http://example.com/livetile;polling-uri2=http://example.com/livetile2"> <meta name="msapplication-task-separator" content="1">
應(yīng)用鏈接
<!-- iOS --><meta property="al:ios:url" content="applinks://docs"> <meta property="al:ios:app_store_id" content="12345"> <meta property="al:ios:app_name" content="App Links"><!-- Android --><meta property="al:android:url" content="applinks://docs"> <meta property="al:android:app_name" content="App Links"> <meta property="al:android:package" content="org.applinks"><!-- Web 回退 --><meta property="al:web:url" content="http://applinks.org/documentation"><!-- 更多信息:http://applinks.org/documentation/ -->
國(guó)內(nèi)的瀏覽器
360 瀏覽器
<!-- 選擇渲染引擎 --><meta name="renderer" content="webkit|ie-comp|ie-stand">
QQ 移動(dòng)瀏覽器
<!-- 在指定方向上鎖定屏幕(鎖定橫/豎屏) --><meta name="x5-orientation" content="landscape/portrait"><!-- 全屏顯示此頁(yè)面 --><meta name="x5-fullscreen" content="true"><!-- 頁(yè)面將以“應(yīng)用模式”顯示(全屏等)--><meta name="x5-page-mode" content="app">
UC 移動(dòng)瀏覽器
<!-- 在指定方向上鎖定屏幕(鎖定橫/豎屏) --><meta name="screen-orientation" content="landscape/portrait"><!-- 全屏顯示此頁(yè)面 --><meta name="full-screen" content="yes"><!-- 即使在“文本模式”下,UC 瀏覽器也會(huì)顯示圖片 --><meta name="imagemode" content="force"><!-- 頁(yè)面將以“應(yīng)用模式”顯示(全屏、禁止手勢(shì)等) --><meta name="browsermode" content="application"><!-- 在此頁(yè)面禁用 UC 瀏覽器的“夜間模式” --><meta name="nightmode" content="disable"><!-- 簡(jiǎn)化頁(yè)面,減少數(shù)據(jù)傳輸 --><meta name="layoutmode" content="fitscreen"><!-- 禁用的 UC 瀏覽器的功能,“當(dāng)此頁(yè)面中有較多文本時(shí)縮放字體” --><meta name="wap-font-scale" content="no">
注意
性能
當(dāng)啟用 GZIP 時(shí),移動(dòng) href
屬性到該元素的開頭以提高壓縮,因?yàn)?href
屬性被用于 a
、base
和 link
標(biāo)簽。
示例:
<link rel="stylesheet">
*請(qǐng)認(rèn)真填寫需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。