當(dāng)你開始在網(wǎng)頁設(shè)計(jì)中，網(wǎng)站的速度似乎是別人的問題。至少，當(dāng)我還是一個(gè)新手，似乎是那樣。
我開始在空白畫布上的每一個(gè)設(shè)計(jì)的PS圖象處理軟件，畢竟。沒有計(jì)劃，沒有線框。我通常甚至沒有計(jì)劃出有多少頁，我將有，或?qū)⒁獙λ麄儭Ｎ抑皇恰爸谱骶W(wǎng)站”，主要是為了娛樂，因?yàn)檫@是我決定如何度過我的青少年時(shí)期。
我想我可以想出如何優(yōu)化速度，一旦我想出了如何建立網(wǎng)站的第一個(gè)地方。

你需要考慮。很多人仍然有相當(dāng)慢的互聯(lián)網(wǎng)接入。3G不是很大，和移動(dòng)用戶有那些討厭的數(shù)據(jù)上限。此外，還有可能數(shù)以百萬計(jì)的移動(dòng)設(shè)備在那里與低端處理器。

雖然我可以提供一些技巧和技巧，

在這篇文章中，最重要的是你可以采用的是心態(tài)。
速度意味著轉(zhuǎn)換，銷售，和人們回到您的網(wǎng)站，為更多的內(nèi)容。一個(gè)緩慢的網(wǎng)站意味著人們?yōu)榱瞬粶y試他們的耐心和耐心去走了。和網(wǎng)站可以感覺速度慢，即使當(dāng)他們加載速度快。
這是互聯(lián)網(wǎng)。你有競爭。
這里有一個(gè)圖表，如果你想如何網(wǎng)站速度影響你的底線，更直觀的解釋。

把它從頂部
你應(yīng)該開始你的速度優(yōu)化，你應(yīng)該開始的設(shè)計(jì)過程中的每一個(gè)部分：與內(nèi)容。除非所有的訪問者都是網(wǎng)頁設(shè)計(jì)人員，否則很可能他們不太關(guān)心你的網(wǎng)站設(shè)計(jì)，只要他們可以得到內(nèi)容。

如果內(nèi)容本身正在減慢你的站點(diǎn)，沒有優(yōu)化網(wǎng)站的設(shè)計(jì)將解決它。
內(nèi)容可以慢下來，在一對夫婦的大方式：
大量的圖像
這變得明顯，大的圖像傾向于更好地銷售。這是偉大的。但請謹(jǐn)慎使用這些海量圖像，確保他們適當(dāng)壓縮，或者更好的是，使用SVG。
如果你要看看這些數(shù)據(jù)，你會發(fā)現(xiàn)平均頁面大小為移動(dòng)設(shè)備（通常是較慢的速度和覆蓋的數(shù)據(jù)計(jì)劃）是快速接近1MB，和圖像問題的一半。

當(dāng)設(shè)計(jì)本身是緩慢的
當(dāng)然，這一切都是相反的。許多網(wǎng)站以輕，簡單的內(nèi)容，如文本和一些小的圖像被稱為低計(jì)劃的設(shè)計(jì)和壞的代碼被稱為。
這部分是因?yàn)槿藗冇X得有必要盡可能地讓他們的網(wǎng)站。我理解這一沖動(dòng)，但閃光的日子已經(jīng)來了，（大多）是因?yàn)橐粋€(gè)原因。使用HTML5，CSS3和JavaScript取代Flash，不應(yīng)該成為你的目標(biāo)。
你的用戶不需要在屏幕上反彈的東西。他們需要得到你所提供的信息，或者你正在銷售的產(chǎn)品。
這些奇特的東西往往會使事情變慢
你的網(wǎng)站不需要視差效應(yīng)，一堆動(dòng)畫，或是閃閃發(fā)亮的小玩意兒是有效的。

現(xiàn)在，我不是說你應(yīng)該把它簡單地把它作為一個(gè)沒有布局的白色背景上的黑色文字。我是說，每一個(gè)文體加上需要對用戶體驗(yàn)進(jìn)行權(quán)衡。
當(dāng)你在網(wǎng)站上添加動(dòng)畫和華麗的東西，如果你需要它，你需要它的一個(gè)或2件事情，或者如果你需要更先進(jìn)的東西。有很好的機(jī)會，如果你不做出一個(gè)實(shí)際的應(yīng)用程序，你不需要的東西那樣，比如jQuery。這是特別真實(shí)的小到中等大小的網(wǎng)站。

這不只是字節(jié)大小。我在網(wǎng)頁上看到過動(dòng)畫，這是我的整個(gè)游戲機(jī)，這是不酷的。現(xiàn)在想象有人試圖瀏覽該網(wǎng)站上的低端智能手機(jī)或平板電腦。想象一下挫折。
如果你需要的只是一個(gè)或兩個(gè)要素你設(shè)計(jì)了香料，這是整個(gè)圖書館的JavaScript插件不需要jQuery或其他框架。
說的太多的代碼
這使我受到的HTML和CSS框架。機(jī)會是，你不需要整個(gè)龐大的框架，如引導(dǎo)或基礎(chǔ)，使一個(gè)簡單的網(wǎng)站。它可能會減少前端開發(fā)時(shí)間，但它可能不值得額外的加載時(shí)間。

如果你要使用一個(gè)框架，至少要自定義它，然后取出你不需要的東西。大多數(shù)的大的HTML / CSS框架提供簡單的方法來做這個(gè)。
關(guān)于這些圖像…
不，不是大的。我們談?wù)摿四切，F(xiàn)在我們看看細(xì)節(jié)。你的網(wǎng)站還使用光柵圖像的背景顏色，漸變，陰影，圖標(biāo)，和那種事情？它不應(yīng)該。
如果可以用HTML，CSS，SVG，那么它應(yīng)該。這可能是更多的代碼，但代碼通常仍然輕。JPEG文件，甚至很多PNG文件。
所以我的網(wǎng)站現(xiàn)在快了，對嗎？
嗯，那里還有很多要學(xué)習(xí)，特別是如果你使用像WordPress的CMS，或任何復(fù)雜的主機(jī)設(shè)置。這個(gè)建議將只會讓你開始建立你的第一個(gè)網(wǎng)站.

牧羊人設(shè)計(jì)文章推薦：

國外的時(shí)尚網(wǎng)站設(shè)計(jì)欣賞
東海岸和西海岸的設(shè)計(jì)師