1、怎麼設計網頁
網頁設計——根據企業希望向瀏覽者傳遞的信息(包括產品、服務、理念、文化),進行網站功能策劃,然後進行的頁面設計美化工作。作為企業對外宣傳物料的其中一種,精美的網頁設計,對於提升企業的互聯網品牌形象至關重要。
網頁設計一般分為三種大類:功能型網頁設計(服務網站&B/S軟體用戶端)、形象型網頁設計(品牌形象站)、信息型網頁設計(門戶站)。設計網頁的目的不同,應選擇不同的網頁策劃與設計方案。
網頁設計的工作目標,是通過使用更合理的顏色、字體、圖片、樣式進行頁面設計美化,在功能限定的情況下,盡可能給予用戶完美的視覺體驗。高級的網頁設計甚至會考慮到通過聲光、交互等來實現更好的試聽感受。
網頁設計常用的工具包括AI、PS、FL、FW、DW等。
網頁,是網站中的任何一頁面,通常是HTML(是標准通用標記語言下的一個應用)格式(文件擴展名為html、或htm、或asp、或aspx、或php、或jsp等)。網頁通常用圖像檔來提供圖畫,網頁要使用網頁瀏覽器來閱讀。
在網頁設計的認識上,許多人似乎仍停留在網頁製作的高度上。認為只要用好了網頁制
作軟體,就能搞好網頁設計了。
其實網頁設計是一個感性思考與理性分析相結合的復雜的過程,它的方向取決於設計的
任務,它的實現依賴於網頁的製作。正所謂「功夫在詩外」,網頁設計中最重要的東西
,並非在軟體的應用上,而是在我們對網頁設計的理解以及設計製作的水平上,在於我
們自身的美感以及對頁面的把握上。
首先,我們要弄清楚網頁設計的任務。
一、設計的任務
設計是一種審美活動,成功的設計作品一般都很藝術化。但藝術只是設計的手段,而並
非設計的任務。設計的任務是要實現設計者的意圖,而並非創造美。
網頁設計的任務,是指設計者要表現的主題和要實現的功能。站點的性質不同,設計的
任務也不同。從形式上,可以將站點分為以下三類。
第一類是資訊類站點,像新浪、網易、搜狐等門戶網站。這類站點將為訪問者提供大量
的信息,而且訪問量較大。因此需注意頁面的分割、結構的合理、頁面的優化、界面的
親和等問題。
第二類是資訊和形象相結合的網站,像一些較大的公司、國內的高校等。這類網站在設
計上要求較高,既要保證資訊類網站的上述要求,同時又要突出企業、單位的形象。然
而就現狀上來看,這類網站有粗製濫造的嫌疑。
第三類則是形象類網站,比如一些中小型的公司或單位。這類網站一般較小,有的則有
幾頁,需要實現的功能也較為簡單,網頁設計的主要任務是突出企業形象。這類網站對
設計者的美工水平要求較高。
當然,這只是從整體上來看,具體情況還要具體分析。不同的站點還要區別對待。別忘
了最重要的一點,那就是客戶的要求,它也屬於設計的任務。
明確了設計的任務之後,接下來要想的就是如何完成這個任務了。
二、設計的實現
設計的實現可以分為兩個部分。第一部分為站點的規劃及草圖的繪制,這一部分可以在
紙上完成。第二部分為網頁的製作,這一過程是在計算機上完成的。
設計首頁的第一步是設計版面布局。我們可以將網頁看作傳統的報刊雜志來編輯,這里
面有文字、圖像乃至動畫,我們要做的工作就是以最適合的方式將圖片和文字排放在頁
面的不同位置。
除了要有一台配置不錯的計算機外,軟體也是必需的。不能簡單地說一個軟體的好壞,
只要是設計者使用起來覺得方便而且能得心應手的,就可以稱為好軟體。當然,它應該
能滿足設計者的要求。筆者常用的軟體是Macromedia的Dreamweaver、Fireworks、
Flash以及Adobe的Photoshop、imageready,這些都是很不錯的軟體。
接下來我們要做的就是通過軟體的使用,將設計的藍圖變為現實,最終的集成一般是在
Dreamweaver里完成的。雖然在草圖上,我們定出了頁面的大體輪廓,但是靈感一般都
是在製作過程中產生的。設計作品一定要有創意,這是最基本的要求,沒有創意的設計
是失敗的。在製作的過程中,我們會碰到許多問題,其中最敏感的莫過於頁面的顏色
了。
四、造型的組合
在網頁設計中,我們主要通過視覺傳達來表現主題。在視覺傳達中,造型是很重要的一
個元素。拋去是圖還是文字的問題,畫面上的所有元素可以統一作為畫面的基本構成要
素點、線、面來進行處理。在一幅成功的作品裡,是需要點、線、面的共同組合與搭配
來構造整個頁面的。
通常我們可以使用的組合手法有秩序、比例、均衡、對稱、連續、間隔、重疊、反復、
交叉、節奏、韻律、歸納、變異、特寫、反射等等,它們都有各自的特點。在設計中應
根據具體情況,選擇最適合的表現手法,這樣有利於主題的表現。
通過點、線、面的組合,可以突出頁面上的重要元素,突出設計的主題,增強美感,讓
觀者在感受美的過程中領會設計的主題,從而實現設計的任務。
造型的巧妙運用不僅能帶來極大的美感,而且能較好地突出企業形象,而且能將網頁上
的各種元素有機的組織起來,它甚至還可以引導觀者的視線。
三、色彩的運用
色彩是一種奇怪的東西,它是美麗而豐富的,它能喚起人類的心靈感知。一般來說,紅
色是火的顏色,熱情、奔放;也是血的顏色,可以象徵生命。黃色是明度最高的顏色,
顯得華麗、高貴、明快。綠色是大自然草木的顏色,意味著純自然和生長,象徵安寧和
平與安全,如綠色食品。紫色是高貴的象徵,有莊重感。白色能給人以純潔與清白的感
覺,表示和平與聖潔。
我們知道,顏色是光的折射產生的,紅、黃、藍是三原色,其它的色彩都可以用這三種
色彩調和而成。換一種思路,我們可以用顏色的變化來表現光影效果,這無疑將使我們
的作品更貼近現實。
色彩代表了不同的情感,有著不同的象徵含義。這些象徵含義是人們思想交流當中的一
個復雜問題,它因人的年齡、地域、時代、民族、階層、經濟地區、工作能力、教育水
平、風俗習慣、宗教信仰、生活環境、性別差異而有所不同。
單純的顏色並沒有實際的意義,和不同的顏色搭配,它所表現出來的效果也不同。比如
綠色和金黃、淡白搭配,可以產生優雅,舒適的氣氛。藍色和白色混合,能體現柔順、
淡雅、浪漫的氣氛。紅色和黃色、金色的搭配能渲染喜慶的氣氛。而金色和粟色的搭配
則會給人帶來暖意。設計的任務不同,配色方案也隨之不同。考慮到網頁的適應性,應
盡量使用網頁安全色。
但顏色的使用並沒有一定的法則,如果一定要用某個法則去套,效果只會適得其反。經
驗上我們可先確定一種能表現主題的主體色,然後根據具體的需要,應用顏色的近似和
對比來完成整個頁面的配色方案。整個頁面在視覺上應是一個整體,以達到和諧、悅目
的視覺效果。
五、設計的原則
設計是有原則的,無論使用何種手法對畫面中的元素進行組合,都一定要遵循五個大的
原則:統一、連貫、分割、對比及和諧。
統一,是指設計作品的整體性,一致性。設計作品的整體效果是至關重要的,在設計中
切勿將各組成部分孤立分散,那樣會使畫面呈現出一種枝蔓紛雜的凌亂效果。
連貫,是指要注意頁面的相互關系。設計中應利用各組成部分在內容上的內在聯系和表
現形式上的相互呼應,並注意整個頁面設計風格的一致性,實現視覺上和心理上的連貫
,使整個頁面設計的各個部分極為融洽,猶如一氣呵成。
分割,是指將頁面分成若干小塊,小塊之間有視覺上的不同,這樣可以使觀者一目了
然。在信息量很多時為使觀者能夠看清楚,就要注意到將畫面進行有效的分割。分割不
僅是表現形式的需要。換個角度來講,分割也可以被視為對於頁面內容的一種分類歸
納。
對比就是通過矛盾和沖突,使設計更加富有生氣。對比手法很多,例如:多與少、曲與
直、強與弱、長與短、粗與細、疏與密、虛與實、主與次、黑與白、動與靜、美與丑、
聚與散等等。在使用對比的時候應慎重,對比過強容易破壞美感,影響統一。
和諧是指整個頁面符合美的法則,渾然一體。如果一件設計作品僅僅是色彩、形狀、線
條等的隨意混合,那麼作品將不但沒有「生命感」,而且也根本無法實現視覺設計的傳
達功能。和諧不僅要看結構形式,而且要看作品所形成的視覺效果能否與人的視覺感受
形成一種溝通,產生心靈的共鳴。這是設計能否成功的關鍵。
六、網頁的優化
在網頁設計中,網頁的優化是較為重要的一個環節。它的成功與否會影響頁面的瀏覽速
度和頁面的適應性,影響觀者對網站的印象。
在資訊類網站中,文字是頁面中最大的構成元素,因此字體的優化顯得尤為重要。使用
css樣式表指定文字的樣式是必要的,通常我們將字體指定為宋體,大小指定為12px,
顏色要視背景色而定,原則上以能看清且與整個頁面搭配和諧為准。在白色的背景上,
我們一般使用黑色,這樣不易產生視覺疲勞,能保證瀏覽者較長時間地瀏覽網頁。
圖片是網頁中的重要元素。圖片的優化可以在保證瀏覽質量的前提下將其size降至最低
,這樣可以成倍地提高網頁的下載速度。利用Photoshop6或Fireworks4可以將圖片切
成小塊,分別進行優化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們
把有較為復雜顏色變化的小塊優化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優
化為gif,這是由這兩種格式的特點決定的。
表格(table)是頁面中的重要元素,是頁面排版的主要手段。我們可以設定表格的寬度、
高度、邊框、背景色、對齊方式等參數。很多時候,我們將表格的邊框設為0,以此來
定位頁面中的元素,或者籍此確定頁面中各元素的相對位置。我們知道:瀏覽器在讀取
網頁html原代碼時,是讀完整個table才將它顯示出來的。如果一個大表格中含有多個
子表格,必須等大表格讀完,才能將子表格一起顯示出來。我們在訪問一些站點時,等
待多時無結果,按"停止"按鈕卻一下顯示出頁面就是這個原因。因此,我們在設計頁面
表格的時候,應該盡量避免將所有元素嵌套在一個表格里,而且表格嵌套層次盡量要
少。在使用Dreamweaver製作網頁時,會自動在每一個td內添加一個空字元「 」。如果
單元格內沒有填充其它元素,這個空字元會保留,在指定td的寬度或高度後,可以在源
代碼內將其刪去。
網頁的適應性是很重要的,在不同的系統上,不同的解析度下,不同的瀏覽器上,我們
將會看到不同的結果,因此設計時要統籌考慮。一般我們在800*600下製作網頁,最佳
瀏覽效果也是在800*600解析度下,在其它情況下只要保證基本一致,不出現較大問題
即可。
說了這么多,只是希望能對做「網頁設計」的人有所幫助,希望他們在做網頁的時候能
夠從整體著眼,無愧於「設計」這兩個字。順便說一下,本文只代表本人個人觀點,僅
供參考。
對於網頁的框架與定位,這個是很難說得清楚的,這要看你在做網站時,對網站的
規劃,並不能一並而論的,如果你沒有這方面的經驗,就多多在網上看看別人是如何設計
的吧,是非常的用的,可以把他們給抓下來,做個圖庫,方便自己設計
其實看看一些設計精良的網頁,會對自己有很大的作用,
把別人的網頁下載下來,再用相關的軟體,進行分析,
可以學到許多的東西的,是一種快捷的學習方法,
但決不是COPY
我認為首要的是突出主題
一個好的網站(個人的只能算做網頁)最首要的是突出你的主題,在別人搜索或訪問時首
先就看有沒有自己所需要的內容,要麼就直奔主題.然後再在主題鮮明的基礎上做好框架
設計.一個好的網站要做到層次分明,結構合理,讓人一看就能明白你想要表達的中心思
想是什麼,以及怎樣才能以以最快的速度找到自己想要的內容.這兩個主要問題解決後再
在一些細節上加以潤色,就能製作出賞心悅目的網站.
2、網頁設計原理:如何設計漂亮的網頁
邁阿密大學的藝術科學學院網頁通過細節的精心處理給人一種賞心悅目的視覺效果。最好的設計往往就是最簡單的設計:一個中心思想,一幅圖片,少量的文字,開放的空間。這種風格的設計清晰、漂亮,讓人印象深刻。但真實的生活並不經常是如此的簡單,更多的是雜事纏身。在設計一個項目時,往往需要將很多不同的信息同時放上去,一個都不能少,就象現在很多的網站一樣,信息密集,顯得非常擁擠復雜。 在本文中,我們將介紹邁阿密大學的藝術科學學院網站的版面,它之所以吸引我們的注意,是因為該網站雖然有很多信息,但卻給我們留下美好的印象。該網站通過兩個途徑實現這種效果:一,它盡可能地減少各種元素,只保留最重要的部分(其實仍然是「簡單的設計」思想在起作用),二,就是在處理各種細節時都經過精心處理。這種設計手法在技術上其實一點不難,讓我們進去看看:主頁雖然多達二十多個鏈接,但整體卻顯得溫和,協調一致。結構: 網站的頁面尺寸並沒有走極端,不會太長,大多數頁面上的內容不需要拖動就可以輕易瀏覽,是一種方便人們閱讀的屏幕尺寸。每個頁面由三個區域構成,每一個區域負責不同的信息,最上方及最下方的區域內容是固定的,改變的只是中間區域的內容。不同的顏色定義了不同的區域:白色區域是中心舞台,這個區域通過上方顏色較深的頁眉與下方較淺的頁腳而得到確定。固定內容的區域包含了各種最基本的元素:標志,鏈接,搜索等諸如此類的內容。中間白色區域的內容則是變化的,主要展示不同的事件信息、新聞簡訊等內容。從下方示意圖可以看出,這個頁面結構相當緊湊,可以有效組織各種內容,比起那種需要拖動滾動條的頁面更容易閱讀。緊湊,是其中的關鍵。頁眉:此外由兩個色帶構成:綠色及棕色。這兩種顏色構成了一個簡單堅實的頁眉並統領著這個網站。標志及鏈接文字則反轉成白色字體。為了柔和視覺效果,左方還使用了象是陽光照射所呈現的一個非常微弱的漸變面。 頁眉右方遠處有四個固定的鏈接,文字的顏色顯得相當低調,但由於處於頁眉的區域內,沒有人會忽視它的存在。主鏈接:第一級鏈接處於頁眉的標色色帶區域內。鏈接的字體、顏色及陰影與上方的標志呼應,使兩者之間產生視覺上的聯系。 綠色及棕色當然是兩種不同的顏色,但如果你將這兩種顏色變成灰度顯示,你可以發現他們的相同之處,其灰度色值是基本一樣的,這個隱藏的共同點使兩者在視覺上既有區別,又有聯系。下圖中,字母的間距比較寬松,與普通的字母間距相比,呈現一種輕松氣息,也傳達了一種從容及尊嚴。在屏幕顯示時,字母間距較大也更容易閱讀。次級鏈接: 當瀏覽者深入這個網站時,字體字母及顏色在細節上的變化都在暗示讀者這是另外的一些信息。但字體及尺寸仍然與主鏈接相同。中心舞台:在頁眉與頁腳之間的白色區域是我們的中心區域,也是這個網站的視覺焦點所在。在每一個頁面中的文章,都顯得相當簡短,而且象印刷的書本那樣的文字排版,行距非常大,採用襯線字體,整個頁面顯得清爽而不窒息。其書本氣息讓人能夠舒適閱讀。頁腳: 有效設計的頁腳是可以發揮很大的作用的。不要將頁腳想像成一條多出來的「尾巴」,而應該將它看作是一個支撐點,支撐著上述所有內容的一個區域。頁腳區域中放置的也是一些固定不變的內容,如鏈接、聯系信息及標志等。在設計中,層次感是非常重要的。上圖左,如果將頁眉與頁腳設計成相同的份量,給人的感覺就象奧利奧夾心曲奇餅,它分散了讀者的注意力,弱化了版面的力量感。相反,三個區域呈現層次感使到每個區域都能夠正確承擔起自己的任務。在腦海中一定要記住的是,讀者的眼睛永遠會集中在中心區域內,所以這里要放置最重要的信息。周圍所放置是支持性的內容。字體:這個網頁中,正文的字體全部採用Georgia字體,可以說是一種在屏幕上顯示的最佳襯線字體,當樣,Georgia作為印刷字體同樣表現良好。中國設計者在使用英文字體時更多會採用默認的Times字體。 讓我們看看Georgia字體與Times字體的區別,從這種區別中,也可以知道為什麼在屏幕上顯示時,Georgia字體會贏了這一回合。點擊上圖看大圖字母的間距與字母形狀一樣重要, Georgia字體用於正文時,整體顯得平滑、重復及具有節奏感。試比較以下兩者的觀看感覺。
3、如何自學網頁設計
1、在桌面上右鍵點擊滑鼠,出現對話框之後,點擊新建。

2、新建一個文本問檔,用於寫網頁代碼。

3、打開記事本,現在我們就可以編寫簡單的HTML代碼了。

4、現在,我們把文本的命名改成1.html。

5、一個簡單的HTML網頁就搭建完成了,可以通過瀏覽器打開試試看。

4、如何設計網頁跳轉?
插入一個錨鏈接就可以了復。
常用工具欄--命名錨記。
首先插入一個返回點(就是你說要跳轉到的頁首、頁尾或指定高度),並設置名稱;
然後在"某段文字"或"圖片"處插入鏈接,鏈接地址改為 #你剛才設置的名稱。
這樣當你點擊這段文字時候就會跳轉至頁首了
1、在Dreamweaver「文檔」窗口的「設計」視圖中,將插入點放在需要命名錨記制的地方。
在「插入」欄的「常用」類別中,單擊「命名錨記」按鈕。
在「錨記名稱」框中,鍵入錨記的名稱,然後單擊「確定」。(錨記名稱不能包含空格)。 錨記標記在插入點處出現。如下圖所示

然後輸入名稱,注意此時名稱前不加#號

2、在Dreamweaver「文檔」窗口的「設計」視圖中,選擇要從其創建鏈接的文本或圖像。
在屬性檢查器的「鏈接」框中,鍵入一個數字元號 (#) 和錨記名稱。例如,若要鏈接到當前文檔中名為「top」的錨記,請鍵入 #top。

5、怎樣設計好一個網站
第一,做網站,首先必須要解決的就是網站內容問題,即確定網站的主題。
對於內容主題的選擇,要做到小而精,主題定位要小,內容要精。不要去試圖製作一個包羅萬象的站點,這往往會失去網站的特色,也會帶來高強度的勞動,給網站的及時更新帶來困難。
第二,選擇好域名
域名是網站在互聯網上的名字。一個非產品推銷的純信息服務網站,其所有建設的價值,都凝結在其網站域名之上。失去這個域名,所有前期工作就將全部落空。
第三:掌握建網工具
網路技術的發展帶動了軟體業的發展,所以用於製作Web頁面的工具軟體也越來越豐富。從最基本的HTML編輯器到現在非常流行的Flash互動網頁製作工具,各種各樣的Web頁面製作工具,網站製作者需了解W3C的HTML4.0規范、CSS層疊樣式表的基本知識、javascript、VBScript的基本知識。對於常用的一些腳本程序如ASP、CGI、PHP也要有適當了解,還要熟練使用圖形處理工具和動畫製作工具以及矢量繪圖工具,並能部分了解多種圖形圖像動畫工具的基本用法,熟練使用FTP工具以及擁有相應的軟硬體和網路知識也是必備的
第四:確定網站界面
界面就是網站給瀏覽者的第一印象,往往決定著網站的可看性,在確定網站的界面時要注意以下三點:
①欄目與板塊編排
構建一個網站就好比寫一篇論文,首先要列出題綱,才能主題明確、層次清晰。網站建設初學者,最容易犯的錯誤就是:確定題材後立刻開始製作,沒有進行合理規劃。從而導致網站結構不清晰,目錄龐雜混亂,板塊編排混亂等。結果不但瀏覽者看得糊里糊塗,製作者自己在擴充和維護網站也相當困難。所以,我們在動手製作網頁前,一定要考慮好欄目和板塊的編排問題。
網站的題材確定後,就要將收集到的資料內容作一個合理的編排。比如,將一些最吸引人的內容放在最突出的位置或者在版面分布上占優勢地位。欄目的實質是一個網站的大綱索引,索引應該將網站的主體明確顯示出來。在制定欄目的時候,要仔細考慮,合理安排。在欄目編排時需要注意的是:
●盡可能刪除那些與主題無關的欄目;
●盡可能將網站內最有價值的內容列在欄目上;
●盡可能從訪問者角度來編排欄目以方便訪問者的瀏覽和查詢;輔助內容,如站點簡介、版權信息、個人信息等大可不必放在主欄目里,以免沖淡主題。
另外,板塊的編排設置也要合理安排與劃分。板塊比欄目的概念要大一些,每個板塊都有自己的欄目。舉個例子:ENET矽谷動力(www.enet.com.cn)的站點分新聞、產品、游戲、學院等板塊,每個板塊下面又各有自己的主欄目。一般來說,個人站點內容較少,只要分個欄目也就夠了,不需要設置板塊。如果有必要設置板塊的,應該注意:
●各板塊要有相對獨立性;
●各板塊要有相互關聯;
●各板塊的內容要圍繞站點主題;
②目錄結構與鏈接結構
網站的目錄是指建立網站時創建的目錄。例如:在用Frontpage建立網站時都默認建立了根目錄和Images子目錄。目錄的結構是一個容易忽略的問題,大多數站長都是未經規劃,隨意創建子目錄。目錄結構的好壞,對瀏覽者來說並沒有什麼太大的感覺,但是對於站點本身的維護,以後內容的擴充和移植有著重要的影響。所以建立目錄結構時也要仔細安排,比如:
●不要將所有文件都存放在根目錄下。有網站製作者為了方便,將所有文件都放在根目錄下。這樣就很容易造成:文件管理混亂,搞不清哪些文件需要編輯和更新,哪些無用的文件可以刪除,哪些是相關聯的文件,影響工作效率;上傳速度變慢,伺服器一般都會為根目錄建立一個文件索引,如果將所有文件都放在根目錄下,那麼即使只上傳更新一個文件,伺服器也需要將所有文件再檢索一遍,建立新的索引文件,很明顯,文件量越大,等待的時間也將越長。
●按欄目內容建立子目錄。子目錄的建立,首先按主欄目建立。友情連接內容較多,需要經常更新的可以建立獨立的子目錄。而一些相關性強,不需要經常更新的欄目,例如:網站簡介、站長情況等可以合並放在一個統一目錄下。所有程序一般都存放在特定目錄,例如:CGI程序放在cgi-bin目錄,所有提供下載的內容也最好放在一個目錄下,便於維護管理。
●在每個主目錄下都建立獨立的Images目錄。一般來說,一個站點根目錄下都有一個默認地Images目錄。將所有圖片都存放在這個目錄里很是不方便,比如在欄目刪除時,圖片的管理相當麻煩。所以為每個主欄目建立一個獨立的Images目錄是方便管理的。原因很簡單,就是方便維護與管理。
其它需要注意的還有:目錄的層次不要太深,不要超過3層;不要使用中文目錄,使用中文目錄可能對網址的正確顯示造成困難;不要使用過長的目錄,太長的目錄名不便於記憶;盡量使用意義明確的目錄,以便於記憶和管理。
網站的鏈接結構是指頁面之間相互鏈接的拓撲結構。它建立在目錄結構基礎之上,但可以跨越目錄。形象的說:每個頁面都是一個固定點,鏈接則是在兩個固定點之間的連線。一個點可以和一個點連接,也可以和多個點連接。更重要的是,這些點並不是分布在一個平面上,而是存在於一個立體的空間中。一般的,建立網站的鏈接結構有兩種基本方式:
●樹狀鏈接結構(一對一),這類似DOS的目錄結構,首頁鏈接指向一級頁面,一級頁面鏈接指向二級頁面。這樣的鏈接結構瀏覽時,一級級進入,一級級退出,條理比較清晰,訪問者明確知道自己在什麼位置,不會「不知身在何處」,但是瀏覽效率低,一個欄目下的子頁面到另一個欄目下的子頁面,必須回到首頁再進行。
●星狀鏈接結構(一對多),類似網路伺服器的鏈接,每個頁面相互之間都建立有鏈接。這樣瀏覽比較方便,隨時可以到達自己喜歡的頁面。但是由於鏈接太多,容易使瀏覽者迷路,搞不清自己在什麼位置,看了多少內容。
因此,在實際的網站設計中,總是將這兩種結構混合起來使用。網站希望瀏覽者既可以方便快速地達到自己需要的頁面,又可以清晰地知道自己的位置。所以,最好的辦法是:首頁和一級頁面之間用星狀鏈接結構,一級和二級頁面之間用樹狀鏈接結構。關於鏈接結構的設計,在實際的網頁製作中是非常重要一環,採用什麼樣的鏈接結構直接影響到版面的布局。
6、怎麼設計網頁?
要想學做網頁,首先得了解製作網頁的工具
Dreamweaver:這是網頁三劍客之一,專門製作網頁的工具,可以自動將網頁生成代碼,是普通網頁製作者的首選工具,界面簡單,實用功能比較強大。建議初學者選用。
另外一個工具就是代碼編輯工具,例如寫字本、EditPlus等,這些工具主要編輯asp等動態網頁。
此外還有一些網路編程工具,javascript、java編輯器等。
網頁製作也是一個比較吃香的行業,要真正做一個好的網站,還必須有良好的設計功底。所以還得學很多邊緣性的軟體,例如photoshop、flash等。
大型的網站往往還需要資料庫的支持,所以還得懂資料庫。sql、甲骨文等。
總之,掌握好網頁製作,能獨立完成一個網站的製作工作,那就不要考慮吃飯問題。隨便混就好了!
網站設計八步驟
由於目前所見即所得類型的工具越來越多,使用也越來越方便,所以製作網頁已經變成了一件輕松的工作,不像以前要手工編寫一行行的源代碼那樣。一般初學者經過短暫的學習就可以學會製作網頁,於是他們認為網頁製作非常簡單,就匆匆忙忙製作自己的網站,可是做出來之後與別人一比,才發現自己的網站非常粗糙,這是為什麼呢?常言道:「性急吃不了熱豆腐」。建立一個網站就像蓋一幢大樓一樣,它是一個系統工程,有自己特定的工作流程,你只有遵循這個步驟,按部就班地一步步來,才能設計出一個滿意的網站。
一、確定網站主題
網站主題就是你建立的網站所要包含的主要內容,一個網站必須要有一個明確的主題。特別是對於個人網站,你不可能像綜合網站那樣做得內容大而全,包羅萬象。你沒有這個能力,也沒這個精力,所以必須要找准一個自己最感興趣內容,做深、做透,辦出自己的特色,這樣才能給用戶留下深刻的印象。網站的主題無定則,只要是你感興趣的,任何內容都可以,但主題要鮮明,在你的主題范圍內內容做到大而全、精而深。
二、搜集材料
明確了網站的主題以後,你就要圍繞主題開始搜集材料了。常言道:「巧婦難為無米之炊」。要想讓自己的網站有血有肉,能夠吸引住用戶,你就要盡量搜集材料,搜集得材料越多,以後製作網站就越容易。材料既可以從圖書、報紙、光碟、多媒體上得來,也可以從互聯網上搜集,然後把搜集的材料去粗取精,去偽存真,作為自己製作網頁的素材。
三、規劃網站
一個網站設計得成功與否,很大程度上決定於設計者的規劃水平,規劃網站就像設計師設計大樓一樣,圖紙設計好了,才能建成一座漂亮的樓房。網站規劃包含的內容很多,如網站的結構、欄目的設置、網站的風格、顏色搭配、版面布局、文字圖片的運用等,你只有在製作網頁之前把這些方面都考慮到了,才能在製作時駕輕就熟,胸有成竹。也只有如此製作出來的網頁才能有個性、有特色,具有吸引力。如何規劃網站的每一項具體內容,我們在下面會有詳細介紹。 四、選擇合適的製作工具
盡管選擇什麼樣的工具並不會影響你設計網頁的好壞,但是一款功能強大、使用簡單的軟體往往可以起到事半功倍的效果。網頁製作涉及的工具比較多,首先就是網頁製作工具了,目前大多數網民選用的都是所見即所得的編輯工具,這其中的優秀者當然是Dreamweaver和Frontpage了,如果是初學者,Frontpage2000是首選。除此之外,還有圖片編輯工具,如Photoshop、Photoimpact等;動畫製作工具,如Flash、Cool 3d、Gif Animator等;還有網頁特效工具,如有聲有色等,網上有許多這方面的軟體,你可以根據需要靈活運用。
五、製作網頁
材料有了,工具也選好了,下面就需要按照規劃一步步地把自己的想法變成現實了,這是一個復雜而細致的過程,一定要按照先大後小、先簡單後復雜來進行製作。所謂先大後小,就是說在製作網頁時,先把大的結構設計好,然後再逐步完善小的結構設計。所謂先簡單後復雜,就是先設計出簡單的內容,然後再設計復雜的內容,以便出現問題時好修改。在製作網頁時要多靈活運用模板,這樣可以大大提高製作效率。
六、上傳測試
網頁製作完畢,最後要發布到Web伺服器上,才能夠讓全世界的朋友觀看,現在上傳的工具有很多,有些網頁製作工具本身就帶有FTP功能,利用這些FTP工具,你可以很方便地把網站發布到自己申請的主頁存放伺服器上。網站上傳以後,你要在瀏覽器中打開自己的網站,逐頁逐個鏈接的進行測試,發現問題,及時修改,然後再上傳測試。全部測試完畢就可以把你的網址告訴給朋友,讓他們來瀏覽。
七、推廣宣傳
網頁做好之後,還要不斷地進行宣傳,這樣才能讓更多的朋友認識它,提高網站的訪問率和知名度。推廣的方法有很多,例如到搜索引擎上注冊、與別的網站交換鏈接、加入廣告鏈等。
八、維護更新
網站要注意經常維護更新內容,保持內容的新鮮,不要一做好就放在那兒不變了,只有不斷地給它補充新的內容,才能夠吸引住瀏覽者
7、怎麼樣設計網頁
怎樣設計網頁
在網頁設計的認識上,許多人似乎仍停留在網頁製作的高度上。認為只要用好了網頁製作軟體,就能搞好網頁設計了……
在網頁設計的認識上,許多人似乎仍停留在網頁製作的高度上。認為只要用好了網頁製作軟體,就能搞好網頁設計了。
其實網頁設計是一個感性思考與理性分析相結合的復雜的過程,它的方向取決於設計的任務,它的實現依賴於網頁的製作。正所謂「功夫在詩外」,網頁設計中最重要的東西,並非在軟體的應用上,而是在我們對網頁設計的理解以及設計製作的水平上,在於我們自身的美感以及對頁面的把握上。
首先,我們要弄清楚網頁設計的任務。
一、設計的任務
設計是一種審美活動,成功的設計作品一般都很藝術化。但藝術只是設計的手段,而並非設計的任務。設計的任務是要實現設計者的意圖,而並非創造美。
網頁設計的任務,是指設計者要表現的主題和要實現的功能。站點的性質不同,設計的任務也不同。從形式上,可以將站點分為以下三類。
第一類是資訊類站點,像新浪、網易、搜狐等門戶網站。這類站點將為訪問者提供大量的信息,而且訪問量較大。因此需注意頁面的分割、結構的合理、頁面的優化、界面的親和等問題。
第二類是資訊和形象相結合的網站,像一些較大的公司、國內的高校等。這類網站在設計上要求較高,既要保證資訊類網站的上述要求,同時又要突出企業、單位的形象。然而就現狀上來看,這類網站有粗製濫造的嫌疑。
第三類則是形象類網站,比如一些中小型的公司或單位。這類網站一般較小,有的則有幾頁,需要實現的功能也較為簡單,網頁設計的主要任務是突出企業形象。這類網站對設計者的美工水平要求較高。
當然,這只是從整體上來看,具體情況還要具體分析。不同的站點還要區別對待。別忘了最重要的一點,那就是客戶的要求,它也屬於設計的任務。
明確了設計的任務之後,接下來要想的就是如何完成這個任務了。
二、設計的實現
設計的實現可以分為兩個部分。第一部分為站點的規劃及草圖的繪制,這一部分可以在紙上完成。第二部分為網頁的製作,這一過程是在計算機上完成的。
設計首頁的第一步是設計版面布局。我們可以將網頁看作傳統的報刊雜志來編輯,這裡面有文字、圖像乃至動畫,我們要做的工作就是以最適合的方式將圖片和文字排放在頁面的不同位置。 除了要有一台配置不錯的計算機外,軟體也是必需的。不能簡單地說一個軟體的好壞,只要是設計者使用起來覺得方便而且能得心應手的,就可以稱為好軟體。當然,它應該能滿足設計者的要求。筆者常用的軟體是Macromedia的Dreamweaver、Fireworks、Flash以及Adobe的Photoshop、imageready,這些都是很不錯的軟體。 接下來我們要做的就是通過軟體的使用,將設計的藍圖變為現實,最終的集成一般是在Dreamweaver里完成的。雖然在草圖上,我們定出了頁面的大體輪廓,但是靈感一般都是在製作過程中產生的。設計作品一定要有創意,這是最基本的要求,沒有創意的設計是失敗的。在製作的過程中,我們會碰到許多問題,其中最敏感的莫過於頁面的顏色了。
三、色彩的運用
色彩是一種奇怪的東西,它是美麗而豐富的,它能喚起人類的心靈感知。一般來說,紅色是火的顏色,熱情、奔放;也是血的顏色,可以象徵生命。黃色是明度最高的顏色,顯得華麗、高貴、明快。綠色是大自然草木的顏色,意味著純自然和生長,象徵安寧和平與安全,如綠色食品。紫色是高貴的象徵,有莊重感。白色能給人以純潔與清白的感覺,表示和平與聖潔。
我們知道,顏色是光的折射產生的,紅、黃、藍是三原色,其它的色彩都可以用這三種色彩調和而成。換一種思路,我們可以用顏色的變化來表現光影效果,這無疑將使我們的作品更貼近現實。
色彩代表了不同的情感,有著不同的象徵含義。這些象徵含義是人們思想交流當中的一個復雜問題,它因人的年齡、地域、時代、民族、階層、經濟地區、工作能力、教育水平、風俗習慣、宗教信仰、生活環境、性別差異而有所不同。
單純的顏色並沒有實際的意義,和不同的顏色搭配,它所表現出來的效果也不同。比如綠色和金黃、淡白搭配,可以產生優雅,舒適的氣氛。藍色和白色混合,能體現柔順、淡雅、浪漫的氣氛。紅色和黃色、金色的搭配能渲染喜慶的氣氛。而金色和粟色的搭配則會給人帶來暖意。設計的任務不同,配色方案也隨之不同。考慮到網頁的適應性,應盡量使用網頁安全色。
但顏色的使用並沒有一定的法則,如果一定要用某個法則去套,效果只會適得其反。經驗上我們可先確定一種能表現主題的主體色,然後根據具體的需要,應用顏色的近似和對比來完成整個頁面的配色方案。整個頁面在視覺上應是一個整體,以達到和諧、悅目的視覺效果。
四、造型的組合
在網頁設計中,我們主要通過視覺傳達來表現主題。在視覺傳達中,造型是很重要的一個元素。拋去是圖還是文字的問題,畫面上的所有元素可以統一作為畫面的基本構成要素點、線、面來進行處理。在一幅成功的作品裡,是需要點、線、面的共同組合與搭配來構造整個頁面的。
通常我們可以使用的組合手法有秩序、比例、均衡、對稱、連續、間隔、重疊、反復、交*、節奏、韻律、歸納、變異、特寫、反射等等,它們都有各自的特點。在設計中應根據具體情況,選擇最適合的表現手法,這樣有利於主題的表現。
通過點、線、面的組合,可以突出頁面上的重要元素,突出設計的主題,增強美感,讓觀者在感受美的過程中領會設計的主題,從而實現設計的任務。
造型的巧妙運用不僅能帶來極大的美感,而且能較好地突出企業形象,而且能將網頁上的各種元素有機的組織起來,它甚至還可以引導觀者的視線。
五、設計的原則
設計是有原則的,無論使用何種手法對畫面中的元素進行組合,都一定要遵循五個大的原則:統一、連貫、分割、對比及和諧。
統一,是指設計作品的整體性,一致性。設計作品的整體效果是至關重要的,在設計中切勿將各組成部分孤立分散,那樣會使畫面呈現出一種枝蔓紛雜的凌亂效果。
連貫,是指要注意頁面的相互關系。設計中應利用各組成部分在內容上的內在聯系和表現形式上的相互呼應,並注意整個頁面設計風格的一致性,實現視覺上和心理上的連貫,使整個頁面設計的各個部分極為融洽,猶如一氣呵成。
分割,是指將頁面分成若干小塊,小塊之間有視覺上的不同,這樣可以使觀者一目瞭然。在信息量很多時為使觀者能夠看清楚,就要注意到將畫面進行有效的分割。分割不僅是表現形式的需要。換個角度來講,分割也可以被視為對於頁面內容的一種分類歸納。
對比就是通過矛盾和沖突,使設計更加富有生氣。對比手法很多,例如:多與少、曲與直、強與弱、長與短、粗與細、疏與密、虛與實、主與次、黑與白、動與靜、美與丑、聚與散等等。在使用對比的時候應慎重,對比過強容易破壞美感,影響統一。
和諧是指整個頁面符合美的法則,渾然一體。如果一件設計作品僅僅是色彩、形狀、線條等的隨意混合,那麼作品將不但沒有「生命感」,而且也根本無法實現視覺設計的傳達功能。和諧不僅要看結構形式,而且要看作品所形成的視覺效果能否與人的視覺感受形成一種溝通,產生心靈的共鳴。這是設計能否成功的關鍵。
六、網頁的優化
在網頁設計中,網頁的優化是較為重要的一個環節。它的成功與否會影響頁面的瀏覽速度和頁面的適應性,影響觀者對網站的印象。
在資訊類網站中,文字是頁面中最大的構成元素,因此字體的優化顯得尤為重要。使用css樣式表指定文字的樣式是必要的,通常我們將字體指定為宋體,大小指定為12px,顏色要視背景色而定,原則上以能看清且與整個頁面搭配和諧為准。在白色的背景上,我們一般使用黑色,這樣不易產生視覺疲勞,能保證瀏覽者較長時間地瀏覽網頁。
圖片是網頁中的重要元素。圖片的優化可以在保證瀏覽質量的前提下將其size降至最低,這樣可以成倍地提高網頁的下載速度。利用Photoshop6或Fireworks4可以將圖片切成小塊,分別進行優化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們把有較為復雜顏色變化的小塊優化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優化為gif,這是由這兩種格式的特點決定的。
表格(table)是頁面中的重要元素,是頁面排版的主要手段。我們可以設定表格的寬度、高度、邊框、背景色、對齊方式等參數。很多時候,我們將表格的邊框設為0,以此來定位頁面中的元素,或者籍此確定頁面中各元素的相對位置。我們知道:瀏覽器在讀取網頁html原代碼時,是讀完整個table才將它顯示出來的。如果一個大表格中含有多個子表格,必須等大表格讀完,才能將子表格一起顯示出來。我們在訪問一些站點時,等待多時無結果,按"停止"按鈕卻一下顯示出頁面就是這個原因。因此,我們在設計頁面表格的時候,應該盡量避免將所有元素嵌套在一個表格里,而且表格嵌套層次盡量要少。在使用Dreamweaver製作網頁時,會自動在每一個td內添加一個空字元「 」。如果單元格內沒有填充其它元素,這個空字元會保留,在指定td的寬度或高度後,可以在源代碼內將其刪去。
網頁的適應性是很重要的,在不同的系統上,不同的解析度下,不同的瀏覽器上,我們將會看到不同的結果,因此設計時要統籌考慮。一般我們在800*600下製作網頁,最佳瀏覽效果也是在800*600解析度下,在其它情況下只要保證基本一致,不出現較大問題即可。
說了這么多,只是希望能對做「網頁設計」的人有所幫助,希望他們在做網頁的時候能夠從整體著眼,無愧於「設計」這兩個字。
8、怎樣製作簡單的靜態的網頁設計
你好。首先下載Dreamweaver.exe並打開,選擇你使用的編輯語言,本案例用html
打開頁面後,選著設計窗口,如圖所示。設計窗口可以快速布局網頁,不需要自己編輯代碼。
打開你要設計的網頁的設計圖,本經驗是百度經驗首頁為例,首先我們製作頂上的搜索條,點擊插入—表格(如圖所示)。打開表格屬性編輯表格屬性。插入1行和5列,表格寬度為1130,(即為網頁的寬度),邊距,間距分別為0,此表格只是為了定位,因此不設邊框。
設置好表格後,可在表格裡面插入你的內容,首先我們插入logo,點擊插入—圖像—選擇你要插入的圖片。點確定即可完成logo插入。表格的小大高度都可根據設計圖需要調整,滑鼠移到表格邊框虛線即可拖拉調整高度或寬度。如圖所示
接下來我們來做搜索框,點擊插入—表單—插入文本域—確定。插入文本框後可點擊文本框調整文本框的屬性。根據設計圖,文本框上班還要添加內容,因此,可選擇單元格右擊選擇表格—拆分單元格,此處是需要添加一行的內容,因此拆分為兩行,如圖所示。
用同樣的辦法拆分上面的行,因為要添加10個選擇項,因此拆分為10列(右擊選中的行—拆分單元格—10列—確定)。拆分好後在小格裡面添加文字內容即可。表格大小可根據步驟四調整。
接下來我們做搜索按鈕,同樣根據設計圖要把表格拆分為兩行。點擊插入插入按鈕的圖片。
接下來給按鈕添加鏈接,本次經驗分享的是靜態網頁,因此在此先跟大家分享怎麼直接添加按鈕鏈接。同樣是點擊插入—添加超級鏈接,填寫你事先做好的頁面鏈接,或者其他網站鏈接。
剩下的內容都可根據方法步奏逐漸添加,調節細節即可完成你想要設計的網頁。如圖所示是上面步奏所做的靜態頁面,把所有做好的網頁用超級鏈接鏈接起來即可做成一個簡單的網站
另外我們還可以採用front page。也可以很容易的實現。
望採納。
9、怎麼製作網頁啊?我要最簡潔的方法!
網站建設流程是什麼樣子的?一個網站的建設是需要吧很多細節結合在一起,只有把各步驟有序的完成,才能建成一個完整的網站,雖然建站的步驟很多,而且都是分開的部分,但是這些步驟會形成一個基本的流程,按照這個流程去做,就能完成建站,下面就給大家介紹一下,網站建設的基本流程是什麼?
域名空間。一個網站的建設首先當然是選擇一個好的域名,後綴一般都是選擇.com和.cn的較多,.com是國際域名後綴,.cn是中國的域名,域名的主體一般和你的網站主題,或者企業的名稱全拼來做域名的主體,如今互聯網當中網站繁多,很多域名已經被注冊,可以是全拼,可以是首字母,可以加地域或者數字,但是一定要有意義,讓人容易記住。當域名購買完了之後,還要有個域名可以訪問到的地方,這時候就要租一個虛擬主機的空間了,把域名與主機綁定,當訪問域名時,就直接進入放在虛擬主機空間里的網站了。
規劃設計
這時候就要著手規劃想要的網站了,個人網站或者是企業站或是門戶站,要有目的性,不同類型的網站設計業不一樣,需要做一個合理的規劃,想好需要實現的功能,想要的板式類型和主要的面對用戶群,這都是網站初期要計劃好的,這時候也要收集好素材,網站中需要的內容,文字,圖片等信息的收集,都是在建站的時候需要的,做好准備。
製作建設
當做好准備的時候,就要開始建站了,建站主要分前台和後台,前台的就是網站的板式,根據網站類型,面向人群,來設計網站的版面,不宜太過雜亂,一定要簡潔,保證用戶體驗,才能讓訪問者有好感。建設後台就較為復雜了,就要用程序整合前台,並且完成需要的功能,這個需要較為復雜的程序編寫。
測試發布
當網站程序方面編寫好的時候,就是個一個網站的雛形了,但這時候網站還是不完善的,需要進行測試評估,網站還是有很多不完善的地方,要從用戶體驗的角度多去觀察,漸漸完善。當網站的問題都解決,沒什麼大的問題的時候,就可以把網站傳到虛擬主機空間里,這是訪問域名就可以正式訪問網站了。
維護推廣
網站雖然上線了,但是工作還沒有完成,這時候網站也許還有沒發現的漏洞等細節,在網站上線之後,還要繼續完善網站的不足,維護主要針對於網站的伺服器,網站安全和網站內容的維護。這時候站內的完成了,就要注重站外了,可以做seo優化或者百度推廣,對網站進行推廣,這是針對百度