• 
• 
• 
• 
• 
• 
• 

知識普及 ? 網(wǎng)頁的設(shè)計(jì)中應(yīng)注意內(nèi)容、功能、表現(xiàn)三個(gè)方面

網(wǎng)頁的設(shè)計(jì)中應(yīng)注意內(nèi)容、功能、表現(xiàn)三個(gè)方面

奈薇網(wǎng)站建設(shè) 于2020-04-10 11:40發(fā)表 閱讀次數(shù) 2211次

首先網(wǎng)站的本質(zhì)主題具有形式主義，其中包括內(nèi)容、功能、表現(xiàn)這三點(diǎn)內(nèi)容在內(nèi)也體現(xiàn)了三個(gè)網(wǎng)站的要素要在里面，同時(shí)低保真原型也解決了網(wǎng)站基礎(chǔ)內(nèi)容層面的問題，而高保真線框圖也給我們規(guī)劃了網(wǎng)站的功能和表現(xiàn)，內(nèi)容主要是網(wǎng)站最基本最重要的核心，因此高保真原型也必須建立在低保真原型的基礎(chǔ)上面，給我們大家直接進(jìn)行了頁面的細(xì)節(jié)規(guī)劃是一種本末倒置的一種錯(cuò)誤行為體現(xiàn)。 　　對交互形式進(jìn)行區(qū)分，可以看作對線框圖圖例的一種補(bǔ)充;這種增補(bǔ)可能根據(jù)不同網(wǎng)站的需要有所社區(qū)，甚至提供一些非常獨(dú)特的圖例，比如在規(guī)劃一個(gè)房地產(chǎn)SNS社區(qū)的過程中，甚至可以增加Icon圖例，這樣做的好處不僅僅是給其他設(shè)計(jì)實(shí)現(xiàn)人員以提示和方便，并且使得高保真原型具有“可讀性”，更趨近于最后的頁面結(jié)果。 　　某房地產(chǎn)SNS網(wǎng)站線框圖中的Icon圖例↑ 　　使用顏色對頁面“可交互”部分進(jìn)行區(qū)分↓ 　　區(qū)分有鏈接的文本和無鏈接文本是非常重要的工作，在低保真原型中你可能完全可以不理會它們，然而對于高保真線框圖則必須區(qū)分哪些文本是可以點(diǎn)擊的，哪些純?yōu)g覽文本;對于標(biāo)題級的文本，應(yīng)該使用較大字體，同時(shí)賦予一個(gè)淺色的背景進(jìn)行標(biāo)識;那些沒有鏈接的文字段落，可以使用首行縮進(jìn)的多條灰色背景代表它們(真正的頁面中可以沒有縮進(jìn));如果時(shí)間充裕，更推薦以真實(shí)的文字去填充頁面中的段落部分。 　　無處不在的柵格系統(tǒng)↓ 　　柵格系統(tǒng)已經(jīng)在網(wǎng)頁設(shè)計(jì)中被普遍的采納，網(wǎng)絡(luò)中已經(jīng)有諸多的介紹性文章，更可以參考960.gs的相關(guān)代碼進(jìn)行具體的應(yīng)用;不要以為柵格系統(tǒng)只對視覺設(shè)計(jì)師有幫助，在高保真線框圖的設(shè)計(jì)中同樣可以獲得非常大的幫助;類似Visio和Axure這樣的原型設(shè)計(jì)軟件都提供了強(qiáng)大的輔助線和網(wǎng)格對齊支持，能夠讓你輕松的實(shí)現(xiàn)線框圖中的柵格。 　　區(qū)分“可交互”的部分 　　討論內(nèi)容的形式主義，并非要簡單的區(qū)分哪些是圖片，哪些是文字，哪些是Flash動(dòng)畫……而是要將那些用戶可交互的內(nèi)容進(jìn)行延展和變換;在這里談及的交互就是人與機(jī)器的互動(dòng)，對于萬維網(wǎng)而言，最常見的就是鼠標(biāo)響應(yīng)和鍵盤響應(yīng)。 　　使用顏色對不同的頁面元素類型進(jìn)行標(biāo)注是十分有效的方法，比如： 　　綠色代表超級鏈接 　　橙色代表表單項(xiàng)目 　　紫色代表Js效果 　　在高保真線框圖中建立柵格系統(tǒng) 　　帶有柵格系統(tǒng)的高保真原型是最接近真實(shí)頁面的設(shè)計(jì)(甚至可以認(rèn)為選擇合理的柵格系統(tǒng)是建立高保真線框圖的第一步驟)，具有以下三個(gè)優(yōu)勢： 　　優(yōu)勢一：通過柵格控制屏幕資源 　　內(nèi)容形式主義的核心就是對屏幕資源進(jìn)行規(guī)劃，建立柵格系統(tǒng)能夠?qū)撁娴恼w和局部尺寸進(jìn)行有效的把握，提高原型的真實(shí)度和適應(yīng)性。 　　例如，在以60像素為基準(zhǔn)的柵格系統(tǒng)中，可以實(shí)現(xiàn)適應(yīng)標(biāo)準(zhǔn)屏幕尺寸(800px×600px)的兼容，整個(gè)網(wǎng)站的頁面風(fēng)格提供強(qiáng)大的伸縮。 　　能夠適應(yīng)800*600標(biāo)準(zhǔn)屏幕分辨率的線框圖柵格 　　優(yōu)勢二：輕松實(shí)現(xiàn)整站圖片尺寸規(guī)劃 　　將那些具有內(nèi)容意義的圖片(非裝飾圖)放手給沒有經(jīng)驗(yàn)的視覺設(shè)計(jì)師，往往會帶來災(zāi)難性的后果，這也是很多看起來很美的設(shè)計(jì)與實(shí)際效果相差懸殊的主要原因;既然已經(jīng)決定進(jìn)行高保真原型設(shè)計(jì)，就肯定要對視覺設(shè)計(jì)層面的工作進(jìn)行干預(yù);內(nèi)容圖片是伴隨內(nèi)容經(jīng)常更換的，本身更貼近交互設(shè)計(jì)的范疇，在某些時(shí)候，視覺設(shè)計(jì)應(yīng)該合理讓路。 　　基于柵格系統(tǒng)的基準(zhǔn)寬度，通常需要規(guī)劃2~3個(gè)常用的寬高比例，并且按照頁面的需要進(jìn)行尺寸的規(guī)劃;這一系列的圖片尺寸應(yīng)該在高保真線框圖開始之前，柵格系統(tǒng)確立之后，就準(zhǔn)備妥當(dāng)，用來做內(nèi)容填充時(shí)使用。 　　包含兩個(gè)固定比例和一個(gè)可伸縮比例的整站圖片尺寸規(guī)劃 　　優(yōu)勢三：形成線框圖的塊級復(fù)用 　　網(wǎng)頁設(shè)計(jì)的靈活源自規(guī)劃中的塊級復(fù)用。通?？梢园涯硯讉€(gè)相關(guān)的內(nèi)容元素形成一個(gè)“內(nèi)容塊”，在頁面的制作過程中，這些塊可能是一個(gè)div、ol、ul、dl級的標(biāo)記語言;由于Web頁面是一種縱向的延展，因此在線框圖的高保真設(shè)計(jì)中主要是依據(jù)柵格系統(tǒng)對塊級內(nèi)容的寬度進(jìn)行規(guī)劃;在常用寬度確定之后，就可以輕松的實(shí)現(xiàn)“乾坤大挪移”，縮減設(shè)計(jì)工作量，提高團(tuán)隊(duì)的設(shè)計(jì)執(zhí)行效率(視覺設(shè)計(jì)師們也很歡迎這種規(guī)劃)。 　　曾經(jīng)有人斷言萬維網(wǎng)已經(jīng)進(jìn)入了讀圖時(shí)代，也在“眼球經(jīng)濟(jì)”的影響下，網(wǎng)站渴望每個(gè)內(nèi)容元素都得到用戶的充分關(guān)注，越來越多的Web界面使用圖片作為內(nèi)容傳達(dá)形式，這也帶來了訪問速度緩慢和搜索引擎優(yōu)化的難度，使圖文搭配進(jìn)行了內(nèi)容的形勢化，而從一個(gè)側(cè)面反映了它們之間的強(qiáng)弱關(guān)系，也是一件非常輕松的事情。

網(wǎng)頁的設(shè)計(jì)中應(yīng)注意內(nèi)容、功能、表現(xiàn)三個(gè)方面相關(guān)標(biāo)簽：網(wǎng)站制作公司，網(wǎng)絡(luò)公司，做網(wǎng)站，網(wǎng)站建設(shè)公司

相關(guān)熱點(diǎn)推薦

淺談品牌的視覺識別 怎樣充分利用你的網(wǎng)站設(shè) TDK是什么？有什么作 微信為什么這么人在用 網(wǎng)站排名第三頁不到首頁 青島網(wǎng)站設(shè)計(jì)中關(guān)于al 好設(shè)計(jì)應(yīng)該是平凡的設(shè)計(jì) 網(wǎng)站LOGO簡論 網(wǎng)頁布局設(shè)計(jì)基礎(chǔ) 優(yōu)秀網(wǎng)站的五大特點(diǎn) 新站快速推廣經(jīng)驗(yàn)，百度 為中文而設(shè)計(jì)的文本框 關(guān)于網(wǎng)站優(yōu)化五大技巧 如何進(jìn)行網(wǎng)站首頁改版 web設(shè)計(jì)師可以走得更 專業(yè)設(shè)計(jì)網(wǎng)站的公司哪里 青島網(wǎng)站設(shè)計(jì)的幾點(diǎn)知識 青島網(wǎng)站制作哪家強(qiáng) 交互設(shè)計(jì)的8項(xiàng)黃金法則 設(shè)計(jì)良好網(wǎng)頁的4項(xiàng)原則 公司網(wǎng)站制作需要注意的 如何讓你的網(wǎng)站更有吸引 泛泛而談界面中的斑馬紋 網(wǎng)絡(luò)營銷的五個(gè)階段 青島網(wǎng)站設(shè)計(jì)成功要素 小型企業(yè)網(wǎng)站維護(hù) 奈薇建站網(wǎng)科技2016 國內(nèi)網(wǎng)頁設(shè)計(jì)經(jīng)驗(yàn)談 網(wǎng)頁設(shè)計(jì)：如何確定網(wǎng)站 微信營銷推廣的特性-奈 什么是自助建站？ 如何從營銷的角度策劃建 建網(wǎng)站必備六步 基本搜索引擎優(yōu)化策略 新人做站之網(wǎng)站定位與網(wǎng) Web頁面設(shè)計(jì)原則 個(gè)人網(wǎng)站站長看過來網(wǎng)站 網(wǎng)站設(shè)計(jì)中的簡潔與簡單 以“產(chǎn)品”思維搭建網(wǎng)站 關(guān)于VIP用戶研究與產(chǎn)

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

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