• 
• 
• 
• 
• 
• 
• 

知識普及 ? 青島網(wǎng)站設計如何突出網(wǎng)頁核心內(nèi)容

青島網(wǎng)站設計如何突出網(wǎng)頁核心內(nèi)容

奈薇網(wǎng)站制作 于2019-07-14 16:54發(fā)表 閱讀次數(shù) 2452次

對圖文信息的提煉以及優(yōu)化，是青島網(wǎng)站設計最重要的一步，如何能夠更加直觀的突出網(wǎng)頁的主題，傳遞頁面內(nèi)容？我們認為至少包括這四個方面：一、對于已經(jīng)確定放置于頁面的信息，如何更好的撰寫文字、挑選圖片才能達成功能性和視覺上美觀的完美統(tǒng)一？二、從網(wǎng)站的整個訴求來講，網(wǎng)頁上需要放置哪些信息才能更好的實現(xiàn)網(wǎng)站的訴求？哪些信息是需要保留的？而哪些信息是需要放置在其他頁面甚至干脆舍棄掉的？三、區(qū)分信息的重要程度，哪些是重要的，需要著重表現(xiàn)的？而哪些是次要一些的信息？四、區(qū)分出信息的主次后，在布局、色彩、尺寸上，即在視覺上如何更好的突出和表現(xiàn)？ 　　這四個部分的每一部分幾乎都有討論不完的話題，那么在這篇文章中我只就第四個方面，也就是網(wǎng)頁上核心內(nèi)容和視覺表現(xiàn)的關系來梳理和概括一下自己在這方面的一些理解，盡量的將我所考慮到的內(nèi)容都寫出來，同時舉一些具體的案例來說明我的觀點，便于大家更好地理解。 　　一、核心內(nèi)容對于頁面布局的影響 　　下圖是一個提供WordPress網(wǎng)站建設的公司，在它的主頁上從上到下可以看到這樣幾部分信息：導航、Logo、口號、作品展示、選擇我們的理由、聯(lián)系表單、日志列表、郵件訂閱、Twitter信息以及版權信息。其中的第一視覺無疑是公司的口號和作品展示，這就是此網(wǎng)站主頁上的核心內(nèi)容。因為作為一個網(wǎng)站建設公司來講，直觀的讓客戶知道你是干什么的？干的怎么樣？應該是客戶最想要了解的內(nèi)容。那么對于核心內(nèi)容，在視覺上做了哪些考慮呢？ 　　我們可以看到，在宣傳口號上設計師給”wordpress”這個詞應用了非常大的文字尺寸，并且顏色上和其他文字區(qū)別開，使用了較深的灰色，強調(diào)本公司是建設專門以wordpress為后臺的網(wǎng)站。在宣傳口號的下方的作品展示圖的尺寸很大，寬度達到了540像素，而整個的設計寬度是1000像素，在主頁上這樣大尺寸的展示圖能夠非常清晰而直接的讓客戶看到作品的原貌，從而對于公司的制作水準有了一個直觀的印象。而這樣的大尺寸的作品展示其實已經(jīng)隱約的決定了整個網(wǎng)站的布局。想想看，在屏幕的左上方區(qū)域擺放上一個寬540像素，高460像素的矩形之后，接下來的區(qū)域該放置哪些信息，其實就像是擺放積木一樣，按照重要程度挨個放置就行了。當然這并非是唯一的布局方式，但是無論何種布局方式，我們的想法都應該在功能性的考慮的范圍內(nèi)進行。所以創(chuàng)意我們可以有，但是要明白和天馬行空的純創(chuàng)意的區(qū)別。 　　如果上面的頁面布局仍然讓人覺得中規(guī)中矩的話，下面的一個酒店的主頁的布局也許會讓我們感覺有些新意?？梢钥吹?，此設計的背景用了大幅的食物圖片，導航和主內(nèi)容區(qū)只占到整個頁面高度的三分之一，讓背景的圖片大面積的呈現(xiàn)出來，和上面的設計一樣，這樣布局的目的并非單純是為了標新立異或者是為了視覺上的美觀，而是該酒店的特色也許就在于餐飲方面，所以為了對核心內(nèi)容進行突出，在布局上做了相應的考慮。再下面的一張餐廳也在主視覺部分強調(diào)了美味的食物，但兩者采用了完全不同的布局方式，雖然各自有信息架構(gòu)方面的獨特考慮，但是也不妨將它們看作同樣一種核心內(nèi)容的兩種不同的創(chuàng)意方式。 　　二、核心內(nèi)容對于色彩方案的影響 　　Lofter是網(wǎng)易提供的輕博客服務，其中的信息類型主要有四類：即：圖片、音樂、文字、視頻。關于Lofer的模板設計，木偶同學在《LOFTER輕博模板設計》一文中對主要展示圖片的模板的有如下設計方面的考慮，”該模板通常是為了滿足攝影用戶，圖片展示面積要夠大，夠爽；模板首頁一屏能看多圖；背景要暗，突顯當前圖片；邊框的設計讓圖片更突出，或讓圖片更精美。”通過分析和理解此設計思路，我們能夠發(fā)現(xiàn)，其中的圖片展示面積要夠大，也就是我們上面提到的布局方面的考慮，而背景要暗即是我們這里要討論的對于色彩方案的影響。 　　另外的一個例子來自于韓國的搜索引擎服務網(wǎng)站Naver。liuman0722在《高效的設計可視化》一文中針對Naver的設計寫到”韓國著名門戶/搜索引擎網(wǎng)站Naver旗下的NaverShopping，其產(chǎn)品定位即提供商品的搜索服務，通過搜索商品名稱，可以按照商品類別列出幾乎韓國所有的大型電子商務網(wǎng)站提供的該商品鏈接。所以在界面上，用強對比色調(diào)突出搜索功能和導航區(qū)（頁面左上角的綠色區(qū)域）。通過視覺化引導，讓用戶專注于核心內(nèi)容，聚焦用戶視線的焦點，在白色為主色調(diào)的頁面，視線會先看到強色調(diào)的部分，所以也可以用強色調(diào)來突出核心內(nèi)容，讓用戶的視覺聚焦在那里。” 　　從木偶同學的完成作品中我們可以看到，按照設計思路做出來的灰色的背景平靜而低調(diào)，和白色的圖片邊框和背景形成鮮明的對比，而灰白的色彩方案和色彩多變的圖片不會沖突，無論圖片怎么變化都能和灰色和白色百搭，所以彩色的圖片在白色的背景和邊框的映襯下更加搶眼，讓照片這樣重要的信息在視覺方面得到了充分的表達。 　　所有的視覺設計都是圍繞信息來做的，我們必須首先梳理好了信息的內(nèi)容和結(jié)構(gòu)，才能知道應該在哪里施以重墨，在哪里點到為止。反過來，很多的設計思路和想法可以說本身已經(jīng)暗含在信息中了，比如我們上面提到的布局和色彩方案。只要提煉和優(yōu)化好了信息，怎么來做其實在梳理信息的過程中就漸漸的明晰了。 　　信息始終是網(wǎng)頁設計的中心，任何的設計都需要為信息傳遞服務，更加直觀的傳遞品牌的寓意。

青島網(wǎng)站設計如何突出網(wǎng)頁核心內(nèi)容相關標簽：網(wǎng)頁設計，開發(fā)網(wǎng)站，制作網(wǎng)頁，網(wǎng)站制作

相關熱點推薦

為中文而設計的文本框 關于網(wǎng)站優(yōu)化五大技巧 如何進行網(wǎng)站首頁改版 web設計師可以走得更 專業(yè)設計網(wǎng)站的公司哪里 青島網(wǎng)站設計的幾點知識 青島網(wǎng)站制作哪家強 交互設計的8項黃金法則 設計良好網(wǎng)頁的4項原則 公司網(wǎng)站制作需要注意的 如何讓你的網(wǎng)站更有吸引 泛泛而談界面中的斑馬紋 網(wǎng)絡營銷的五個階段 青島網(wǎng)站設計成功要素 小型企業(yè)網(wǎng)站維護 奈薇建站網(wǎng)科技2016 國內(nèi)網(wǎng)頁設計經(jīng)驗談 微信營銷推廣的特性-奈 什么是自助建站？ 如何從營銷的角度策劃建 建網(wǎng)站必備六步 基本搜索引擎優(yōu)化策略 新人做站之網(wǎng)站定位與網(wǎng) Web頁面設計原則 個人網(wǎng)站站長看過來網(wǎng)站 網(wǎng)站設計中的簡潔與簡單 以“產(chǎn)品”思維搭建網(wǎng)站 關于VIP用戶研究與產(chǎn) 營銷型網(wǎng)站優(yōu)化需要注意 如何制作友情連接？做友 網(wǎng)站建設目標分析 如何 如何創(chuàng)建一個新的網(wǎng)站 8個實用的友情鏈接技巧 個人網(wǎng)站如何制作才能成 網(wǎng)站搜索引擎優(yōu)化指南 網(wǎng)站描述怎么寫？ 如何提高自己網(wǎng)站的流量 網(wǎng)頁文案設計淺談 個人如何做網(wǎng)站

奈薇建站網(wǎng)青島網(wǎng)站建設公司/青島網(wǎng)站制作公司，專業(yè)提供"氣質(zhì)"型網(wǎng)站建設及精美網(wǎng)站制作服務，同時歡迎各地網(wǎng)站建設公司、網(wǎng)站制作公司代理我們的奈薇建站系統(tǒng)共同發(fā)展

熱點地區(qū)：青島網(wǎng)站建設價格 青島即墨網(wǎng)站制作公司 開發(fā)區(qū)信息港 山東在線門戶