熱門文章

2011年4月28日 星期四

不同性質網站不同的色彩搭配方案

網頁的色彩,是訪問者登錄頁面時的第一印象,好的頁面色彩能給用戶留下深刻的印象,並且能產生很好的視覺效果和營造網站整體氛圍的作用。因此在你開​​始網頁設計之前,客戶會提出對網頁視覺風格設計的期望:活躍、大氣、穩重、信賴、都市化。此時你就該有想法了。

 色彩對於每個人、地域或國家都有不同的情感認知和聯想意義,從某種程度看,大多數人對色彩認知和聯想是一致的,如紅色,人們感覺得喜慶,熱鬧…再具體到事物會聯想到紅心桃、草莓等等。在這裡簡單介紹色彩的情感聯想。

色彩的情感聯想,主要從具體聯想和抽象聯想兩個維度劃分:

色彩的情感聯想是人們對事物的不斷的積累和認知,了解這些不但對網頁設計有幫助,還對市場營銷有幫助。如設計一個環保教育類網站,“環保教育”首先聯想到生命、自然、綠色生態,而這些聯想的事物共同色係是綠色,如果網站採用人們已認知的色彩會讓人們在初次訪問網站時,會對網站的主題產生共鳴和信賴感。

那設計師就憑自己“經驗和色彩原理”就對網頁進行色彩設計?我們先慢鏡頭往回看整個網站的設計流程–設計師在著手視覺設計的前期流程:

如果視覺設計師忽視前期的工作,網站最後視覺設計輸出或許會與客戶期望存在出入的風險。所以視覺設計師需要先了解和參與網站的定位、目標用戶、內容規劃的基礎上才能更好把握頁面的視覺設計。

各類網站色彩應用

網站的類型很多,按照分類,其各自的目的和側重點不同,對用戶的情感訴求心理也會不同。下面主要從網站的類型層面上來簡單探討色彩在網頁上的應用:

1.門戶類:其主要需求是如何方便用戶在堆砌的信息中有效、快速進行目標選擇,而頁面色彩可傾向於清爽,簡潔。

騰訊網,雅虎,網易等門戶採用清爽簡潔的淺色調來降低信息快速獲取時的視覺干擾。同性質的同類網站主要是沿用自己公司主色系或logo來做區分,便於用戶對品牌的識別。

2. 產品類:主要目的需求展示產品的特性,促進瀏覽者消費慾望,頁面色彩可根據具體產品定位做多樣化設計。

細化產品具體定位,如apple,韓國手機iriver高科技電子產品,其簡潔灰白色調給網站帶來科技感和現代感。

3.社區類:其需求是操作簡單易用,長時間使用的舒適度,頁面色彩也傾向清爽,簡潔。

主要以分享、交流信息為主的社區網,有如上面門戶網信息獲取性質,所以配色上比較簡潔清爽。但各社區網又各自有自己的核心目標用戶群,所以在配色方面帶有各自的特點。如校友核心用戶是在校學生,頁面頂端上的banner運用活潑的綠色調來渲染青春朝氣的氛圍.

4. 公司、企業類:展示企業形象,加深提高品牌印象,可應用logo的主色系設計,達到品牌統一。

5. 電子商務類:其目的在滿足方便快捷地查看商品和進行交易,同時運暖色調渲染氣氛,讓用戶感受到網站整體的活躍氛圍和愉悅感。

6. 個人類:滿足用戶的自我個性展示和駕馭能力的需求,頁面色彩設計更是多樣化和個性化。現在有很多網站設置了換膚、自定義裝扮等功能來滿足用戶需求,如個人空間、博客、社區等等,就連門戶類網站也開始滿足用戶的色彩喜好設置護膚。所以各類網站的色彩應用沒有固定的模式,以按自身定位來靈活設計網頁色彩。

好的網頁設計絕不是單純的因為天才的創意或者靈感爆發的一瞬間而產生的,只有網頁設計師在“持續改進”的迭代方法中才能達到好的效果,你必須通過不斷的“質疑自己”,在不同的設計種找到缺點,並尋求更好的方案來改進它。

網頁設計一個重要環節:網頁的優化

現在,許多網頁設計公司在設計網頁時,已經不僅僅考慮到色彩、佈局、文字內容等多方面設計相關因素,還有一點很重要,就是網頁的優化。如何讓你的網站今後更好進行搜索引擎優化,在你完成這個設計之前就得做好鋪墊。下面就談談網頁的優化。

網頁設計中,網頁的優化是較為重要的一個環節。它的成功與否會影響頁面的瀏覽速
度和頁面的適應性,影響觀者對網站的印象。

在資訊類網站中,文字是頁面中最大的構成元素,因此字體的優化顯得尤為重要。使用
css樣式表指定文字的樣式是必要的,通常我們將字體指定為宋體,大小指定為12px,
顏色要視背景色而定,原則上以能看清且與整個頁面搭配和諧為準。

在白色的背景上,我們一般使用黑色,這樣不易產生視覺疲勞,能保證瀏覽者較長時間地瀏覽網頁。圖片是網頁中的重要元素。圖片的優化可以在保證瀏覽質量的前提下將其size降至最低
,這樣可以成倍地提高網頁的下載速度。利用Photoshop6或Fireworks4可以將圖片切
成小塊,分別進行優化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們
把有較為複雜顏色變化的小塊優化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優
化為gif,這是由這兩種格式的特點決定的。

表格(table)是頁面中的重要元素,是頁面排版的主要手段。我們可以設定表格的寬度、
高度、邊框、背景色、對齊方式等參數。很多時候,我們將表格的邊框設為0,以此來
定位頁面中的元素,或者籍此確定頁面中各元素的相對位置。我們知道:瀏覽器在讀取
網頁html原代碼時,是讀完整個table才將它顯示出來的。如果一個大表格中含有多個
子表格,必須等大表格讀完,才能將子表格一起顯示出來。

我們在訪問一些站點時,等待多時無結果,按"停止"按鈕卻一下顯示出頁面就是這個原因。因此,我們在設計頁面表格的時候,應該盡量避免將所有元素嵌套在一個表格里,而且表格嵌套層次盡量要少。在使用Dreamweaver製作網頁時,會自動在每一個td內添加一個空字符“ ”。如果單元格內沒有填充其它元素,這個空字符會保留,在指定td的寬度或高度後,可以在源
代碼內將其刪去。

網頁的適應性是很重要的,在不同的系統上,不同的分辨率下,不同的瀏覽器上,我們
將會看到不同的結果,因此設計時要統籌考慮。一般我們在800*600下製作網頁,最佳
瀏覽效果也是在800*600分辨率下,在其它情況下只要保證基本一致,不出現較大問題
即可。

就說到這裡了,回頭看看,自己覺得有點羅嗦了,有些條理不是很清楚。總之,就是能夠給學網頁設計的朋友們一些幫助。以上只是個人觀點,僅供參考!

2011年4月27日 星期三

設計移動網頁的幾個要素

現在,網頁設計公司已經越來越趨向移動設計了,由於手機,ipad,等移動設備的發明,我們以後除了電腦版的網頁,也要做出一個對應手機或行動裝置的網頁。

1. 確立網頁設計的內容,方向及類型
執行一個網頁設計的計劃前先要確定的一些方向:
全新網頁設計-是為某產品/品牌做一個新的網頁,包括電腦頁面及行動裝置頁面嗎?
重新設計網頁-是要從原有的舊網頁取材,量身訂造一個電腦頁面及行動裝置頁面嗎?
增設行動裝置頁面-是原有的電腦頁面不改變,只需要增設一個行動裝置頁面嗎?
以上3個不同的情況都有不同的設計策略,是網頁設計者開始做網頁設計前必須要釐清的。

2. 確定公司/品牌所要表達的形象
很多時候,網頁設計者/開發者需要為公司設計一個網頁,因此首要注意的是公司的形象及產品的特色。
3. 在設計行動裝置版網頁前務必預測網站流量
如果是要用舊有的電腦版網站為藍本,重新設計行動裝置版的網頁(目前這種案例居多),建議先用Google Analytics 或其他測量網頁流量的工具來作一些訪客背景調查,能夠掌握越多關於網站訪客的資料越好。

4. 學習如何設計可自動調整版面的網頁設計
承第三點,每一年推出的行動裝置之多,就算做了網頁訪客資料調查,也無法因應隨時做出符合每一台行動裝置/瀏覽器的頁面,根據Responsive Web Design 這篇文章,與其試圖迎合每一個行動裝置/瀏覽器,不如讓設計自然適應不同的裝置。善用新的資源如HTML5,CSS3,及不同的網路字體,做出自動調整版面的網頁設計

5. 簡單,但不能簡陋
設計行動裝置網頁的黃金要素就是要簡單,行動裝置的畫面絕對不可能比電腦螢幕大,處理器也不一定比電腦好,因此設計必須要簡單化。最基本要求是檔案的大小要越小越好,以及網頁載入的時間要越短越好。而且目前無線網路還沒有到非常成熟的階段,因此行動裝置網站不要做得太複雜及花俏。行動裝置網頁的各個元素放置為止,都必須要想清楚,行動裝置版網頁比電腦版網頁少了3/4的空間,代表沒有空間可以浪費, 1/4的空間裡,每一個元素都是重點。
但是簡單不代表行動版網頁注定要簡陋,多試著學習CSS3,可以減少圖片或Javascript 的依賴,並能輕鬆的完成多背景、圓角、3D 動畫、文字陰影、漸變及透明度等設計特色。

6. 網頁模板建議採用單欄式設計(Single-Column Layouts)
網頁模板採用單欄式設計,目的是為了方便在有限的行動裝置畫面上閱讀並操作網頁, 太多欄位對於一些手指頭比較大的使用者來說很容易誤觸,並且個別欄位字體變小也不好閱讀。
如果是多欄式的模板,建議使用Responsive web design 技巧,將多欄(multi-column)模板合併成單欄式設計。

7. 行動裝置網頁的按鍵要明顯易按
網頁設計者必須要清楚使用電腦時,滑鼠或touch pad 可以按左鍵,右鍵,或者滑動軸,這些行動裝置都沒有。另外在將電腦版網頁移植到行動裝置時還有一個要點,就是電腦網頁在做選取的功能時,可以將滑鼠遊標移到按鍵上方但不一定要按下(hover),但是行動裝置只有點擊的功能,所以重新設計或移植網頁時必須要重新設計按鍵特性。

8. 記得提供視覺反饋按鍵
在電腦網頁點擊一個按鈕時,都會看到按鈕的顏色變化,這告訴使用者他已經成功點擊該按鈕,同樣的,行動裝置網頁也建議做這樣的設計,這種不起眼的小設計會影響到使用者的心情及反應。另外一個視覺反饋的重點在網頁載入的時候,在使用者做出點擊/選取的動作後,網頁會開始loading,這個時候建議做出一些行動圖案讓使用者知道網頁正在載入,避免使用者重複點擊按鈕,延誤載入的時間。

9. 測試,測試,再測試網頁性能
網頁完成後才是考驗的開始,作為網頁設計者,你能夠確定你設計的網頁在各個裝置上都能運作嗎?不可能(尤其是Android 裝置更要注意,參考前文「漫談iOS 以及Android 版本分裂狀態以及對於開發者的影響」及「Andorid 的版本分裂以及HTC 的機海戰術」),因為你不可能真的測試過每一台行動裝置。所以必須要測試軟體(developer SDK)的輔助,以及一些網頁版的模擬器(web-based emulator), Mike Brittain的網站有提供一些測試網頁的相關資料。

2011年4月26日 星期二

如何給你的網站行銷

現如今,隨著互聯網的日益更新,網頁設計的行銷路徑也千變萬化。

運用網頁設計的專業技能,最主要還是希望能成功的將我們的公司或網頁資訊內容,透過網頁設計的整體規劃整合,循序漸進的散播在網路上。

因此,運用網頁設計的專業技巧來建置您的網站格外重要。而網頁設計如何讓接收訊息方,能成功的接收網頁設計所傳播的訊息,並能對您網站上的訊息,做最快速的理解與吸收,這是從事網頁設計的工作者所應思索的。

很多網頁設計它不僅只是單一面,它的思考層級是全面性的。如果只思考網頁設計的單一面,往往會失去網頁設計在網路上的價值。網頁設計它所要專精的不僅只是單一網頁設計上的美編,對於整體網站層級的辨識度,更是不可抹滅。所謂網頁設計層級辨識度,便是泛指網頁設計在製作的同時,應該注意整體形體架構的一貫性,如果只注意網頁設計的小部份設計層面,對於網站的整體意象層面是沒有加分意義的。

網頁設計的整體意象整合

很多人在規劃網頁設計的同時,往往忽略了"形象關注性"的問題;"形象關注性"也是在網頁設計的同時不可忽略的。

那何謂網頁設計"形象關注性",一個擁有動態式的網站規劃模式,它當然能適時的得到它應有的效果呈現。當然也不是一味的全部動態式的呈現,只是少部份的搭配應用,對於網站上的整體CIS的局部呈現是必需的。當然CIS的整體適性,是要經過網頁設計專業度的調整;整體網頁設計的意象情境的畫面運鏡呈現是必需的。當然這是網站設計最難的部份,它所搭配的設計軟體或思考邏輯是相當高的。

網頁設計的整體行銷方向

因而網頁設計它的整體行銷,並不僅只是單單局限在設計應用上,多方的觸角延伸,適時的加以應用搭配,也是不可忽視的。網頁設計已逐步進展到多媒體的延伸,對於一般網頁設計師來講,當然是一大突破,但也是一大考驗,因為那是另外一個網頁設計上的區塊。

網頁設計從美術層面來看,絕對只是單一的,網站最後循環的觸角還是"接受度"的問題,網站所要朔造的並不只是形體的設計,延伸更廣更細的層面,這是網頁設計師們所要具體思索的。當然每一種網站設計所提供的內容接受度不同,讓它完全畫成等號,那是不可能的事,但如何讓大方向不偏離,也是網頁設計上的一門學問。

我們往往會看到網站的主題內容很零散,主題面太過偏離,這對於使用者來說是非常吃力的。整體網頁設計的網站架構主提的聚焦是非常重要的,聚焦就是適時的讓主題凸顯,讓主題的含蓋面更廣,而不失網站主題的真義。

2011年4月25日 星期一

元伸科技:虛擬主機服務

虛擬主機顧名思義,使用者是與其他很多網頁設計公司共享一台網站伺服器及連線。也就是把一台獨立主機分成許多虛擬的主機,每一台虛擬主機都具有獨立的網址及功能,由於多台虛擬主機共享一台主機的資源,每個用戶所負擔的硬體費、維護費、線路費均大幅降低。

元伸的主機是放在內湖六星級的IDC 機房中,該機房是國內數一數二的IDC (Internet Data Center),尤其不斷電系統和發電機設備能夠即時供應足夠電力至少不致於發生無法供電之危險。如果沒有台電供電、自來水處供水,與外界隔絕的惡劣情況下,依靠內部設施仍可獨立運轉336個小時(14天)。

利用西門子BMS 整合系統,針對環境、消防、機電、UPS、發電機、電氣室、冷氣、用水系統進行24 小時嚴密監控。
內部安控:98 具攝影機 (CCTV)。
網路管理:24Hr 工程師值班。
門禁系統、防洪設施、防震基礎、煙霧偵測、液漏偵測、冷氣機恆溫恆濕及備源電力等,號稱「六星級機房」。

如果你沒有工程人員負責網站的維護,又希望網站能穩定運作,其實元伸網頁設計公司的虛擬主機是一個比較好的選擇,省錢又有專業人員處理。

2011年4月21日 星期四

熱水器三種控制方式

熱水器按其對水加熱溫度控制方式不同分為:機械、數顯和數控三種型式。

1)機械式控制電熱水器

機械式電熱水器溫度控制的主要元件為壹機械式旋鈕調節的溫度控制器,該溫控器通常由測溫探頭、可調式驅動機構和壹對電觸點組成。當探頭處溫度上升時,探頭內的介質(液體或氣體)膨脹,並通過毛細管推動驅動機構,使電觸點動作。電觸點的動作溫度可通過可調式驅動機構進行調節或使電觸點處常開狀態。機械式熱水器用溫控器主要特點是:動作溫度可在壹定範圍內連續調節,操作簡單方便,價格低廉。適合壹般家庭使用。缺點是溫度控制方式單壹,只能實現循環加熱壹種方式。

2)數顯型控制電熱水器

數顯型電熱水器控制系統通常由顯示板、主控制板、強電板和溫度傳感器組成。顯示板用於顯示現在溫度、設置溫度、故障代碼和定時數的信息,還可以利用控制面板上的按鍵和旋鈕來進行設置操作。主控制板是控制系統的核心,用於對溫度信息的處理和對熱水器的運行過程實施控制。強電板用於提供系統所需電源、實施強電驅動及漏電檢測。溫度傳感器用於採集溫度信息。

3)數控型電熱水器

數控型電熱水器由顯示板、主控制板、強電板和溫度傳感器組成。顯示板上的LCD顯示屏用於顯示工作模式、加熱狀態、現在溫度、設置溫度、設置菜單、時鍾、定時時段、故障代碼等信息,還可以利用板上按鍵進行設置操作。主控制板是控制系統核心,用於對溫度信息的處理和對熱水器的運行過程實施控制。強電板用於提供系統所需電源、實施強電驅動及漏電檢測。過溫檢測和常溫檢測溫度傳感器用於採集溫度信息。

我眼中的設計

現如今,隨著網絡技術的不斷進步,各種網頁製作軟件的發明使得網頁設計變的越來越簡單,許多學網頁設計的朋友開始懷疑和徘徊。夢想遙不可及,是不是應該放棄?我想說,失落和徘徊是很正常的,要有信念,用正確的態度去面對。其實,在追夢的路上,你並不孤單,
我們一路風雨相伴!

話說回來,在當今中國的設計界確實存在很大的水分,很多小公司的“設計師”只是被當作一個工具,他們並不具備創新和鑑賞能力,這種現象的普遍導致設計師的地位大大折扣。個人學習網頁設計也有一年多時間了,也遇到過不少問題,以下是我的小小總結,那麼該用什麽樣的態度對待設計呢?
      
       1.不是設計師低賤,而是你做了一個低賤的設計師。
       2.一個合格的設計師,不僅要有精湛的設計能力,還要有文化和藝術底蘊。
       3.設計員只運用軟件和素材,而大師會去研究設計的精髓!
       4.設計也是一種銷售,你要學會怎麼將你的作品銷售給你的客戶。
       5.客戶不會管你設計的過程多麼辛苦,他們只要他們滿意的結果,所以溝通能力往往大於你的設計能力!
       6.除了美術,還要有更多的業餘愛好,這樣會為你帶來意想不到的靈感!
       7.如果離開電腦就無法工作,那你就不是一個合格的設計師!
       8.要時常關注業內的進展和趨勢,才能確保你的競爭力,否則,看到新的高手出現,你會覺得自己還活在十年前。
       9.最後一點,也是我覺得最重要的——設計和藝術必須是你最大的愛好!
以上全是個人觀點!

2011年4月20日 星期三

成功網站設計五步曲

隨著網絡技術的不斷發展,網絡應用已經滲透到人類社會的各個角落。越來越多的人希望擁有網站,開闢網絡世界裡的一片天地。政府利用網站宣傳自己的施政綱領;企業利用網站宣傳自己的形象;個人利用網站展示個性風采。如何設計一個出色的網站呢?

一、定位網站的主題和名稱

網站的主題也就是網站的題材,網頁設計開始首先遇到的問題。網站題材千奇百怪,如果題材已經確定以後,就可以圍繞題材給網站起一個名字。網站名稱,也是網站設計的一部分,而且是很關鍵的一個要素。
建議:

1、名稱要正。其實就是要合法,和理,和情。不能用反動的,色情的,迷信的,危害社會安全的名詞語句。

2、名稱要易記。最好用中文名稱,不要使用英文或者中英文混合型名稱。另外,網站名稱的字數應該控制在六個字(最好四個字)以內,四個字的也可以用成語。字數少還有個好處,適合於其他站點的鏈接排版。

3、名稱要有特色。名稱平實就可以接受,如果能體現一定的內涵,給瀏覽者更多的視覺衝擊和空間想像力,則為上品。例如:音樂前衛,網頁陶吧,e書時空等。在體現出網站主題的同時,能點出特色之處。

二、定位網站的CI形象

所謂CI(corporate identity),意思是通過視覺來統一企業的形象。一個傑出的網站,和實體公司一樣,需要整體的形象包裝和設計。準確的,有創意的CI設計,對網站的宣傳推廣有事半功倍的效果。

三、確定網站的欄目

建立一個網站好比寫一篇文章,首先要擬好提綱,文章才能主題明確,層次清晰。如果網站結構不清晰,目錄龐雜,內容東一塊西一塊。結果不但瀏覽者看得糊塗,自己擴充和維護網站也相當困難。網站的題材確定後,並且收集和組織了許多相關的資料內容,但如何組織內容才能吸引網友們來瀏覽網站呢?欄目的實質是一個網站的大綱索引,索引應該將網站的主體明確顯示出來。

四、確定網站的目錄結構

網站的目錄是指你建立網站時創建的目錄。例如:在用frontpage98建立網站時都默認建立了根目錄和images(存放圖片)子目錄。目錄結構的好壞,對瀏覽者來說並沒有什麼太大的感覺,但是對於站點本身的上傳維護,內容未來的擴充和移植有著重要的影響。

五、確定網站的鏈接結構

網站的鏈接結構是指頁面之間相互鏈接的拓撲結構。它建立在目錄結構基礎之上,但可以跨越目錄。建立網站的鏈接結構有兩種基本方式:

1、樹狀鏈接結構

類似DOS的目錄結構,首頁鏈接指向一級頁面,一級頁面鏈接指向二級頁面。這樣的鏈接結構瀏覽時,一級級進入,一級級退出。優點是條理清晰,訪問者明確知道自己在什麼位置,不會"迷"路。缺點是瀏覽效率低,一個欄目下的子頁面到另一個欄目下的子頁面,必須繞經首頁

2、星狀鏈接結構

類似網絡服務器的鏈接,每個頁面相互之間都建立有鏈接。這種鏈接結構的優點是瀏覽方便,隨時可以到達自己喜歡的頁面。缺點是鏈接太多,容易使瀏覽者迷路,搞不清自己在什麼位置,看了多少內容。

2011年4月19日 星期二

網頁製作:Dreamweaver中框架的使用技巧

學習網頁設計的朋友一定對網頁三劍客不陌生吧,網頁三劍客,顧名思義,就是網頁製作編輯軟件,包括Dreamweaver\Flash\Firework\,是一套功能非常強大的網頁編輯工具.今天要為大家講解的是Dreamweaver中框架的使用技巧:

【增加新框架 】

要給框架頁面增加新框架,就是像拆分錶格的單元格一樣,把一個框架分為兩個框架。其操作如下:
(1)按住Ctrl鍵,將鼠標放在框架邊框上,當鼠標變為上下箭頭時,可把邊框拖到一個新位置,當鬆開鼠標按鈕時,一個新的空白內容的框架就形成了。
(2)也可以通過命令來操作:首先單擊要拆分的框架內部,選“框架”菜單中的“拆分框架”命令,在彈出的“拆分框架”對話框中單擊“拆分成列”或“拆分成行”單選按鈕,單擊“確定”按鈕即可。

【刪除框架 】

若框架頁面看起來太亂,可刪除某些框架。要刪除一個框架,可先單擊該框架選擇它,再選擇“框架”菜單中的“刪除框架”命令即可。

【改變框架屬性】

在設置好框架的整體佈局後,我們還可以對每一框架的具體屬性進行設置,操作如下:

(1)單擊需設置屬性的框架,選擇“框架”菜單中的“框架屬性”,則彈出“框架屬性”對活框。

(2)在對話框的“名稱”文本框中可輸入框架名,這樣便於識別不同的框架;在“選項”區域中,若選中“在例覽器中可以調大小”複選框,則客戶在瀏覽站點時,可重新定義框架尺寸,通過在“顯示滾動條”下拉列錶框中選擇不同的描述項,可設置讓滾動條是否出現。

(3)在“框架大小”區域中,可設置框架大小,可以定義一個絕對像素值或相對於瀏覽器窗口的百分比,若要用瀏覽器來設置相對於該頁面中框架的尺寸,可選“相對”;在“邊距”區域中,可設置內容頁面與框架邊框分隔的像素數值。

(4)要改變開始頁面,可以在“初始網頁”文本框中輸入一個新的頁面名字或URL。

(5)單擊“框架網頁”按鈕,則彈出“網頁屬性”對話框。

(6)在該對話框的“框架”選項卡中,在“框架間距”文本框中,可輸入以像素為單位的邊框寬度;若要使框架邊框消失,則不要選中“顯示邊框”複選框。

(7)單擊“確定”按鈕,關閉“網頁屬性”對話框,再單擊“確定”按鈕,關閉“框架屬件”對話框,完成框架屬性設置。

有關網頁設計站點的經驗

在進行網頁設計過程中--形式應該服從功能。這種方法應用於我們站點的整個設計過程中。當然,我們有最新的網頁工具,並且能夠將各種可視的小配件上載到網頁上。但是我們認為這樣做將不利於為訪問者提供有效的服務。

事實上,我經常發現一些站點未將重點放在功能上。常見的錯誤包括:

【用戶界面元素不一致】
例如,同一個控件在不同的頁面上功能不同,或者同一個功能對應幾個用戶界面控件。

【導航欄位置不一致】

決定站點的哪些頁和功能需要在站點的任何頁上都可被訪問到。這就是應該保持一致性的“全局導航欄”。
不太注意或根本不注意基本的圖形設計原則,例如排版式樣、色彩和版面的設計。

【相關元素和功能的隨意】

分組注意將元素放置在網頁上的位置和目的。這可幫助訪問者從其它相鄰的選擇和位置來推斷某個鏈接的功能。使網頁過於龐大以至使訪問者需要通過典型的調製解調器速度的Internet 連接進行長時間的下載。這並不是說不應該使用圖形,但是您需要對它們進行精挑細選,然後用適當的壓縮和顏色索引優化它們。

現在的網頁站點仍然存在很多問題,這並不奇怪。畢竟,網頁設計“藝術”相對來說還是個新生事物。在四、五年以前,網頁頁甚至是普通的。那時,人們好像認為他們的網頁站點將會吸引訪問者只是因為它們存在​​--並且,可能在某些情況下這種方法確實有效。但是這些站點一般很難看,並且更重要的是,它們真的難以使用。接下來便進入“看看我們能做些什麼”階段,在網頁中加入了大量的動畫、聲音文件以及其它附加件,導致訪問者需要長時間地進行下載,但是並未獲得多少實實在在的內容。

如今的網頁設計師們已經吸取了前人的經驗和教訓。好的站點傾向於簡化和快速,同時在功能上有所提高。這是Microsoft 的目標,而且我們最先承認自己所犯的錯誤(參閱“Microsoft 的網頁簡史”看一看以前的主頁設計)。
設計錯誤並不總是顯而易見的。有時在設計上對一個小元素的移動或更改將有很少或根本沒有影響。但是,在其它情況下,它可能確實會對頁面功能有所影響。而且如果說我們從過去幾年學到了一些東西,那就是小的改動會使網頁頁的運行方式有很大的不同。

2011年4月18日 星期一

如何提高燃氣熱水器的利用率

【減少煙氣排放中的能量損失】

一個重要途徑是選用合理過剩空氣系數,這主要是因為過剩空氣的減少可降低煙氣的產生量,但是合理的過剩空氣系數並不等於小的過剩空氣系數,過剩空氣系數過小一則可能造成一氧化碳含量過高,二則可能造成煙氣溫度過高,反而使得煙氣排放中的能量損失增大。

加強燃氣熱水器的換熱器換熱能力】

這也是提高其能源利用率的重要措施。目前“帶大面積吸熱導熱管的燃氣熱水器”已經獲得了我國專利局的認可,該實用新型技術根據燃氣熱水器結構特點和燃氣燃燒基本理論,對吸熱導熱管進行了獨特技術改造,較大程度上克服了燃氣熱水器設計中熱能損失過大這一重大缺陷,對提高燃氣熱水器的熱效率進行了獨特的技術突破,使燃氣熱水器的熱水產率大幅度提高,從而達到了提高燃氣利用率的節能目的。

【在燃氣熱水器中使用紅外燃燒方式】

紅外燃燒方式具有防倒風力強,產生的CO、NOx​​等廢氣量比大氣式燃燒方式低70%-90%,減少了因氧化物量過多而致癌的問題,同時紅外線燃燒方式比大氣式燃燒方式省氣20%以上,這就從源頭減少廢氣量,因而紅外燃燒燃氣熱水器是典型的高效、環保型燃氣熱水器。同時,燃燒室的情況以及火排的形式同樣影響到燃氣熱水器能量利用率。

【熱負荷調節】

在國內使用最多的節能型負荷調節方式是冬、夏分段火力調節,即所謂的冬夏型燃氣熱水器。該種類型的燃氣熱水器解決了燃氣熱水器夏天水溫過熱的現象,實際應用效果表明,與普通的熱水器相比,夏季使用這種節能熱水器每天可節省大約1元,5年下來所節省的錢相當於購買一台這種熱水器所花的費用。燃氣熱水器的熱負荷調節也可以使用電子元件控制得到,該種熱水器中電子元件可以精確的控制燃氣—空氣的比例調節、燃空混合氣的供應量,這種採用燃氣比例控制閥的方式在國內燃氣熱水器中得到了越來越多的使用。

2011年4月17日 星期日

設計主頁目標的依據

無意在網上看到的一篇有關網站設計時如何確定主頁目標的文章,覺得不錯,整理下,希望和大家一起分享~~

一個好的網頁設計師做設計的時候通常是從後往前設計。從最小最深層的元素:案例頁面或者搜索列表。然後從後面開始設計網站的各個部分的網頁,然後是index頁,最後設計home頁。這麼做主要是因為每一部分都需要根據該部分可能包括的內容來精心規劃和設計。如果主頁與內頁的內容或者主體不相符,對網站所有者,以及網站的用戶來說都是個很大的失敗。主頁是所有訪問者對整個網站的第一印象。俗話說得好,第一印像只有一次。正因為網站的首頁本身有著如此重要的意義,首頁本身才有者其獨特的一系列設計目標。

開始著手實施這些目標之前,你會發現一個棘手的問題。所有我曾參與設計過的網頁都有著驚人的相似的訪問量趨勢,但總有一個網站會拔得頭籌。還記得之前提到過的最小最深刻的設計元素吧?這一點,即案例頁面,對一個新的網站來說是一個微量元素;對搜索引擎來說它是搜索結果;對一個網上商店來說,它是一個產品頁面。這一頁面往往佔據了60%到75%的網站訪問量,其餘的訪問量大都來自網站的首頁。

產品或者案例頁面的訪問量如此之高,是不是就說明首頁的設計無足輕重了呢?答案是否定的。鑑於首頁是整個網站的門面或者說形象工程,是整個網站給訪問者的第一印象,因此首頁的設計也是至關重要的。我們來看一下首頁帶給我們的挑戰吧。記住,我們說首頁的時候,是以whatever.com這種形式上線的頁面也就是用戶打開一個網站看到的第一個頁面。

所有的首頁都有四大主要目標,排列順序如下:

目標一:回答問題,這是什麼地方?

一個新到的訪問者到了一個不熟悉的網站上要做的第一件事就是問這樣一個問題。如果你忽視了這一工作未能對這一問題做出一個明確的回答,你就會使訪問者感到困惑不堪。如果這一網站未能對這一問題做出認真回答,也就是說這一網站的首頁未能在最短的時間內讓客戶弄明白這一問題,客戶就會一頭霧水,對你的網站的主要職能無法做出一個清晰的判斷,訪問者就會毫不遲疑的退出你的網站,再也不回來。用戶這種反應是可以可以理解的,換個角度想想,如果你遇到了一個人,他的言行讓你覺得自己像白痴一樣什麼也聽不懂,什麼也看不懂,你會是什麼反應?你會選擇跟這樣的人合作嗎?你還會選擇繼續在他的網站上停駐嗎?以上內容都是關於如何給訪問者留下最好的第一印象。

不要害怕使用那些句法老套,但是又的確很有用的表達:“這裡是誰的網站,我們的網站是做什麼的。”這些句子雖然簡單,但卻能在最短的時間內傳達最多的有效信息。然後將這一頁面鏈接到內容更為詳細的about頁面。這樣,對你的網站設計感興趣並且需要從你的網站上獲得幫助的訪問者會循著鏈接找到對他們有用的頁面,而且要確保你使用的文檔積極而且令人興奮,使用戶感覺到你傳達的信息都很重要。當然,文字內容不要拖沓冗長。但是要確保你的文本內容包含有大量的有用信息。但是這些解釋需要出現在第一頁的頭部,對你的網站來說這是將新的訪問者轉變成回頭客的最重要的方式。

對於那些想要嘗試新事物的公司來說,這一點尤其重要。 Google會擺脫一個用戶不友好的門戶頁面,儘管所有人都已經很熟悉對這一網站的使用。但這恰恰是這一原則的例外。如果你在嘗試新的事物,有時候你具有必要用平實易懂的語言來解釋這一點,比如:Flock是一個開源的網絡瀏覽器。如果三秒鐘之內,你無法讓一個新到你的網站上的訪問者弄清楚你的網站主要是關於什麼的,你的第一大目標就未能實現,其餘的目標就更無從談起了,唯一會使用這一網站的是那些費了九牛二虎之力了解你的網站的內容的人們,你知道的,這些人我們只能稱之為受虐狂。

目標二:留住回頭客
第二大目標在於擺脫已經了解你的網站的內容,直到自己在做什麼的用戶的使用方式,這樣的擁護跟你一樣,大都會是這個網站的建設者,他們很久以前就在這個網站上,對整個網站也已十分了解了。伴隨著開始的兩大目標的一個極佳的技術就是要使頁面某一區域顯得很有活力。這一區域可以用來向新的訪問者介紹網站內容。但是一旦用戶註冊進來,這一介紹就要替換為對這一特定用戶有用的內容或者說信息。 ( 這一做法也符合了目標三)

目標三:展示新的內容
到你該實現目標三的時候,你就已經開始忙於同時滿足新的訪問者和回頭客的不同需要了。那就要想你表示祝賀了,現在,所有的訪問者都在同一個頁面上了!現在就是用網站上不斷更新的內容給所有訪問者留下深刻印象了。很多網站在完成了第一第二大目標之後就停步不前了。但是你可能忽略了這一點,一旦用戶弄明白了你的網站的主要職能,然後又再次回到你的網站上來的時候,他們的問題將會是:有什麼新的信息?你要比你的用戶更了解你的網站,最後是能成為他們的嚮導。建議一些他們應該去的頁面或區域。從新信息著手。博客在這方面尤其有用,可以保持內容的不斷更新。
目標四:提供可靠的,連貫的全球適用的導航

這一點不僅對首頁有益,對整個網站都很有好處,這一點之所以重要是因為你在首頁上設定的期望需要在每一頁面上下足功夫才能達到預期目標。在這裡看這一點微不足道,如果某一鏈接出現在了首頁的導航欄中,這一鏈接也因該出現在其他頁面大致相當的位置。如果頁面底部出現了六個鏈接,所有頁面的底部都應該出現這六個鏈接。

為用戶著想的設計主要的目的在於交流順暢,提早設定預期目標,然後傳達你所允諾的內容。將首頁想像成一首歌的開篇第一小節。你所要做的就是要保證你的調子始終都能取悅聽眾。

2011年4月15日 星期五

實踐出真知---設計配色方法


俗話說實踐出真知,處於對網頁設計的好奇和興趣,超愛平面設計和網頁設計。

最吸引我的還是設計時色彩搭配的問題。色彩搭配的合不合理,關係到設計的成敗。

通過慢慢的實踐和總結,我發現在設計中紅配黑、 淺藍配顏色艷麗的桔黃色、 黑色陪深黃色比較跟的上潮流哦~

另外, 灰色比較百搭,配什麼顏色都比較好看;

如果你要多種顏色搭配,最好用淺一點的顏色搭配;

如果要用深色搭配,那麼顏色最多不要超過三種,而且其中最好包括黑色或者灰色比較好!

 
淺綠也是一種不錯的調配色哦~

哈哈,如果你也和我一樣喜歡平面設計和網頁設計,歡迎交流~



2011年4月14日 星期四

網頁色彩搭配的妙計

一個好的網頁設計除了需要合理的網頁佈局技巧之外,色彩的搭配也是很重要的。當你的鼠標在頁面上遨遊時,假如頁面顏色單一不突出或者沒有特色是很難吸引客戶停留的,但是怎樣的色彩搭配才是最完美的呢?我在這裡教大家些關於網頁色彩搭配的妙用方法。
一、紅色的色感溫暖,性格剛烈而外向,是一種對人刺激性很強的色。紅色容易引起人的注意,也容易使人興奮、激動、緊張、衝動、還是一種容易造成人視覺疲勞的色。
1、在紅色中加入少量的黃,會使其熱力強盛,趨於躁動、不安。2、在紅色中加入少量的藍,會使其熱性減弱,趨於文雅、柔和。3、在紅色中加入少量的黑,會使其性格變的沉穩,趨於厚重、樸實。4、在紅中加入少量的白,會使其性格變的溫柔,趨於含蓄、羞澀、嬌嫩。
二、黃色的性格冷漠、高傲、敏感、具有擴張和不安寧的視覺印象。黃色是各種色彩中,最為嬌氣的一種色。只要在純**中混入少量的其它色,其色相感和色性格均會發生較大程度的變化。1、 在黃色中加入少量的藍,會使其轉化為一種鮮嫩的綠色。其高傲的性格也隨之消失,趨於一種平和、潮潤的感覺。2、 在黃色中加入少量的紅,則具有明顯的橙色感覺,其性格也會從冷漠、高傲轉化為一種有分寸感的熱情、溫暖。3、 在黃色中加入少量的黑,其色感和色性變化最大,成為一種具有明顯橄欖綠的複色印象。其色性也變的成熟、隨和。4、 在黃色中加入少量的白,其色感變的柔和,其性格中的冷漠、高傲被淡化,趨​​於含蓄,易於接近。
三、藍色的色感冷嘲熱諷,性格樸實而內向,是一種有助於人頭腦冷嘲熱諷靜的色。藍色的樸實、內向性格,常為那些性格活躍、具有較強擴張力的色彩,提供一個深遠、廣埔、平靜的空間,成為襯托活躍色彩的友善而謙虛的朋友。藍色還是一種在淡化後仍然似能保持較強個性的色。如果在藍色中分別加入少量的紅、黃、黑、橙、白等色,均不會對藍色的性格構成較明顯的影響力。
1、 如果在橙色中黃的成份較多,其性格趨於甜美、亮麗、芳香。2、 在橙色中混入小量的白,可使橙色的知覺趨於焦躁、無力。
四、綠色是具有**和藍色兩種成份的色。在綠色中,將**的擴張感和藍色的收縮感相中庸,將**的溫暖感與藍色的寒冷感相抵消。這樣使得綠色的性格最為平和、安穩。是一種柔順、恬靜、潢足、優美的色。
1、 在綠色中黃的成份較多時,其性格就趨於活潑、友善,具有幼稚性。2、 在綠色中加入少量的黑,其性格就趨於莊重、老練、成熟。3、 在綠色中加入少量的白,其性格就趨於潔淨、清爽、鮮嫩。
五、紫色的明度在有彩色的色料中是最低的。紫色的低明度給人一種沉悶、神秘的感覺。
1、 在紫色中紅的成份較多時,其知覺具有壓抑感、威脅感。2、 在紫色中加入少量的黑,其感覺就趨於沉悶、傷感、恐怖。3、 在紫色中加入白,可使紫色沉悶的性格消失,變得優雅、嬌氣,並充滿女性的魅力。
六、白色的色感光明,性格樸實、純潔、快樂。白色具有聖潔的不容侵犯性。如果在白色中加入其它任何色,都會影響其純潔性,使其性格變的含蓄。
1、 在白色中混入少量的紅,就成為淡淡的粉色,鮮嫩而充滿誘惑。2、 在白色中混入少量的黃,則給人一種香膩的印象。3、 在白色中混入少量的藍,給人感覺清冷、潔淨。4、 在白色中混入少量的橙,有一種干燥的氣氛。5、 在白色中混入少量的綠,給人一種稚嫩、柔和的感覺。6、 在白色中混入少量的紫,可誘導人聯想到淡淡的芳香。
此外,值得注意的是,在選擇顏色上時,不要全部使用,多未必是好的,關鍵是合適,什麼時候該用什麽顏色,該在哪裡使用,在你動手之前先問下自己。肯定會為你的網頁設計加分不少