關(guān)于響應(yīng)式設(shè)計(jì)的事實(shí)

響應(yīng)式設(shè)計(jì)是網(wǎng)頁設(shè)計(jì)的一個(gè)相對(duì)較新的術(shù)語。只有創(chuàng)造三年前的5月2010，當(dāng)網(wǎng)頁設(shè)計(jì)師Ethan馬科特使用術(shù)語在 他的文章 為列表分開。
今天，甚至還有一個(gè)小型的辯論會(huì)上關(guān)于是否響應(yīng)設(shè)計(jì)是呆在這里還是只是曇花一現(xiàn)。只有時(shí)間會(huì)告訴你，但現(xiàn)在很明顯，響應(yīng)式設(shè)計(jì)力求讓用戶體驗(yàn)盡可能舒適。

響應(yīng)式設(shè)計(jì)是 Web設(shè)計(jì)理念，著重于建立網(wǎng)站，給用戶提供一個(gè)增強(qiáng)的觀看體驗(yàn)。這包括特征 如輕松導(dǎo)航和閱讀，和最小的瀏覽器縮放、滾動(dòng)和平移。所有這一切都發(fā)生在一系列不同的設(shè)備，從臺(tái)式機(jī)到智能手機(jī)。

因?yàn)檫@個(gè)網(wǎng)站設(shè)計(jì)方法仍然處于剛起步的狀態(tài)，你可能并不完全清楚什么是響應(yīng)式設(shè)計(jì)  所有關(guān)于。它是更多關(guān)于無縫顯示內(nèi)容跨多個(gè)平臺(tái)，主要是幫助企業(yè)建立通過更好的用戶體驗(yàn)，增加他們的銷售更具吸引力的網(wǎng)站嗎？
Mashable已經(jīng)騎虎難下， 被稱為2013年 響應(yīng)設(shè)計(jì)。雖然還有待觀察，響應(yīng)式設(shè)計(jì)的一些基本內(nèi)容標(biāo)準(zhǔn)，將永遠(yuǎn)不會(huì)消失。這里有最重要的設(shè)計(jì)因素熟悉。

之間是有區(qū)別的響應(yīng)式設(shè)計(jì)和手機(jī)設(shè)計(jì)
你會(huì)認(rèn)為響應(yīng)式設(shè)計(jì)和手機(jī)設(shè)計(jì)是一樣的-但他們不原諒。當(dāng)然，響應(yīng)式設(shè)計(jì)并創(chuàng)建了網(wǎng)站，讓他們對(duì)瀏覽器的大小和移動(dòng)友好的反應(yīng)，但反應(yīng)的設(shè)計(jì) 真的是整個(gè)網(wǎng)頁設(shè)計(jì)。參照這個(gè)網(wǎng)頁設(shè)計(jì)方法為手機(jī)設(shè)計(jì)是它固有的限制的問題，這會(huì)傷害到它本身的方法。

最有效的網(wǎng)站響應(yīng)可以看作是他們的意思是，在一系列的決議。這包括一切從通常的1024×768像素到1920×1080顯示之間的一切。這類網(wǎng)站也看精彩的平板電腦（包括視網(wǎng)膜和標(biāo)準(zhǔn)顯示器），以及智能手機(jī)。如果一個(gè)網(wǎng)頁設(shè)計(jì)師看響應(yīng)式設(shè)計(jì)僅僅通過移動(dòng)的情況下，那么他可能錯(cuò)過了一個(gè)更廣泛的用戶體驗(yàn)。 
同時(shí)，移動(dòng) 是 整個(gè)響應(yīng)設(shè)計(jì)的討論很適當(dāng)?shù)钠瘘c(diǎn)。這是規(guī)范開始移動(dòng)方案再擴(kuò)大這個(gè)設(shè)計(jì)額外的尺寸為開發(fā)一個(gè)響應(yīng)式網(wǎng)站。許多設(shè)計(jì)師認(rèn)為這是簡單的增加而不是減少他們的視覺效果。
 

質(zhì)量和圖像大小優(yōu)先 
如果有一個(gè)規(guī)則，網(wǎng)站設(shè)計(jì)者應(yīng)該遵循，它的圖像質(zhì)量比圖像的實(shí)際數(shù)量更重要。原因是低質(zhì)量的圖像根本不在任何尺寸的具有吸引力。 需要網(wǎng)站加載圖像的時(shí)間幾乎是一樣的大小一樣重要。移動(dòng)用戶會(huì)同意這是因?yàn)樗麄冇杏邢薜膸捰靡钥购狻?/p>

什么是一個(gè)網(wǎng)頁設(shè)計(jì)師嗎？只要達(dá)到負(fù)載時(shí)間和質(zhì)量之間的智能平衡。這包括縮放圖像和CSS的高度和寬度屬性，避開裝載全尺寸圖片，而對(duì)于互聯(lián)網(wǎng)圖像優(yōu)化。在上傳之前，我們強(qiáng)烈建議對(duì)作物的任何圖像的最小尺寸盡可能節(jié)約每一張照片，只要它仍然保持鋒利，視覺質(zhì)量。
看看 索尼美國官網(wǎng)。請(qǐng)注意，所有的圖片都超級(jí) 尖銳的品質(zhì)，不管它們是什么尺寸。一旦你訪問該網(wǎng)站或刷新網(wǎng)頁，還要注意如何快速的圖像加載。你不必等待超過二一切成為焦點(diǎn)，非常明顯。

設(shè)計(jì)師有很多選擇時(shí)，將圖像以響應(yīng)的設(shè)置。他們可以只使用幾個(gè)圖像； 減少圖像的使用在手機(jī)大小的方案；允許圖像掩模本身在移動(dòng)環(huán)境；或利用各種文件的大小和版本。這些選擇將有效地工作，雖然有些開發(fā)商對(duì)隱藏圖像，因?yàn)橛脩羧匀恍枰d入圖片盡管他們看不見。
 

讓我們對(duì)響應(yīng)式的談話
類型不應(yīng)該一刀切。一種字體看起來有吸引力的桌面上的眼睛可能是可怕的在你的智能手機(jī)。字體必須遵循同樣的規(guī)則 響應(yīng)等方面的設(shè)計(jì)。
響應(yīng)字體最重要的方面是線長度。光滑的可讀性，類型應(yīng)該是基于屏幕的寬度進(jìn)行了優(yōu)化。拇指規(guī)則，桌面網(wǎng)站，是50和75個(gè)字符之間的線是理想的；對(duì)于移動(dòng)設(shè)備，只是在35到50個(gè)字符是理想的。

型也必須容易閱讀的垂直。許多網(wǎng)站利用線的空間，高達(dá)百分之140的屏幕的大小更大的文本塊。如果屏幕 更小，更多的空間應(yīng)該被添加。
即使是特定的字體的使用是有意義的。漂亮的字體和新奇的字體要看視覺上的吸引力更大屏幕的能力，但他們難以閱讀，如果點(diǎn)尺寸小。這些字體之間應(yīng)該有很多空間。當(dāng)你的工作與較小的尺寸，最簡單的方法就是利用正常的無襯線字體樣式和連招。

在 煮熟的網(wǎng)頁設(shè)計(jì)的網(wǎng)站，你可以看到很多這些應(yīng)遵循的基本原則，制定良好的響應(yīng)。注意線的長度，文本在桌面，平均大于50到75個(gè)字符-理想的建議是由一個(gè)字體，干凈，易于閱讀。此外，線間距也大于字體的點(diǎn)大小。在移動(dòng)設(shè)備上，該網(wǎng)站的響應(yīng)性更好：在iPhone 5顯示屏，每行的字符數(shù)約為67，這是一位在理想規(guī)則35和50個(gè)字符之間。
 

別忘了導(dǎo)航
當(dāng)涉及到用戶體驗(yàn)-這是一個(gè)網(wǎng)頁設(shè)計(jì)師應(yīng)該考慮的最重要的因素是在導(dǎo)航的優(yōu)先考慮。導(dǎo)航的順利和有效的確保舒適的用戶體驗(yàn)。
有效響應(yīng)的設(shè)計(jì)必須確保這個(gè)格外關(guān)注某一特定瀏覽器的寬度。一個(gè)網(wǎng)站，采用響應(yīng)式設(shè)計(jì)也奠定了其在不同領(lǐng)域的導(dǎo)航網(wǎng)站，在瀏覽器的寬度都依賴。其中一個(gè)最好的例子是食品感官的網(wǎng)站導(dǎo)航。

它會(huì)響應(yīng)設(shè)計(jì)規(guī)模的網(wǎng)站導(dǎo)航，更大比例的設(shè)備上有著更大的屏幕是一個(gè)錯(cuò)誤。
 

響應(yīng)式設(shè)計(jì)的外賣
所以，當(dāng)你聽到網(wǎng)頁設(shè)計(jì)師談?wù)撁舾械脑O(shè)計(jì)，你就會(huì)知道這不僅僅是做一個(gè)網(wǎng)站看起來好和較小的流暢運(yùn)行，手機(jī)屏幕。你會(huì)知道，這種設(shè)計(jì)方法的基礎(chǔ)上，使各種規(guī)模的網(wǎng)站的原則提供最佳用戶體驗(yàn)-無論他們使用查看網(wǎng)站。

響應(yīng)式設(shè)計(jì) 仍然是一個(gè)相對(duì)較新的概念，至少對(duì)大多數(shù)人只是查看網(wǎng)站在互聯(lián)網(wǎng)上。這就是為什么如此多的人仍然不可以讓響應(yīng)式設(shè)計(jì)響應(yīng)式設(shè)計(jì)同意。這是關(guān)于手機(jī)屏幕看到一切都正常嗎？這是關(guān)于加載時(shí)間、高質(zhì)量的圖像，請(qǐng)眼睛？這是關(guān)于一個(gè)干凈的設(shè)計(jì)和易于閱讀的字體？ 

這是所有的多。這些都是本網(wǎng)站設(shè)計(jì)的方法的基本原理，但響應(yīng)的設(shè)計(jì)仍然是不斷發(fā)展和變化的，所以有很好的機(jī)會(huì)，額外的元素將被考慮，太。最后，是關(guān)于用戶體驗(yàn)的提升，因?yàn)闆]有人愿意面對(duì)一個(gè)網(wǎng)站，是緩慢的，模糊的，很難讀，混亂或難以駕馭。

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

• 海天盛筵網(wǎng)站設(shè)計(jì)
• 東海國際公寓網(wǎng)站設(shè)計(jì)
• SUMMARY微信頁面設(shè)計(jì)