《眾妙之門——網頁排版設計制勝秘訣》——3.4 展現品牌視覺的同時保持網頁的可讀性...

本節書摘來自異步社區《眾妙之門——網頁排版設計制勝秘訣》一書中的第3章,第3.4節,作者: 【德】Smashing Magazine 譯者: 侯景艷 , 范辰 更多章節內容可以訪問云棲社區“異步社區”公眾號查看。

3.4 展現品牌視覺的同時保持網頁的可讀性

為了讓網頁在浩瀚的互聯網世界中脫穎而出,設計師需要讓網頁的視覺設計保持很高的質量。在某些情況下,這意味著你要對網頁進行精心的設計。隨著演示性和風格性的網站越來越受歡迎,一定要為網頁挑選最適合的版式,這一點特別重要。下面,讓我們來看一些風格獨特的網站,它們都在設計中使用了丑和臟的元素。我們已經在文章“The Secrets Of Grunge Design”中看過了這些網站,只是形式不太一樣罷了。

在Pain is Good網站,品牌理念主導著網頁的設計(見下頁)。網頁上大多數文字都被圖片所替代,這讓設計師能夠充分利用品牌識別的力量。

當我們把字體嵌入圖像中,就能以各種富有創意的方式來利用它們。設計師為了強調品牌理念,在商標中使用了“pain(痛苦)”字樣,但因為是圖像而非文字,所以將會被搜索引擎屏蔽。而且頂部的導航欄也做了非常規的處理,致使導航欄元素間的對比很弱,雖然能看清楚,但還是應該稍作改善。


d1387045abdd711fbe225a7addf81545e9036c35

Bart-Jan Verhoef網站則更注重文字而不是視覺元素。設計師精心挑選了一些品牌和設計元素用圖像來表達,但是大部分仍是文字表述。設計氛圍通過背景圖片

營造出來,而文字的功能性未受影響。

這種方式既能營造出“臟”設計的感覺,又能很好地滿足用戶的需求。下面即將講述“將文字看作用戶界面”部分,先讀一讀這個章節的內容,再回過頭看上面的設計,你就能體會個中內涵。


27738003e0739432bd472c4c30894840b6eb0e49

這是一個結合了美觀與可讀性的出色例子:www.subdued.net。

當然,設計師和藝術家還會繼續在可讀性的范疇中探索。最佳的方式就是在個人的設計案例中進行各種設計實踐,比如下面的網站Exp Typo。注意,頁面左下角與舊打字機圖片交疊部分的文字很難辨認。


ec42c2932d669f66536a14336de3785122afeed9

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/259001.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/259001.shtml
英文地址,請注明出處:http://en.pswp.cn/news/259001.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

vs2013創建及使用DLL

這幾天看了許多關于生成Dll的博文,很有感觸,遂整理在此,以供自己后續參考。 VS2013創建DLL 我們使用vs2013來生成Dll,其實使用其他的版本也是同理如此。步驟如下: 單擊“新建項目”,選擇“Win32 項目”&a…

python的作用域分別有幾種_python中作用域與函數嵌套

知識回顧: 拆解傳參。 1.字典傳參。使用** 2.列表傳參。使用* 實際上我們在定義函數的時候,如果省略了星號,那么在調用函數的時候必須要省略星號,除非我們拆解后的參數個數剛好相等。 視頻內容 本節知識視頻教程 文字講解開始&…

這個博客的由來

筆者從事電信行業大型商業智能系統工作多年,日前從事B2C電商網站類數據分析工作,特開設此微博,在發表好文同時,研究網站分析技術。轉載于:https://www.cnblogs.com/sambazhu/p/3508633.html

《Axure RP8 網站和APP原型制作 從入門到精通》一2.7 交付

本節書摘來自異步社區《Axure RP8 網站和APP原型制作 從入門到精通》一書中的第2章,第2.7節,作者 金烏,更多章節內容可以訪問云棲社區“異步社區”公眾號查看 2.7 交付 模型一旦經過批準,我們就可以進入切圖和優化圖像環節了。我…

iOS UISegmentedControl 的使用

當用戶輸入不僅僅是布爾值時,可使用分段控件(UISegmentedControl)。分段控件提供一欄按鈕(有時稱為按鈕欄),但只能激活其中一個按鈕。分段控件會導致用戶在屏幕上看到的內容發生變化。它們常用于在不同類別…

js粘貼板為什么獲取不到圖片信息_【第1829期】復制黏貼上傳圖片和跨瀏覽器自動化測試...

前言這個操作體驗倒是不錯。今日早讀文章由丁香園蔣璇投稿分享。蔣璇, 前端開發攻城獅, 現任職于丁香園. 英語愛好者, 測試驅動開發(TDD)&行為驅動開發(BDD)推崇者. 先專注于 https://github.com/Jiang-Xuan/tuchuang.space 項目的測試驅動開發探索正文從這開始~~在網頁中上…

在C++中調用DLL中的函數

轉載自:http://blog.sina.com.cn/s/blog_53004b4901009h3b.html   應用程序使用DLL可以采用兩種方式:一種是隱式鏈接,另一種是顯式鏈接。在使用DLL之前首先要知道DLL中函數的結構信息。Visual C6.0(或者更先進的版…

CentOS LVS安裝配置

目錄(?)[] 一般2.6.10以上內核版本都已經自帶了ipvsadm,故不需要安裝。 Ipvs 1.25編譯 ipvsadm-1.25編譯不過 去掉netlink庫的依賴:去掉libipvs/Makefile的CFLAGS -DLIBIPVS_USE_NL,去掉Makefile的LIBS -lnl。需要popt庫解析命令行,在這里…

《淘寶網開店 拍攝 修圖 設計 裝修 實戰150招》一一2.7 橫式構圖和豎式構圖...

本節書摘來自異步社區出版社《淘寶網開店 拍攝 修圖 設計 裝修 實戰150招》一書中的第2章,第2.7節,作者: 葛存山,更多章節內容可以訪問云棲社區“異步社區”公眾號查看。 2.7 橫式構圖和豎式構圖 橫幅畫面,即畫面底邊…

Node.js初接觸(一)

本來還在糾結著到底要學哪一種后臺語言呢,突然發現node.js很火,既然能被這么多人推崇,自然是有他的優勢的。去百度百科看了一眼,或許是我理解能力太差,并沒有了解到很多關于node.js的東西,大概就是知道了No…

python request file upload_Python基于requests實現模擬上傳文件

方法1: 1.安裝requests_toolbelt依賴庫 #代碼實現 def upload(self): login_token self.token.loadTokenList() for token in login_token: tempPassword_url self.config[crm_test_api]/document/upload tempPassword_data self.data_to_str.strToDict(title:1.…

MATLAB中的randi函數

randi Pseudorandom integers from a uniform discrete distribution.來自一個均勻離散分布的偽隨機整數 R randi(IMAX,N) returns an N-by-N matrix containing pseudorandom integer values drawn from the discrete uniform distribution on 1:IMAX.返回一個NN的包含偽隨機…

C++ dll的隱式與顯式調用

轉載自:http://blog.sina.com.cn/s/blog_53004b4901009h3b.html   應用程序使用DLL可以采用兩種方式:一種是隱式鏈接,另一種是顯式鏈接。在使用DLL之前首先要知道DLL中函數的結構信息。Visual C6.0&…

《OpenGL ES 2.0游戲開發(上卷):基礎技術和典型案例》——6.5節光照的每頂點計算與每片元計算...

本節書摘來自異步社區《OpenGL ES 2.0游戲開發(上卷):基礎技術和典型案例》一書中的第6章,第6.5節光照的每頂點計算與每片元計算,作者 吳亞峰,更多章節內容可以訪問云棲社區“異步社區”公眾號查看 6.5 光照…

毛筆筆鋒算法IOS版

http://www.merowing.info/2012/04/drawing-smooth-lines-with-cocos2d-ios-inspired-by-paper/#.VUln2_mqpBe轉載于:https://www.cnblogs.com/wangjinming/p/4481145.html

USE PDFCREATE TO CREATE A PDF FILE

來源:http://www.pdfforge.org/files/old_forum/1002.html a working sample with C & COM 2007-08-15 22:56:18 by eckart hi, here is a working sample of how to use PDFCreator in Visual C (after searching on internet for something similar I guess t…

python將一行作為字段_關于python:Django admin在同一行顯示多個字段

我已經創建了一個模型,它將自動顯示模型中的所有字段,并將其顯示在管理頁面上。 現在,我有一個問題,我希望在同一行中有兩個字段,為此,我必須在modeladmin中指定字段集: 1 2 3 4 5fieldsets ( …

c++顯式加載dll并使用DLL的類

轉載自: http://blog.163.com/tianjunqiang666126/blog/static/8725911920121064573594/ 首先需要強調,當使用某個類時一般目的有二:實例化成對象或者繼承它產生新類。對于前者,我們可以構造一個抽象類&a…

如何在Debian上安裝配置ownCloud

如何在Debian上安裝配置ownCloud 據其官方網站,ownCloud可以讓你通過一個Web界面或者WebDAV訪問你的文件。它還提供了一個平臺,可以輕松地查看、編輯和同步您所有設備的通訊錄、日歷和書簽。盡管ownCloud與廣泛使用Dropbox非常相似,但主要區別…

jQuery相當于對 javascript二次開發,所以基于 jQuery實現的各種插件直接調用即可...

jQuery相當于對 javascript二次開發,所以基于 jQuery實現的各種插件直接調用即可轉載于:https://www.cnblogs.com/npk19195global/p/4482363.html