TML 5 是最新的超文本標記語言 (HTML),它是用于描述網頁內容和外觀的標準編程語言。如今,所有主要瀏覽器(Chrome、Safari、Firefox、Opera 和 IE)都提供 HTML5 支持,這使其成為當今使用的最新 HTML 技術。
下面列出了 HTML5 的一些驚人優勢:
1. 跨瀏覽器兼容性
HTML5 易于實現,并且可以與 CSS3 一起使用。今天所有的瀏覽器都支持 HTML5 標簽,甚至 IE6 也能理解標記 <!doctype html> 并且會正確地呈現頁面。
2. 新的 DOCTYPE 聲明:
關于 HTML 5 最重要的事實是 - HTML5 易于實現并且可以與 CSS3 一起使用
HTML5 的 DOCTYPE 聲明非常簡單:
<! DOCTYPE html>
是的,只有“DOCTYPE”和“html”這兩個詞,不再有長行充滿臟標簽的不可讀代碼。
3. 帶來可用性和用戶體驗的改進
可用性和用戶體驗與網站或應用程序的設計程度有關。我們都想要更好的動態網站和美觀的應用程序與用戶交互并允許用戶享受功能、內容等,而不僅僅是看它。HTML5 對 Web 具有多項技術增強和改進功能,并且使用 HTML5 代碼,Web 開發人員可以輕松設計更好的應用程序和動態網站,從而帶來更好的用戶體驗和可用性。
4. 替代 Flash 和 Silver light
HTML5超越Flash和Silver light而領先只是因為播放Flash文件和Silver light需要安裝Adobe Flash最新版本或Silver light插件,還需要注意設備和操作系統的兼容性. HTML 5 并非如此。因此,HTML5 如今在公司中變得越來越流行,因為它提供了大量的屬性和功能,可幫助 Web 開發人員以最少的工作量構建漂亮的網站和應用程序。
5. 大量用于移動應用和游戲
HTML5 在移動應用程序和游戲開發中的適應性隨著 HTML5 Web 應用程序工具在從用戶界面 (UI)、開發、使用腳本等開始的所有情況下為 Web 開發人員提供了更大的靈活性而增加。
HTML5 還能夠處理多媒體內容,而無需安裝插件,我們可以使用該技術輕松開發交互式游戲。
6. 干凈的標記和改進的代碼
HTML5 帶有簡潔的標記和簡潔的代碼,使其比以前的版本更易于訪問。HTML 5 允許 Web 開發人員和 Web 設計人員使用更簡潔的代碼并刪除 div 標簽并將所有 div 標簽替換為新的 HTML 5 元素。
7. 離線瀏覽
HTML5 還提供離線瀏覽功能,這意味著訪問者可以在沒有有效互聯網連接的情況下加載網頁上的某些元素。假設你訪問了該站點,但不知何故你現在沒有連接到互聯網,或者互聯網連接發生故障。使用 HTML5 離線緩存,我們仍然可以加載網站的核心元素,你可以離線查看它們。
8. HTML5 在網站抓取和索引方面對 SEO 友好:
如今,為了在包括谷歌在內的不同搜索引擎中獲得并保持最高排名,必須小心優化網站和所有必要的 SEO 模塊。HTML 5 帶有各種屬性和模塊,使網絡爬蟲可以輕松搜索你的內容并使其正確編入索引,從而提高其在搜索引擎搜索結果頁面中的排名。HTML5 的技術提供了具有廣泛結構元素、語義、表單類型、新屬性和媒體元素的各種功能,使數字營銷專家和開發人員更容易專注于更好的搜索引擎優化技術并推動更多的自然搜索流量。
9. 視頻和音頻支持
借助 HTML5 技術,我們不再需要依賴第三方插件來渲染音頻和視頻。你可以忘記 Flash Player 和其他第三方媒體播放器和插件。你可以使用新的 HTML5 <video> 和 <audio> 標簽輕松訪問你的視頻和音頻。
以前你必須使用舊的 <embed> 和 <object> 標簽并分配大量參數,以顯示視頻可見并正常工作。但是使用 HTML5 的視頻和音頻標簽,我們可以將它們視為圖像; <video src=”url”/>。
我們只需要像任何其他 HTML 元素一樣在單行標簽中定義高度、寬度和自動播放等參數:<video src=”url” width=”800px” height=”500px”autoplay/>。
10. 地理位置支持
在地理定位的幫助下,我們可以輕松地找出我們在世界上的位置,并輕松地與人們分享這些信息。過去,如果我們想首先檢測客戶端設備的位置,我們必須查看客戶端 IP 地址、你的無線網絡連接、手機的基站和緯度和經度。但是對于 HTML5,已經開發了一組 API,它們可以有效地允許客戶端設備(即你的手機、IP 甚至你的桌面瀏覽器)使用你的 HTML5 兼容瀏覽器直接可用的 JavaScript 檢索地理定位信息。
HTML5 改進并增強了瀏覽體驗。那么為什么不為你的網站和移動應用程序采用 HTML 5 呢?
了解更多
端在使用DIV+CSS布局時,通常需要通過為div命名的方式,來區分網頁中不同的模塊。在HTML5中布局方式有了新的變化,HTML5中增加了新的結構標簽,如header標簽、nav標簽、article標簽等,具體介紹如下。
1. header標簽
HTML5中的header標簽是一種具有引導和導航作用的結構標簽,該標簽可以包含所有通常放在頁面頭部的內容。header標簽通常用來放置整個頁面或頁面內的一個內容區塊的標題,也可以包含網站Logo圖片、搜索表單或者其他相關內容。其基本語法格式如下:
<header>
<h1>網頁主題</h1>
...</header>
在上面的語法格式中,<header></header>的使用方法和<div class="header"></div>類似。
注意:
在HTML網頁中,并不限制header標簽的個數,一個網頁中可以使用多個header標簽,也可以為每一個內容塊添加header標簽。
2. nav標簽
nav標簽用于定義導航鏈接,是HTML5新增的標簽,該標簽可以將具有導航性質的鏈接歸納在一個區域中,使頁面元素的語義更加明確。nav標簽的使用方法和普通標簽類似,例如下面這段示例代碼:
<nav>
<ul>
<li><a href="#">首頁</li>
<li><a href="#">公司概況</li>
<li><a href="#">產品展示</li>
<li><a href="#">聯系我們</li>
</ul></nav>
在上面這段代碼中,通過在nav標簽內部嵌套無序列表ul來搭建導航結構。通常一個HTML頁面中可以包含多個nav標簽,作為頁面整體或不同部分的導航。具體來說,nav標簽可以用于以下幾種場合。
● 傳統導航條:目前主流網站上都有不同層級的導航條,其作用是跳轉到網站的其他主頁面。
● 側邊欄導航:目前主流博客網站及電商網站都有側邊欄導航,目的是將當前文章或當前商品頁面跳轉到其他文章或其他商品頁面。
● 頁內導航:它的作用是在本頁面幾個主要的組成部分之間進行跳轉。
● 翻頁操作:翻頁操作切換的是網頁的內容部分,可以通過點擊“上一頁”或“下一頁”切換,也可以通過點擊實際的頁數跳轉到某一頁。
除了以上幾點以外,nav標簽也可以用于其他導航鏈接組中。需要注意的是,并不是所有的鏈接組都要被放進nav標簽,只需要將主要的和基本的鏈接放進nav標簽即可。
3. footer標簽
footer標簽用于定義一個頁面或者區域的底部,它可以包含所有放在頁面底部的內容。在HTML5出現之前,一般使用<div class="footer"></div>標簽來定義頁面底部,而現在通過HTML5的footer標簽可以輕松實現。與header標簽相同,一個頁面中可以包含多個footer標簽。
4. article標簽
article標簽代表文檔、頁面或者應用程序中與上下文不相關的獨立部分,該元素經常被用于定義一篇日志、一條新聞或用戶評論等。一個article標簽通常有它自己的標題(可以放在header標簽中)和腳注(可以放在footer標簽中),例如下面的示例代碼。
<article>
<header>
<h1>秋天的味道</h1>
<p>你想不想知道秋天的味道?它是甜、是苦、是澀...</p>
</header>
<footer>
<p>著作權歸XXXXXX公司所有...</p>
</footer></article>
需要注意的,在上面的示例代碼中還缺少主體內容。主體內容通常會寫在header和footer之間,通過多個section標簽進行劃分。一個頁面中可以出現多個article標簽,并且article標簽可以嵌套使用。
5. section標簽
section標簽表示一段專題性的內容,一般會帶有標題,主要應用在文章的章節中。例如,新聞的詳情頁有一篇文章,該文章有自己的標題和內容,因此可以使用article標簽標注,如果該新聞內容太長,分好多段落,每段都有自己的小標題,這時候就可以使用section標簽把段落標注起來。在使用section標簽時,需要注意以下幾點:
● section不僅僅是一個普通的容器標簽。當一個標簽只是為了樣式化或者方便腳本使用時,應該使用div標簽。
如果article標簽、aside標簽或nav標簽更符合使用條件,那么不要使用section標簽。
● 沒有標題的內容模塊不要使用section標簽定義。
值得一提的是,在HTML5中,article標簽可以看作是一種特殊的section標簽,它比section標簽更具有獨立性,即section標簽強調分段或分塊,而article標簽強調獨立性。如果一塊內容相對來說比較獨立、完整時,應該使用article標簽;但是如果想要將一塊內容分成多段時,應該使用section標簽。
6. aside標簽
aside標簽用來定義當前頁面或者文章的附屬信息部分,它可以包含與當前頁面或主要內容相關的引用、側邊欄、廣告、導航條等有別于主要內容的部分。aside標簽的用法主要分為兩種:
● 被包含在article標簽內作為主要內容的附屬信息。
● 在article標簽之外使用,作為頁面或網站的附屬信息部分。最常用的的使用形式是側邊欄。
| 本刊見習記者 趙姝焱
編輯 | 崔婧
當一種新的顛覆式技術出現,是投靠大平臺還是堅持走獨立的道路?
HTML5(下稱H5)火了。在多數人還沒完全弄清楚什么是H5時,它已悄無聲息地潛入移動端,并漸呈燎原之勢火速席卷微信朋友圈。
以前,H5頁面在朋友圈的分享還是一些公眾號的文章,但很快,企業就嗅到了商機。他們發現把會議邀請、活動策劃等商業信息制作成有趣的H5頁面,或者是制作一個H5小游戲,通過用戶分享后傳播效率更高。
當然,作為一項新興技術,H5絕不僅僅是卡片式營銷或小游戲而已,它將催生新的應用生態圈。這直接吸引了互聯網巨頭的不斷靠攏,百度直達號、騰訊QQX5內核、搜狐快
站……他們都試圖把H5作為開山之斧,重尋往昔霸主輝煌。
最積極的還是創業公司,在互聯網革命風云變幻之際,它們正在謀求崛起。
在北京老城區的胡同里,一家創業公司在經歷了PC互聯網轉型陣痛后,正努力探尋移動時代H5創業方向的另一種可能。
流量入口:移動時代瀏覽器沒戲
這家名為“火速網絡科技”的公司,目前專注于打造H5內容分發平臺。創始人趙九州說,這已是他們的第三次創業了。
此前,趙九州團隊一直做瀏覽器。2011年,從知名開源論壇軟件Discuz!的公司出來后,他們做了“財貓瀏覽器”,以提供網購返利為主要功能。用戶通過該瀏覽器從淘寶、京東等大型電商網站購物可獲5%~50%的高額現金返利。
兩年后,他覺察到PC瀏覽器在移動時代沒什么想象空間,再加上360瀏覽器和淘寶的封殺屏蔽,于是決定轉型做移動端火速瀏覽器。不過做了一段時間后,趙九州發現自己遇到了很嚴重的瓶頸。
他解釋說,PC時代,流量是一切,瀏覽器是入口型的應用,處于搜索引擎上游。然而到了移動時代,瀏覽器功能弱化,只能解決搜索的長尾需求。此前用戶對瀏覽器的大量需求,比如看新聞和視頻,已經被相應的App替代。
“連百度和360都會出單獨的搜索App,如果做得足夠好,理論上完全可以實現移動端瀏覽器的所有功能。”趙九州斷言,“微博和微信加入搜索功能后,也使大量用戶不再單純
依靠瀏覽器來獲取信息。”
另一方面,趙九州覺得瀏覽器產品本身也出了問題,同質化已經達到前所未有的地步。省流量、速度快,這些方面誰都不存在絕對優勢;比安全、比炫酷,競爭已經脫離了產品和技術本身。“UC、搜狗、360、百度、QQ、獵豹……這么多瀏覽器,差別到底在哪兒呢?其實它們靠營銷、渠道,甚至砸錢來競爭。”
換言之,他們原來做產品的思路“不好使”了。 趙九州相信移動端肯定有個超級流量入口,只不過未必是瀏覽器的形態。他決定回到做瀏覽器的初心—做流量入口。
用戶痛點:滿足需求才是核心
趙九州發現,大量信息和服務類應用出現重復、泛濫和擱置的現象,用戶的低頻次、長尾需求并沒有得到充分滿足。他相信在智能手機人口紅利消退的情況下,解決單一領域低頻需求的產品會逐漸消亡,未來將是平臺化的互聯網狀態。
2014年,他暫停了已經開發好的移動端火速瀏覽器,試圖找出新的承載未來手機超級流量入口的產品形態。為此,趙九州團隊開始深入研究移動端用戶的行為習慣,最終基于H5技術開發出火速輕應用,專注于HTML5內容、Webapp與H5 game的聚合分發,并提出三個產品理念:產品去本地化、內容去中心化、場景去搜索化。
第一,產品去本地化。“用戶手機里安裝的上百個App,一天能用到的平均不超過20個,常用的更是沒幾個。”趙九州說,“用戶對于智能手機的使用已達到成熟期。”因此,火速輕應用把低頻、長尾需求的服務類App以Web形式存在云端,應用時點擊手機桌面快捷方式即可,這樣可以減少占據空間和資源。
第二,內容去中心化。在移動互聯網時代,人們不再關注信息來自哪里,而是更多關注消息和節目本身。火速輕應用不再去分發一個個站點的入口,而只推送最終內容給用戶。對于版權問題,趙九州表示,由于給用戶推薦的內容直接指向內容源,所以與合作方之間沒有版權糾紛。“我們扮演快遞的角色,類似PC時代的好123,把用戶指引到合適的地方。”
第三,場景去搜索化。搜索與發現是兩種獲取信息的機制。移動時代,更貼合用戶需求的做法是讓他們無明確目的地發現內容。火速輕應用沒有設置搜索框,趙九州解釋,這是因為他發現用戶在移動端不喜歡打字,只喜歡“點”。他希望將“點擊”做到極致。
基于以上理念,火速輕應用希望在移動時代顛覆瀏覽器,以更好的形態滿足用戶需求。
火速輕應用對H5的思考得到了資本認可。2015年1月21日,火速輕應用宣布獲得創新工場千萬級人民幣的A輪融資。創新工場投資總監姜證飛認為:“作為一項新興技術,目前H5的發展還比較受局限,應以用戶需求為切入點做產品,根據其本身特性順勢而為。”
運營之道:從培養用戶習慣做起
2014年7月,“圍住神經貓”游戲三天獲訪一億次的神話令國內H5行業看到了希望。2015年1月,微信開放JS-SDK接口,對H5發展起到了推波助瀾的作用。此后,H5被視作新的機遇,創業者紛紛投身其中。
在前不久剛結束的第十屆全球移動游戲大會H5分論壇上,渠道、發行、CP齊聚一堂,熱烈討論H5游戲的未來。圓桌論壇環節,大家意見一致:H5游戲大有可為,只期待下一
個爆款。
就在同行們大呼“形勢一片大好”之時,趙九州卻有不一樣的思考。在他看來,H5不是一個技術驅動型產業,內容和運營的驅動才是正確方向,“用戶習慣從App切換到H5需要時間”。為此,火速輕應用開發出“蜻蜓”和“云游”兩款產品,希望借此培養用戶習慣。
“蜻蜓”是一款免費的H5開發工具,可讓開發者在5分鐘內搭建一個輕應用。火速輕應用希望通過這種零成本接觸H5的形式,讓更多用戶參與其中。
“云游”也是火速輕應用培養用戶習慣的一項工具。它為眾多App提供H5內容的合作頻道,無須下載火速輕應用客戶端即可在其他App里直接體驗H5內容。“我們做一個內容源,讓用戶更簡單地接觸H5。”趙九州說。
創業危機:夾縫中突圍
趙九州認為,H5會像LBS、SNS一樣,成為互聯網的基礎建設。火速輕應用正在做的就是一步步夯實這項基礎建設、影響用戶,希望有朝一日改變移動互聯網格局。
然而,在巨頭云集的互聯網生態下,創業公司的種種努力依然舉步維艱。互聯網巨頭紛紛打造超級App,試圖保住PC時代的霸主地位。
以微信為例,這個目前國內用戶量最大的超級App,作為孕育H5萌芽的肥沃土壤,也在一步步扼殺H5創業公司的發展空間。2014年9月前后,開發者們發現,微信開始主動限制H5應用在朋友圈中傳播。“標準目前還比較模糊,我們的經驗是IP訪問數量達到十幾萬左右,就會被限制傳播,微信公眾賬號的用戶也不被允許導流至各自客戶端。”
“圍住神經貓”神話再難復制,H5開發者有如困獸,在夾縫中尋找突圍之路。趙九州堅信,任何一個產品的商業模式都必須是獨立的。“依附于大平臺,你成長的天花板完全取決于別人。如果別人有戰略變動,你就會非常受影響。事實告訴我們,只能突圍出去。”
目前,火速輕應用正從最初在微信規則下傳遞影響力、獲取用戶,逐步轉變成與微信建立合作關系,同時快速在微信之外的渠道發展自身競爭力。此外,他們也在嘗試與硬件廠商合作,甚至有計劃開發第三方ROM。
“巨頭們現在還不敢對H5做太深入的嘗試,因為他們不知道能不能成功。這對于創業公司來講,是個絕佳的空窗期。我們要盡力在巨頭進入之前,做出自己的競爭力和壁壘。”趙九州苦笑著說,“創業公司必須學會干臟活、累活,這是困境,也是機遇。”
版權所有:本文作者趙姝焱,編輯崔婧,文章為原創,本刊版權所有,如需轉載請與zzyyanan聯系,未經授權,轉載必究。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。