2014-12-24 分類: 搜索引擎優(yōu)化
引進(jìn)進(jìn)步的網(wǎng)絡(luò)應(yīng)用程序:他們可能意味著你的網(wǎng)站和搜索引擎優(yōu)化
進(jìn)步的Web應(yīng)用程序是下一個(gè)大的東西,當(dāng)它涉及到提供一個(gè)爆炸性的移動(dòng)體驗(yàn)。但是究竟是什么使一個(gè)PWA?你應(yīng)該有一個(gè)嗎?如果你創(chuàng)造了一個(gè),你會(huì)如何確定它的排名?
他們可以不必要的應(yīng)用程序開發(fā)。你的移動(dòng)網(wǎng)站成為你的應(yīng)用。我的一些同事在builtvisible來(lái)說(shuō),這似乎有點(diǎn)有趣的討論:做品牌需要一個(gè)應(yīng)用程序和網(wǎng)站,或一個(gè)PWA?
充實(shí)了這一點(diǎn),這意味著我們希望像推送通知,后臺(tái)同步,網(wǎng)站/應(yīng)用程序脫機(jī)工作,有覺得自己像一個(gè)本地應(yīng)用一定看/設(shè)計(jì),能夠?qū)υO(shè)備進(jìn)行設(shè)置主屏幕。
這些都是我們傳統(tǒng)上沒有在網(wǎng)絡(luò)上提供給我們的東西。但由于新的瀏覽器支持更多的HTML5規(guī)范和先進(jìn)的JavaScript,我們可以開始創(chuàng)建一些這樣的功能。在整體上,進(jìn)步的網(wǎng)絡(luò)應(yīng)用程序是:
進(jìn)步為每一個(gè)用戶工作,無(wú)論瀏覽器的選擇,因?yàn)樗麄兪墙⒁詽u進(jìn)式增強(qiáng)為核心的宗旨。
反應(yīng)敏捷的
適合任何形式的因素:桌面,移動(dòng),平板電腦,或什么是下一步。
連接獨(dú)立
加強(qiáng)與服務(wù)工人的工作離線或低質(zhì)量的網(wǎng)絡(luò)。
像APP
感覺像一個(gè)應(yīng)用程序到用戶與應(yīng)用程序風(fēng)格的相互作用和導(dǎo)航,因?yàn)樗麄兪墙⒃趹?yīng)用程序外殼模型。
新鮮的
總是最新的感謝服務(wù)工人的更新過(guò)程。
保險(xiǎn)柜
服務(wù)通過(guò)HTTPS來(lái)防止窺探,確保內(nèi)容沒有被篡改。
發(fā)現(xiàn)
被識(shí)別為“應(yīng)用程序”由于W3C的體現(xiàn)和服務(wù)人員登記范圍,讓搜索引擎找到他們。
重新接合
通過(guò)像推通知這樣的功能重新進(jìn)行重新接觸。
安裝
讓用戶“保持”的應(yīng)用程序,他們發(fā)現(xiàn)最有用的在他們的主頁(yè)屏幕上沒有麻煩的一個(gè)應(yīng)用程序商店。
鏈接
通過(guò)網(wǎng)址輕松共享,不需要復(fù)雜的安裝。
來(lái)源:你的第一個(gè)進(jìn)步的網(wǎng)絡(luò)應(yīng)用程序(谷歌)
值得我們花點(diǎn)時(shí)間來(lái)打開“應(yīng)用程序”的一部分。從根本上說(shuō),有一個(gè)PWA兩部分:服務(wù)人員(我們會(huì)在一分鐘內(nèi)),和應(yīng)用程序體系結(jié)構(gòu)。谷歌將此定義為:
…最小的HTML,CSS和JavaScript驅(qū)動(dòng)的用戶界面。應(yīng)用程序外殼應(yīng):
負(fù)荷快速
被緩存
動(dòng)態(tài)顯示內(nèi)容
一個(gè)應(yīng)用程序外殼是可靠的良好性能的秘密。想想你的應(yīng)用程序的外殼像捆綁的代碼,你會(huì)發(fā)布到一個(gè)應(yīng)用程序存儲(chǔ),如果你正在建立一個(gè)本地應(yīng)用程序。它的負(fù)載需要離開地面,但可能不是整個(gè)故事。它保持您的用戶界面本地和通過(guò)一個(gè)接口動(dòng)態(tài)地拉動(dòng)內(nèi)容。
即時(shí)加載Web應(yīng)用程序的應(yīng)用程序外殼架構(gòu)
加載內(nèi)容的這種方法允許令人難以置信的快速感知的速度。我們能夠得到的東西,看起來(lái)像我們的網(wǎng)站在用戶面前幾乎瞬間,只是沒有任何內(nèi)容。然后該頁(yè)面將去獲取內(nèi)容和所有的好。顯然,如果我們真的在現(xiàn)實(shí)世界中這樣做的事情,我們會(huì)很快地運(yùn)行到搜索引擎優(yōu)化問題,但我們也會(huì)解決這一問題。
如果當(dāng)時(shí),在他們的核心,一個(gè)漸進(jìn)的網(wǎng)絡(luò)應(yīng)用程序只是一個(gè)在一個(gè)聰明的方式為加載的東西額外的功能,為什么我們要一個(gè)網(wǎng)站?
使用案例
讓我在我進(jìn)入這是明確的:對(duì)于大多數(shù)人來(lái)說(shuō),一個(gè)PWA是你不需要的東西。這是很重要的,它不停的重復(fù),所以我再重復(fù)一遍:
你可能不需要一個(gè)PWA。
這的原因是,大多數(shù)網(wǎng)站不需要能夠表現(xiàn)得像一個(gè)應(yīng)用程序。這并不是說(shuō)沒有好處,PWA功能所能帶來(lái)的東西,但在不少地方,效益不大于它需要實(shí)現(xiàn)的功能在此刻的時(shí)間。
當(dāng)你看著一個(gè)PWA的呢?好吧,讓我們看看一個(gè)清單的東西,可能表明你確實(shí)需要一個(gè)…
標(biāo)志一個(gè)PWA可能是適當(dāng)?shù)?/p>
你有:
定期更新的內(nèi)容,如股票行情,迅速變化的價(jià)格和庫(kù)存水平,或其他實(shí)時(shí)數(shù)據(jù)
一個(gè)聊天或通訊平臺(tái),實(shí)時(shí)的更新和推送通知的新項(xiàng)目來(lái)
一個(gè)觀眾可能會(huì)拉數(shù)據(jù),然后離線瀏覽,比如一個(gè)新聞應(yīng)用程序或一個(gè)博客每天發(fā)布許多文章
一個(gè)定期更新的內(nèi)容的網(wǎng)站,用戶可以檢查在一天幾次
大多是使用支持的瀏覽器的用戶
總之,你有東西超出了一個(gè)正常的網(wǎng)站,與互動(dòng)或時(shí)間敏感的組件,或迅速發(fā)布或更新的內(nèi)容。一個(gè)很好的例子就是谷歌天氣PWA:
他們是如何工作的
所以,你有一些東西會(huì)從這種功能中受益,但需要知道這些事情是如何工作的。歡迎來(lái)到奇跡是服務(wù)工人。
服務(wù)人員可以被認(rèn)為是一個(gè)代理,坐在你的網(wǎng)站和瀏覽器之間。它要求截取你要瀏覽器來(lái)做的事情,并劫持返回的回應(yīng)。這意味著我們可以做的事情,例如,保持一個(gè)請(qǐng)求的數(shù)據(jù)副本,所以當(dāng)它的要求再次,我們可以直接服務(wù)于它(這被稱為緩存)。這意味著我們可以獲取數(shù)據(jù)一次,然后重播它一千次,而不必再去獲取它。它像一個(gè)音樂家,錄制一張專輯-這意味著他們不必每次你想聽他們的音樂播放一場(chǎng)音樂會(huì)。同樣的事情,但與網(wǎng)絡(luò)數(shù)據(jù)。
如果你想讓服務(wù)人員更深入的解釋,看看Jake Archibald從谷歌給出適度的技術(shù)討論。
服務(wù)人員可以做什么
服務(wù)人員從根本上存在提供額外的功能,這是沒有提供給瀏覽器,直到現(xiàn)在。這些包括類似的東西:
推通知,用于告訴用戶發(fā)生了什么事情,如收到一個(gè)新消息,或者他們正在查看的頁(yè)面已被更新
背景同步,用于更新數(shù)據(jù),而用戶不使用該頁(yè)面/站點(diǎn)
離線緩存,允許一個(gè)用戶在離線狀態(tài)下仍然可以訪問某個(gè)站點(diǎn)的一些功能的經(jīng)驗(yàn)
處理地理位置或其他硬件設(shè)備的查詢數(shù)據(jù)(如設(shè)備gyrpscope數(shù)據(jù))
預(yù)取數(shù)據(jù)一個(gè)用戶將很快需要,如圖像進(jìn)一步下一頁(yè)
它的計(jì)劃,在未來(lái),他們將能夠做的比他們目前所能做的更多。然而,現(xiàn)在,這些是各種功能,你將能夠利用。顯然,這些大多是通過(guò)Ajax加載數(shù)據(jù),一旦應(yīng)用程序已經(jīng)加載。
什么是搜索引擎優(yōu)化的影響?
所以你在網(wǎng)上銷售的應(yīng)用程序。但如果你創(chuàng)造了一個(gè),你會(huì)如何確定它的排名?和任何新的前端技術(shù)一樣,總是會(huì)影響你的搜索引擎的知名度。但不要驚慌;你會(huì)與一個(gè)PWA遇到潛在的問題得到解決之前曾對(duì)JavaScript網(wǎng)站SEO。一個(gè)引物,以本文對(duì)JS SEO一看。
有幾個(gè)問題,你可能會(huì)遇到,如果你要有一個(gè)網(wǎng)站,使使用應(yīng)用程序的外殼架構(gòu)。首先,這是非常必要的,你要使用某種形式的js框架或視角下的圖書館,像角或反應(yīng)。如果是這樣的話,你會(huì)想看一看一些angular.js或反應(yīng)SEO建議。如果你使用的是其他的東西,短版本是你需要在服務(wù)器上的預(yù)渲染網(wǎng)頁(yè),然后拿起你的應(yīng)用程序時(shí),它的加載。這使你有所有的好東西,這些工具給你,同時(shí)也為谷歌等服務(wù)的東西可以理解。盡管他們最近的建議,他們?cè)阡秩具@種應(yīng)用越來(lái)越好,我們?nèi)匀豢梢钥吹胶芏嗟睦?,在野外它們揮舞著可怕的當(dāng)他們爬重JS的東西。
假設(shè)你在聰明的JS前端技術(shù)的世界,讓你做事情的PWA的方式,您還需要提供所需的網(wǎng)頁(yè)工作隨著HTML CSS和JS。不只是包括腳本標(biāo)簽<代碼> src屬性,但整個(gè)文件,內(nèi)聯(lián)。
很明顯,這意味著你要增加你發(fā)送的頁(yè)面的大小,但它有一大好處,即網(wǎng)頁(yè)將立即加載。更重要的是,雖然所有的JS(需要拾?。┖虲SS(要求作出的設(shè)計(jì)感)立即交貨,瀏覽器將能夠使你的內(nèi)容和提供的東西,看起來(lái)是正確的,通俗易懂。
再次,當(dāng)我們要使用服務(wù)人員緩存內(nèi)容一旦它的到來(lái),這不應(yīng)該有太多的影響。我們也可以緩存所有的css和js外部文件需要單獨(dú)和負(fù)載從緩存存儲(chǔ)而不是取他們的每一次。這也使它很可能略多,PWA在用戶試圖請(qǐng)求你的網(wǎng)站第一次失敗了,但你仍然可以優(yōu)雅地處理這種情況的錯(cuò)誤信息或默認(rèn)的內(nèi)容,并重新嘗試在下一頁(yè)查看。
還有其他潛在的問題,人們可以運(yùn)行在,以及。華盛頓郵報(bào),例如,建立一個(gè)自己的網(wǎng)站的版本,但它只適用于移動(dòng)設(shè)備。顯然,這意味著該網(wǎng)站可以爬好的谷歌的移動(dòng)機(jī)器人,但不是桌面的。重要的是要尊重的P部分的縮寫-網(wǎng)站應(yīng)該啟用用戶可以使用的功能,但仍然正常工作的人使用的瀏覽器,不支持他們的工作。它是關(guān)于加強(qiáng)功能,而不是要求人們升級(jí)他們的瀏覽器。
與所有這一切的唯一一個(gè)稍微復(fù)雜的事情是,它需要,經(jīng)驗(yàn),你設(shè)計(jì)你的應(yīng)用程序離線的第一次經(jīng)驗(yàn)。這是如何做的是在衛(wèi)國(guó)明的演講中引用。唯一的問題是,沿著這條路線:你只服務(wù)內(nèi)容一旦有人到達(dá)你的網(wǎng)站,等了足夠長(zhǎng)的時(shí)間來(lái)加載一切。顯然,在谷歌的情況下,這是不好的工作。所以這是我建議的…
而不是僅僅發(fā)送您的應(yīng)用程序,然后使用Ajax請(qǐng)求的內(nèi)容加載,然后拿起,使用此工作流代替:
用戶到達(dá)現(xiàn)場(chǎng)
網(wǎng)站發(fā)送回應(yīng)用程序(最小的HTML和CSS,JS,立即使一切工作),隨著…
…內(nèi)容Ajax響應(yīng),預(yù)加載應(yīng)用程序狀態(tài)
應(yīng)用程序立即加載,然后拿起前端。
添加所需的數(shù)據(jù)意味著,在負(fù)荷,我們不可能使一個(gè)Ajax調(diào)用獲得初始數(shù)據(jù)要求。相反,我們可以捆綁,在太,所以我們得到的東西,可以立即渲染內(nèi)容以及。
作為一個(gè)例子,讓我們想想一個(gè)天氣應(yīng)用。現(xiàn)在,基本的模式將是,我們發(fā)送用戶的所有內(nèi)容顯示我們的應(yīng)用程序的基本版本,但不是數(shù)據(jù)說(shuō)什么天氣是。在這個(gè)修改后的版本,我們也將在今天的天氣是什么樣的,但任何后續(xù)的數(shù)據(jù)請(qǐng)求,然后我們?nèi)ヒ粋€(gè)Ajax調(diào)用服務(wù)器。
這意味著我們還提供內(nèi)容,谷歌等指標(biāo),沒有從我們的AJAX可能問題調(diào)用失敗。從谷歌和用戶的角度來(lái)看,我們只是提供了一個(gè)非常高性能的初始負(fù)載,然后注冊(cè)服務(wù)人員提供更快的經(jīng)驗(yàn),為每一個(gè)后續(xù)頁(yè)面,并可能額外的功能。
網(wǎng)站欄目:進(jìn)步的網(wǎng)絡(luò)應(yīng)用程序意味著你的網(wǎng)站和搜索引擎優(yōu)化
瀏覽路徑:http://jinyejixie.com/news20/20420.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷seo公司;服務(wù)項(xiàng)目有網(wǎng)站營(yíng)銷、搜索引擎優(yōu)化等
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容