網(wǎng)絡(luò)技術(shù)應(yīng)用基礎(chǔ)

1.1網(wǎng)站設(shè)計基礎(chǔ)1.1網(wǎng)站設(shè)計基礎(chǔ)1、網(wǎng)頁的定義：在網(wǎng)站中，供用戶閱讀的一個個頁面，就稱之為“網(wǎng)頁”，又稱為Web頁。如圖1-1所示即為一個網(wǎng)頁的界面。圖1-2圖1-1程序是否在服務(wù)器端運行，是重要標志！（2）

按網(wǎng)頁的表現(xiàn)形式，可將網(wǎng)頁分為靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁。運行于客戶端的程序、網(wǎng)頁、插件、組件，屬于靜態(tài)網(wǎng)頁，例如html頁、Flash、JavaScript、VBScript等等，它們是永遠不變的。一般用戶制作的都是靜態(tài)網(wǎng)頁，它是一切網(wǎng)頁制作的基礎(chǔ)，如果想制作動態(tài)網(wǎng)頁，那么仍然需要先做好靜態(tài)頁面，然后在此靜態(tài)頁面中加入動態(tài)技術(shù)，從而制作出十分精彩的動態(tài)頁面。在服務(wù)器端運行的程序、網(wǎng)頁、組件，屬于動態(tài)網(wǎng)頁，它們會隨不同客戶、不同時間，返回不同的網(wǎng)頁，例如ASP、PHP、JSP、ASP.net、CGI等。

網(wǎng)頁的組成元素網(wǎng)頁元素多種多樣的，包括文本、圖像、動畫和音樂等。文本是網(wǎng)頁最基本的組成元素，是網(wǎng)頁的主體部分。圖像也是網(wǎng)頁中不可缺少的元素，是使網(wǎng)頁看起來更美觀的點睛之筆。3、網(wǎng)站的定義

在網(wǎng)上看到的一個個網(wǎng)頁頁面的集合就是網(wǎng)站。網(wǎng)站可以包含多個頁面，也可以只有一個頁面，比如一些簡單的個人主頁就可能只有一個簡單的頁面，而一些大型網(wǎng)站則可能有很多頁面。1.1網(wǎng)站設(shè)計基礎(chǔ)網(wǎng)頁制作是一門綜合性技術(shù)，需要用到圖像處理、動畫制作、頁面設(shè)計、語言編程等方面知識。常用的網(wǎng)頁制作工具可以分為五大類:圖形圖像制作工具：Photoshop、Fireworks、Freehand、CorelDraw。網(wǎng)頁編輯工具：記事本、Dreamweaver、FrontPage、VisualInterdev、visualstudio。網(wǎng)頁動畫工具：Flash、Swish、UleadGifAnimator。網(wǎng)頁開發(fā)語言：ASP、ASP.NET、JSP、PHP、Perl、CGI、XML、JavaScript、VBScript等。網(wǎng)頁上傳工具：CuteFtp、LeapFtp、FlashFXP1.1網(wǎng)站設(shè)計基礎(chǔ)1．HTML語言HypertextMarkupLanguage(超文本標記語言)HTML文件可以直接由瀏覽器解釋執(zhí)行，而無須編譯客戶端（瀏覽器）服務(wù)器端（網(wǎng)頁提供者）Internet提供內(nèi)容提出請求1.1網(wǎng)站設(shè)計基礎(chǔ)1．HTML語言編寫環(huán)境：記事本、Dreamweaver、Frontpage、Word等文本編輯器HTML文件必須以html或htm為擴展名運行環(huán)境：IE、Firefox等1.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記1）背景顏色及背景圖像<bodybgcolor="green"background="image/back.gif">

顏色: 系統(tǒng)預(yù)定義顏色:red、green、blue等 六位16制數(shù):#FF0000rrggbb圖像: gif、jpg、bmp或png1.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記2）字體標記<font><fontsize=""color=""face="">……………</font>Size(字體大小): 取值1～7,由小到大Face(字體類型): 客戶端所能獲得的字體，必須是用戶計算機已經(jīng)安裝的字體，如使用特殊字體，可以把文字轉(zhuǎn)化為圖片進行加入1.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記3）段落標記<p>…</p>和換行標記<br>注意：

<br>是單標簽4）水平線標記<hr><hrsize="2"width="80%"color="red"noshade>

Width：寬度，可以是百分比，也可是像素5）圖像標記<img><imgsrc="images/snoopy.gif"> src:圖像文件的路徑名及文件名，一般使用相對路徑1.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記7）表格標記<table><tableborder="1“cellpadding=“2”cellspacing=“5”><tr><td>精品課程</td><td>單位</td><td>負責人</td></tr><tr><td>網(wǎng)絡(luò)技術(shù)</td><td>傳媒技術(shù)學院</td><td>張三</td></tr></table>border：邊框?qū)挾?.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記8）滾動字幕標記<marquee><marqueedirection="up"scrolldelay="150"onMouseOver="this.stop();"onMouseOut="this.start();">我會動的，哈哈!</marquee>注：Direction:運動方向（down、up、left、right）Scrolldelay:間隔時間，值越大越慢1.1網(wǎng)站設(shè)計基礎(chǔ)HTML常用標記9）背景音樂標記<bgsound><bgsoundsrc="……"loop="……">loop：循環(huán)次數(shù)，當值為-1時表示無限次循環(huán)播放，背景音樂一般采用*.mid格式文件。10）多媒體文體嵌入標記<embed><embedsrc="mp3/ibelieve.mp3"loop="-1"></embed>1.1網(wǎng)站設(shè)計基礎(chǔ)2.Dreamweaver8(2)Dreamweaver8使用請看演示1.1網(wǎng)站設(shè)計基礎(chǔ)3．網(wǎng)站設(shè)計流程網(wǎng)站整體規(guī)劃搜集和準備素材

網(wǎng)站制作

網(wǎng)站測試與發(fā)布

用戶需求分析網(wǎng)站整體規(guī)劃內(nèi)容需求包含什么功能需求如何實施

設(shè)計需求如何更好

技術(shù)需求具體實現(xiàn)

功能需求:網(wǎng)站的受眾群體是哪些？其特點是什么？網(wǎng)站最受關(guān)注的是哪些功能？是否有留言本、論壇、站內(nèi)搜索等？是否提供用戶注冊？內(nèi)容需求:網(wǎng)站內(nèi)容包括哪些類型？網(wǎng)站信息采用哪些表現(xiàn)方式：文本、圖片、視頻、表格等？是否具有獨立維護內(nèi)容的能力？網(wǎng)站信息是否允許下載和轉(zhuǎn)載？設(shè)計需求:網(wǎng)站采用哪種色系？網(wǎng)站的風格是什么樣的？網(wǎng)站的頁面深度有幾級？是否有Flash動畫？技術(shù)需求

:網(wǎng)站采用何種技術(shù)系統(tǒng)具有的安全度是否對瀏覽器有要求等1.1網(wǎng)站設(shè)計基礎(chǔ)3．網(wǎng)站設(shè)計流程網(wǎng)站整體規(guī)劃搜集和準備素材

網(wǎng)站制作

網(wǎng)站測試與發(fā)布

用戶需求分析網(wǎng)站整體規(guī)劃欄目規(guī)劃

功能規(guī)劃

頁面結(jié)構(gòu)規(guī)劃

欄目規(guī)劃的原則

:欄目設(shè)計結(jié)構(gòu)要清晰、設(shè)計簡潔。欄目順序安排合理，分清主次，重要欄目放在靠前位置，突出重點。欄目結(jié)構(gòu)不超過三級，過深的欄目容易使訪問者失去耐心。首頁個人簡介課程教學學術(shù)研究生活隨筆聯(lián)系方式教學理論教學課件教學資源論文專著科研項目獲獎情況圖4-33欄目結(jié)構(gòu)圖功能規(guī)劃

:分為前臺功能和后臺功能前臺功能是為訪問者服務(wù)的，如注冊、評論、留言、搜索等功能后臺功能是供網(wǎng)站維護者使用多功能，如發(fā)布功能、論壇、資源庫等導航區(qū)版權(quán)信息內(nèi)容區(qū)功能區(qū)功能區(qū)圖4-34首頁頁面布局導航區(qū)版權(quán)信息內(nèi)容區(qū)功能區(qū)圖4-35二級列表頁面布局導航區(qū)版權(quán)信息內(nèi)容區(qū)圖4-36三級內(nèi)容頁面布局1.1網(wǎng)站設(shè)計基礎(chǔ)3．網(wǎng)站設(shè)計流程