2016-11-14 分類: 網(wǎng)站建設(shè)
今天創(chuàng)新互聯(lián)要談的是網(wǎng)頁設(shè)計風(fēng)格,重點是報紙排版的風(fēng)格。在這篇文章中,你會發(fā)現(xiàn)這種風(fēng)格的最鮮明的特點,并得到一些有用的提示,把你學(xué)到的東西運用到您的項目將獲得更大的收獲。
風(fēng)格是你的網(wǎng)站設(shè)計的一個總的組合方式。風(fēng)格也是你和你的用戶交流的一種方式。每個網(wǎng)站的設(shè)計風(fēng)格都有它自己的組件合集。
網(wǎng)頁設(shè)計中主要的風(fēng)格分類:
1、極簡主義;
2、破舊風(fēng)格;
3、懷舊風(fēng)格與時尚風(fēng)格;
4、插畫風(fēng)格;
5、報紙排版風(fēng)格個與雜志風(fēng)格。
報紙風(fēng)格的設(shè)計最時候用于在線報紙和雜志,因為它們的印刷品也是這個結(jié)構(gòu),所以這樣做用戶體驗會更好。用這個風(fēng)格設(shè)計的網(wǎng)站必須是重視內(nèi)容的。報紙風(fēng)格的網(wǎng)站設(shè)計往往是靠內(nèi)容豐富排版,多列結(jié)構(gòu),簡單的對比色,以及其他真實報刊種常用的手法。
報類網(wǎng)站布局:特點
1. 白紙黑字
傳統(tǒng)印刷的報紙都是白色的紙張黑色(灰、深灰)的字。這種色彩組合讓我們的眼睛非常舒適,可讀性好,這就是為什么報紙一直用這種配色的原因,特別是那種塞滿了內(nèi)容的版面。你也可以選擇黑底白字,但是千萬不要選黑底黃色、綠藍色、粉紅色和藍色等顏色的字體,檢視你的設(shè)計盡量在你的眼睛感覺好了之后再做,你也可以吸取經(jīng)典的色彩并用于你的網(wǎng)頁設(shè)計。
中性的亮和黑是基本色,你還可以使用更多的強調(diào)色。舉例來說,藍色是很好用的標題,紅色是好的按鈕。導(dǎo)航菜單上的各種效果可以用原色的更亮或更暗的色來修飾,或者是一樣調(diào)性的色彩。這樣菜單會比較突出,整體的用戶體驗也會比較好。
2. 極簡主義圖形
報紙排版風(fēng)格的網(wǎng)站界面是干凈的,內(nèi)容翔實的,結(jié)構(gòu)合理的,圖形是表達精準的,極簡主義的。圖形元素有以下幾種:
1、線
2、形狀
3、各種顏色
4、版式樣式
5、紋理
如我們已經(jīng)提到,這類網(wǎng)站用色的種類總是很少。紋理更是少之又少,因為各種質(zhì)感的紋理只會分散讀者的注意力,讓內(nèi)容的可讀性變差。但是紙張的質(zhì)感是可以的,這個很重要,它可以是一個背景紋理,或者是有紙張質(zhì)感的按鈕,又或者只是頁眉和頁腳區(qū)域。
報紙風(fēng)格的設(shè)置總是會基于網(wǎng)格的設(shè)計,或者使用多列布局,減少對形狀和線條的依賴。因為它們有足夠的內(nèi)容去形成你的網(wǎng)站。
3.基于網(wǎng)格的設(shè)計或多列式排版
報紙風(fēng)格的網(wǎng)站布局會有一個好的組織結(jié)構(gòu),這些都是內(nèi)容豐富的網(wǎng)站,所以結(jié)構(gòu)一重要。網(wǎng)格和柵格是內(nèi)容排版好工具。這是是事實,“精心設(shè)計的網(wǎng)格系統(tǒng)可以使您的設(shè)計不僅美觀而且清晰實用(馬克博爾頓)” 網(wǎng)格布局設(shè)計的頁面會讓你的內(nèi)容突破條條框框,從而吸引用戶閱讀你的內(nèi)容而不離開。
相似而不相同的是多列柵格布局。這些可能有很多適合高度的柵格,但是寬度不一樣。柵格越寬闊可讀性越好。2種柵格會有一個很好的外觀,雖然3種柵格或更多當(dāng)然會更好。柵格和網(wǎng)格能很好的區(qū)分內(nèi)容,讓用戶更容易找到他感興趣的板塊。當(dāng)你使用這種布局的時候,你不能忘記柵格的空格。如果柵格太緊,網(wǎng)頁上的內(nèi)容就會非常難讀。
4.標題和摘要
當(dāng)你進入一個文字內(nèi)容很多的網(wǎng)站或博客的時候你會打開每一篇么?標題會讓我們區(qū)分感興趣的和不重要的內(nèi)容。所以每個內(nèi)容板塊需要有標題,哪怕這個區(qū)塊在網(wǎng)格和柵格中很小,它都必須有標題,標題的字體要大,最好是加粗的字體和色彩不同,這樣會更清晰。
摘要文字是對文章簡短的描述,這些經(jīng)常會讓讀者更容產(chǎn)生興趣,讓他們更容易理解長篇的文字內(nèi)容,摘要這個元素是非常好用的,特別是博客、新聞類的網(wǎng)站。
5.主要和次要內(nèi)容
有一種老的辦法,就是繪制一條粗線在你的內(nèi)容之間,當(dāng)然形式不限,這樣會定義那些是最重要的那些是等待被讀的文字。例如:你能給你的前臺頁面中的文章頁面設(shè)計一個大標題。這是一個有特征的區(qū)域,包含大圖和圖形。其他的內(nèi)容將會更小并根據(jù)網(wǎng)格系統(tǒng)排列。這樣將會更容易分享新內(nèi)容,并且獲取更多分享。
6.直觀和一致的導(dǎo)航
報紙風(fēng)格的網(wǎng)站排版是為內(nèi)容而設(shè)計的,而且這些內(nèi)容必須能容易被導(dǎo)航,由此可見,導(dǎo)航菜單的特征就是簡單,和正確的位置。
最好的位置在頁面頂部,因為這塊區(qū)域是最先被注意到的,而且總是在同樣的地方,如果你在頁面底部,你只需要滾動頁面。如果,你喜歡垂直導(dǎo)航,而且非要不可,讓你的菜單在左邊垂直,因為我們的閱讀習(xí)慣是從左至右的。
報紙風(fēng)格的網(wǎng)站分享出大量的文字內(nèi)容,這些內(nèi)容都需要能傳達給用戶。
7.分類目錄
更好的分類目錄可以讓報紙風(fēng)格的網(wǎng)站有更好的布局效果,這種情況在博客上效果更明顯,其他網(wǎng)站也是。很多網(wǎng)站沒做好就是內(nèi)容沒組織好。分類目錄,在那些經(jīng)常發(fā)布大量不同內(nèi)容的網(wǎng)站(新聞類)是非常必要的。
將您的內(nèi)容進行分類,并將其顯示在菜單欄上。
8. 廣告位
在你的網(wǎng)站火起來前,你有考慮會如何利用它賺錢么?廣告是許多站長賺錢的好工具。廣告banner放置的地方必須要定義好。正確的地方是側(cè)邊欄、左、右、頁眉或頁腳。宣傳的banner經(jīng)常在文字中間。這對你的廣告位買家是好事,而且這些也可以刺激你的讀者。
9. 功能邊欄工具條
邊欄不僅僅只是放廣告,也可以放文章目錄、最新內(nèi)容、搜索框、電子郵件、導(dǎo)航、社交按鈕、折扣或誘惑活動等。報紙風(fēng)格的網(wǎng)站邊欄是一個很好的位置,因為這里只是一個柵格而已。
邊欄設(shè)計相關(guān)的要素:
1、尺寸(高和寬)
2、顏色
3、字體
4、位置
邊欄一般小于普通的柵格布局,不能做大,色彩保持中型,字體大小要可視,位置在頁面的左邊還是右邊?我們之前已經(jīng)說過,放在左邊就是一切,因為用戶會立刻看到。
10. 大化留白
無論我們設(shè)計了多少網(wǎng)站,功能有多多,我們都不能忘記要留白,因為留白是報紙類網(wǎng)頁設(shè)計風(fēng)格的必要組成部分。讓柵格之間留白,讓空白存在于側(cè)面和底部 ,用戶必須有機會讓他們的眼鏡離開如墻一般的文本,去休息一會,并且思考。
一般情況下,留白被看作是沒有內(nèi)容的。在狹義上還有一層意思:留白是指行與行之間,字與字之間和內(nèi)容元素周邊。留白會讓你的網(wǎng)站可讀性更高,更簡潔,即便是你的網(wǎng)站內(nèi)容很多也如此。
11. 經(jīng)常更新
報紙風(fēng)格的網(wǎng)站布局必須有不斷的內(nèi)容補充與更新。因為用網(wǎng)格和柵格設(shè)計的網(wǎng)頁如果沒有充足的內(nèi)容會很難看,因此你必須徹底填滿你的網(wǎng)站,并且保持更新,保持與時事熱點接軌。
內(nèi)容和頻率像是一對情侶,就想國王和王后。保持內(nèi)容更新除了會讓你的網(wǎng)站好看,還可以讓搜索引擎更多的收錄你的內(nèi)容,從而影響人們的搜索結(jié)果。如果你的內(nèi)容是過時的,人們會很少看你的網(wǎng)站,搜索引擎也一樣(如:百度和谷歌等),你的網(wǎng)站在搜索引擎的權(quán)重就會很低。
12. 開通社交軟件分享功能
博客和新聞類網(wǎng)站報紙風(fēng)格用得最多,而這些網(wǎng)站沒有社交媒體的整合就不能存在?,F(xiàn)在是大眾分享時代,人們在社會網(wǎng)絡(luò)上花費了大量時間。所以你的網(wǎng)站一定要有社交網(wǎng)絡(luò)分享按鈕,如:微博、微型、Facebook、谷歌、LinkedIn等,沒有這些功能,你如果沒這些功能,就等于放棄了大量入口。
還有一件事,就是報紙風(fēng)格類網(wǎng)站必須是響應(yīng)式的,這種布局效果無論在什么設(shè)備上都需要保持不變,移動類的網(wǎng)站不能有邊欄,而且最好重新設(shè)計導(dǎo)航,因為移動網(wǎng)站滾動用得比點擊多。
本文題目:報紙排版風(fēng)格的網(wǎng)頁設(shè)計原則
分享網(wǎng)址:http://jinyejixie.com/news/67506.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計公司、App設(shè)計、Google、營銷型網(wǎng)站建設(shè)、企業(yè)建站、網(wǎng)站內(nèi)鏈
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容