Godzilla. 2018-10-16
網(wǎng)站建設(shè)
分享現(xiàn)代國外響應(yīng)式設(shè)計的卓越典范
隨著時間的推移，響應(yīng)式設(shè)計已經(jīng)非常成熟。 一開始，它只是提供適應(yīng)不同屏幕的東西 - 即使它不是那么好。但現(xiàn)代的響應(yīng)式設(shè)計釋放了大量的創(chuàng)造力。許多設(shè)計師沒有將小屏幕視為負擔，而是尋找新的方法來迎接創(chuàng)造具有美感和功能的東西的挑戰(zhàn)。
有了這個既定的歷史，在結(jié)合之前對上海自適應(yīng)網(wǎng)站建設(shè)的優(yōu)缺點分析，我們認為看一些真正處于響應(yīng)式設(shè)計前沿的網(wǎng)站會很有趣。
在這里，他們是完整的響應(yīng)視圖和他們帶到桌面的一些想法（或者我應(yīng)該說，平板電腦？）：
1.華盛頓郵報
響應(yīng)式設(shè)計面臨的巨大挑戰(zhàn)之一就是占用內(nèi)容豐富的網(wǎng)站并使其在較小的屏幕上運行。 “華盛頓郵報”在充分利用屏幕房地產(chǎn)方面做得非常出色。
雖然桌面版本利用了多列網(wǎng)格，但平板電腦（人像）和手機版本可以很好地應(yīng)對壓縮內(nèi)容的挑戰(zhàn)。小屏幕上的樣式簡單滑出式標題導(dǎo)航因其易用性而受到贊揚，這種體驗主要針對移動設(shè)備進行。
2.99U
99U是Adobe的創(chuàng)意專業(yè)人士在線雜志。喜歡這個網(wǎng)站的一個方面是它在任何屏幕尺寸上的布局都非常簡單。
使用淺色背景和大型黑色排版使得從桌面到移動設(shè)備都易于閱讀。 一個獨特的功能是，在移動設(shè)備上，網(wǎng)站的頁腳實際上隱藏在漢堡菜單中。這個小技巧可以節(jié)省一些空間并保留它以保持對內(nèi)容的關(guān)注。
3.VOX
Vox是一個新聞網(wǎng)站，采用移動導(dǎo)航的不同路線。
標準文本導(dǎo)航欄不再是無處不在的漢堡菜單，而是隨著屏幕變小而縮小。但是，不是試圖在一個小空間中擠壓幾個項目，而是逐漸從菜單中刪除類別，并將其隱藏在名為“更多”的下拉菜單中。
4.Etsy
也許沒有人比Etsy更好地為他們的用戶設(shè)計。狡猾的市場也做出了正確的響應(yīng)。移動亮點中的標題是以極其清晰簡潔的方式為您提供所有基礎(chǔ)知識（徽標，銷售鏈接，登錄和購物車圖標）。
他們的分類商店部分從多列照片卡轉(zhuǎn)換為干凈的垂直圖標菜單。這是工作中漸進式增強的一個很好的例子。
5.肯德基
肯德基是一個很好的雞肉供應(yīng)商，也在他們的網(wǎng)站上做了一些出色的工作。
用戶體驗在不同設(shè)備和屏幕尺寸之間非常一致。在所有視口上同時使用漢堡菜單和水平滾動也意味著用戶將確切知道該做什么，無論他們用什么來瀏覽網(wǎng)站。
6.本田
作為眾多產(chǎn)品的制造商，本田擁有多個產(chǎn)品線和用戶可能感興趣的品牌。他們在每個交替橫幅中使用顏色使得找到你想要的東西變得非常簡單（在平板電腦和手機上看起來特別酷）。
同樣，這是一個在不同視口上帶來非常相似體驗的網(wǎng)站。
7.The National
獨立搖滾樂國家大都會充分利用屏幕房地產(chǎn)。 實際上，他們的網(wǎng)格式新聞和信息布局橫跨高清屏幕的整個寬度。
這種類型的布局非常適合在頁面寬度上全力以赴。較小的屏幕被視為類似的氛圍，新聞項目并排列出并且仍然足夠容易閱讀。該網(wǎng)站提醒您，響應(yīng)式設(shè)計還包括利用更高的屏幕分辨率，而不僅僅是確保所有內(nèi)容都適合較小的分辨率。
最后，響應(yīng)革命
看看我們上面提到的網(wǎng)站，它們都不是特別具有革命性的。 但每個人都有自己有趣的技術(shù)和理念，以確定響應(yīng)式設(shè)計應(yīng)該如何工作（更不用說要達到目標時需要克服的許多挑戰(zhàn)）。 它們可能不是革命性的，但它們肯定是革命的一部分。
文章評論：