《網(wǎng)頁設計與制作》第一章:Dreamweaver2004制作_第1頁
《網(wǎng)頁設計與制作》第一章:Dreamweaver2004制作_第2頁
《網(wǎng)頁設計與制作》第一章:Dreamweaver2004制作_第3頁
《網(wǎng)頁設計與制作》第一章:Dreamweaver2004制作_第4頁
《網(wǎng)頁設計與制作》第一章:Dreamweaver2004制作_第5頁
已閱讀5頁,還剩32頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權,請進行舉報或認領

文檔簡介

第1章網(wǎng)頁制作基礎網(wǎng)頁設計與制作

南海學院計算機系制作5/19/20241第1章網(wǎng)頁制作基礎Web和瀏覽器WebWeb的特點和結構Web最大的特點是使用了超文本(Hypertext)WWW采用C/S(客戶機/服務器)工作模式在瀏覽器和服務器之間應用HTTP(HyperTextTransferProtocol,超文本傳輸協(xié)議)作為網(wǎng)絡應用層通信協(xié)議

5/19/20242

URLInternet上所有的資源都有一個唯一的URL地址,一般將URL地址稱為網(wǎng)址。URL的完整格式如下:協(xié)議://主機名(或IP地址):端口號/路徑名/文件名5/19/20243【例】幾個URL的例子.

(1),用http協(xié)議和缺省端口號(80)訪問微軟公司服務器。這里沒有指定路徑和文件名,所以訪問的結果是把一個缺省主頁送給瀏覽器。

(2)/pub/ms-windows/winvn926.zip,用FTP協(xié)議訪問北京大學FTP服務器上路徑名為pub/ms-windows、文件名為winvn926.zip的文件。5/19/20244

(3)http://gnacademy.org:8001///uu-gna/index.html,從運行在端口號8001的gnacademy.org服務器上訪問index.html主頁。

(4)/Addressing/URL/5-BNF.html#httpaddress,訪問

服務器上Addressing/URL目錄下的5-BNF.html網(wǎng)頁文件中錨點標識為httpaddress的地方。5/19/20245瀏覽器概述分類InternetExplorerNetscapeNavigatorMosaic等專業(yè)瀏覽器以及一些以上述瀏覽器為內(nèi)核的專用瀏覽器。

其中使用最廣泛的是Microsoft出品的InternetExplorer6.0(簡稱IE6)。5/19/20246IE6的界面標題欄工具欄菜單欄地址欄狀態(tài)欄瀏覽窗口5/19/20247

IE6.0的使用瀏覽網(wǎng)頁“停止”按鈕前進和后退刷新頁面改變文字大小選擇編碼全屏幕顯示查看源文件

5/19/20248打開多個窗口用菜單欄上的“文件”→“新建”→“窗口”,會打開一個新的瀏覽器窗口。一般情況下,打開四、五個窗口可以充分利用系統(tǒng)資源,而且通過調(diào)整窗口的大小和位置還可以同時瀏覽。5/19/20249主頁、臨時文件和歷史記錄瀏覽器在打開時自動調(diào)入的網(wǎng)頁稱為“主頁”,主頁可以通過“工具”→“Internet選項”打開Internet選項對話框,在“常規(guī)”選項卡的“主頁”欄設置.5/19/202410收藏夾的使用使用菜單“收藏”→“添加到收藏夾”打開添加到收藏夾對話框。5/19/202411使用菜單“收藏”→“整理收藏夾”打開收藏夾整理對話框,進行收藏夾中網(wǎng)頁的移動、刪除、改名及創(chuàng)建新文件夾等操作。5/19/202412關閉圖片顯示

在網(wǎng)絡速度較慢時,不觀看網(wǎng)頁中的圖片和其它多媒體內(nèi)容可以得到更快的下載速度。通過“工具”→“Internet選項”打開Internet選項對話框,在“高級”選項卡中可以對瀏覽器的工作方式進行設置5/19/202413關閉自動完成功能通過工具→Internet選項,打開Internet選項對話框,在“內(nèi)容”選項卡的“個人信息”部分單擊“自動完成”按鈕打開自動完成設置對話框。5/19/202414搜索引擎的使用1、使用瀏覽器的“搜索”按鈕2、使用專門的搜索引擎

http://www.google.cn

(Google)

http://

(擺渡)

(雅虎)

(搜狐)

5/19/202415認識網(wǎng)站1.門戶網(wǎng)站2.個人網(wǎng)站3.專業(yè)網(wǎng)站4.職能網(wǎng)站5/19/2024161.門戶網(wǎng)站

這類網(wǎng)站是一種綜合性網(wǎng)站,涉及領域非常廣泛,包含文學、音樂、影視、體育、新聞和娛樂等方方面面的內(nèi)容,具有論壇、搜索和短信等功能。現(xiàn)在國內(nèi)較著名的門戶網(wǎng)站有搜狐()、網(wǎng)易()等。5/19/2024172.個人網(wǎng)站個人網(wǎng)站具有較強個性化,是以個人名義開發(fā)創(chuàng)建的網(wǎng)站,其內(nèi)容、樣式、風格等都是非常有個性的。5/19/2024183.專業(yè)網(wǎng)站這類網(wǎng)站具有很強的專業(yè)性,通常只涉及某一個領域,內(nèi)容專業(yè)。如榕樹下網(wǎng)站()即是一個專業(yè)文學網(wǎng)站。5/19/2024194.職能網(wǎng)站職能網(wǎng)站具有專門的功能,如政府職能網(wǎng)站等。目前逐漸興起的電子商務網(wǎng)站也屬于這類網(wǎng)站,較有名的電子商務網(wǎng)站有阿里巴巴()、卓越網(wǎng)()和當當網(wǎng)上書店()等。5/19/202420認識網(wǎng)頁Flash動畫導航欄GIF動畫文字表單圖片超級鏈接5/19/202421網(wǎng)頁中的元素1.文字2.圖像3.表單4.Flash動畫5.表格6.超級鏈接7.視頻、音頻8.POP窗口9.標題欄和狀態(tài)欄文字

5/19/2024221.2網(wǎng)頁制作的相關知識HTML語言概述

是一種超文本標記語言,作為一種網(wǎng)頁編輯語言,易學易懂。5/19/2024231、HTML網(wǎng)頁

HTML網(wǎng)頁通常是由三部分內(nèi)容組成的:版本信息、網(wǎng)頁標題(HEAD)和文檔主體(BODY)。

下面就是網(wǎng)頁結構的總體框架:

<!HTML網(wǎng)頁版本信息說明><HTML><HEAD><!標題標記、屬性及其內(nèi)容></HEAD><BODY><!主體標記、屬性及其內(nèi)容></BODY></HTML>5/19/202424(1)版本信息版本信息位于HTML網(wǎng)頁文件的第一行(2)HTML文件標記大部分網(wǎng)頁文件都是以<HTML>標記開始的,在文件的結尾處又以</HTML>結束

(3)頭部信息

HEAD標記之間是HTML文檔的頭部,用來標明當前文檔的有關信息在HEAD標記之間,使用頻率最高的標記就是TITLE,它用于定義顯示在瀏覽器標題欄的文檔標題。5/19/202425【例】給網(wǎng)頁設置“勵志學社”的文檔標題,可在頭部輸入以下代碼:<TITLE>勵志學社</TITLE>5/19/202426(4)主體標記網(wǎng)頁的主體是“<BODY>……</BODY>”標記對作用的范圍

<BODY>標記用于定義HTML文檔主體的開始,它能夠設置網(wǎng)頁的背景圖像、背景顏色、鏈接顏色和網(wǎng)頁邊距等屬性,其基本用法如下所示:<BODYBackground="URL"Bgclolr=ColorBgpropeties=FixedLeftmargin=nLink=ColorAlink=ColorText=ColorTopmargin=nVlink=Color>

Bgcolor為背景顏色。關于顏色的值后面會詳細介紹。Text為不包含超級鏈接的文字顏色。

Link為超級鏈接文字的顏色。

Alink為正被點擊的超級鏈接文字的顏色。5/19/202427

Leftmargin、Topmargin用于設置網(wǎng)頁的左邊距和上邊框,它們是以像素為單位【例1】將網(wǎng)頁的上邊距和左邊距分別設置為40和30個像素的寬度,使用黑色文本、白色背景,未訪問的鏈接源采用藍色,已訪問的鏈接源標記為暗紅色。<BODYBackground="moom.gif"Bgcolor="White"Bgproperties=FixedLeftmargin=30Link="Blue"Text="Black"Topmargin=40Vlink="Maroon">

Vlink為已經(jīng)點擊過的超級鏈接文字的顏色。

Background設置,如果設置了背景圖片,圖片會覆蓋已經(jīng)設置的顏色。

5/19/2024282、XML語言

XML(eXtensibleMarkupLanguage)被稱作是下一代的網(wǎng)頁標記語言,也是采用各種標記來形成網(wǎng)頁的源代碼。

XML中包括可擴展格式語言XSL(ExtensibleStyleLanguage)和可擴展鏈接語言XLL(ExtensibleLinkingLanguage)。5/19/2024291.22靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁靜態(tài)網(wǎng)頁指基本上全部使用HTML語言制作的網(wǎng)頁,頁面的內(nèi)容是固定不變的。動態(tài)網(wǎng)頁(DynamicHTML,DHTML)利用JavaScript,CSS(層疊樣式表)及其它類似的語言如VBScript等與HTML進行有機的結合來使靜態(tài)的HTML網(wǎng)頁變成動態(tài)。5/19/2024301.23Web服務器端程序

專業(yè)的網(wǎng)站都是建立在使用數(shù)據(jù)庫的基礎上的,要將這些數(shù)據(jù)庫變成可以通過瀏覽器顯示和操作的Web頁面,就需要編寫服務器端的程序。用戶向服務器傳送提交的表單(個人信息、選擇結果等)需要在服務器端進行記錄、篩選等處理。大量的數(shù)據(jù)庫查詢、修改處理也需要服務器端程序的支持。目前常用的服務器端編程技術主要有CGI、ASP、PHP、JSP等,不同的技術需要不同的系統(tǒng)環(huán)境支持。5/19/2024311.3網(wǎng)頁制作的基本方法制作網(wǎng)頁的基本步驟

1、確定網(wǎng)頁的內(nèi)容

2、設計網(wǎng)頁的組織結構

3、資料的收集與整理

4、選擇網(wǎng)頁的設計方法

常用的網(wǎng)頁制作工具有Frontpage、Dreamweaver等。服務器端的ASP程序可以使用VisualInterdev、UltraDEV等編輯。5/19/202432開始網(wǎng)頁制作構建頁面框架創(chuàng)建導航條填充內(nèi)容創(chuàng)建返回主頁連接5/19/202433網(wǎng)頁制作的原則站點要有創(chuàng)意整體規(guī)劃動畫不能過多導航要明朗制作通用網(wǎng)頁主題鮮明優(yōu)化圖象定時更新5/19/202434制作網(wǎng)頁時要注意的問題1、網(wǎng)頁的標題要簡潔,明確。

2、在文本中要使用水平線,以分割不同部分。

3、對重點段落要強調(diào)顯示。

4、網(wǎng)頁中插入的圖片要盡量的小。

5、圖形要附加文字說明,以便關閉圖像時查看。

6、網(wǎng)頁中引用的資料及商標(或圖標),不能侵犯版權。5/19/2024351.4MacromediaStudioMX2004

MacromediaStudioMX2004是目前應用最廣泛的網(wǎng)頁制作工具組件,使用方便、功能齊全,Dreamweaver、Flash、Fireworks被稱作“網(wǎng)頁三劍客”。在Dreamweaver

里用豐富的層疊樣式表制作耐看,專業(yè)的網(wǎng)站。

MacromediaFl

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論