網(wǎng)站的瀏覽器兼容問題,對于網(wǎng)站優(yōu)化來說非常重要,如果網(wǎng)站的兼容性不行,,對于網(wǎng)站的用戶體驗度影響非常大。在網(wǎng)站建設的時候就要充分考慮到這個問題并解決這個問題。不然會帶來許多不好的影響。
1、網(wǎng)站兼容性影響到網(wǎng)站加速載速度
用戶體驗度關就是網(wǎng)站加載速度,如果一個網(wǎng)站在一個瀏覽器上加載速度是正常的,秒開;但在另外一個瀏覽器上卻遲遲不能打開,每次打開都需要花上幾十秒甚至是幾分鐘。那這樣就不行了,用戶不知道這個網(wǎng)站需要用什么瀏覽器打開的,只管自己方便就用哪個瀏覽器。如果剛好是用了不兼容的那個瀏覽器打開網(wǎng)站,那么沒等到網(wǎng)站打開,用戶都已經(jīng)等不耐煩關閉掉網(wǎng)站了,你就永遠失去了一個潛在客戶了。
2、網(wǎng)站的兼容性影響網(wǎng)站的功能
這個是對于用戶和網(wǎng)站運營維護人員來說都是有影響的,不同的瀏覽器,有些網(wǎng)站功能可以使用有些則不行。例如是網(wǎng)站的搜索功能,在某瀏覽器,用戶可以通過網(wǎng)站的搜索框搜索到自己想要的內(nèi)容,在另外一個瀏覽器則不能使用該功能。另外網(wǎng)站后臺的維護,有時候,在某一瀏覽器上更新編輯時,發(fā)現(xiàn)很多的編輯框加載不出來,這樣是非常影響后期網(wǎng)站的維護工作的。所以在網(wǎng)站建設的時候就需要注意好這個問題。
3、網(wǎng)站兼容問題還會影響到網(wǎng)站頁面的顯示
有時候我們在某一瀏覽器打開網(wǎng)頁的時候發(fā)現(xiàn)網(wǎng)站頁面顯示不完整或者是拉伸縮短等變形問題,而在另外一個瀏覽器上卻沒有出現(xiàn)這種問題。這都是網(wǎng)站的兼容問題,網(wǎng)站建設時候沒有考慮到瀏覽器的內(nèi)核上是否都能兼容。你可知道,網(wǎng)站頁面的顯示也是直接影響到用戶體驗的。
網(wǎng)站的兼容性問題影響到后期的網(wǎng)站優(yōu)化和運營,所以在網(wǎng)站建設的時候就要充分考慮好、注意好兼容性問題,提高網(wǎng)站用戶體驗度,才能贏得用戶和搜索引擎的喜愛。
大多數(shù)網(wǎng)站設計在網(wǎng)站兼容方面做的不夠好,為什么呢?
2017年,如果說你的網(wǎng)站仍然停留在只是Google、百度等PC瀏覽器打開無異常,而換成其它版本的小眾瀏覽器打開不行或者bug頻出,那便不能算是一個合格的網(wǎng)站!杭州蒙特網(wǎng)站設計很肯定的告訴大家,移動端也一樣,不管是iPad還是各種版本的手機端,都應該能保證展現(xiàn)效果一致,且沒有其他結(jié)構變動等問題。
不得不說的是,大多數(shù)網(wǎng)站在兼容性這方面做得并不是太好!
因為網(wǎng)站各種特效的不斷創(chuàng)新和技術的更新迭代,導致一些老版本或特殊版本的IE等瀏覽器無法同時兼容同樣的一種或者多種特效!所以,我們的程序員必須要在保證主流瀏覽器能夠正常訪問的基礎上,盡可能的針對每一個存在的瀏覽器版本進行兼容性優(yōu)化!
網(wǎng)站建設過程中的兼容性問題怎么破?
當然是先從大的主流瀏覽器出發(fā),在保證主流、占比較大的網(wǎng)站瀏覽器訪問網(wǎng)站正常的前提下,再一一通過測試調(diào)整各種小額占比瀏覽器的兼容性特效實現(xiàn)等!當然了,總會有一些比較特殊的效果,很多瀏覽器都需要調(diào)整,導致程序有很多必要和不必要的壟余。
那么,代碼壟余如何解決呢?
一般十幾年的專業(yè)網(wǎng)絡公司在這方面會做的很好,網(wǎng)站兼容性真是一個當下必須要解決的問題,忽視了它,后期頭疼的問題就會頻繁發(fā)生,沒有后顧之憂的網(wǎng)站建設,前期就要做好每一個建站細節(jié)。
發(fā)現(xiàn)Web前端開發(fā)工程師煩的就是解決瀏覽器兼容性的問題。不過,別擔心,既然小編已經(jīng)說出來了,就是給大家?guī)磉@一部分的相關知識分享給大家,解決大家的煩惱,一下幾點是根據(jù)朋友以及同事和看了某些程序員大佬的博客之后總結(jié)出來的幾點,希望能夠幫到大家。
我也編程,可兼容使我痛苦
這個問題對于Web開發(fā)者來說真是頭疼的問題,我從事Web開發(fā)也有兩年時間,期間遇到過許許多多類似的問題,每次都被搞得很累,后來畫了大半年時間專門研究Web前端技巧,后我總結(jié)了一些方案出來:
1.在開發(fā)Web APP的時候,開發(fā)機上面把主流瀏覽器都裝上,比如說:Chrome、FF、safari、IE、IE Tester... 在大多數(shù)情況下,F(xiàn)F和Chrome差別不是很大。
2.開發(fā)過程中要注意,每做好一個樣式,都要跑一遍所有要兼容的瀏覽器,這樣雖然開發(fā)過程時間會比較長,可是會比你開發(fā)完成后再來改效率高得多,我曾經(jīng)就碰到過一個產(chǎn)品,開發(fā)完成后由于兼容性問題導致其發(fā)展面很窄,后不得不重新開發(fā)。
3.如果真的碰到樣式不兼容的情況,那么只能針對不同的瀏覽器做相應的調(diào)整。
4.一些新的特效可能在一些版本落后的瀏覽器里不兼容,這個時候我們的原則就是:不求效果絢麗,只求工整規(guī)范。
5.多積累,多看看符合W3C標準規(guī)范的CSS手冊和JS手冊,注意積累,或者用一些開源框架,那樣兼容性可以省下不少時間。
我們認為chrome + firefox + safari + ie9是高端瀏覽器,ie8勉強算準高端吧。這樣這部分占有率約57%(如果加上其他webkit內(nèi)核的瀏覽器會更高一些) 已經(jīng)大于ie6 + ie7。
高端和低端瀏覽器的差距可以用html5test量化一下:
Google Chromium 11.0.690的分數(shù)是293,而Microsoft Internet Explorer 6.0的分數(shù)17,也許有各種fallback方案可以保證完全兼容性各個瀏覽器,但依然不能保證低端瀏覽器的使用體驗,頂多是看起來各個瀏覽器都一樣了。因此,現(xiàn)在的設計和開發(fā)的策略是瀏覽器分級支持。優(yōu)先為高端瀏覽器設計,同時考慮低端瀏覽器的退化方案。甚至有些復雜的應用可以拒絕ie6,提示用戶使用高端瀏覽器。豆瓣7月份將會發(fā)布一款對ie6說no的產(chǎn)品(國內(nèi)個拒絕支持ie6的產(chǎn)品吧)
因此不要再考慮向后兼容,應該考慮向后退化,更多考慮向前兼容。
那么究如何讓網(wǎng)站建設HTML文件保持兼容性呢?
一個設計良好的網(wǎng)頁應該能夠被寬帶網(wǎng)上的多媒體高檔電腦或者依然使用慢速MODEM連接的低檔電腦上安裝的瀏覽器閱讀。然而,很多新的網(wǎng)站設計者均不是非常的了解如何盡量的讓這些HTML文件保持很好的兼容性。
當然,這里有太多的不確定因素影響網(wǎng)頁后呈現(xiàn)的結(jié)果。首先,計算機的顯示器有不同的分辨率和顯示質(zhì)量,其次,運行著各種各樣的操作系統(tǒng),使用著不通版本的WEB瀏覽器
,不同INTERNET連接方式和各種速度的MODEM。我們不能想當然的去武斷地判定瀏覽者的喜好。我們還是花點時間來測試頁面,這樣可以讓每一個訪問者感到愉快。然而,遺憾的是我們沒有辦法為每一個訪問者來優(yōu)化頁面,但是下面講述的幾個步驟將有助于您保證大多數(shù)訪問者的瀏覽效果。
1、不要依賴圖形。
就站點設計而言,的確能夠通過成功的圖形設計招徠或者丟失訪問者。并非所有的訪問者可以完全看到圖片,某些人為了加快存取網(wǎng)絡的速度已經(jīng)關閉了瀏覽器端的圖形。簡而言之,圖形并不能正確的在客戶端加載。
然而,圖形經(jīng)常被用來作為導航按鈕。舉例來說,訪問者經(jīng)常按向左的箭頭返回上一頁,或者一個包含問號的圖形可以得到更多的信息,或者按公司的標志(LOGO)會告訴用戶公司的地址和電話號碼。圖形映射(IMAGE MAP)允許你按圖像的不同區(qū)域連接到不同的地方,這個經(jīng)常被用來用作站點地圖,你給訪問者提供站點內(nèi)容指引。但是如果你僅僅通過圖片來提供站點導航的話,某些訪問者將不能完全或者正確的離開你的站點。
總是告訴用戶你的站點需要什么樣類型的技術才能正確瀏覽你的網(wǎng)站是一個非常愚笨的方法。如果訪問者需要安裝插件才能處理,如果你僅僅給出一個連接讓訪問者去下載。這個自認為非常酷的頁面對用戶來說根本不是什么幽默的事情,這是和用戶的期待所恰恰相反的。至于為什么恰恰相反,希望你能反思一下,如果是你,你會為了瀏覽一個你根本不知道什么樣的站點而去下載一堆你不知道的插件么?
如何解決這個矛盾呢?你可能想到的解決方法有二種:一個是單純的文本,另外就是完全的圖形方式。其實不然。如果你使用一個圖形映射的方式給內(nèi)容列表,可以在該頁的后使用一個純文本方式的表格來處理,這樣會好很多。如果使用圖形按鈕,還是包括簡單的導航文字提示。
大多數(shù)的時候,通常我們要養(yǎng)成使用"ALT"標記的習慣,這樣當圖形未能正確顯示的時候可用預備的文本替代顯示。這樣,用戶至少可以看到關于這個圖形的表述,便知道這個圖形究意味著什么。舉例來說某個圖象標記的預備文本就可以這樣寫:
使用"ALT"標記也有另外一個好處。文字將顯示在圖象的上面,這樣會給用戶造成一個頁面快說引導的感覺。
2、確定受眾。
一般的來說,絕大多數(shù)普通受眾圖形,插件,applets和其它有關的高級Web瀏覽器特性。對我們來說,頁面的實用可能比漂亮更重要,對于用戶來說,沒有什么比頁面能夠快速下載更重要了,簡而言之,精簡你的站點,這是一條的捷徑。
波士頓一位圖形設計者兼美術講師說:"你必須考慮什么,這一切都應該來自自于你的觀眾"!
為了讓每個人滿意,一個站點的實用比漂亮更加重要。并且首先,它必須能夠快速的被用戶端的較老版本的瀏覽器快速解釋。簡化你的站點,然而,那未必是的辦法。
考慮一下站點訪問者的操作系統(tǒng),監(jiān)視器,瀏覽器,和的連接類型。然后,想想理論上他們需要從你的站點獲得什么?他們是想獲得連接還是需要實際的內(nèi)容?如果是普通的站點是否會失望,是否需要為瀏覽下載特別的插件。有一個竅門就是沒有必要為每一個人優(yōu)化你的站點,要滿足每一個訪問者顯然不可能,你必須為訪問者采取適當?shù)募夹g。
3、保持頁面小巧。
這個小節(jié)我們談論的是關于圖形的處理。的方法是我們呼吁廣大的讀者保持讓圖形文件的尺寸盡量的小。即使是那些僥幸擁有快速Internet連接的用戶,他們不會抱怨說你的站點加載速度太快。
網(wǎng)站建設過程中的兼容性問題怎么破?
眾所周知,網(wǎng)站在上線之前必須要經(jīng)歷一個大關:測試!而測試的前提除了各種bug修復和功能試用外,還有重要的一點:就是網(wǎng)站在多終端、多版本瀏覽器下的兼容性問題。
進入2017年,如果說你的網(wǎng)站仍然停留在只是Google、百度等PC瀏覽器打開無異常,而換成其它版本的小眾瀏覽器打開不行或者bug頻出,那便不能算是一個合格的網(wǎng)站!移動端也一樣,不管是iPad還是各種版本的手機端,都應該能保證展現(xiàn)效果一致,且沒有其他結(jié)構變動等問題。
可是,不得不說的是,大多數(shù)網(wǎng)站在兼容性這方面做得并不是太好!因為網(wǎng)站各種特效的不斷創(chuàng)新和技術的更新迭代,導致一些老版本或特殊版本的IE等瀏覽器無法同時兼容同樣的一種或者多種特效!所以,我們的程序員必須要在保證主流瀏覽器能夠正常訪問的基礎上,盡可能的針對每一個存在的瀏覽器版本進行兼容性優(yōu)化!