當你開始在網(wǎng)頁設計中,網(wǎng)站的速度似乎是別人的問題。至少,當我還是一個新手,似乎是那樣。
我開始在空白畫布上的每一個設計的PS圖象處理軟件,畢竟。沒有計劃,沒有線框。我通常甚至沒有計劃出有多少頁,我將有,或?qū)⒁獙λ麄?。我只是“制作網(wǎng)站”,主要是為了娛樂,因為這是我決定如何度過我的青少年時期。
我想我可以想出如何優(yōu)化速度,一旦我想出了如何建立網(wǎng)站的第一個地方。
你需要考慮。很多人仍然有相當慢的互聯(lián)網(wǎng)接入。3G不是很大,和移動用戶有那些討厭的數(shù)據(jù)上限。此外,還有可能數(shù)以百萬計的移動設備在那里與低端處理器。
雖然我可以提供一些技巧和技巧,
在這篇文章中,最重要的是你可以采用的是心態(tài)。
速度意味著轉(zhuǎn)換,銷售,和人們回到您的網(wǎng)站,為更多的內(nèi)容。一個緩慢的網(wǎng)站意味著人們?yōu)榱瞬粶y試他們的耐心和耐心去走了。和網(wǎng)站可以感覺速度慢,即使當他們加載速度快。
這是互聯(lián)網(wǎng)。你有競爭。
這里有一個圖表,如果你想如何網(wǎng)站速度影響你的底線,更直觀的解釋。
把它從頂部
你應該開始你的速度優(yōu)化,你應該開始的設計過程中的每一個部分:與內(nèi)容。除非所有的訪問者都是網(wǎng)頁設計人員,否則很可能他們不太關心你的網(wǎng)站設計,只要他們可以得到內(nèi)容。
如果內(nèi)容本身正在減慢你的站點,沒有優(yōu)化網(wǎng)站的設計將解決它。
內(nèi)容可以慢下來,在一對夫婦的大方式:
大量的圖像
這變得明顯,大的圖像傾向于更好地銷售。這是偉大的。但請謹慎使用這些海量圖像,確保他們適當壓縮,或者更好的是,使用SVG。
如果你要看看這些數(shù)據(jù),你會發(fā)現(xiàn)平均頁面大小為移動設備(通常是較慢的速度和覆蓋的數(shù)據(jù)計劃)是快速接近1MB,和圖像問題的一半。
當設計本身是緩慢的
當然,這一切都是相反的。許多網(wǎng)站以輕,簡單的內(nèi)容,如文本和一些小的圖像被稱為低計劃的設計和壞的代碼被稱為。
這部分是因為人們覺得有必要盡可能地讓他們的網(wǎng)站。我理解這一沖動,但閃光的日子已經(jīng)來了,(大多)是因為一個原因。使用HTML5,CSS3和JavaScript取代Flash,不應該成為你的目標。
你的用戶不需要在屏幕上反彈的東西。他們需要得到你所提供的信息,或者你正在銷售的產(chǎn)品。
這些奇特的東西往往會使事情變慢
你的網(wǎng)站不需要視差效應,一堆動畫,或是閃閃發(fā)亮的小玩意兒是有效的。
現(xiàn)在,我不是說你應該把它簡單地把它作為一個沒有布局的白色背景上的黑色文字。我是說,每一個文體加上需要對用戶體驗進行權衡。
當你在網(wǎng)站上添加動畫和華麗的東西,如果你需要它,你需要它的一個或2件事情,或者如果你需要更先進的東西。有很好的機會,如果你不做出一個實際的應用程序,你不需要的東西那樣,比如jQuery。這是特別真實的小到中等大小的網(wǎng)站。
這不只是字節(jié)大小。我在網(wǎng)頁上看到過動畫,這是我的整個游戲機,這是不酷的?,F(xiàn)在想象有人試圖瀏覽該網(wǎng)站上的低端智能手機或平板電腦。想象一下挫折。
如果你需要的只是一個或兩個要素你設計了香料,這是整個圖書館的JavaScript插件不需要jQuery或其他框架。
說的太多的代碼
這使我受到的HTML和CSS框架。機會是,你不需要整個龐大的框架,如引導或基礎,使一個簡單的網(wǎng)站。它可能會減少前端開發(fā)時間,但它可能不值得額外的加載時間。
如果你要使用一個框架,至少要自定義它,然后取出你不需要的東西。大多數(shù)的大的HTML / CSS框架提供簡單的方法來做這個。
關于這些圖像…
不,不是大的。我們談論了那些?,F(xiàn)在我們看看細節(jié)。你的網(wǎng)站還使用光柵圖像的背景顏色,漸變,陰影,圖標,和那種事情?它不應該。
如果可以用HTML,CSS,SVG,那么它應該。這可能是更多的代碼,但代碼通常仍然輕。JPEG文件,甚至很多PNG文件。
所以我的網(wǎng)站現(xiàn)在快了,對嗎?
嗯,那里還有很多要學習,特別是如果你使用像WordPress的CMS,或任何復雜的主機設置。這個建議將只會讓你開始建立你的第一個網(wǎng)站.
牧羊人設計文章推薦: