- Adobe Dreamweaver CS5 網(wǎng)頁設(shè)計與制作技能基礎(chǔ)教程
- 易連雙 趙林
- 2149字
- 2020-04-22 16:19:47
1.2 網(wǎng)站制作流程
網(wǎng)站制作是一個復(fù)雜的系統(tǒng)工程,有一定的工作流程。只有遵循這個流程,一步一步地操作,才能設(shè)計出讓用戶滿意的網(wǎng)站。所以在制作網(wǎng)站之前,先要了解網(wǎng)站建設(shè)的基本流程。
1.2.1 網(wǎng)站策劃
一個網(wǎng)站的成功與否,與建站前的策劃有著極為重要的關(guān)系。在建立網(wǎng)站前應(yīng)明確建設(shè)網(wǎng)站的目的、網(wǎng)站的功能、網(wǎng)站規(guī)模、投入費用等。網(wǎng)站策劃對網(wǎng)站建設(shè)起到計劃和指導(dǎo)的作用,對網(wǎng)站的內(nèi)容和維護起到定位作用。只有詳細地規(guī)劃,才能避免在網(wǎng)站建設(shè)中出現(xiàn)很多問題。網(wǎng)站策劃包括以下3部分內(nèi)容。
1.市場分析
在建設(shè)網(wǎng)站之前,要進行必要的市場分析,具體包括以下3個方面。
◆ 要了解相關(guān)行業(yè)的市場是怎樣的,有什么樣的特點,是否能夠在互聯(lián)網(wǎng)上開展公司業(yè)務(wù)。
◆ 市場主要競爭者分析,競爭對手上網(wǎng)情況及其網(wǎng)站規(guī)劃、功能作用。
◆ 公司自身條件分析,公司概況、市場優(yōu)勢,可以利用網(wǎng)站提升哪些競爭力。
2.網(wǎng)站目的及功能定位
◆ 對網(wǎng)站制作市場分析后,就該明確建站的目的,進行具體的功能定位。
◆ 為什么要建網(wǎng)站,是為了宣傳產(chǎn)品,進行電子商務(wù),還是建設(shè)行業(yè)性網(wǎng)站?是企業(yè)的需要還是市場拓展的延伸?
◆ 整合公司資源,確定網(wǎng)站功能。根據(jù)公司的需要和計劃,確定網(wǎng)站的功能:產(chǎn)品宣傳、網(wǎng)上營銷、客戶服務(wù)、電子商務(wù)。
◆ 潛在用戶需求分析,網(wǎng)站為用戶帶來的價值以及為公司帶來的價值。
根據(jù)網(wǎng)站功能,確定網(wǎng)站應(yīng)達到的目的作用。
3.網(wǎng)站技術(shù)解決方案
根據(jù)網(wǎng)站的功能及后期發(fā)展可能出現(xiàn)的功能擴展確定網(wǎng)站技術(shù)解決方案。
◆ 租用虛擬主機的配置。
◆ 網(wǎng)站安全性措施,防黑、防病毒方案。
◆ 相關(guān)程序開發(fā),如ASP、JSP、CGI 、數(shù)據(jù)庫程序等。
1.2.2 網(wǎng)站設(shè)計
網(wǎng)站策劃完成后,接下來就可以進行網(wǎng)站制作的設(shè)計工作。
1.規(guī)劃站點
站點的規(guī)劃是開發(fā)網(wǎng)站的第一步,也是關(guān)鍵的一步。規(guī)劃站點即對網(wǎng)站的整體定位,其中,不僅要準(zhǔn)備建設(shè)站點所需要的文字資料、圖片信息和視頻文件,還要將這些素材整合,并確定站點的風(fēng)格和規(guī)劃站點的結(jié)構(gòu)。總之,規(guī)劃站點就是通過視覺效果來統(tǒng)一網(wǎng)站的風(fēng)格和內(nèi)容等。
規(guī)劃站點的目的在于明確所建站點的方向和采用的方法,規(guī)劃時應(yīng)遵循以下4個原則。
(1)確定網(wǎng)站的服務(wù)對象
只有確定了網(wǎng)站的服務(wù)對象,對不同的讀者投其所好,才能制作出有價值的網(wǎng)站。比如要制作一個兒童網(wǎng)站,確定的對象就是兒童。在確定服務(wù)對象后,還應(yīng)考慮目標(biāo)對象的計算機配置、瀏覽器版本以及是否需要安裝插件等問題。
(2)確定網(wǎng)站的主題和內(nèi)容
網(wǎng)站的主題要鮮明,重點要突出。對于不同的愛好者和需求者,應(yīng)該有不同的定位。比如,要制作一個圖片類網(wǎng)站。開發(fā)者從多個方面著手,對瀏覽者的需求進行分類,例如,可分為攝影圖庫、設(shè)計圖庫、矢量圖庫等。
(3)把握網(wǎng)站結(jié)構(gòu)
網(wǎng)站的總體結(jié)構(gòu)要層次分明,盡量避免層次復(fù)雜的網(wǎng)絡(luò)結(jié)構(gòu),一般網(wǎng)站結(jié)構(gòu)選擇樹形結(jié)構(gòu),這種結(jié)構(gòu)的特點是主次分明、內(nèi)容突出。
常用的結(jié)構(gòu)類型有以下三種。
①層狀結(jié)構(gòu)類似于目錄系統(tǒng)的樹狀結(jié)構(gòu),如圖1-5所示。該結(jié)構(gòu)由網(wǎng)站文件的主頁開始,依次劃分為一級標(biāo)題、二級標(biāo)題等,逐級細化,直至提供給瀏覽者具體信息。在層狀結(jié)構(gòu)中,主頁是對整個網(wǎng)站文件的概括和歸納,同時提供與下一級的鏈接。層狀結(jié)構(gòu)具有很強的層次性。

圖1-5
②線性結(jié)構(gòu)類似于數(shù)據(jù)結(jié)構(gòu)中的線性表,如圖1-6所示。該結(jié)構(gòu)用于組織本身的線性順序形式存在的信息,可以引導(dǎo)瀏覽者按部就班地瀏覽整個網(wǎng)站文件。這種結(jié)構(gòu)一般都用在意義平行的頁面上。

圖1-6
③Web結(jié)構(gòu)類似于Internet的組成結(jié)構(gòu),各網(wǎng)頁之間形成網(wǎng)狀鏈接,如圖1-7所示,Web結(jié)構(gòu)允許用戶隨意瀏覽。

圖1-7
(4)選擇網(wǎng)站風(fēng)格
網(wǎng)站風(fēng)格應(yīng)該根據(jù)網(wǎng)站的主題和內(nèi)容選擇一種合適的風(fēng)格類型,以求在內(nèi)容和形式上的完美結(jié)合,突出網(wǎng)站的個性,才能更吸引人們的注意力。風(fēng)格的設(shè)計主要表現(xiàn)在色彩的運用上。
2.搜集素材
網(wǎng)站的主題內(nèi)容是文本、圖像和多媒體等,它們構(gòu)成了網(wǎng)站的靈魂,若沒有它們,則再好的結(jié)構(gòu)設(shè)計都不能達到網(wǎng)站設(shè)計的初衷,也不能吸引瀏覽者。任何一種網(wǎng)站,無論是商業(yè)性質(zhì)、娛樂性質(zhì),還是個人性質(zhì)的,在網(wǎng)站建設(shè)之初都應(yīng)進行充分的調(diào)查和準(zhǔn)備,即調(diào)查讀者對網(wǎng)站的需求度、認(rèn)可度,以及準(zhǔn)備所需資料和素材。網(wǎng)站的資料和素材包括所需圖片、動畫、logo的設(shè)計、框架規(guī)劃、文字信息搜索等。
1.2.3 網(wǎng)頁制作
完成網(wǎng)站策劃和設(shè)計工作后,就開始著手網(wǎng)頁的制作了。網(wǎng)站中的頁面通稱為網(wǎng)頁,它是一個純文本文件,是向瀏覽者傳遞信息的載體。網(wǎng)頁采用超文本和超媒體技術(shù),采用HTML、CSS、XML等多種語言對頁面中的各種元素(如文字、圖像、音樂等)進行描述,并通過客戶端瀏覽器進行解析,從而向瀏覽者呈現(xiàn)網(wǎng)頁的各種內(nèi)容。
1.設(shè)計網(wǎng)頁圖像
網(wǎng)頁圖像設(shè)計包括Logo 、標(biāo)準(zhǔn)色彩、標(biāo)準(zhǔn)字、導(dǎo)航條和首頁布局等。用戶可以使用Photoshop或Fireworks軟件來具體設(shè)計網(wǎng)站的圖像。
有經(jīng)驗的網(wǎng)頁設(shè)計者,通常會在使用網(wǎng)頁制作工具之前,設(shè)計好網(wǎng)頁的整體布局,這樣在具體設(shè)計過程中將會大大節(jié)省工作時間。
2.制作網(wǎng)頁
素材和圖像都具備了,設(shè)計工具也選好了,下面就需要按照計劃一步一步地把自己的想法變成現(xiàn)實了,這是一個復(fù)雜而細致的過程,一定要按照先大后小、先簡單后復(fù)雜來進行制作。所謂先大后小,就是說在制作網(wǎng)頁時,先把大的結(jié)構(gòu)設(shè)計好,然后再逐步完善小的結(jié)構(gòu)設(shè)計。所謂先簡單后復(fù)雜,就是先設(shè)計出簡單的內(nèi)容,然后再設(shè)計復(fù)雜的內(nèi)容,以便出現(xiàn)問題時好修改。在制作網(wǎng)頁時要靈活運用模板,這樣可以大大提高制作效率。
- UG NX10.0從新手到高手
- Creo 4.0中文版從入門到精通
- Premiere Pro 2022短視頻剪輯、調(diào)色與特效制作實戰(zhàn)(全彩微課版)
- Photoshop CC 實戰(zhàn)入門
- Oracle SQL Developer 2.1
- eZ Publish 4: Enterprise Web Sites Step/by/Step
- Learning Ext JS 3.2
- ASP.NET jQuery Cookbook
- 中文版3ds Max 2021完全自學(xué)教程
- Stable Diffusion圖像與視頻生成入門教程
- Python Testing: Beginner's Guide
- AutoCAD入門教程全掌握
- UG NX 8.0模具設(shè)計教程
- 剪映專業(yè)版:短視頻創(chuàng)作案例教程(全彩慕課版)
- SketchUP草圖繪制從新手到高手