導航:首頁 > 萬維百科 > 對於網頁設計的來源

對於網頁設計的來源

發布時間:2020-10-25 12:01:38

1、網頁設計(網站)是做什麼的

網頁設計(web design,又稱為Web UI design,WUI design,WUI),是根據企業希望向瀏覽者傳遞的信息(包括產品、服務、理念、文化),進行網站功能策劃,然後進行的頁面設計美化工作。作為企業對外宣傳物料的其中一種,精美的網頁設計,對於提升企業的互聯網品牌形象至關重要。
網頁設計一般分為三種大類:功能型網頁設計(服務網站&B/S軟體用戶端)、形象型網頁設計(品牌形象站)、信息型網頁設計(門戶站)。設計網頁的目的不同,應選擇不同的網頁策劃與設計方案。
網頁設計的工作目標,是通過使用更合理的顏色、字體、圖片、樣式進行頁面設計美化,在功能限定的情況下,盡可能給予用戶完美的視覺體驗。高級的網頁設計甚至會考慮到通過聲光、交互等來實現更好的視聽感受。
網頁設計主要以Adobe產品為主,常見的工具包括FW、PS、FL、DW、CDR、AI等,其中DW是代碼工具,其他是圖形圖像和FL動畫工具。還有最近幾年Adobe新出的EdgeReflow、EdgeCode、Muse。

2、網頁設計的誕生與演變

網頁的誕生,對於老網民來說,好像很久很久以前的故事了,其實,到目前為止也就是十幾年的時間。它期間,網路技術的發展變化使人目不暇接,可以說它的演變周期是以「天」來計算的。

第1章 可能性的探索
網路技術的日新月異的變化給網頁設計帶來了新的表現天地。在網路世界裡,技術始終起著先導作用,設計見分曉隨著技術的發展而發展、變化。
瀏覽器這個新技術的出現使得信息傳達與思想交流得以在網頁中實現。可以說網頁設計這個概念也是在這個時期開始了萌芽。在瀏覽器的發展初期,網頁頁面上還無法顯示圖像、聲音、影像等要素,必須啟動其它輔助軟體才能實現,但是,很快這些技術問題便得到了解決。現在好像已經是理所當然的事情,可在當時這是一個多麼在的驚喜啊。網頁設計師們像得到了法寶,大家趕快在網頁中加進了這些新的要素。從那時起,諸如shockwave、Future Splash(現叫Flash)以及各種Movie、Java等新技術發表後,這樣的行為就反復地出現。但不管怎麼說,隨著各種技術的不斷發展,瘰曾經出現在出版印刷、廣播電視以及光碟等媒體上的表現形式,逐漸地在網頁設計上也同樣成為了可能。
這種「既然可能,那就試試」的想法的第一個「受害者」就是網頁的下載速度。雖然這種豐富的實驗性網頁看上去與其它的網頁有所不同,但是,那種圖像的亂貼,各種技術的濫用所導致的結果使得網頁的下載時間成倍的增長。更嚴重是任何信息也無法傳遞出去。當然,無論是網頁設計師還是用戶,都希望網頁更有抵魅力、更有感染力。但是,如果它失去了必要的平衡關系的話,其結果是事與願違。這種設計構想與技術(下載速度等等)的沖突矛盾,至今還持續著。也許,這種沖突將永遠無法得到解決。因為,無論傳送速度如何地改善,網路用戶都將不斷地增加,而且,隨著傳送速度的提高,網頁設計師們又會想出很多新的表現手法,他們的探索與嘗試是不會停止的。

第2章 形式與結構
從「網頁」這個稱呼來看,我們就應該明白,當初創造它的科學家們僅僅是把它作為一種可以共享的「文書」來使用的載體則設想為「低」。
隨著網路商業行為被人們所接受,越來越多的人參與進來。人們使用網際網路與利用網際網路的目地與其誕生初期產生了很多不同,變得多元化了。隨之而來的便是各種各樣的探索與嘗試網際網路廣告、電子商務、電子出版、網上商店等等。到這時;正式概念上的「網頁設計」雛形終於誕生了。當然,在此之後,在此之前,伺服器上的以及電腦與電腦在文件流通上的「設計」是一直存在的,這種設計是如何地重要是毋庸置疑的。但是,作為可視的,人與人在交流層次上的網頁設計,才是人們最需要的,才是人們直接地實現自己理想的手段。
在網頁設計的發展初期,設計家們就發現,無法保證自己所設計製作的內容完全不變地再現於網頁之中。瀏覽器在解釋文本語言的構造後,並通過頁面來顯示時,會出現一些偏差與變異,顯然它沒有充分考慮到更容易讓它人控制的解讀方式。作為人與人之間的有效的交流手段來說,它還存在太多的缺陷。對於這些問題進行了一系列的探索,想了很多不得已的辦法。比如用本來是做表格的標記格式來控制頁面的構圖,用透明GIF圖像來調整間距,用圖像方法來進行文字設計等等。雖然,這些技巧無法解決所有問題,而且,這種做法對於重視結構的HTML來說會帶來許多不利的問題,但是,這種做法所帶來的好處在重視這些好處的人們之間,很快傳播開來。現在,CSS方案被提出與普及,人們才真正朝著解決「形式與結構」這個問題上前進了一步。

第3章 設計方針的變遷
僅僅十幾年的時間,網頁設計的流行傾向就經歷了幾次巨大的轉變。其中之一就是對機能性重視的演變。在一兩年前,網際網路上許多著名的網站都陸續地改變了自己的網頁設計風格,網站的製作重點都更加傾向於對可操作性,功能性的重視。原因之一便是隨著用戶和訪問頻率的急劇增加,導致網站必須把多餘的純裝飾性的東西省略,以提高網站的可讀性,另一個原因是,各個網站已經積攢了一定的經驗,漸漸明白什麼是應該提供的信息,哪些服務是重要的哪些是不重要的。現在較多的媒體型網站以及軟硬體公司的網站上,還有網上商店等到電子商務型網站上,均可以看到這樣的變化。人們最關心的門戶網站也是如此。
去掉多餘的圖像來提高速度,這是對機能性的重視,但是,如何使用戶更快更容易地找到需要的信息,如何讓用戶更快地了解網頁上的信息質量,如何引起用戶的興趣等等,還有如:什麼樣的信息放在什麼樣的欄目里,應該起什麼樣的名稱,這些信息應該是以什麼樣的形式來設計,比如說文章應該分多少頁來顯示,每頁的量又應該是多少,標題應該如何設計,圖像該有該無等等,都對信息的傳遞效果起到很大的影響。另外,電腦屏幕是平面的,我們無法直觀地了解網站信息的立體結構;比如說,從一本書的外觀厚薄上,我們可以直接地感到其信息量的多少,無論閱讀到哪裡,我們也可以輕而易舉地知道已經看了多少,還有多少沒看,但在網頁里,我們卻很容易迷失方向。如何使用戶能更快地把握網站的立體結構,如何使用戶穿梭自由,這些都是每一個網頁設計師應該注重的問題,這也是重視機能的根本所在。對待不同的內容,不同的目的必須採取不同的設計手法。如果在這一點上概念模糊,定位不準的話,肯定給讀者帶來的是不快與煩惱,也是浪費讀者的時間與精力。

第4章 關於速度
速度是網頁設計類學的基本要素。「沒有迅捷的傳送速度,就沒有好的設計」很多從事此項設計的人都相信這句神話。
針對傳送速度的限制,出現了許多新的設計方案。比如,在HTML之上,設很多層頁,利用這些層頁可進行植字,重疊排版的技術(CSS),它使設計者們實現了用有限的資料來提供更多內容的想法。在CSS出現之前,要設計一個理想的標題只能用平面圖像,因此在一定程度上對傳送速度產生了影響。使用CSS的話,字體,正確的文字尺寸,文章中的行距以及在畫面中的位置等都可以得到自由的調整,另外,使用像Macromedia的Flash一樣的Vektor Graphc Fomart圖像處理格式,更可以在不降低畫面效果的情況下,不精確地完成文字字體的選擇與字體的設計,然而,不依賴以上技術也同樣可以提高下載速度。掌握幾個簡單的方法就能使用迅速地等到需要的內容。例如,利用HTTP的特徵,靈活使用壓縮手法也可以提高瀏覽速度,把幾個圖像統一為一個,就比把它們分割成眾多的小圖像好得多,因為,瀏覽器在讀取圖像的時候,是一幅一幅讀取的,每幅圖像的讀都必須進行數次接續交換,這種交換次數越多下載速度就越慢。如果把小的圖像統一起來,變成一個指南圖來利用,即使單個文件變得大一些,因數據交換次數少了,下載速度也會有所提高。
如何使自己的網頁變得更加輕巧。如何進一步提高網頁的下載速度,主要有兩點必須考慮:

4.1、簡潔的HTML構成
4.2、減少每一幅圖像的容量(bytes)
所謂「簡潔的HTML構成」不是以前那種沒有任何設計的簡單網頁。而是在網頁設計的排版構圖上,使我們能夠設計出理想的構圖。但是,表格技術又有其弊病,如果把表格設計得過分復雜的話(比如過分使用表格之中套表格等手法的話),瀏覽器在解釋與顯示它時就會花過多的時間。所以簡潔的表格設計構成是提高下載速度的一個關鍵。隨著網頁商業化的普及,在網頁上,商品圖像的登載已成為必然的事情。如果登載的照片沒有經過精心的加工,下載它所需要的時間是難以想像的,用戶會因此對你的網頁產生反感。為了避免這樣的結果。應在允許的范圍內,把圖像壓縮到最小程度,因為計算機上的圖像是由一個點的像素組成的,所以這些像素點的多少便是使圖像的容量產生變化的主要原因。在用Photoshop加工圖像時,JPEG的壓縮率由1%到100%大致可分為10個檔次,當然1%的壓縮率最高,圖像的信息量(像素)被壓縮到最少,但對圖像質量的傷害太大,一般不適合採用。相反,100%的壓縮率最小,圖像質量很好,但是,文件太大,也不適合採用。一般是在30%到50%之間進行壓縮。GIF在減色時也分很多檔次,可在1色到256色間變化。

第5章 簡潔明了
「簡潔」也是網頁設計的基本要素。在設計網頁時,我們必須充分考慮到用戶在閱讀網頁時的心理狀態,要讓讀者在最短的時間里,迅速地理解網頁里所提供的信息內容。在用戶進入網頁的數秒以內,給他一個好印象,引起他的興趣,才是最重要的。這就要求設計簡潔,主次分明,並通過明了易懂的網頁指南向用戶介紹網站內容。最終把用戶吸引到網站里。
5.1、滾動條的限制
在設計網頁時,對於重要的信息最好是在不滾屏的狀態下完全地顯示出來,這是一下最理想的狀態。但是,由於種種原因,這種狀態無法在所有情況下保持,即使如此,我們也應該盡量使它只出現一個滾動條,要麼是上下滾動,要麼是左右滾動。過多的滾屏會防礙用戶對整個網頁的理解。
5.2、統一網頁形象
這個概念來自於企業形象設計系統(CIS)的設計原理。這個原理在網頁設計中也同樣適用。這個系統會加強網頁的整體形象,以及頁面與頁面之間的統一性和整體感。使用戶對網頁能產生更深刻的印象。
5.3、網頁指南系統
因為網頁的閱覽方式是不定的,跳動性的,也可以說是含糊不清的,如果沒有明確的指南引導,我們的用戶將不知何去何從。這樣便容易導致他們離開這里。那麼,該如何做呢?我們知道讀者閱覽網頁的方式是自由的,跳動性的,所以我們就要做到無論讀者在網站里的什麼位置上,都可以自由地跑到其它想去的頁面上。這就要求我們在所有的頁面上都設有復數的連接點。而且最好是一次點擊就可以進去。其實,網頁設計與建築設計在很多原理上是很相似的,首先驃設計一個精彩的店面,因為給顧客留下的第一印象是很重要的,然後要有很多道路以及電梯等設備,盡快使顧客到達自己要去的地方,並明白所處的方位。如何去其它的樓層,在那裡有些什麼等等。讓你的顧客迷路是一種最危險的行為,因為在網上的顧客會馬上跑到其它的網站里。
製作網頁指南的要點在於簡明易懂以及使用上的簡單便利。無論你自己認為是多麼優秀的設計,用戶不明其意,或者不知如何使用的話,一切都等於零。而且, 如果用戶為了看到想要的信息要經過數次點擊,也是不可取的。以最少的點擊獲得最多的結果是網頁設計的一個原則。據調查,如果主頁的訪問率為100人次,經過第一次點擊到達下一頁的訪問率將下降到30到50人次,再下一頁的話,訪問率會減少到10到20 人次。這個調查說明,網頁的層次越復雜,內容的實際訪問率也將越低,情報也就越難傳達到讀者那裡,所以,盡量把網頁的層次簡單化,力求以最少的點擊次數連接到具體的內容。最理想的是只通過兩三次點擊就可以到達目的地。
第6章 圖像製作
圖像的下載速度決定著網頁顯示的快慢。HTML文件對下載速度沒有太大的影響,對速度影響最大的還是圖像,所以,如何把圖像做得精緻恰當,選用什麼樣的壓縮方式也是提高下載速度的關鍵。
6.1、JPEG和GIF
現在網頁上經常使用的圖像壓縮方式還是以JPEG與GIF為主。這兩種壓縮方式選擇哪一種更好呢?這是由設計時的具體情況決定的。
GIF的壓縮方式與人們的讀書方法是一樣的,從左向右,由上到下。圖像在用GIF格式保存時,加工軟體是由左上端的像素開始,然後向右掃描,然後再由下一端的左邊開始,就這樣反復地掃描壓縮。如果是由一些不同的色素點組成的復雜紋樣的話,它就無法進行有效的壓縮,在平塗顏色面積較大的情況下,漸變色彩較少的圖像,使用GIF形式壓縮比較合適。雖然它不適合照片的壓縮,但是,如果照片等圖像的尺寸小於100*100px的話,用GIF形式壓縮也是比較合適的。
JPEG是一個攝影團體發明的壓縮方式,它最適合照片之類圖像的壓縮,圖像的壓縮率可以自由調整。適於大幅圖像的製作,隨著壓縮率的提高,下載速度也就會相應提高。色彩復雜的圖像選擇JPEG形式的理由是,這種形式可以保存幾百萬種像素。而GIF形式的像素保存卻被限制在256種之內。JPEG形式的缺點是隨著壓縮率的提高,圖像的質量便會越來越差。另外,如果要修改這些圖像的話,應該打開24比特(bit)的原始圖像進行修改與變更尺寸。因為通過這兩種形式保存的圖像,在質量上都有所降低,若把它們打開再一次修改再一次變更尺寸保存的話,它們的質量就會有明顯的下降。
6.2、圖像的容量(bytes)
在用 Photoshop進行了圖像製作時,無法正確了解圖像的容量(bytes)圖像左下端的數值也並非圖像的真正容量。要起了解圖像的真正容量,最簡便的辦法就是選擇菜單的「Getinfo「命令。在這里我們可以了解它在硬碟上佔有的空間,以及文件本身的真正的容量。
6.3、圖像的格式
在網頁中可以插入的圖像有兩種:普通圖像和動畫。普通圖像的格式如表6-1所示。

格式 含義
GIF Graphics Interchange Formats的縮寫,CompuServer公司1987年推出GIF標准,並於1989年和1990年更新,目前標準是89a,256色,可以在所有的瀏覽器中觀看
JPEG Joint Photographics Experts Group開發的圖片格式,以開發小組的縮寫表示,JPEG保留RGB圖片中的所有顏色信息,通過選擇性地去掉數據來壓縮文件,JPEG圖片在打開時自動解壓縮
BMP DOS和Windows兼容計算機系統的標准Windows圖片格式,Windows與OS/2的點陣圖格式不同
TIFF 標簽圖片文件格式,用於在應用程序之間和計算機平台之間交換文件,是一種靈活的點陣圖圖片格式,為所有繪畫、圖片編輯和頁面排版應用程序支持。而且幾乎所有桌面掃描儀都可以生成TIFF圖片
PCX Z-Soft Painbrush格式,用於IBM PC兼容計算機上。大多數PC軟體支持PCX 5
PNG Portable Network Graphics(可移植網路圖形)縮寫,是作為GIF的免專利替代品而開發的,支持顏色索引、灰度和真彩色圖像,需要特殊的插件支持才能顯示,用於在World Wide Web上無損壓縮和顯示圖像
EPS 封裝的PostScript文件,用於在應用程序間傳輸PostScript語言圖稿
而動畫格式有許多種,Dreamweaver支持的動畫常用的有數種:
1、GIF動畫――GIF動畫實際上是將幾幅GIF圖像循環播放而形成的動畫圖像。GIF動畫的製作工具很多,其中Microsoft公司的Gif Animator是最常用也是最好用的工具。
2、SWF動畫――Flash動畫,目前最為流行的網頁動畫,可以是高質量的矢量動畫。
3、視頻――有AVI視頻、QuickTime視頻、RM視頻和MPEG等數種。
在網頁中,我們可以在背景圖片的上面加上一個透明Flash動畫,使原本不會動的圖片變的更加生動,從而使網頁多姿多彩。[5] 圖片格式(P38)
結論:
在網頁設計時一定要選擇質量好,容量小的圖像為網頁快速的下載速度和留住訪問者打下基礎,同時,統一的網頁結構和布局也是提高網頁的顯示速度和網站的可讀性必要因素.

3、網頁設計的社會價值

網頁設計對於廣大網民來說,是面向不同的受眾群體,為他們提供所需要的信息,將信息以網頁整合的方式傳達給受眾。對於公司及企業來說,是為企業做宣傳,在一定程度上起到打廣告的作用,以網站的形式讓大眾了解其具體情況。對於設計師來說,就是在如今網路發達的時代,不斷的創新,使有創意有價值的網站在眾多的「垃圾網站」中脫穎而出,最重要的是實用性。

不知道你滿意不?祝新年愉快!^0^

4、網頁的設計原理是什麼?

網頁設計,網頁設計原則理念
(1)內容和功能決定表現形式和界面設計
做一個良好的網頁設計,需要了解客戶的東西很多,比如:
1、建站目的(是主推產品還是平品牌,是主要注重seo還是用戶交互等)。
2、網站類型。
3、欄目規劃及每個欄目的表現形式及功能要求。
4、主色調、客戶性別喜好、聯系方式、舊版網址、偏好網址。
5、根據行業和客戶要求,哪些是著重表現。
6、是否分期建設、考慮後期的兼容性、是否要開發其他語言版本。
7、客戶是否有強烈的建站慾望。
8、你是否能在精神意識上控制住客戶。
當把上述的內容都弄明白了的時候,大腦中就已經給這個網站有了全面而形象的定位了,這時才是有的放矢去做界面設計的時候了。
(2)界面是弱化的,突出的是功能
一個好的界面設計它的界面是弱化的,它突出的是功能,著重體現的是網站業提供給使用者是主要什麼。這就涉及到瀏覽順序、功能分區等等。要讓訪客在0.5秒內就能把握網站的行業性質,1秒內就知道該從哪個地方開始使用這個網站,能點一次的,絕不點第二次。當然上面說的是大多數功能性網站,對於宣傳展示性網站,諸如加特效的或flash網站,可能就不得不花哨一些,但不能太過分。網站不是動畫片,在效率越來越高,社會心理越來越浮躁的中國,人們的耐心越來越小,心理承受能力越來越低。效果可以體現意境,點到為止。
(3)模塊化和可修改性強
模塊化不僅可以提高重用性,也能統一網站風格,還可以降低程序開發的強度。這里就設計一些尺寸、模數、寬容度、命名規范等等知識了,不再冗述。
無論是架構還是模塊或圖片,都要考慮可修改性強。舉個簡單的例子logo、按鈕等,很多人喜歡製作圖片,n個按鈕就是n張圖片。如果只做3-5類按鈕的背景圖片,然後用在網頁代碼里打上文字,那麼修改起來就簡單,而網頁顯示的字體是帶有鋸齒的,一般即能清晰又保證美觀的字體字型大小有幾類:
宋體12px |宋體12px粗體|宋體14px |宋體14px粗體|黑體20px | verdana 9px | arialblack 12px+ |
(4)創意是可恥的,分析能力遠比創意來的重要
設計界動輒就大談什麼「創意」,需要指出的是,還沒有搞清目的意義和內容,還沒在技術製作上臻於完善的基礎上,用創藝和特效來迷惑客戶和訪客是可恥的。一個網站設計者的分析能力遠比創藝來的重要。

5、網頁設計與互聯網的關系?

1.網頁設計(web design,又稱為Web UI design,WUI design,WUI),是根據企業希望向瀏覽者傳遞的信息(包括產品、服務、理念、文化),進行網站功能策劃,然後進行的頁面設計美化工作。
2.作為企業對外宣傳物料的其中一種,精美的網頁設計,對於提升企業的互聯網品牌形象至關重要。

6、什麼是網頁設計?

網頁設計,又稱web界面設計,是企業將產品、服務、理念、文化等信息傳遞給訪問者的一種形式,和我們通常所見的平面設計是有一些不同之處的,最為主要的就是利用文字和圖片之間的組合,從而達到很好的和諧與美的布局設計。
網頁設計中需要達到的一個要求就是需要體現不同頁面之間的聯系,正確處理網頁之間、網頁的順序和內容、網頁內部和區域之間的關系。為了可以使得最終的效果得到良好的呈現,在布局的時候需要特別的注意是否合理和諧,美化視覺的合理性,讓參觀者有一個流暢的視覺體驗

7、專業網頁設計師的靈感來源,為什麼別人的網頁很有創意

藝術來源於生活,網頁設計師要經常參加一個藝術照獲取靈感,另外注意路邊,地鐵,公交車等所有的廣告設計作品,吸取精華,精美的藝術設計需要積累和轉化,首先你得注意觀察

8、怎麼才能找到關於網頁設計/製作的工作.對於一個幾乎

網頁設計是根據企業希望向瀏覽者傳遞的信息(包括產品、服務、理念、文化),進行網站功能策劃,然後進行的頁面設計美化工作。作為企業對外宣傳物料的其中一種,精美的網頁設計,對於提升企業的互聯網品牌形象至關重要。
網頁設計一般分為三種大類:功能型網頁設計(服務網站&B/S軟體用戶端)、形象型網頁設計(品牌形象站)、信息型網頁設計(門戶站)。設計網頁的目的不同,應選擇不同的網頁策劃與設計方案。
網頁設計的工作目標,是通過使用更合理的顏色、字體、圖片、樣式進行頁面設計美化,在功能限定的情況下,盡可能給予用戶完美的視覺體驗。高級的網頁設計甚至會考慮到通過聲光、交互等來實現更好的試聽感受。
網頁設計常用的工具包括AI、PS、FL、FW、DW CDR等。

9、網頁設計的構成要素有哪些?

網站的基本元素是網頁,一個個的網頁構成了一個完整的網站,網頁也是可分的,構成網頁的基本元素包括標題、網站LOGO、頁眉、頁腳、主體內容、功能區、導航區、廣告欄等。這些元素在網頁的位置安排,就是網頁的整體布局。

與對於網頁設計的來源相關的知識