時間:2014-03-01 來源:合肥網hfw.cc 作者:hfw.cc 我要糾錯
設計一個吸惹人的網頁主橫幅實在可以很簡單,我們思考的只是如何分配區域。
在一個簡略的網頁中,上方的橫幅是最主要的視覺元素。在良多博客網頁中,它甚至是獨一的視覺元素。所以它的作用可以說是相稱大的。它必須可以與網站的風格配合,并能轉達視覺上的信息。它必需讓人看上一眼就讓人曉得這個網站是屬于什么類型,作風是什么。這個橫幅還必須可能供給簡略明了的導航鏈接。所有這些,我們都可以通過將橫幅分成三個區域而輕松實現:每一個區域都擁有本人的功效,而我們還要將這三個區域在視覺上同一,使三者具備類似性及和諧性。看一下我們在本文中所先容的例子。
從劃分空間開端:
一個網頁橫幅的寬度橫跨全部網頁,而高度又相稱窄。將其分成三個區域:名稱,圖片及導航鏈接。而后我們分辨對其進行設計。
如何分配區域:普通來說,我們都是將名稱放在左上方,而導航欄目放在下方。其空間的分配應該穩重。空間的比例大小是依據詳細的名稱(長或短)跟圖片而定的,很難說有什么最佳的比例。然而,應該避免將上方空間分成兩等份,由于分成兩等份會讓人的留神力都放在版式上,而不是放在內容上。采用錯誤稱的散布效果會更好。
尋找一張具表示力的圖片:
一張英俊的圖片是設計一個美麗橫幅的要害。在找到照片后,我們還要細心研討一下截取照片的哪一局部可以最有效傳達相干的信息。其切實實際中你會發明,要挖掘這一點并不難。
截取照片時應記住一點:盡可能截取能夠傳達最多信息的那一部門。在上圖這張田園式的景致圖片中,有樹,有草,有山,有陽光看一下我們截取的局部,都將這多少個重要的圖片元素都包含了,這恰是我們所須要的,面積雖比原圖小許多,但截取后的圖片所要傳達的信息豈但不減少,而且在檔次感上還增強了。圖片上有豐盛的明暗區域(見黑白圖片),造成近、中、遠三種視覺效果。
用顏色分配區域:
用吸管工具從圖片選。網頁設計根據企業希望向瀏覽者傳遞的信息,進行網站功能策劃,然后進行的頁面設計美化工作。取一種較深的顏色,將這種顏色的色階由暗到亮排列,然后我們再來決議哪一個區域用哪一種顏色。特殊要留神的是能產生對比。
強比較更具沖擊力:上述所有的色彩都領有統一種色調。而且這些顏色實踐上都是來自于圖片,可以說,無論你如何將顏色調配到區域中,個別來說,都能夠構成調和的搭配。但對照度卻會因你的不同調配而有所差別。強比較存在沖擊力,而低對照顯得更安靜(但也因而給人的印象不深)。
放置名稱及導航文字:
肯定顏色后,我們要湊合文字。文字應該可以與圖片發生互補:復雜的圖片 / 簡單的字體;優雅的圖片 / 優雅的字體;安靜的圖片 / 裝潢性強的字體。
首先留心上圖中,文字在色彩應用上的調換。綠色的文字用在金黃色背景上,反之,金黃色的字體用在綠色背景上這樣的調換應用能夠使全部版面顯得更加同一和諧。
上圖
一個十分長的名稱應當分成兩行或多行,行與行之間的字體應當是整潔的,防止使用某些高下不平的字體或小字字母,這樣會在如斯狹小的小空間中造成抵觸。大寫字母是咱們這個例子中的第一抉擇。咱們采取一種鎮靜優雅的字體,與這幅英俊的圖片發生互補。
避免使用這種裝潢性較強的字體,它顯得過于獨特了,只會在這里喧賓奪主。
這種字體固然很美麗,但與這個例子中的圖片或網站作風不搭配。
采取補色:
在這個例子中,一張半形象的圖片傳達出 d&t 修建設計公司的風格,假如我們按上面的那個例子來挑選顏色,那藍 / 灰的顏色會對 logo 產生過于克制的影響,所以我們使用一種反色。
補色構成強烈的對比效果:整張圖片都是由冷色形成,而對一間年青的建造設計公司來說,藍色不能轉達它那種沖勁及活氣。解決措施:我們用藍色的反色或補色來部署 logo 區域。我們首先在色輪上斷定藍色的地位,而后取舍與其絕對的另一種顏色(見上方色輪)。互為補色的兩。傳單設計從事設計制作,彩色印刷,包裝,后道加工一條龍服務。種顏色并不占有統一種基色(不象其它顏色關聯,比方,綠色及橙色,這兩種顏色都有黃色在里面),這就是為什么互為補色的兩種顏色可能造成無比強烈的對比。在上方這個色輪中,紫色與黃色存在最高的色度對比。
與 logo 配合:
fairweather downs 的標記已經有五十年的使用歷史了,在這么長的歲月中,這個標志簡直不轉變過。這就是經典!在這種情形下,我們的設計重點應該是斟酌標志而不是圖片。