網(wǎng)頁設(shè)計(jì)必備知識(shí)

第頁網(wǎng)頁設(shè)計(jì)必備知識(shí)〔網(wǎng)頁〔制定〕〕必備知識(shí)

以下就是網(wǎng)頁制定必備知識(shí)等等的介紹，希望為您帶來幫助。

(一)什么是主頁

Internet快速發(fā)展，網(wǎng)民人數(shù)激增，能在網(wǎng)上擁有自己的主頁是網(wǎng)民的心愿。在網(wǎng)絡(luò)中有一種配置較高，24小時(shí)開機(jī)的計(jì)算機(jī)，之間連接在internet上的服務(wù)器。利用瀏覽器，通過internet可以直接查看硬盤(服務(wù)器)上的文件，這就是我們講的網(wǎng)頁。很多網(wǎng)頁合起來就構(gòu)成了主頁。

(二)主頁空間及免費(fèi)服務(wù)

要做主頁首先要在internet上找一個(gè)服務(wù)器空間放置主頁。大的網(wǎng)站可以給你提供30M至100M的免費(fèi)主頁空間讓你使用。因?yàn)槭敲赓M(fèi)的，服務(wù)功能少一些。你要享受更好的服務(wù)，可以申請(qǐng)?zhí)摂M主機(jī)，但這是要收費(fèi)的。

申請(qǐng)到主頁空間后，會(huì)得到一個(gè)域名，就是你的主頁地址，在瀏覽器地址欄輸入這個(gè)網(wǎng)址就可以瀏覽你的主頁了。如果網(wǎng)址名太長不好記，還可以申請(qǐng)一個(gè)新的域名。域名有免費(fèi)和收費(fèi)兩種，免費(fèi)的域名，注冊一下就可以了;收費(fèi)的域名要到指定的機(jī)構(gòu)辦理手續(xù)。國外域名可以自由申請(qǐng)，一個(gè)域名一年約十幾元錢。

在internet上還有免費(fèi)的計(jì)數(shù)器和聊天室，都可以用到你的網(wǎng)頁中去。

(三)網(wǎng)頁實(shí)際是文本文件

網(wǎng)頁是用文本文件組成的，擴(kuò)大名是htm或html。最初用html(超文本標(biāo)記語言)，現(xiàn)在擴(kuò)大為有HTML、CSS、JAVAscript組成的DHRML，就是常說的"動(dòng)態(tài)網(wǎng)頁'。

網(wǎng)頁是純文本文件，可以用文本編輯軟件來編輯，記事本是最簡單的網(wǎng)頁編輯工具了，但功能太簡單。Ultraedit是具有很強(qiáng)功能的文本編輯軟件，專為網(wǎng)頁編輯提供了很強(qiáng)的功能。

(四)所見即所得的網(wǎng)頁制作工具

用文本編輯軟件做網(wǎng)頁必須會(huì)HTML語言，所見即所得的網(wǎng)頁制作工具，和WORD排版差不多，你只要將文本、圖形擺到網(wǎng)頁中，網(wǎng)頁會(huì)自動(dòng)生成HTML代碼。

Frontpage是微軟公司出品的網(wǎng)頁制作工具，和WORD、IE結(jié)合得非常好，簡單易用、易上手，是初學(xué)者比較好的選擇，但兼容性差一些，制作的網(wǎng)頁不支持Netscape等其他瀏覽器，對(duì)復(fù)雜的動(dòng)態(tài)網(wǎng)頁的制定能力有限。

Macromedia公司的Dreamweaver是相當(dāng)優(yōu)秀的網(wǎng)頁制作工具，功能強(qiáng)大，操作方便，代碼簡潔，有強(qiáng)大的動(dòng)態(tài)網(wǎng)頁制定能力，與Fireworks、Flash等軟件結(jié)合緊密，受到大多數(shù)專業(yè)網(wǎng)頁制定者的青睞。

(五)網(wǎng)頁的大小與傳輸速率

初學(xué)網(wǎng)頁制定的人喜愛在網(wǎng)頁上放很多美麗的圖片，看起來很舒適。但是圖片多，會(huì)使網(wǎng)頁的文件很大，瀏覽相當(dāng)費(fèi)時(shí)間。要盡量少用圖片，必須用的話也要盡量想辦法減小圖片的體積。

(六)網(wǎng)頁上常見的圖形格式

JPEG和GIF是網(wǎng)頁中使用比較多的兩種圖形文件格式。

JPEG格式文件的擴(kuò)大名是JPG，是一種高壓縮率的真彩色圖形文件，可按必須要調(diào)整其壓縮質(zhì)量和文件大小，是用得最多的一種靜態(tài)圖形文件格式。

GIF文件擴(kuò)大名是GIF,是一種256色的動(dòng)畫文件格式，可以在網(wǎng)頁中顯示動(dòng)畫效果。GIF文件采納無損壓縮技術(shù)，壓縮后圖形質(zhì)量不會(huì)有絲毫變化，還可以使用透明背景。GIF文件要有專用工具軟件制作，如Addbe公司的Imageread和Macromedia公司的Fireworks。

(七)gif動(dòng)畫的制作

gifmovegear、Animagicgif也是小巧有用的gif動(dòng)畫制作工具。

(八)網(wǎng)頁內(nèi)容與網(wǎng)頁制定

網(wǎng)頁內(nèi)容和網(wǎng)頁外觀像寫文章一樣，是形式和內(nèi)容的統(tǒng)一。不要在網(wǎng)頁中加入太多的華而不實(shí)的圖片、效果，網(wǎng)頁要盡量明快、簡潔才好。

(九)上傳網(wǎng)頁

網(wǎng)頁做好以后，就可以上傳到申請(qǐng)好的服務(wù)器中，一般采納FTP上傳網(wǎng)頁(如LeapFTP、CuteFTP)，也可以用瀏覽器上傳網(wǎng)頁。

用Dreamweaver、Frontpage提供的FTP功能也可以上傳網(wǎng)頁。

要注意的兩個(gè)問題：

1、你的主頁的第一個(gè)HTML文件必須是index.htm和index.html。這是你主頁的大門。沒有他，別人是無法訪問你的網(wǎng)頁的。

2、因服務(wù)器使用的操作系統(tǒng)不一樣，所以網(wǎng)頁文件名是區(qū)分大小寫的。

網(wǎng)頁制定必備基礎(chǔ)技能

1、熟練掌握html/css代碼

不管是否是做開發(fā)的，最基本的開發(fā)語言HTML/CSS你是有必要掌握的，知道如何閱讀、編輯并解決問題。然而依據(jù)制定師/開發(fā)者的實(shí)際工作狀況，你所必須要了解的程度、范疇甚至?xí)鼜V一些。在任何狀況下，你都應(yīng)該清楚樣式、色彩要如何通過代碼來進(jìn)行控制和調(diào)整，從長遠(yuǎn)來看，這些技能是極其有用的。

2、編輯圖片

在任何制定領(lǐng)域都會(huì)和圖片常常打交道，絕大多數(shù)甚至是必須要整天編輯處理圖片。從最基本的裁剪、調(diào)色和修補(bǔ)，你應(yīng)該能夠從容地修整圖片，至少你應(yīng)該了解如何能夠盡可能好地對(duì)圖片進(jìn)行優(yōu)化。

3、了解印刷

雖然大多數(shù)時(shí)候可能都在忙于數(shù)字化的制定，但是總會(huì)有一些制定是必須要借助到印刷的。從名片到新聞稿，這些東西在制定之初就要為印刷做好準(zhǔn)備。在這方面，最值得注意的還是不同媒體的分辨率和色彩的控制，避免萬一你要的是深紅色，結(jié)果印刷出來是暗紅色!

4、書寫標(biāo)題

在進(jìn)行網(wǎng)頁制定的時(shí)候，正文部分可用假文(Loremipsum)來作為占位符，但是標(biāo)題則不能如此。當(dāng)你在進(jìn)行概念制定的時(shí)候，標(biāo)題是視覺和內(nèi)容信息的粘合劑，它不能隨便找句話放那兒。一個(gè)合理的標(biāo)題文本可以清楚地告訴客戶這個(gè)地方要多大的空間，有什么樣的效果，它會(huì)給客戶留下清楚而持久的印象。

5、熟悉各種設(shè)備

作為一個(gè)網(wǎng)頁制定師，肯定要熟練地用各種數(shù)字設(shè)備來瀏覽網(wǎng)頁。不同的系統(tǒng)、不同的設(shè)備在瀏覽網(wǎng)頁這件事情上還是有差異的，所以你應(yīng)當(dāng)適時(shí)地離開自己最熟悉的電子設(shè)備，去嘗試更多的數(shù)碼設(shè)備，保證自己的網(wǎng)頁能在任何狀況下都可以流暢地瀏覽。

6、敢于手繪

或許你并不是美術(shù)專業(yè)出身，但是你必須要敢于用草圖來傳遞信息。討論中不管有什么樣的想象和構(gòu)思，用手繪和草圖來表現(xiàn)能夠更清楚的闡述出來。請(qǐng)記住，線框圖和大綱才干更好地傳遞信息。你無必須成為手繪大師，不用字寫的非常美麗，但是你必須要敢于這么做，自信地用手勾勒出這一切，與人分享。

7、使用通用框架

在創(chuàng)業(yè)階段使用常見的網(wǎng)頁制定框架并不是什么丟人的事情，實(shí)際上，除非你真的是特別專業(yè)而強(qiáng)大的開發(fā)者，最好還是使用通用的框架。使用通用的框架可以讓別人也更好的使用你的網(wǎng)站和產(chǎn)品，如果你的網(wǎng)站必須要最終交付給客戶，那么從長遠(yuǎn)來看，用通用框架更好維護(hù)。

8、備份和打包

網(wǎng)站看起來是個(gè)完善的整體，但是實(shí)際并非如此，它同樣是容易損壞且脆弱的。備份網(wǎng)站是一門必修課。你應(yīng)當(dāng)了解網(wǎng)站系統(tǒng)中哪些東西比較容易損壞，多久備份一次比較合理。即使你不明白其中的道理，至少要了解哪些必須要儲(chǔ)存，備份應(yīng)該備份在什么地方。

此外，你應(yīng)該了解如何將網(wǎng)站樣式、制定相關(guān)、個(gè)性化、客戶文件以及系統(tǒng)的關(guān)鍵性文件在哪里，以及如何打包它們。

9、了解趨勢

簡單來說，重要的不是對(duì)所有趨勢如數(shù)家珍，但是你至少要深入了解至少三個(gè)流行趨勢，能夠說明白這些制定趨勢在視覺上的特征，為什么要用它們，它們的運(yùn)作原理是怎樣的，你為什么喜愛或者不喜愛它們等等

10、解釋制定理論

色彩、流程、平衡、比例、間距，這些常見的制定概念你都了解了嘛?當(dāng)你在進(jìn)行制定項(xiàng)目的時(shí)候，這些概念你都應(yīng)當(dāng)了解并運(yùn)用起來。制定并不是單純的好看，內(nèi)在的概念也原理能告訴你為什么它這樣才會(huì)美麗。理解了它們，能自己解釋它們，你才干創(chuàng)造出平衡的美感。

網(wǎng)頁制定的一般流程

如果是基于商業(yè)型的網(wǎng)站，可大致分為七步：

一、購買空間和域名;

二、整理客戶資料，要依據(jù)客戶的要求來構(gòu)建我們的網(wǎng)站;

三、初步制定頁面效果，先制定幾個(gè)主要的頁面出來;

四、依據(jù)客戶的要求修改網(wǎng)站;

五、整體網(wǎng)站制作;

六、將做好的網(wǎng)站上傳到網(wǎng)絡(luò)空間;

七、后期維護(hù)及推廣。

如果是基于個(gè)人的網(wǎng)站，可大致分為五步：

一、申請(qǐng)免費(fèi)空間域名，因?yàn)槭莻€(gè)人的網(wǎng)站，如果購買的話很不劃算;

二、整理個(gè)人網(wǎng)站的資料，想好要做一個(gè)什么樣的網(wǎng)站;

三、整體網(wǎng)站制作;

四、上傳到網(wǎng)絡(luò)空間;

五、后期維護(hù)及推廣。

網(wǎng)頁制定有用法則

一、糾結(jié)的時(shí)候，讓自然為你做決定

遵循自然規(guī)律的制定總是因?yàn)橘N近萬物本源而受到更多人的寵愛，因此，當(dāng)你舉棋不定的時(shí)候，你可以選擇將制定代入大自然定律中，讓自然為你做出最好的決定。比如，現(xiàn)實(shí)和自然告訴我們，光源來自天空，在人們也已經(jīng)習(xí)慣了這種由上至下光線來源的時(shí)候，制定師必須要做的應(yīng)該是能順應(yīng)用戶視線的光線制定。

二、脫離色彩誘惑，能真正看清布局制定

色彩對(duì)人類視覺的沖擊力能產(chǎn)生最大的效果;一個(gè)網(wǎng)頁的用戶體驗(yàn)是否合格，從色彩和布局上就能看出一二。但在色彩的"陪同'下，布局的好壞與否似乎就此被"矮化'。為了讓制定師在制定時(shí)能更加清楚的審閱網(wǎng)頁布局，去色或是"灰度模式'的使用或許更有利于新手的布局制定工作。

沒有了色彩"打攪'之后的網(wǎng)頁布局一旦能夠讓自己滿意，再按照色彩理論或是個(gè)性喜好添加和更改顏色。

三、制定感是"留'出來的!

大膽留白是制定概念中經(jīng)常會(huì)提到的理論，但真正能依據(jù)理論具體落實(shí)的制定師卻為數(shù)不多?？赡苁且?yàn)橹贫◣熌憙翰粔虼?PS：怕被客戶噴死，"你是不是偷懶啊!怎么內(nèi)容那么少!你到底有沒有認(rèn)真做制定啊!@#￥%*!')，另一種可能是沒有在實(shí)際中領(lǐng)會(huì)到留白的美妙。

網(wǎng)頁制定中的留白是為了在有限的容量中預(yù)留一些讓其中元素呼吸的負(fù)空間，并不是一種所謂的"偷懶'行為。大片留白在國內(nèi)市場中極有可能面對(duì)各種不滿，但小范圍的留白卻能很有效的提升整個(gè)網(wǎng)頁的檔次。比如網(wǎng)頁中圖片與字句之間的間距，只要留出兩倍及以上的間隙，整體都會(huì)展現(xiàn)出令人眼前一亮的簡潔感。

四、試試把文字直接放在圖片上

這種制定手法看起來很簡單是不是?但要用這種方法制定出一鳴驚人的網(wǎng)站就有一定難度了。在應(yīng)用過程中，為了不破壞網(wǎng)站的用戶體驗(yàn)，有幾點(diǎn)可以特別關(guān)注。

文字的顏色盡量使用白色，讓網(wǎng)頁看起來更大氣;因此，網(wǎng)頁背景圖的色系選擇以暗色為主;更細(xì)致的話可以再不同的分辨率下進(jìn)行調(diào)試，確保在所有的狀況下文字或主要內(nèi)容都是易于辨識(shí)的。

五、關(guān)于字體，合適比新穎更重要

"堅(jiān)定求新'是很多制定師的職業(yè)病，其實(shí)，在任何事件中，合適，比什么都重要!

在網(wǎng)頁字體的應(yīng)用中，形形色色的字體樣式會(huì)讓制定師不知如何是好，制定師或許會(huì)因此挑花了眼，或許會(huì)始終在常用的幾種字體中互相轉(zhuǎn)換。而關(guān)于字體的選擇，制定師應(yīng)該依據(jù)圖片中的某些元素作為靈感，以此在網(wǎng)頁中自然地形成隱形線索。

六、只有強(qiáng)弱并存才會(huì)獲得對(duì)比

用強(qiáng)弱的對(duì)比展現(xiàn)重點(diǎn)特別是制定中強(qiáng)調(diào)內(nèi)容最自然的方式。比如背景圖的弱化，加上清楚的文字或圖案，網(wǎng)頁會(huì)因此營造出以后總別致的唯美效果。如果圖片比較單調(diào)，也可以在背景和文字的中間添加一些透明度較高的線性幾何成分，讓頁面豐富充實(shí)起來，也讓整體不再單薄。

七、你必須要一雙善于發(fā)現(xiàn)的眼睛

身邊的一切都可能隨時(shí)為你帶來靈感，千萬別小氣你的眼睛!

每一個(gè)細(xì)小的部分都有資格成為你的制定元素，你應(yīng)該讓它們產(chǎn)生一些小改變，它們就會(huì)讓你的制定大提升。濾鏡?幾何?每一種效果都必須要你的嘗試。

八、桃紅色淺橙色!她們才是真正的百搭色

粉嫩的暖色系色彩一直會(huì)被誤認(rèn)為是很難用的顏色，當(dāng)這類色彩被混雜在五顏六色的"調(diào)色盤'中確實(shí)夠難搭配，那無妨嘗試一下在單色背景中使用她們，無論是稍作點(diǎn)綴，還是設(shè)置為主色調(diào)，你都一定會(huì)發(fā)現(xiàn)其中的不張揚(yáng)魅力。

九、導(dǎo)航是網(wǎng)頁中最重要的制定

導(dǎo)航可以說是整個(gè)網(wǎng)站中最重要的制定，用戶體驗(yàn)舒適與否很大的決定權(quán)源自于此。對(duì)導(dǎo)航制定的最正確評(píng)價(jià)應(yīng)該是"召之即來，揮之即去'。幽靈按鈕、漢