這幾年互聯網變化好多，我們在網上瀏覽的方式也一樣。在本文中，我們將看一下最近扁平化設計帶來的可訪問性提升以及使得互聯網或多或少更開放和可用性。

扁平化元素

擬物化設計模仿顏色、紋理、形狀甚至實際生活中特定的實際形狀，因此能對不喜歡新技術和更喜歡仿現實環境的人非常有幫助。然而，對視障用戶能有多少用戶呢?堅持這種設計方法對他們會有價值嗎?好吧，和擬物化設計相對應的，扁平化設計，有很多優勢可以幫助到這些特殊需求。因為扁平化設計使用基本的形狀，比如，正規/不正規的多邊形，它們更容易識別。

扁平化和擬物化的兩個計算器對比展示了兩種技術之間的不同。扁平化設計給予按鈕本身較小的重要性同時增強了內容(本例中的數字和數學符號)。另一方面，擬物化設計通過給予按鈕更大的重要性而使得它們很突出，而內容卻因為低對比度而不太醒目了。

上面的例子展示了扁平化設計如何提升和給予內容更大的重要性，從而能證明對視障用戶是有幫助的。

大字體和小圖標

不只是在扁平化設計中，極簡主義設計也一樣，大字體元素是最重要的一種表現。字體能讓用戶聚焦在內容，從而成為設計流程中最重要的一部分。當前設計中的趨勢包括高對比色的大字體、清晰的自定義字體和平衡的段落的使用——基本上就是，把傳統印刷排版帶到Web中來。這些原則增強了易讀性和可讀性，提高了易用性的另一個方面。畢竟，高對比色的自定義字體能提升可訪問性是一個眾所周知的事實。

這里的共用元素是使用大而清晰的高對比色字體增強可讀性(比較像Sans-Serifs)

此外，清晰的大字體可用于基本元素中以創建Web和UI中強對比色的按鈕，從而幫助用戶輕易地識別指定元素的功能并將之與別的元素區分開來。說道元素，這些扁平化的元素在設計過程中變得真的很重要，因為它們有助于給于扁平化設計流程個性和強度，從而構建更好的所有按鈕和界面元素的表現、可見性和清晰性。

基本形狀、實色和簡單的圖標組成了這個優秀的iPhone皮膚的一部分，它展示了最好的扁平化UI元素。

實色與高對比色

到現在為止，我們討論了應用于大字體和圖標的高對比色。現在，讓我們看下細節方面。在網頁設計中使用高對比色不是一個新的理念。事實上，多年來，高對比色被用于為網頁設計中特定的關鍵元素提供更好的視覺效果。

網上由很多出色的教程和工具來幫助你創建精確的色彩組合。比如，

Color Scheme Designer向你展示單色、雙色、三色、四色、以此類推的色盤，并讓你更多了解某個特定顏色如何與別的顏色相互影響。

Color Scheme Designer, 一個很贊的工具，可以查看顏色混合時的表現，然后用其結果作為創建高對比色的扁平化設計的參考。

同時，高對比色也可以被用于顏色之外，比如形狀、分派、高度、線性、紋理和字的粗細。事實上，玩轉這些所有元素及其相應的對比度能提升你的設計的表現，并使你的設計讓視弱的人更易用。

高對比色網站及其灰度實例

這里是一些高對比色網站及其灰度版本，有的做了負反轉，展示出漂亮的設計是如何天然的兼容了可用性和易用性理念的。

bigtop.it. 使用了大的字體和元素，暖色和溫和的顏色之間的軟對比。他們定義的對比度恰到好處。

aaugh.it 極簡主義帶來的簡易的優勢和適度的對比度

cheesesurvivalkit.com 有個漂亮的灰、白、紅三色，提供了強對比度并提升了可讀性和元素識別度。

metaphiziks.com 很完美的提升了內容顯示。

Symb.ly是一個使用了極簡樣式來讓你專注于內容的高對比度網站。

Odopod.com展示了一個漂亮的使用了粉色、白色和高規格圖片的溫和的對比色。當轉換到灰度版本，所有元素都完全可識別。

unfold.no 是一個使用了高雅、簡單設計和清晰內容的網站

本文來源于成都網站建設公司與成都網站設計制作公司-創新互聯成都公司！

當前標題：詳細解析網頁扁平化設計與可訪問性
轉載來源：http://vcdvsql.cn/news39/318689.html

成都網站建設公司_創新互聯，為您提供服務器托管、響應式網站、定制網站、做網站、手機網站建設、網站導航

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯