第一篇：個(gè)人網(wǎng)頁(yè)排版
個(gè)人網(wǎng)頁(yè)設(shè)計(jì)如何排版布局
有些人始終認(rèn)為，網(wǎng)頁(yè)最主要是內(nèi)容，不需要再搞些門面上的東西，還拿出來(lái)比喻?？墒羌t花還需要綠葉陪襯。想想，若不只是單純的文本，還有畫面出來(lái)，那么它所吸引的何止現(xiàn)在的這些迷呢？ 那我所要說(shuō)的到底是什么呢？
我們先來(lái)說(shuō)說(shuō)構(gòu)成，“構(gòu)成：是將造型按視覺(jué)效應(yīng)、視覺(jué)力學(xué)和精神力學(xué)等原則組成的，具備美好形態(tài)的造型”。構(gòu)成形式里，有空間構(gòu)成（平面構(gòu)成和立體構(gòu)成）和時(shí)間構(gòu)成（靜和動(dòng)）。網(wǎng)頁(yè)設(shè)計(jì)的創(chuàng)作，就是要協(xié)調(diào)這里面的種種關(guān)系，順應(yīng)視覺(jué) 感受，才能夠打動(dòng)觀看者的視覺(jué)，得到我們想要的效果。
在這些形形式式里，都有 著如下的部件： 點(diǎn)：我們一般認(rèn)為，點(diǎn)是指圓形的，但這是不正確的。只要在空間里有非常少量的 面積，無(wú)法形成一個(gè)視覺(jué)上感覺(jué)的圖形，都是一個(gè)點(diǎn)。無(wú)論什么形狀都可以。線：點(diǎn)集合在一起就形成線。面：一個(gè)平面。體：一個(gè)物體。一般是指物體占據(jù)的空間，有三維形狀。那么，當(dāng)點(diǎn)、線、面與體集結(jié)在一個(gè)網(wǎng)頁(yè)上時(shí)，它們的關(guān)系要怎么協(xié)調(diào)呢？它們之間都有什么作用呢？
這需要網(wǎng)頁(yè)設(shè)計(jì)師花時(shí)間去構(gòu)想與策劃，如果有客戶找你設(shè)計(jì)網(wǎng)頁(yè)，他老說(shuō)網(wǎng)頁(yè)設(shè)計(jì)很簡(jiǎn)，可以很快只是把東西往上面一放就可以了，再不行就現(xiàn)場(chǎng)告訴你如何擺擺位。
如果你想做出好的網(wǎng)頁(yè)設(shè)計(jì)作品，這種單的設(shè)計(jì)你不要接了，可以交給網(wǎng)站制作人員直接做這種沒(méi)有設(shè)計(jì)質(zhì)素的單。深圳網(wǎng)站設(shè)計(jì)公司認(rèn)為做網(wǎng)頁(yè)設(shè)計(jì)懂得放棄某些單是你向?qū)I(yè)網(wǎng)頁(yè)設(shè)計(jì)師邁進(jìn)的第一步，因?yàn)槟承﹩螘?huì)影響你的設(shè)計(jì)思想與策劃，只要能糊口，別做廉價(jià)勞工！說(shuō)回網(wǎng)頁(yè)設(shè)計(jì)布局理論，點(diǎn)有集中視線、緊縮空間、引起注意的功能。兩個(gè)點(diǎn)相距不遠(yuǎn)而且形狀不等時(shí)，一般由小向大看。
近距離的點(diǎn)引起面的感覺(jué)。靈活運(yùn)用點(diǎn)，可使你的頁(yè)面有一些本質(zhì)上的變化。當(dāng)點(diǎn)占據(jù)不同的空間時(shí)，它所引起的感覺(jué)是不同的。
1）居中引起視覺(jué)集中注意。2）上引起下跌落感。3）在上左或上右引起不安定感。4）下方中點(diǎn)，產(chǎn)生踏實(shí)感。5）左下右下，增加了動(dòng)感。
為什么會(huì)這樣呢？因?yàn)槿说囊曈X(jué)，都是經(jīng)過(guò)對(duì)生活的感覺(jué)都得來(lái)的。在下方的東西，一般聯(lián)想到大地。在上方的東西，一般聯(lián)想到浮云。網(wǎng)頁(yè)設(shè)計(jì)的線、面、體亦然。
線，又分為直線和曲線。直線：給人以速度，明確而銳利的感覺(jué)，具男性感。曲線，則優(yōu)美輕快，富于旋律。曲線的用法各異，需結(jié)合自己的需要。而直線又分為斜線、水平線及垂直線。水平線代表平穩(wěn)、安定、廣闊，具踏實(shí)感。垂直線則有強(qiáng)烈的上升及下落趨勢(shì)，可增加動(dòng)感。斜線，一般我沒(méi)有怎么使用，因?yàn)樗斐梢曈X(jué)的一種不安定。據(jù)SNL網(wǎng)頁(yè)設(shè)計(jì)公司多年網(wǎng)站設(shè)計(jì)經(jīng)驗(yàn)所知，有些客戶是很迷信的，平穩(wěn)、安定可以代表他們公司的穩(wěn)固，所以別以為太有個(gè)性的設(shè)計(jì)能取悅他們。
人們每看到一個(gè)東西，都試圖用橫直來(lái)分析，斜、歪是人們所不愿意見到的，但 適當(dāng)運(yùn)用部梢源锏揭恍┨厥廡Ч ?這個(gè)要靠個(gè)人的感覺(jué)。面，指的是二度空間里的形。面又分為幾何形和任意形，我個(gè)人比較喜歡任意形，因?yàn)樗呷饲槲?。幾何形使人有一些機(jī)械感，但是，每一個(gè)圖形里都會(huì)要用到幾何形，請(qǐng)看它們各代表什么：
（1）圓形：運(yùn)動(dòng)及和諧美（2）矩形：?jiǎn)渭兌鞔_，穩(wěn)定（3）平行四邊形：有向一方運(yùn)動(dòng)的感覺(jué)。（4）梯形：最穩(wěn)定，令人聯(lián)想到山。（5）正方形：穩(wěn)定的擴(kuò)張。（6）正三角形：平穩(wěn)的擴(kuò)張。（7）倒三角形：不安定，動(dòng)態(tài)及擴(kuò)張、幻想。
我們?cè)谌粘Ｉ钪兴吹降臇|西，都是由于形與形、圖與底的相互關(guān) 系。圖形之間，圖底之間，正由于對(duì)比產(chǎn)生差異而被我們所感知所接受。圖與底的視差越大，圖形越清晰，對(duì)視覺(jué)的沖擊力越大，網(wǎng)頁(yè)設(shè)計(jì)中排版也是這個(gè)道理。那么，平面上 有那么多的東西，我怎么才能夠確定它是否是最主要的呢？請(qǐng)看：易于 成為“視覺(jué)中心”的條件：
（1）居于畫面中心。（2）垂直或水平的比傾斜更易成為中心。（3）被包圍。（4）相對(duì)于其它圖形較大的。（5）色感要素強(qiáng)烈。（6）熟悉的圖案，如果這件東西我們很熟，則一定會(huì)以它為焦點(diǎn)。
可以把自己認(rèn)為最主要的東西做大一點(diǎn)，突出一點(diǎn)，色彩鮮艷一點(diǎn)，其它的東西小 而且色調(diào)不要那么鮮明，以免搶了主題的“風(fēng)頭”。但有網(wǎng)頁(yè)設(shè)計(jì)用色方面深圳網(wǎng)頁(yè)設(shè)計(jì)公司提醒一下網(wǎng)頁(yè)設(shè)計(jì)初學(xué)者，對(duì)于注重企業(yè)形象的公司企業(yè)，企業(yè)用色是很嚴(yán)謹(jǐn)?shù)?，他們很可能有VI，有專用色、配色，所以在商業(yè)網(wǎng)頁(yè)設(shè)計(jì)中網(wǎng)頁(yè)設(shè)計(jì)師必須要求客戶提供主頁(yè)要求或VI資料。
第二篇：個(gè)人網(wǎng)頁(yè)制作
個(gè)人網(wǎng)頁(yè)制作
宣傳語(yǔ)：如果你已經(jīng)上網(wǎng)，為何不嘗試一下在網(wǎng)上做一個(gè)完全屬于自己的主頁(yè)？有了自己的主頁(yè)，全世界的人都可以隨時(shí)找到你，你也可以向全世界宣傳下自己，是非常有意義和有意思的。現(xiàn)在簡(jiǎn)單介紹一下制作主頁(yè)的過(guò)程和方法：
一、準(zhǔn)備材料
你首先做一個(gè)小計(jì)劃,準(zhǔn)備在主頁(yè)上告訴人家什么？比如介紹三個(gè)方面：自我介紹,我的愛(ài)好,我的工作,那你就先起一個(gè)總目錄（文件夾,比如d:html）,來(lái)放你的所有文件，然后再在這個(gè)目錄建立三個(gè)子目錄：myself,interest，job。文件名你可以任意，但最好全部小寫，因?yàn)橛械闹鳈C(jī)要認(rèn)大小寫。然后將你的材料copy進(jìn)相應(yīng)的子目錄。比如你要在你的主頁(yè)里展示你的靚照，那就將你的照片掃描成JPG格式的文件，放在myself的目錄下.要注意,網(wǎng)上只能使用JPG和GIF兩種圖象格式，其他諸如BMP和TIF等很通用的格式都不能用在網(wǎng)上,因?yàn)樗鼈兲罅?但你可以用圖象軟件進(jìn)行轉(zhuǎn)換，比如Office97的照片編輯器。把你準(zhǔn)備在你主頁(yè)上出現(xiàn)的圖象放進(jìn)相應(yīng)的目錄里后,你就可以開始制作了。
二、開始制作
你無(wú)須去記復(fù)雜的HTML語(yǔ)言，你可以用Netscape4.0或者WORD7.0,我用的是Frontpage.打開Netscape,在file菜單里選EditPage,便可以制作了.文字的處理基本跟Word沒(méi)什么兩樣,關(guān)鍵是插入圖片和產(chǎn)生鏈接.我們先做關(guān)于你自我介紹的一頁(yè)，你先寫上“大家好，我是superboy，下面是我的照片：”這時(shí)要放圖片了，只須點(diǎn)擊Insert菜單，選取Image,在Choosefile里選取你的圖象文件即可，然后把這個(gè)文件保存為myself.html文件，放在myself的目錄下。好，現(xiàn)在必須做封面了，你在封面寫：“歡迎來(lái)到superboy的主頁(yè)”以下是“自我介紹，我的愛(ài)好，我的工作”。你的自我介紹要鏈接到下一頁(yè)去，你只須用鼠標(biāo)選“自我介紹”后按鼠標(biāo)右鍵，再選createlink，然后再選你myself目錄下的myself.html，就將“自我介紹”鏈接到下一頁(yè)了，以后在瀏覽器中一按，就可以跳到鑲有你靚照的頁(yè)面啦。在你的封面做好了所有鏈接和圖片后，記住你必須將這一頁(yè)保存為index.htm(有的主機(jī)要求必須為index.html),因?yàn)榫W(wǎng)頁(yè)默認(rèn)的主頁(yè)名稱是index.制作主頁(yè)其實(shí)很簡(jiǎn)單，只要多實(shí)際制作，工多藝熟。還可以拿來(lái)主義，在網(wǎng)上看到什么好的主頁(yè)，用另存為功能保存為.html格式的文件，細(xì)細(xì)研究人家是如何做的。還可以借用網(wǎng)頁(yè)模版來(lái)搞，我的就是這樣的。
三、將你制作好的安放在網(wǎng)上
要在網(wǎng)上安你自己的家，你必須先申請(qǐng)一個(gè)主頁(yè)空間，即向某一個(gè)主機(jī)申請(qǐng)一快硬盤空間?，F(xiàn)在有較多的主機(jī)提供免費(fèi)主頁(yè)空間，具體見實(shí)用鏈接欄目。這些主機(jī)不僅提供免費(fèi)個(gè)人主頁(yè)空間，并且還提供留言簿、計(jì)數(shù)器等很有用的功能。只要到有關(guān)站點(diǎn)申請(qǐng)即可，具體方法，參考相關(guān)題目。申請(qǐng)完成以后用FTP將你所有的主頁(yè)文件上傳至主機(jī)指定的目錄就可以了！
注意：一定要保持網(wǎng)頁(yè)的相對(duì)位置，否則會(huì)看不到網(wǎng)頁(yè)的，有很多朋友都問(wèn)我:為什么我的網(wǎng)頁(yè)傳上去了可是看不到,老是出現(xiàn)網(wǎng)頁(yè)錯(cuò)誤呢？其實(shí)他們都是因?yàn)槲恢玫膯?wèn)題，只要把位置改動(dòng)一下就可以的了引用！
第三篇：個(gè)人網(wǎng)頁(yè)設(shè)計(jì)說(shuō)明文檔
個(gè)人網(wǎng)頁(yè)設(shè)計(jì)說(shuō)明文檔
我的個(gè)人網(wǎng)頁(yè)包括了一個(gè)主網(wǎng)頁(yè)“index.html”以及6個(gè)與主網(wǎng)頁(yè)相鏈接的網(wǎng)頁(yè)，再向其中鑲嵌一系列的圖像以及背景音樂(lè)來(lái)使得個(gè)人網(wǎng)頁(yè)增色不少，充分運(yùn)用了HTML技術(shù)進(jìn)行頁(yè)面結(jié)構(gòu)設(shè)計(jì)、CSS技術(shù)進(jìn)行頁(yè)面樣式展示以及通過(guò)JavaScript控制動(dòng)態(tài)行為來(lái)完成規(guī)范的網(wǎng)頁(yè)制作。主題內(nèi)容以“個(gè)人的簡(jiǎn)單的信息、個(gè)人的對(duì)大學(xué)的規(guī)劃以及音樂(lè)”，主題內(nèi)容積極健康，生機(jī)勃勃，表現(xiàn)出大學(xué)生的活力與激情！
我的主網(wǎng)頁(yè)“index.html”以CSS/DIV來(lái)對(duì)網(wǎng)頁(yè)頁(yè)面進(jìn)行布局,充分運(yùn)用DIV對(duì)各DIV層進(jìn)行定義，全局則通過(guò)CSS進(jìn)行定義，對(duì)頁(yè)面的布局進(jìn)行分割，將整個(gè)頁(yè)面分為頭部(top)、導(dǎo)航(banner)、內(nèi)容(content)、底部(bottom)4個(gè)區(qū)域。除了內(nèi)容區(qū)域外，其它4個(gè)部分都屬于相對(duì)固定的區(qū)域。
首先，主頁(yè)面的頭部是一個(gè)“光良宣傳”的圖片，體現(xiàn)了我愛(ài)音樂(lè)、喜愛(ài)光良。接下來(lái)的是個(gè)人的信息導(dǎo)航，介紹個(gè)人的姓名、學(xué)號(hào)、人生規(guī)劃以及簡(jiǎn)單介紹了下自己，并且大學(xué)規(guī)劃和我資料處還設(shè)置了超鏈接，分別鏈接到“大學(xué)規(guī)劃.html”“個(gè)人簡(jiǎn)歷.html”兩個(gè)鏈接網(wǎng)頁(yè)；接下來(lái)的是兩張新穎的圖片的恰當(dāng)?shù)那度?，并且其中一張圖片中還引入了三個(gè)超鏈接，介紹“光良”、“軟件會(huì)計(jì)”、“德智體美”，各個(gè)方面描述。。。
其次，在主網(wǎng)頁(yè)內(nèi)容上面層次非常清晰，內(nèi)容主要是介紹自己對(duì)大學(xué)生活的感悟以及對(duì)大學(xué)生活的希冀，用表單中的多行文本輸入框?qū)ξ恼聝?nèi)容進(jìn)行編輯和創(chuàng)作，用