圖片樣式

網站的設計原則:任務實現色彩布局造型優化

一個成功捉住用戶“眼球”并終究帶來經濟效益的公司網站首要需求一個優異的計劃,然后輔之優異的制造。計劃是網站的中心和魂靈 ,是一個感性思考與理性分析相聯系的雜亂的進程,它的方向取決于計劃的使命,它的完結依賴于頁面的制造。正所謂“功夫在詩外”,頁面計劃中最首要的東西,并非在軟件的運用上,而是在咱們對頁面計劃的了解以及計劃制造的水平上,在于咱們本身的美感以及對頁面的掌握上。

首要,咱們要弄清楚頁面計劃的使命。

一、計劃的使命

計劃是一種審美活動,成功的計劃著作通常都很藝術化。但藝術僅僅計劃的方法,而并非計劃的使命。計劃的使命是要完結計劃者的目的,而并非發明美。

頁面計劃的使命,是指計劃者要體現的主題和完結的功用。站點的性質不一樣,計劃的使命也不一樣。從方法上,能夠將站點分為以下三類:

第一類是資訊類站點,像新浪、網易、搜狐等門戶網站。這類站點將為拜訪者提供大量的信息,并且拜訪量較大。因而需留意頁面的切割、結構的合理、頁面的優化、界面的親和等疑問。

第二類是資訊和形象相聯系的網站,像一些較大的公司、國內的高校等。這類網站在計劃上請求較高,既要確保資訊類網站的上述請求,同時又要杰出公司、單位的形象。

第三類則是形象類網站,比方一些中小型的公司或單位。這類網站通常較小,有的則有幾頁,需求完結的功用也較為簡略,頁面計劃的首要使命是杰出公司形象。這類網站對計劃者的美工水平請求較高。 當然,這僅僅從全體上來看,詳細情況還要詳細分析。不一樣的站點還要差異對待。別忘了最首要的一點,那即是客戶的請求,它也屬于計劃的使命。

明確了計劃的使命以后,接下來要想的即是怎么完結這個使命了。

二、計劃的完結

計劃的完結能夠分為兩個有些。第一有些為站點的計劃及草圖的制造,這一有些能夠在紙上完結。第二有些為頁面的制造,這一進程是在核算機上完結的。

計劃主頁的第一步是計劃版面規劃。咱們能夠將頁面看作傳統的報刊雜志來編輯,這兒面有文字、圖像乃至動畫,咱們要做的作業即是以最適合的方法將圖像和文字排放在頁面的不一樣方位。

接下來咱們要做的即是經過軟件的運用,將計劃的規劃變為現實,終究的集成通常是在Dreamweaver里完結的。雖然在草圖上,咱們定出了頁面的大體輪廓,可是創意通常都是在制造進程中發生的。計劃著作必定要有創意,這是最根本的請求,沒有創意的計劃是失敗的。在制造的進程中,咱們會碰到許多疑問,其中最靈敏的莫過于頁面的色彩了。

三、色彩的運用

色彩是一種奇怪的東西,它是美麗而豐厚的,它能喚起人類的心創意知。通常來說,紅色是火的色彩,熱心、奔放;也是血的色彩,能夠標志生命。黃色是明度最高的色彩,顯得富麗、尊貴、明快。綠色是大天然草木的色彩,意味著純天然和成長,標志安定平和與安全,如綠色食品。紫色是尊貴的標志,有嚴肅感。白色能給人以純真與清白的感觸,表明平和與純潔。

咱們知道,色彩是光的折射發生的,紅、黃、藍是三原色,其它的色彩都能夠用這三種色彩諧和而成。換一種思路,咱們能夠用色彩的改變來體現光影作用,這無疑將使咱們的著作更貼近現實。

色彩代表了不一樣的情感,有著不一樣的標志含義。這些標志含義是大家思維交流傍邊的一個雜亂疑問,它因人的年紀、地域、年代、民族、階級、經濟區域、作業能力、教育水平、風俗習慣、宗教信仰、生活環境、性別差異而有所不一樣。

單純的色彩并沒有實踐的含義,和不一樣的色彩調配,它所體現出來的作用也不一樣。比方綠色和金黃、淡白調配,能夠發生高雅,舒適的氛圍。藍色和白色混合,能體現柔順、濃艷、浪漫的氛圍。紅色和黃色、金色的調配能烘托喜慶的氛圍。而金色和粟色的調配則會給人帶來暖意。計劃的使命不一樣,配色計劃也隨之不一樣。思考到頁面的適應性,應盡量運用頁面安全色。

但色彩的運用并沒有必定的規律,假如必定要用某個規律去套,作用只會拔苗助長。經歷上咱們可先斷定一種能體現主題的主體色,然后依據詳細的需求,運用色彩的近似和比照來完結悉數頁面的配色計劃。悉數頁面在視覺上應是一個全體,以達到調和、順眼的視覺作用。

四、頁面規劃類型

頁面規劃大致可分為“國”字型、角落型、標題正文型、擺布構外型、上下構外型、概括構外型、封面型、Flash型、改變型,下面別離論說。

1、“國”字型:

也能夠稱為“同”字型,是一些大型網站所喜愛的類型,即最上面是網站的標題以及橫幅廣告條,接下來即是網站的首要內容,擺布排列一些兩小條內容,中心是首要有些,與擺布一同羅列究竟,最下面是網站的一些根本信息、聯系方法、版權聲明等。這種結構是咱們在網上見到的差不多最多的一種結構類型。

2、角落型:

這種結構與上一種本來僅僅方法上的差異,本來是很附近的,上面是標題及廣告橫幅,接下來的左邊是一窄列連接等,右列是很寬的正文,下面也是一些網站的輔佐信息。在這品種型中,一種許多見的類型是最上面是標題及廣告,左邊是導航連接。

3、標題正文型:

這品種型即最上面是標題或相似的一些東西,下面是正文,比方一些文章頁面或注冊頁面等即是這品種。

4、擺布構外型:

這是一種擺布為別離兩頁的結構結構,通常左邊是導航連接,有時最上面會有一個小的標題或標致,右面是正文。咱們見到的大有些的大型論壇都是這種結構的,有一些公司網站也喜愛選用。這品種型結構十分明晰,一望而知。

5、上下構外型:

與上面相似,差異僅僅在所以一種上下分為兩頁的結構。

6、概括構外型:

上頁兩種結構的聯系,相對雜亂的一種結構結構,較為多見的是相似于“角落型”結構的,僅僅選用了結構結構。

7、封面型:

這品種型根本上是呈現在一些網站的主頁,大有些為一些精巧的平面計劃聯系一些小的動畫,放上幾個簡略的連接或許僅是一個“進入”的連接乃至直接在主頁的圖像上做連接而沒有任何提示。這品種型大有些呈現在公司網站和自己主頁,假如說處理的好,會給人帶來賞心順眼的感觸。

8、Flash型:

本來這與封面型結構是相似的,僅僅這品種型選用現在十分游戲行的Flash,與封面型不一樣的是,由于Flash強壯的功用,頁面所表達的信息更豐厚,其視覺作用及聽覺作用假如處理妥當,絕不差于傳統的多媒體。

9、改變型:

即上面幾品種型的聯系與改變,比方本站在視覺上是很挨近角落型的,但所完結的功用的本質是那種上、左、右結構的概括構外型。

有關導航欄的方位

導航欄能讓咱們在閱讀時簡單的抵達不一樣的頁面,是頁面元素十分首要的有些,所以導航欄必定要明晰、奪目,通常來講,導航欄要在“第一屏”能顯示出來,那種橫向放置的導航欄要優于縱向的導航欄思考,因素很簡略:假如閱讀者的第一屏很矮,橫向的仍能悉數看到,而縱向的就很難說了,由于窗口的寬度通常是不會受閱讀器設置影響的,而縱向的則不斷定性要大的多。

什么樣的規劃是最佳的

 

這是初學者可能會問的疑問。本來這要詳細情況詳細分析的:比方假如內容十分多,就要思考用“國字型”或角落型;而假如內容不算太多而一些說明性的東西比較多,則能夠思考標題正文型;那幾種結構結構的一個一同特色即是閱讀便利,速度快,但結構改變不靈敏;而假如是一個公司網站想展現一下公司形象或自己主頁想展現自己風貌,封面性是首選;Flash型更靈敏一些,好的Flash大大豐厚了頁面,可是它不能表達過多的文字信息。還沒有說到的即是改變型了,我僅僅想把這個留給讀者了,由于,只需不斷的改變才會進步,才會不斷豐厚咱們的頁面。

五、外型的組合

在頁面計劃中,咱們首要經過視覺傳達來體現主題。在視覺傳達中,外型是很首要的一個元素。拋去是圖仍是文字的疑問,畫面上的一切元素能夠共同作為畫面的根本構成要素點、線、面來進行處理。在一幅成功的著作里,是需求點、線、面的一同組合與調配來結構悉數頁面的。

通常咱們能夠運用的組合方法有秩序、比例、均衡、對稱、接連、距離、堆疊、反復、交叉、節奏、韻律、概括、變異、特寫、反射等等,它們都有各自的特色。在計劃中應依據詳細情況,挑選最適合的體現方法,這么有利于主題的體現。

經過點、線、面的組合,能夠杰出頁面上的首要元素,杰出計劃的主題,增強美感,讓觀者在感觸美的進程中體會計劃的主題,然后完結計劃的使命。

外型的奇妙運用不只能帶來極大的美感,并且能較好地杰出公司形象,并且能將頁面上的各種元素有機的組織起來,它乃至還能夠引導觀者的視野。

六、計劃的準則

計劃是有準則的,無論運用何種方法對畫面中的元素進行組合,都必定要遵循五個大的準則:共同、連接、切割、對等到調和。

共同,是指計劃著作的全體性,共同性。計劃著作的全體作用是至關首要的,在計劃中切勿將各組成有些孤立渙散,那樣會使畫面呈現出一種枝蔓紛雜的雜亂作用。

連接,是指要留意頁面的相互關系。計劃中應運用各組成有些在內容上的內在聯系和體現方法上的相互照應,并留意悉數頁面計劃個性的共同性,完結視覺上和心理上的連接,使悉數頁面計劃的各個有些極為融洽,猶如趁熱打鐵。

切割,是指將頁面分紅若干小塊,小塊之間有視覺上的不一樣,這么能夠使觀者一望而知。在信息量許多時為使觀者能夠看清楚,就要留意到將畫面進行有效的切割。切割不只是體現方法的需求。換個視點來講,切割也能夠被視為關于頁面內容的一種分類概括。

比照即是經過對立和沖突,使計劃愈加賦有生氣。比照方法許多,例如:多與少、曲與直、強與弱、長與短、粗與細、疏與密、虛與實、主與次、黑與白、動與靜、美與丑、聚與散等等。在運用比照的時分應慎重,比照過強簡單損壞美感,影響共同。

調和是指悉數頁面契合美的規律,天衣無縫。假如一件計劃著作僅僅是色彩、形狀、線條等的隨意混合,那么著作將不但沒有“生命感”,并且也根本無法完結視覺計劃的傳達功用。調和不只需看結構方法,并且要看著作所構成的視覺作用能否與人的視覺感觸構成一種溝通,發生心靈的共識。這是計劃能否成功的要害。

七、頁面的優化

在頁面計劃中,頁面的優化是較為首要的一個環節。它的成功與否會影響頁面的閱讀速度和頁面的適應性,影響觀者對網站的形象。

在資訊類網站中,文字是頁面中最大的構成元素,因而字體的優化顯得尤為首要。運用css款式表指定文字的款式是必要的,通常咱們將字體指定為宋體,大小指定為12px,色彩要視布景色而定,準則上以能看清且與悉數頁面調配調和為準。在白色的布景上,咱們通常運用黑色,這么不易發生視覺疲憊,能確保閱讀者較長時刻地閱讀頁面。

圖像是頁面中的首要元素。圖像的優化能夠在確保閱讀質量的前提下將其size降至最低,這么能夠成倍地進步頁面的下載速度。運用Photoshop或Fireworks能夠將圖像切成小塊,別離進行優化。輸出的格局能夠為gif或jpeg,要視詳細情況而定。通常咱們把有較為雜亂色彩改變的小塊優化為jpeg,而把那種只需單純色塊的卡通畫式的小塊優化為gif,這是由這兩種格局的特色決議的。

DIV與表格(table)是頁面中的首要元素,是頁面排版的首要方法。咱們能夠設定DIV與表格的寬度、高度、邊框、布景色、對齊方法等參數。許多時分,咱們將表格的邊框設為0,以此來定位頁面中的元素,或許籍此斷定頁面中各元素的相對方位。咱們知道:閱讀器在讀取頁面html原代碼時,是讀完悉數table才將它顯示出來的。假如一個大表格中含有多個子表格,有必要等大表格讀完,才能將子表格一同顯示出來。咱們在拜訪一些站點時,等候多時無成果,按"中止"按鈕卻一下顯示出頁面即是這個因素。因而,咱們在計劃頁面表格的時分,應當盡量防止將一切元素嵌套在一個表格里,并且表格嵌套層次盡量要少。因而咱們能夠選用DIV套表格的方法來削減嵌套,進步頁面的閱讀速度。

頁面的適應性是很首要的,在不一樣的體系上,不一樣的分辨率下,不一樣的閱讀器上,咱們將會看到不一樣的成果,因而計劃時要統籌思考。通常咱們在800*600下制造頁面,最佳閱讀作用也是在800*600分辨率下,在其它情況下只需確保根本共同,不呈現較大疑問即可。

 


手机捕鱼平台 地下城怎么多赚钱 手机打电话赚钱软件daquan 起点签约了怎么赚钱 北京目前干什么小生意赚钱 微赚钱怎么不收手续费吗 自己捞沙赚钱吗 翻译英语赚钱软件下载 化妆美容店赚钱吗 炒股买跌怎么赚钱吗 农业机械销售赚钱吗 在大学里面开超市赚钱吗 炼金11级做什么赚钱 农村开洗脚店赚钱吗 用美团不赚钱 搞金融都很赚钱 做车贷房贷这行赚钱吗