腾讯分分彩独胆二期
智軟工作室主要是為寧波公司提供寧波網站建設,寧波網站制作,寧波做網站公司,寧波外貿網站建設公司,寧波網站優化等項目,以優質的服務,優惠的價格,深的客戶信賴。相信有你的加入我們的明天會更有動力!期待與你合作!
  • 寧波智軟設計工作室,打造寧波網站制作工作室頂級品牌
  • 智軟擁有專業的設計團隊
  • 多年網站建設團隊為你服務
  • 智軟期待與你合作
  • 我們的技能
  • 我們掌握的技能有:dreamweaver,flash,photoshop
  • 寧波高端網站建設服務公司
    2014已經悄然到來,在新的一年我們恭賀所有客戶事業蒸蒸日上,同事慶祝智軟設計工作室成立5周年,在5周年為眾多客戶提供了保質量的網站設計與網站制作。 我們在新的一年質量與服務將會更加進一步為更多的客戶帶來高端的網站設計與服務!期待與你合作
  • 企業網站制作建設原因與服務介紹

    智軟設計工作室多年為寧波企業網站制作建設服務一直以來我們以最優惠價格,最優質的質量,最突出的設計!得到了客戶的一致認可,我們的服務包括:寧波網站設計,寧波網站建設,寧波網站制作,寧波網站優化,寧波英文網站制作我們會以優質的服務,最低的價格來報答客戶!

  • 點擊鏈接網站優化推廣介紹

    點擊連接網站優化推廣-對企業的網站優化和網站推廣--對企業的重要性-點擊進行詳細了解

  • 2014開幕,寧波網站設計服務全面優惠.

    2014開幕,寧波智軟設計為寧波企業提供更加優秀的設計和實惠的價格

  • 鏈接到網站案例展示平臺
    智軟設計工作為寧波客戶網站設計案例展示平臺-案例均為定期更新,讓新老客戶更好的看到我們做的案例,點擊查看我們做的網站案例吧!
  • 我們寧波網絡公司提供網站一站式解決方案
    智軟(寧波網絡公司)幫你輕松解決網絡問題,網站一站式解決方案
你當前的位置:智軟工作室 > 營銷與網絡 >

分享下我在網頁設計中的一點點看法

2010-12-07 20:06

近幾年來,隨著科技、計算機技術的迅猛發展和人們生活水平的不斷提高。互聯網以驚人的發展速度并且越來越深入到人們的生活和工作、學習中。信息的傳播形式、內容、數量也在空前的改變著。互聯網它憑借著一個嶄新的媒介和獨特傳播形式打破了傳統性的、地域性的、經濟文化性的阻隔,并且在信息的傳播范圍和傳播速度達到一個質的飛躍。隨著互聯網的發展,周邊的附屬品也同時在飛速的發展。而最明顯的就是互聯網最常用的網絡媒介“網頁”。網頁設計—也開始慢慢上升到一個舉足輕重的位置,一個好的網頁界面設計小則可以讓人賞心悅目,大則可以稱之為現代原創藝術的結晶。越來越多的設計師也開始投入到追求網頁界面形式美的行列中來。然而設計師們在設計界面的同時卻忽略了一個微不足道的,但是卻又是至關重要的“微觀”元素—網頁設計的“細節”處理。它可以讓設計師們的界面美觀度達到極致的升華,也可以讓界面變得暗淡和乏味。

然而,一個網頁設計的“微觀細節”都表現在哪里呢?它們要在何時何地出現才能為我們的界面設計帶來一個極致的升華呢?網頁設計的“微觀細節”主要表現有以下幾點:

1、頁面的整體顏色,也可以稱之為顏色。

2、頁面的整體布局,也可以稱之為排版。

3、頁面的字體元素。也可以稱之為字體。

4、頁面的效果元素。也可以稱之為效果。

以上四點歸納出網頁設計的“細節”主要在以上這些地方著重處理。

頁面的整體色彩可以直接反映這個頁面對用戶的視覺感官,鮮艷的顏色可以給用戶一種清新、活潑的視覺感受,然而此時細節就在于設計師對于色彩與色彩間的把握。

圖一:

單一的色彩元素也可以給用戶帶來另一種不同的視覺感受,如:黑白單一色調可以給用戶一種穩重、時尚的視覺體驗,然而此時細節就在于設計師如何“畫龍點睛”打破單一的色彩體系,不讓用戶感受到壓抑的心理。

圖二:

界面設計的顏色運用,不僅可以給用戶一個對網頁的大體感受,然而對顏色謹慎的細節把握可以讓用戶感到顏色帶來的舒適,從而根據顏色的巧妙配合給用戶帶來不同的視覺和心理體驗。顏色的細節搭配是注重于頁面顏色元素間的色相、明度、飽和度之間的搭配。

色相:是色彩的首要特征,是區別各種不同色彩的最準確的標準。色相環則成為了網頁配色的重要工具之一。在顏色的搭配細節中,色相起到一個重要的環節,色相搭配主要有以下部分細節用于網頁界面設計中:

一、單色搭配

一種色相由暗、中、明三種色調組成。這就是單色。單色搭配上并沒有形成顏色的層次,但形成了明暗的層次。這種顏色搭配產生了一種令人悅目、低對比度的和諧美感。

二、類比色搭配

相鄰的顏色稱為類比色。類比色都擁有共同的顏色。整個頁面如果使用了類比的紅色和黃色進行搭配,給人大氣、有力量的印象。

三、補色搭配

在色相環上直線相對的兩種顏色稱為補色,如:橙色和藍色。補色形成強列的對比效果,傳達出活力、能量、興奮等意義。

四、分離補色搭配

如果我們同時用補色及類比色的方法來確定的顏色關系,就稱為分離補色。這種顏色搭配既具有類比色的低對比度的美感,又具有補色的力量感。形成了一種既和諧又有重點的顏色關系。

五、原色搭配

三原色的搭配,紅黃搭配是最受歡迎的一種搭配方法。但是紅藍搭配只有當兩者的區域是分離時,才會顯得吸引人,如果是緊鄰在一起,則會產生沖突感。

六、二次色搭配

二次色之間都擁有一種共同的顏色所以它們輕易能夠形成協調的搭配。如果三種二次色同時使用,則顯得很舒適、吸引,并具有豐富的色調。它們同時具有的顏色深度及廣度,這一點在其它顏色關系上很難找到。

七、全色相搭配

從色相環上取出所有的色相,開放、熱鬧、像節日一樣的配色就產生了,全色相給人帶來可以隨時參與進去的氣氛,這恰好是適合節日氣氛的色相。

如果注重以上配色搭配的細節,就可以有效的提高網頁觀看的舒適度。色彩的細節注重和培養,更是網頁界面設計的第一堂最重要的課程。

網頁界面的布局、排版可以使網頁的內容在特定有限的版面空間中以一種有序和美觀的形式分布在網頁中,并且符合形式美的法則。網頁界面排版設計中的點、線、面是構成視覺空間的基本元素也是最容易被忽略的元素,無論版面內容與形式有多復雜,所有的具體元素都可以歸納為點、線、面。

圖三:

布局是內容組織的必然結果,它往往是自己逐漸形成的。一旦周全考慮了頁面的所有需求,并且確定了每一塊的內容,你的工作就變成了看著所想要的布局自己展現在你的眼前。這個過程類似拼圖游戲,只不過沒有最終完成的提示圖,但是每個部分都可以改變大小位置。

網頁設計中,設計者要注意到網頁排版的“最佳視域”這一細節會引導用戶去觀看整個頁面,并且能夠創造出一種別稱之為“Diagonal Balance(對角線平衡)”的和諧狀態。人們在瀏覽頁面或布局的時候,視線往往趨向于從左上角移動到右下角,因為人們通常都是從左至右、又傷往下地閱讀,久而久之視線自然會沿著這一路徑移動。

左上角是第一視覺落點區(Primary Optical Area,POA),而右下角則是最終視覺落點區(Terminal Anchor, TA)。與之相對,右上角和左下角則是視覺盲點。頁面上部注意力強于下部,左部強于右部。因此,上部、左上部、中上部為“最佳視域”。

設計者在頁面的設計中要注重網頁“導向視覺流程”,通過誘導元素主動引導讀者視線向一定方向由主到次的移動。

頁面排版的字體位置、形式自由靈活,但要考慮與正文之間的關系。細節在于副標題是對標題內容的補充說明,其視覺強度不能超過標題,一般采用不同于主標題的字體和字號。

圖片和字體在頁面排版中起到相輔相成的效果,字體可以給圖片提供解說說明,而圖片也給字體提供裝飾、補白的效果。一個頁面圖片可以占據頁面很大一部分,相比其他頁面更具有視覺沖擊力。網頁界面設計不能只用文字,過長的文字篇幅會使網頁顯得單調。在網頁中插入圖片可以令網頁生色不少。但圖片也不能用得太多,簡單的圖片堆砌,會讓人覺得累贅,而且影響網頁的下載速度。所以網站中的圖片既要美觀、符合網站的內容,又要少而精,放在最需要的地方,起到畫龍點睛的效果,增加網站的吸引力。頁面設計中圖片形象的遠近處理會產生不同程度的視覺吸引力。根據頁面的需要我們可以改變圖片的位置、面積、數量和組合形式來達到頁面的整體美觀和保持頁面的視覺沖擊。

網頁頁面的信息“發源地”—文字、字體。隨著網頁設計開發的更新和進步以及平面設計的逐漸成熟,網頁頁面的文字、字體也逐漸呈現出多樣化的趨勢。從最早的宋體、黑體。到現在的襯線字體和無襯線字體,都發映出網頁頁面設計在時代的發現下逐漸進步和完善。

而網頁界面的文字字體越來越豐富,富有設計感。網頁界面不再變得枯燥乏味,而是更注重頁面字體所帶來的設計美感。字體種類的搭配是展現設計師能力的一個表現。

圖四:

如上圖所示,此頁面采用的字體主要有Square721 BT、Arial、Modem No.20 三種字體。LOGO中的“WHISPERING”運用的Modem No.20字體 主要突出LOGO在頁面中的特殊性和特殊樣式,讓LOGO與界面中的字體與眾不同,既有美化效果也有增強視覺效果。讓LOGO變得易于讓用戶發覺。運用不同的字體可以增強界面內的效果,不同的字體、字號、字據、行距、行寬的設置都會對網頁產生微妙的效果。頁面內可以由多種字體組成,但是不能多到泛濫,這樣會誤導用戶是用戶無法根據網頁中的字體這一微妙的形式 去尋找共同特點。讓用戶產生不知道下一步應該怎么做。什么樣的字體就用作什么樣的位置,比如:標題文字就是頁面中最活躍的一個元素,具有很強的導讀功能。

網頁中使用的文字大多分為中文漢字和英文、阿拉伯數字等。中文使用語網頁設計中內容部分一般會采用9-12 Px大小的文字字體,而英文和阿拉伯數字由于易讀性較高,字號可相對縮小。

應用透明的效果來烘托頁面的層次感和動態感覺,通過陰影,凹陷,透明來實現立體的網頁。

搜索欄隱藏效果,為了讓用戶看的更清楚我添加了綠色的“發光點”細節和指示箭頭的效果。這個小小的細節可以更人性化的讓用戶參與體驗我的網站。

網頁說的簡單點就是網絡的一種招貼形式,同處在一種環境下其實我們和平面招貼設計并沒有多大的區別。唯一不同的是我們通過各種細節的效果把一些元素烘托出來,讓他們更加逼真立體,從而把用戶由旁邊觀看改變成主體感受。

更多

【責任編輯:小戴工程師】

關鍵字: 網頁設計

上一篇:百度11月調整網站優化策略分享 下一篇:企業網站優化總結的一點問題-網站太小沒優勢

最新文章

2010-12-07 20:06

相關文章

2010-12-07 20:06
網站制作咨詢:
QQ:277728291
電話:18668277799
郵箱:[email protected]
期待你來電咨詢
回頂部
Copyright 2010 智軟工作室 版權所有    智軟為寧波公司提供最優惠的網絡服務【寧波網站建設,寧波網站制作公司,寧波做網站公司,寧波外貿網站建設公司】我們竭誠為你服務!
腾讯分分彩独胆二期