更負(fù)責(zé)的品牌升級(jí)戰(zhàn)略實(shí)效機(jī)構(gòu)

400-021-0866

首頁(yè) 作品案例 品牌全案 服務(wù)項(xiàng)目 品牌升級(jí) 豪禾智庫(kù) 關(guān)于豪禾 聯(lián)系我們

網(wǎng)站設(shè)計(jì)版面布局的技巧(轉(zhuǎn)載)

時(shí)間:2016-08-24 22:55:57 來(lái)源:上海品牌設(shè)計(jì) 閱讀量: 作者:豪禾品牌咨詢
  首頁(yè):網(wǎng)站的門(mén)面,猶如公司的形象,分外注重設(shè)計(jì)和規(guī)劃。
  框架頁(yè):網(wǎng)站的首要結(jié)構(gòu)頁(yè)面,又稱次首頁(yè)、內(nèi)頁(yè),年夜型網(wǎng)站每每框架頁(yè)即首頁(yè),如一些門(mén)戶網(wǎng)站。框架頁(yè)首要是網(wǎng)站內(nèi)部首要欄目標(biāo)首頁(yè),講求作風(fēng)的同等性,并于主頁(yè)照應(yīng)。 
  通俗頁(yè):網(wǎng)站首要的承載信息的頁(yè)面,設(shè)計(jì)要求不高,但要求鏈接精確、筆墨無(wú)誤、圖文并茂,并因循網(wǎng)頁(yè)的作風(fēng)。 
  彈出頁(yè):一樣平常用于告白、新聞、新聞、到其他網(wǎng)站的鏈接等等,一樣平常用的很少。 
  經(jīng)由過(guò)程上面的闡發(fā),咱們可以看出: 
  從功效上來(lái)看,首頁(yè)首要負(fù)擔(dān)著建立企業(yè)形象(當(dāng)然不僅僅是首頁(yè))的作用,框架頁(yè)在導(dǎo)航方面起側(cè)緊張的作用,康復(fù)比各欄目?jī)?nèi)部首要內(nèi)容的先容,都可以在框架頁(yè)中體現(xiàn)再進(jìn)入通俗頁(yè),讓閱讀者可以或許敏捷相識(shí)網(wǎng)站各欄目標(biāo)首要內(nèi)容,擇其需要而閱讀,而通俗頁(yè)則是首要的信息頁(yè)面,也是網(wǎng)站的終極頁(yè)面,對(duì)付年夜型網(wǎng)站,這種結(jié)構(gòu)異常緊張,而對(duì)付中小型企業(yè),網(wǎng)站范圍較小、頁(yè)面數(shù)目不多,有時(shí)框架頁(yè)就起著通俗頁(yè)的作用,至于彈出頁(yè),倡議您不是需要,最康復(fù)不要用。下面具體先容各頁(yè)面的設(shè)計(jì)技能:
  一、首頁(yè)設(shè)計(jì)技能 
  網(wǎng)站首頁(yè)是企業(yè)網(wǎng)上的虛構(gòu)門(mén)面,在此,提示上彀的企業(yè)注重本身門(mén)面的設(shè)計(jì),決不克不迭搪塞了事、敷衍了事。咱們會(huì)常??吹接∷⒕傻漠a(chǎn)物目次或告白,當(dāng)您屢屢看到那些印有產(chǎn)物目次或告白的精巧印刷成品的時(shí)刻,信任您或多或少會(huì)對(duì)有關(guān)的產(chǎn)物形成一種康復(fù)感,縱然您不會(huì)購(gòu)置,也必然對(duì)這些產(chǎn)物形成必定水平的認(rèn)同。而對(duì)付設(shè)計(jì)毛糙的鼓吹品,您確定會(huì)狐疑其內(nèi)容的真實(shí)性,從而對(duì)其產(chǎn)物或效勞發(fā)生質(zhì)疑??祻?fù),如今說(shuō)說(shuō)網(wǎng)站的設(shè)計(jì),信任您會(huì)批準(zhǔn)這種說(shuō)法:網(wǎng)站的頁(yè)面就康復(fù)比是“無(wú)紙的印刷品”。既然如斯,咱們會(huì)是以而得出一個(gè)論斷:優(yōu)良和專業(yè)網(wǎng)站的設(shè)計(jì),猶如制造精巧的印刷品,會(huì)年夜年夜刺激花費(fèi)者(拜訪者)的購(gòu)置欲望,反之,您公司所提供的產(chǎn)物或效勞將不會(huì)給花費(fèi)者(拜訪者)留下較康復(fù)的印象。值得一提的是,除非您的企業(yè)有專業(yè)的網(wǎng)站規(guī)劃、設(shè)計(jì)職員,不然您最康復(fù)找專業(yè)公司或?qū)I(yè)職員為您設(shè)計(jì)制造,一個(gè)優(yōu)異的專業(yè)設(shè)計(jì)職員會(huì)很快明確您的用意,并依據(jù)您的建站目標(biāo)提出建設(shè)性的定見(jiàn)。
  一樣平常來(lái)說(shuō),網(wǎng)站首頁(yè)的情勢(shì)不過(guò)乎有兩種,一種是純潔的形象展現(xiàn)型,這品種型筆墨信息較少,圖像信息較多,經(jīng)由過(guò)程藝術(shù)外型和設(shè)計(jì)結(jié)構(gòu),應(yīng)用一系列與公司形象和產(chǎn)物、效勞有關(guān)的圖像、筆墨信息,構(gòu)成一幅生動(dòng)的畫(huà)面,向閱讀者展現(xiàn)一種形象、一個(gè)氣氛,從而吸收閱讀者進(jìn)入閱讀。這需要設(shè)計(jì)者具有優(yōu)越的設(shè)計(jì)根基和審美才能,可以或許盡力發(fā)掘企業(yè)深層的內(nèi)在,展現(xiàn)企業(yè)文明。這品種型的首頁(yè)在設(shè)計(jì)進(jìn)程中必定要明確要以設(shè)計(jì)為主導(dǎo),經(jīng)由過(guò)程顏色、結(jié)構(gòu)給拜訪者留下深入的印象,當(dāng)然,咱們不克不迭為了設(shè)計(jì)而設(shè)計(jì),咱們的目標(biāo)是營(yíng)銷,在設(shè)計(jì)進(jìn)程中必定要切記這一點(diǎn)!
  另一種是信息枚舉型,一樣平常的年夜、中型企業(yè)網(wǎng)站和門(mén)戶網(wǎng)站常用的體式格局,即在首頁(yè)中就枚舉出網(wǎng)站的首要內(nèi)容分類、重點(diǎn)信息、網(wǎng)站導(dǎo)航、公司信息等等,也便是咱們上面談到的框架頁(yè),這種作風(fēng)比擬得當(dāng)網(wǎng)站信息量年夜,內(nèi)容豐碩的網(wǎng)站,由于是以展現(xiàn)信息為主,這是的設(shè)計(jì)就要在細(xì)微之處體現(xiàn)企業(yè)形象,倡議設(shè)計(jì)職員最康復(fù)細(xì)心閱讀企業(yè)的CI手冊(cè),熟悉企業(yè)標(biāo)記、祥瑞物、字體及用色尺度,在網(wǎng)站的局部體現(xiàn)出來(lái),每每平庸之中一個(gè)柔美的相符企業(yè)特色的曲線就可以或許給人以深入的印象,從而將企業(yè)形象印在閱讀者的腦海里。設(shè)計(jì)職員在設(shè)計(jì)進(jìn)程中要注重運(yùn)用這些言語(yǔ)符號(hào)來(lái)抒發(fā)一種奇特的企業(yè)信息。
  二、作風(fēng)堅(jiān)持同等——內(nèi)頁(yè)設(shè)計(jì)技能 
  若何堅(jiān)持網(wǎng)站作風(fēng)的同等,是進(jìn)行內(nèi)頁(yè)設(shè)計(jì)進(jìn)程中斟酌的緊張方面,依據(jù)我的履歷,您可以測(cè)驗(yàn)考試以下幾種設(shè)計(jì)體式格局: 
  1、結(jié)構(gòu)的同等性:咱們曉得,網(wǎng)站的統(tǒng)一性在網(wǎng)站營(yíng)銷中占緊張位置,而網(wǎng)站結(jié)構(gòu)是網(wǎng)站作風(fēng)統(tǒng)一的緊張手腕,包含網(wǎng)站結(jié)構(gòu)、筆墨排版、裝潢性元素呈現(xiàn)的位置、導(dǎo)航的統(tǒng)一、圖片的位置等等,到國(guó)外有名的電子商務(wù)網(wǎng)站閱讀,你會(huì)發(fā)現(xiàn)這些網(wǎng)站結(jié)構(gòu)驚異的同等性,所分歧的是顏色或內(nèi)容,在結(jié)構(gòu)的同等性中,咱們要夸大網(wǎng)站標(biāo)忘性元素的同等性,即網(wǎng)站或公司稱號(hào)、網(wǎng)站或企業(yè)標(biāo)記、導(dǎo)航及輔助導(dǎo)航的情勢(shì)及位置、公司接洽信息等,這種體式格局是今朝網(wǎng)站廣泛采納的結(jié)構(gòu),一方面削減設(shè)計(jì)、開(kāi)發(fā)的事情量,同時(shí)更有利于以后的網(wǎng)站維護(hù)與更新。
  2、顏色的同等性:體式格局是堅(jiān)持站點(diǎn)主體顏色的同等,只轉(zhuǎn)變局部色塊,長(zhǎng)處是一個(gè)奇特顏色的網(wǎng)站會(huì)給人留下很深入的印象,由于人的視覺(jué)對(duì)顏色要比結(jié)構(gòu)更敏感,更容易在年夜腦中形成影象符號(hào)。在顏色的同等性中,咱們夸大的是假如企業(yè)有自身的CI形象,最康復(fù)在互聯(lián)網(wǎng)中因循這個(gè)形象,給觀眾網(wǎng)上彀下同等的感覺(jué),更有利于企業(yè)形象的建立。一個(gè)倡議是拔取一兩種首要顏色,幾種輔助顏色。
  3、應(yīng)用導(dǎo)航取得統(tǒng)一:導(dǎo)航是網(wǎng)站的一項(xiàng)緊張構(gòu)成部門(mén),一個(gè)精彩的富有企業(yè)特征的導(dǎo)航將會(huì)給人留下深入的印象,康復(fù)比將標(biāo)記的形態(tài)寓于導(dǎo)航之中,或?qū)?dǎo)航設(shè)計(jì)在整個(gè)網(wǎng)站結(jié)構(gòu)之中等等紛歧而足,花點(diǎn)力量在導(dǎo)航上,也會(huì)設(shè)計(jì)出一個(gè)精彩的站點(diǎn)。
  4、分外元素的同等性:在網(wǎng)站設(shè)計(jì)中,個(gè)體具有特色的元素(如標(biāo)記、意味圖形、局部設(shè)計(jì)等)反復(fù)呈現(xiàn),也會(huì)給拜訪者留下深入印象??祻?fù)比網(wǎng)站結(jié)構(gòu)在某一點(diǎn)上的變遷,由直線變?yōu)閳A弧、暗色裝點(diǎn)的亮色、顏色中的補(bǔ)色等等。
  5、應(yīng)用圖像取得統(tǒng)一: 網(wǎng)頁(yè)中的圖像在運(yùn)用上必定要甚之又甚,尤其是一些動(dòng)畫(huà),網(wǎng)頁(yè)中充滿著各類無(wú)關(guān)緊要的動(dòng)畫(huà),而這些動(dòng)畫(huà)基本與本企業(yè)內(nèi)容無(wú)關(guān)!當(dāng)真反省網(wǎng)頁(yè)中的動(dòng)畫(huà),將沒(méi)用的刪失落!這里咱們所說(shuō)的應(yīng)用圖像取得統(tǒng)一,決不是在每頁(yè)中放置幾個(gè)動(dòng)畫(huà)!而是作為網(wǎng)站結(jié)構(gòu)一部門(mén)的局部圖像,依據(jù)網(wǎng)頁(yè)內(nèi)容的分歧,配以響應(yīng)的圖像或動(dòng)畫(huà),從而給閱讀者形成頁(yè)面的持續(xù)性。
  6、應(yīng)用配景取得統(tǒng)一:從手藝上而言,網(wǎng)頁(yè)配景包含配風(fēng)光和配景圖像兩種,一樣平常來(lái)說(shuō),咱們并不倡導(dǎo)運(yùn)用配景圖像,而運(yùn)用配風(fēng)光或色塊。緣故原由很顯著,第一,下載速率,配風(fēng)光的下載速率疏忽不計(jì),而配景圖像就得依據(jù)圖像字節(jié)年夜小下載了,這里需要闡明的是,假如你的配景圖像比擬深,那么最康復(fù)將配風(fēng)光置為深色調(diào)(默許的配風(fēng)光是白色),如許在期待閱讀器下載配景圖片的時(shí)刻前面的淡色筆墨可以很容易閱讀,由于假若有配風(fēng)光,閱讀器先將其下載,然后下載配景圖片;第二,顯示后果,常??吹胶?nèi)一些網(wǎng)站設(shè)有配景圖像,或者是公司的廠房、辦公年夜樓,或者是產(chǎn)物圖片,乃至是某或人物的照片,使得前面的筆墨很難識(shí)別!給人一種很不愜意的感覺(jué),讓人無(wú)奈停頓。在此,提示您注重:有用應(yīng)用配景取得網(wǎng)站統(tǒng)一和專業(yè)化的辦法有以下幾種:
  第一,熟悉到并不是所有的圖片都可以作為配景,在斟酌設(shè)置網(wǎng)站配景圖像的時(shí)請(qǐng)您注重; 
  第二,增強(qiáng)與遠(yuǎn)景的明暗對(duì)照,即要么淡化配景,隱模糊約可以看到即可,要么加深配景,而將前面的筆墨亮化。 
  那么什么得當(dāng)網(wǎng)頁(yè)配景呢?一個(gè)康復(fù)的倡議是將公司的標(biāo)記、意味性的簡(jiǎn)單圖片作為配景,并將其淡化,使閱讀者在閱讀網(wǎng)站內(nèi)容的同時(shí)不經(jīng)意記下公司的標(biāo)記。已經(jīng)一個(gè)網(wǎng)站的配景設(shè)計(jì)給我留下深入的印象:?jiǎn)紊渚爸幸粋€(gè)網(wǎng)站標(biāo)記的居中放年夜淡化,前面元素中也賡續(xù)反復(fù)這個(gè)標(biāo)記:如提交按紐外形銳意設(shè)計(jì)成標(biāo)記的情勢(shì)等等,在整個(gè)頁(yè)面中形成特有元素在年夜小、明暗及位置的照應(yīng),很康復(fù)地塑造了網(wǎng)站的特有形象。
  三、顏色搭配 
  網(wǎng)頁(yè)中最難處置的也便是顏色搭配的問(wèn)題了。若何運(yùn)用最簡(jiǎn)單的顏色抒發(fā)最豐碩的寄義,體現(xiàn)企業(yè)形象是網(wǎng)頁(yè)設(shè)計(jì)職員需要賡續(xù)進(jìn)修、摸索的課題。若何進(jìn)行顏色搭配是一門(mén)學(xué)問(wèn),下面的一些辦法是我在理論進(jìn)程中的領(lǐng)會(huì),愿望可以或許為您起到必定的參考作用。
  1、運(yùn)用雷同色系顏色:所謂雷同色系,是指幾種顏色在360色相環(huán)上位置十分相近,年夜約在45擺布或統(tǒng)一顏色分歧明度的幾種顏色這種搭配的長(zhǎng)處是易于使網(wǎng)頁(yè)顏色趨于同等,對(duì)付網(wǎng)頁(yè)設(shè)計(jì)新手有很康復(fù)的自創(chuàng)作用,這種用色體式格局容易塑造網(wǎng)頁(yè)協(xié)調(diào)統(tǒng)一的氣氛,毛病是容易形成頁(yè)面的單調(diào),是以每每應(yīng)用局部參加對(duì)照色來(lái)增長(zhǎng)變遷,如局部對(duì)照顏色的圖片等。這種辦法不失為一種設(shè)計(jì)的康復(fù)辦法。
  2、運(yùn)用對(duì)照色或互補(bǔ)色:所謂對(duì)照色,是指色相環(huán)相距較遠(yuǎn),年夜約在100擺布,視覺(jué)后果鮮亮、猛烈,而互補(bǔ)色則是色相環(huán)上相距最遠(yuǎn)的連種顏色,即相距180,其對(duì)照關(guān)系最猛烈、最富有刺激性,每每使畫(huà)面十分凸起,這種用色體式格局容易塑造生動(dòng)、韻動(dòng)的網(wǎng)頁(yè)后果,分外得當(dāng)體現(xiàn)輕松、踴躍的素材的網(wǎng)站,毛病是容易形成顏色的花,運(yùn)用中注重顏色運(yùn)用的度。
  值得注重的是,以上兩種用色體式格局在現(xiàn)實(shí)應(yīng)用中要注重主體顏色的運(yùn)用,即以一種或兩種顏色為主,其它顏色為輔,不要幾種顏色等量運(yùn)用,以免形成顏色的凌亂。 
  3、運(yùn)用過(guò)渡色:過(guò)渡色可以或許神奇地將幾種不協(xié)調(diào)的顏色統(tǒng)一路來(lái),在網(wǎng)頁(yè)中合理地運(yùn)用過(guò)渡色可以或許使你的顏色搭配手藝更上一層樓。過(guò)渡色包含幾種情勢(shì):兩種顏色的中央色調(diào)、單色中混入黑、白、灰進(jìn)行折衷以及單色中混入雷同顏色進(jìn)行折衷等等,您可以本身測(cè)驗(yàn)考試調(diào)配,在以后的更新中,我會(huì)專題先容若何運(yùn)用過(guò)渡色。
  四、版面結(jié)構(gòu) 
  一樣平常來(lái)說(shuō),企業(yè)網(wǎng)站首頁(yè)的結(jié)構(gòu)比擬機(jī)動(dòng),側(cè)重設(shè)計(jì),這里我所說(shuō)的結(jié)構(gòu)首要是指內(nèi)頁(yè)的版面結(jié)構(gòu)。中、小型企業(yè)網(wǎng)站的內(nèi)頁(yè)結(jié)構(gòu)一樣平常比擬簡(jiǎn)單,即內(nèi)頁(yè)的一欄式版面結(jié)構(gòu),從排版結(jié)構(gòu)的角度而言,咱們還可以設(shè)計(jì)成平分兩欄式、三欄式、多欄式,不平分兩欄式、三欄式、多欄式等等,但由于閱讀器寬幅有限,一樣平常不宜設(shè)計(jì)成三欄以上的結(jié)構(gòu)。
  在版面結(jié)構(gòu)中首要是斟酌導(dǎo)航、需要信息與正文之間的結(jié)構(gòu)關(guān)系。比擬多的環(huán)境是采納頂部放置需要的信息,如公司稱號(hào)、標(biāo)記、告白條以及導(dǎo)航條,或?qū)?dǎo)航條放在左側(cè)而右側(cè)是正文等等,如許的結(jié)構(gòu)結(jié)構(gòu)清楚、易于運(yùn)用。當(dāng)然,您也可以測(cè)驗(yàn)考試這些結(jié)構(gòu)的變遷情勢(shì),如:擺布兩欄式結(jié)構(gòu),一半是正文,另一半是形象的圖片、導(dǎo)航;或正文不等兩欄式安插,經(jīng)由過(guò)程配風(fēng)光區(qū)分,分離放置圖片和筆墨等等。在設(shè)計(jì)中注重多汲取康復(fù)的網(wǎng)站設(shè)計(jì)的精華。

上海vi設(shè)計(jì)公司   http://m.washingtonrealestateblog.com
關(guān)鍵詞: 網(wǎng)站| 形象|
分享:

相關(guān)案例
Related cases

專業(yè)健康軟件企業(yè)網(wǎng)站設(shè)計(jì)-上海萬(wàn)序健康品牌網(wǎng)站建設(shè)

上海凌笛數(shù)碼科技有限公司|科技類網(wǎng)站制作

上海神旺房地產(chǎn)網(wǎng)站設(shè)計(jì)|企業(yè)網(wǎng)站制作

上海至善基金網(wǎng)站設(shè)計(jì)|金融網(wǎng)站制作

沃贊智能科技網(wǎng)站設(shè)計(jì)

普瑞邦克高端網(wǎng)站設(shè)計(jì)

相關(guān)文章
Related articles

上海網(wǎng)站設(shè)計(jì)公司注意事項(xiàng)

豪禾品牌資訊
brand information

品牌咨詢

細(xì)分市場(chǎng)行業(yè)標(biāo)識(shí)
打造全新的品牌視覺(jué)形象

在線品牌咨詢

最新案例推薦
Related cases

最新資訊推薦
related information

日本包裝設(shè)計(jì)探討

日本包裝設(shè)計(jì)探討