《網頁制作基礎教程（DreamweaverCS3）》預備知識《網頁制作基礎教程（DreamweaverCS3）》預備知1學習的主要內容

網頁文件

網頁一般又稱HTML文件；通常看到的網頁，大都以HTM或HTML后綴結尾的文件；另外還有以CGI、ASP、PHP和JSP后綴結尾的。學習的主要內容

網頁文件2學習的主要內容

網頁分類

根據生成方式，網頁大致可以分為靜態網頁和動態網頁兩種。

靜態網頁

是網站建設初期經常采用的一種形式；網站建設者把內容設計成靜態頁面，訪問者只能被動地瀏覽網站建設者提供的網頁內容。學習的主要內容

網頁分類3學習的主要內容

靜態網頁的特點

網頁內容不會發生變化，除非網頁設計者修改了網頁的內容。不能實現和瀏覽網頁的用戶之間的交互。學習的主要內容

靜態網頁的特點4學習的主要內容

動態網頁

網絡技術日新月異，許多網頁文件的擴展名不再是.htm，還有.php、.asp等，這些都是采用動態頁技術制作出來的。

特點

動態網頁以數據庫技術為基礎，可以大大降低網站維護的工作量。采用動態網頁技術的網站可以實現更多的功能，如用戶注冊、用戶登錄、搜索查詢、用戶管理、訂單管理等。學習的主要內容

動態網頁5學習的主要內容1、html標記語言2、制作網頁的工具

MicrosoftFrontPageNetscape編輯器

Dreamweaver學習的主要內容1、html標記語言6網絡與網站設計基礎知識1、Internet概述2、網頁設計概述3、網站設計概述網絡與網站設計基礎知識1、Internet概述71、Internet概述

Internet

即國際計算機互聯網，在中國也稱“因特網”或“萬維網”，是由符合TCP/IP等網絡協議的網絡組成的互聯網。它是目前全世界最大的網絡，包含著豐富多彩的信息，并提供方便快捷的服務。它縮短了人們之間的距離。1、Internet概述

Internet81、Internet概述通過Internet，用戶可以與接入Internet的任何一臺計算機進行交流，如發郵件、聊天、通話等。在這一節中，主要介紹Internet的工作原理、Internet發展簡史及其提供的主要服務等基礎知識，讓用戶對Internet有個大致的了解。1、Internet概述通過Internet，用戶91、Internet概述

Internet的工作原理Internet是一種全球范圍的基于分組交換原理和TCP/IP的計算機網絡。它將信息進行分組（分割為許多小數據包）后以數據包為單位進行傳輸。Internet在進行信息傳輸時要完成的任務主要有兩項：一是正確分割源文件，以及在目的地將同一源文件的數據包準確地重組起來；二是將數據包準確地送往目的地。1、Internet概述

Internet的工作原理101、Internet概述

Internet發展簡史

Internet起源于20世紀60年代。1968年，基于分組交換原理的計算機網絡——ARPANET。1983年，TCP/IP協議的建立，使計算機通信有了統一的標準。這是計算機網絡發展史上的一個里程碑，網絡從此進入高速發展的時代。1、Internet概述

Internet發展簡史111、Internet概述

Internet提供的主要服務

1．電子郵件2．文件的下載和上傳3．信息查詢4．文件傳輸5．網上聊天6．BBS電子公告欄7．網上游戲8．個人主頁空間9．電子商務1、Internet概述

Internet提供的主要服務121、Internet概述

IP地址和域名

1、IP地址

在Internet上，每一個節點都依靠唯一的IP地址互相區分和相互聯系。IP地址共占用32位，一般以4個十進制數字表示，每個數字之間用小圓點（.）隔開，例如，“05”，這種記錄方法稱為“點—數”記號法。通常用IP地址標識一個網絡和與網絡連接的一臺主機。1、Internet概述

IP地址和域名131、Internet概述

IP地址和域名

2、域名

與網絡上的數字型IP地址相對應的字符型地址，就被稱為域名。TCP/IP中包含著一個域名服務（DomainNameService，DNS）。DNS通過一個名為“解析”的過程將域名轉換為IP地址，或者將IP地址轉換為域名。名字比用點分隔的十進制數IP地址更好記些。既然計算機仍然使用IP地址，那么就必須有一種方法在二者之間進行轉換。DNS使用查找表格的方法來將二者的值關聯起來。

1、Internet概述

IP地址和域名141、Internet概述

IP地址和域名

2、域名

下表1-1中說明了部分組織的域命名約定，和部分國家的域命名約定。1、Internet概述

IP地址和域名151、Internet概述組

織

類

型域命名約定國

家域命名約定國

家域命名約定商業com澳大利亞au莫桑比克mz教育edu加拿大ca尼日利亞ng政府gov中國cn波蘭po國際條約組織int芬蘭fi卡塔爾qa網絡提供商net法國fr薩摩亞群島ws非營利性組織org匈牙利hu瑞典se意大利it阿拉伯聯合酋長國ae日本jp英國uk約旦jo美國us1、Internet概述組織類型域命名約定國家161、Internet概述1、Internet概述171、Internet概述1、Internet概述181、Internet概述1、上網了解Internet提供的服務，并進行具體實現。2、瀏覽熟悉網站，根據域名區分網站屬于的類型。1、Internet概述1、上網了解Internet提供的服192、網頁的設計

網頁的基本元素

常見的網頁元素包括文本、圖片、超鏈接、表格、導航欄、動畫和交互表單。

2、網頁的設計

網頁的基本元素202、網頁的設計

網頁的基本元素

1．文本2．圖片和動畫3．聲音和視頻4．超鏈接5．導航欄6．表格7．表單8．其他常見元素2、網頁的設計

網頁的基本元素212、網頁的設計

網頁布局網頁是否精彩，能否吸引瀏覽者，除了色彩的搭配、文字的變化、圖片的處理等因素外，還有一個非常重要的因素—網頁的布局。

2、網頁的設計

網頁布局222、網頁的設計

網頁布局的基本概念對于初學者，最好應先了解網頁布局的基本概念。

頁面尺寸分辨率為800×600：頁面的顯示尺寸為：780×428個象素；分辨率為1024×768：頁面的顯示尺寸為：1007×600個象素。2、網頁的設計

網頁布局的基本概念232、網頁的設計

網頁布局

⊙整體造型這里是指頁面的整體形象，這種形象應該是一個整體，圖形與文本的結合應該是層疊有序的。雖然顯示器和瀏覽器都是矩形的，但對于頁面的造型，設計者可以充分運用自然界中的各種形狀及它們的組合，如矩形、圓形、三角形、菱形等。

2、網頁的設計

網頁布局242、網頁的設計

網頁布局的一般步驟

（1）構思根據網站內容的整體風格，設計版面布局。不要講究細節，只要有一個輪廓。（2）初步填充內容這一步就要把一些主要的內容放到網頁中，例如，網站的標志、廣告條、菜單、導航條、計數器等。（3）細化在這一步，設計者可以利用網頁編輯工具把草案做成一個簡略的網頁，當然，對每一種元素所占的比例也要有一個詳細的數字，以便以后修改。2、網頁的設計

網頁布局的一般步驟252、網頁的設計

網頁布局的原則在構思和設計的過程中，設計者還必須要掌握以下幾項原則。（1）平衡性（2）對稱性（3）疏密度2、網頁的設計

網頁布局的原則262、網頁的設計

網頁布局類型網頁布局大致可分為“國”字型、拐角型、標題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型等。

2、網頁的設計

網頁布局類型272、網頁的設計2、網頁的設計282、網頁的設計2、網頁的設計292、網頁的設計

標題正文型布局

標題正文型布局的最上面是標題或類似的一些東西，下面一般是正文，例如，一些文章頁面或注冊頁面等就屬于這種類型。

左右框架型布局

采用左右框架型布局的網頁分為左、右兩部分，一般左面是導航鏈接，有時最上面會有一個小的標題或標志，右面是正文。大部分大型論壇和網頁教程都使用這種布局，有一些個人網站和企業網站也喜歡采用這種布局。2、網頁的設計

標題正文型布局302、網頁的設計

上下框架型布局上下框架型布局與左右框架型布局類似，區別僅僅在于這種布局分為上、下兩部分。

綜合框架型布局綜合框架型布局是左右框架型布局與上下框架型布局的結合，相對較復雜，類似于拐角型布局，只是采用了框架結構。

封面型布局封面型布局一般出現在一些網站的首頁，由一些精美的平面設計結合一些小的動畫組成，在頁面中放上幾個簡單的鏈接或者僅僅是一個“進入”的鏈接，甚至直接在圖片上加上鏈接而沒有任何提示。這種布局需要精心設計，能給人帶來賞心悅目的感覺。2、網頁的設計

上下框架型布局312、網頁的設計

配色原則

網站給人的第一印象來自于視覺，因此，確定網站的色彩相當重要。不同的色彩搭配產生不同的效果，從而使網站給人以不同的視覺效果，吸引訪問者的注意力。

2、網頁的設計

配色原則322、網頁的設計1．色彩的形成簡單地說，色彩是一種視覺，是光作用于眼睛的結果。紅、綠、藍色的光被稱為三原色光。2．色彩的特征色彩的基本特征主要有色調、亮度和飽和度三個。色調表現色彩的種類，亮度表現色彩的明亮程度，飽和度表現色彩的鮮艷程度。2、網頁的設計1．色彩的形成332、網頁的設計

配色原則

3．色彩的心理感覺自然界的各種色彩會在人的心中留下不同的印象，產生不同的心理感覺，例如：紅色是一種激奮的色彩，具有刺激效果，能使人產生沖動、憤怒、熱情、活力的感覺；

2、網頁的設計

配色原則342、網頁的設計

配色原則

4．色彩的分類按照色彩對人們心理的影響可以進行以下分類。

暖色系：紅、橙、橙黃、黃等色彩讓人覺得溫馨、和煦、熱情。

中性系：黃綠、綠等色彩讓人覺得舒適、和諧。

冷色系：青綠、藍綠、藍等色彩讓人覺得寧靜、清涼、高雅。

2、網頁的設計

配色原則352、網頁的設計

例子設計出售冷食的虛擬店面，應使用消極而沉靜的顏色，使人從心理上感覺涼爽一些。如果要制作一個休閑主題的個人站點，不妨將網站色彩設計為天藍色，如以海水為背景，再搭配一些魚兒的效果會更好。2、網頁的設計

例子362、網頁的設計

配色原則

5．色彩的選擇和搭配

在制作網站的時候，色彩的選擇和搭配非常重要。一個網站格調的確定，往往取決于色彩的選擇與搭配是否適當。2、網頁的設計

配色原則372、網頁的設計

網頁布局的常用技術

（1）CSS（層疊樣式表）布局CSS對于初學者來說顯得有點復雜，但它的確是一種好的布局方法。（2）表格布局優勢：能對不同對象加以處理，而又不用擔心不同對象之間的影響。缺點：當設計者使用了過多的表格時，會影響頁面的下載速度。

2、網頁的設計

網頁布局的常用技術382、網頁的設計（3）框架布局由于框架技術的兼容性問題，框架結構的頁面不太受歡迎。但從布局上考慮，框架結構不失為一個好的布局方法。（4）div+css布局div+css是進階段的，分布模式很隨意。

2、網頁的設計（3）框架布局392、網頁的設計1、上網查看不同的網頁，分析其網頁的組成元素有哪些。2、打開一些您熟悉的網站，瀏覽網頁，分析其屬于哪種布局和色彩搭配。3、根據自己的經驗和體會，談談對網頁配色的看法。2、網頁的設計1、上網查看不同的網頁，分析其網頁的組成元素有403、網站設計

網站設計的主要任務

⊙網站架構設計；⊙以瀏覽器為客戶端的Web應用程序開發；⊙系統測試及網站發布。3、網站設計

網站設計的主要任務413、網站設計

確定網站的類型

門戶網站門戶網站（PortalSite）集合了眾多內容，提供多樣服務。比較知名的中文門戶網站有三類：一類是像新浪、搜狐、網易這樣完全由國內網絡公司經營的網站，網站內容除了搜索引擎外，還包括新聞、娛樂、游戲、文化、體育、健康、科技、財經、教育等若干版塊，以及網上短信、個人主頁空間、免費郵箱等服務項目；3、網站設計

確定網站的類型423、網站設計

門戶網站第二類是境外投資的網站，如中文雅虎、美國在線等，網站內容以新聞和娛樂為主；第三類是國內傳統媒體辦的網站，以人民網、新華網、央視國際為代表，以提供新聞和時事評論為主。3、網站設計

門戶網站433、網站設計

普及型網站

此類網站包括企業網站、大學網站、政府網站及數量眾多的個人網站。

3、網站設計

普及型網站443、網站設計

電子商務類網站

電子商務類網站分為B2B（商家對商家）和B2C（商家對個人客戶）兩種，按照交易過程可分為商品檢索、商品采購、訂單支付三個階段。

3、網站設計

電子商務類網站453、網站設計

電子商務類網站

具有如下功能：商品發布；商品選購；購物車；在線交易功能；商品交接、資金結算功能。3、網站設計

電子商務類網站463、網站設計

媒體信息服務類網站媒體信息服務類網站是報社、雜志社、廣播電臺、電視臺等傳統媒體為了樹立自己的網上形象，方便服務對象而建立的網站，主要功能包括：信息發布、電子出版、客戶在線咨詢、網站管理。

辦公事務管理網站辦公事務管理網站是企業事業單位為了實現辦公自動化而建立的內部網站，包括以下主要功能模塊：辦公事務管理、人力資源管理、財務資產管理和網站管理。

商務管理網站商務管理網站是企業內部為了進行廣告及商品管理、客戶管理、合同管理、營銷管理等目的而建立的網上辦公平臺。3、網站設計

媒體信息服務類網站473、網站設計

網站主題的確定

網站使用的主要題材有：網上求職、網上聊天/ICQ、網上社區/討論/郵件列表、計算機技術、網頁/網站開發、娛樂網站、旅行、參考/資訊、家庭/教育、生活/時尚等。在選擇網站題材的時候要注意以下3點。○主題小而內容精○題材最好是自己擅長的內容3、網站設計

網站主題的確定483、網站設計

網站名稱的確定

網站名稱也是網站設計的一部分，而且是很關鍵的一個要素。例如，“電腦學習室”和“電腦之家”相比，后者更簡練些；“迷笛樂園”和“MIDI樂園”相比，后者含義更清晰。選擇網站的名稱時要注意以下3點。⊙名稱要端正⊙名稱要易記⊙名稱要有特色3、網站設計

網站名稱的確定493、網站設計

CI（CorporateIdentity，企業形象）

是指通過強化視覺效果的手段來加深用戶對企業形象的印象。例如，可口可樂公司擁有全球統一的標志、色彩和產品包裝，給人們的印象極為深刻。3、網站設計

CI（CorporateIdentity，企503、網站設計

設計網站的標志（Logo）

首先設計者需要設計一個網站的標志（Logo）。如同商標一樣，Logo是站點特色和內涵的集中體現。Logo可以是中文、英文字母、符號或圖案，也可以是動物或人物等。例如，新浪網用字母sina加眼睛作為Logo，體現網站的敏銳和動感的特色。3、網站設計

設計網站的標志（Logo）513、網站設計

設計網站的標準色彩

“標準色彩”是指能體現網站形象和延伸內涵的色彩。例如，IBM的深藍色，肯德基的紅色條紋，Windows的紅、藍、黃、綠色塊，都使瀏覽者覺得很貼切，很和諧。一個網站的標準色彩不宜超過3種。3、網站設計

設計網站的標準色彩523、網站設計

設計網站的標準字體

標準字體是指用于Logo、標題和主菜單的特有字體。一般網頁默認的字體是宋體。可以使用粗仿宋體，可以用廣告體，可以用手寫體等。

3、網站設計

設計網站的標準字體533、網站設計

設計網站的宣傳標語

網站的宣傳標語也可以說是網站的精神、網站的目標，最好用一句話甚至一個詞來高度概括。它類似于實際生活中的廣告語句，例如，雀巢的“味道好極了”，Intel的“給你一顆奔騰的心”，給人們留下的印象都極為深刻。3、網站設計

設計網站的宣傳標語543、網站設計

設計網站的欄目和版塊

網站欄目的實質是一個網站的大綱索引，索引應該將網站的主體明確顯示出來。例如，網易站點分新聞、體育、財經、娛樂、教育等版塊，每個版塊下面有各自的主欄目。3、網站設計

設計網站的欄目和版塊553、網站設計

申請域名和站點空間

在創建一個Web站點之前，必須先申請域名和站點空間。只有申請了域名和站點空間后，用戶制作的網頁才能發布到Internet上，供他人瀏覽。

3、網站設計

申請域名和站點空間563、網站設計

申請域名和站點空間

域名只是Internet中用于解決IP地址對應問題的一種方法。域名由若干個英文字母和數字組成，由“.”分隔成幾部分，如、等。com是頂級域，是com的次級域，是的次級域。一般默認：是國際頂級域名，是的次級域名，也是的二級域名！是相對于的二級域名！3、網站設計

申請域名和站點空間573、網站設計

Internet上域名命名的一般規則

⊙域名中使用的字符域名中只能包含字符：26個英文字母、數字0～9和“_”、“-”、“～”等。⊙域名中字符的組合規則域名中字符的組合規則是：在域名中不區分英文字母的大小寫，對于一個域名的長度是有一定限制的。3、網站設計

Internet上域名命名的一般規則583、網站設計

如何選擇好的域名⊙避免難以記憶和過長的域名因為較長的單詞容易拼錯。⊙域名中盡量使用常用字符盡量不要在域名中使用“_”、“-”、“～”這樣的特殊字符。⊙域名應該朗朗上口，便于記憶域名的命名應該朗朗上口且讓人過目不忘3、網站設計

如何選擇好的域名593、網站設計

申請域名的注意事項

⊙委托公司代辦注冊⊙“先申請先注冊”的原則因為CNNIC對域名注冊采用“先申請先注冊”的原則，沒有預留服務。3、網站設計

申請域名的注意事項603、網站設計

申請域名的形式

⊙收費域名提供收費域名的ISP很多。下圖所示的是“中國互聯”網站的收費域名申請頁面。域名申請成功后，有的ISP還附加提供一定的主頁空間，可以直接上傳發布的網頁。采用收費域名的最大優點是服務有保證，功能比較齊全。

3、網站設計

申請域名的形式613、網站設計圖“中國互聯”網站收費域名申請頁面3、網站設計圖“中國互聯”網站收費域名申請頁面623、網站設計3、網站設計633、網站設計3、網站設計643、網站設計圖查詢域名3、網站設計圖查詢域名653、網站設計

網站空間

網站是建立在網絡服務器上的一組Web文件，它們需要占據一定的硬盤空間。這就是一個網站所需的網站空間。一個網站需要多少空間呢？這是網站建設者十分關心的問題。以企業網站為例，一個企業網站的基本網頁HTML文件和網頁圖片需要1～3MB的空間，產品照片和各種介紹性頁面的大小一般為10MB左右.3、網站設計

網站空間663、網站設計

申請個人網站空間的注意事項個人網站的頁面中不能有黑客、色情、反動、敏感及違反現行國家法律的內容；如果個人網站空間服務商要求用戶將一些代碼添加到用戶的個人主頁源代碼中，請務必添加進去，否則服務商會隨時停止對用戶的服務；3、網站設計

申請個人網站空間的注意事項673、網站設計

申請個人網站空間的注意事項

一般用戶不要在某個站點同時申請兩個以上的個人空間，因為系統可能隨時會刪除其中一個站點；頁面制作好后，請盡快上傳并及時更新，有些系統會定時刪除超過規定時間未上傳或更新主頁者的賬號。3、網站設計

申請個人網站空間的注意事項683、網站設計

申請個人網站空間的方法

申請免費主頁空間的過程一般大同小異，下圖所示的是“雅虎地球村”免費主頁空間申請頁面，申請成功后顯示如圖所示的頁面。

3、網站設計

申請個人網站空間的方法693、網站設計圖

“雅虎地球村”免費主頁空間申請頁面

圖“雅虎地球村”主頁申請成功的頁面

3、網站設計圖“雅虎地球村”免費主頁空間申請頁面圖703、網站設計

申請計數器

“雅虎地球村”網站上提供免費的計數器插件，只要用戶已經在“雅虎地球村”網站申請了主頁空間，登錄后即可在如圖所示的頁面中申請計數器。3、網站設計

申請計數器713、網站設計圖申請計數器3、網站設計圖申請計數器723、網站設計

申請留言板

同樣，“雅虎地球村”網站上也為用戶提供免費的留言板插件，申請方法與計數器類似，如圖所示。3、網站設計

申請留言板733、網站設計圖在“雅虎地球村”中申請留言板3、網站設計圖在“雅虎地球村”中申請留言板743、網站設計1．如何在網上申請域名和個人主頁空間？請上網嘗試申請免費的域名和空間。2．如何申請計數器、留言板？請上網嘗試申請免費的計數器和留言板。3、網站設計1．如何在網上申請域名和個人主頁空間？請上網嘗試75《網頁制作基礎教程（DreamweaverCS3）》預備知識《網頁制作基礎教程（DreamweaverCS3）》預備知76學習的主要內容

網頁文件

網頁一般又稱HTML文件；通常看到的網頁，大都以HTM或HTML后綴結尾的文件；另外還有以CGI、ASP、PHP和JSP后綴結尾的。學習的主要內容

網頁文件77學習的主要內容

網頁分類

根據生成方式，網頁大致可以分為靜態網頁和動態網頁兩種。

靜態網頁

是網站建設初期經常采用的一種形式；網站建設者把內容設計成靜態頁面，訪問者只能被動地瀏覽網站建設者提供的網頁內容。學習的主要內容

網頁分類78學習的主要內容

靜態網頁的特點

網頁內容不會發生變化，除非網頁設計者修改了網頁的內容。不能實現和瀏覽網頁的用戶之間的交互。學習的主要內容

靜態網頁的特點79學習的主要內容

動態網頁

網絡技術日新月異，許多網頁文件的擴展名不再是.htm，還有.php、.asp等，這些都是采用動態頁技術制作出來的。

特點

動態網頁以數據庫技術為基礎，可以大大降低網站維護的工作量。采用動態網頁技術的網站可以實現更多的功能，如用戶注冊、用戶登錄、搜索查詢、用戶管理、訂單管理等。學習的主要內容

動態網頁80學習的主要內容1、html標記語言2、制作網頁的工具

MicrosoftFrontPageNetscape編輯器

Dreamweaver學習的主要內容1、html標記語言81網絡與網站設計基礎知識1、Internet概述2、網頁設計概述3、網站設計概述網絡與網站設計基礎知識1、Internet概述821、Internet概述

Internet

即國際計算機互聯網，在中國也稱“因特網”或“萬維網”，是由符合TCP/IP等網絡協議的網絡組成的互聯網。它是目前全世界最大的網絡，包含著豐富多彩的信息，并提供方便快捷的服務。它縮短了人們之間的距離。1、Internet概述

Internet831、Internet概述通過Internet，用戶可以與接入Internet的任何一臺計算機進行交流，如發郵件、聊天、通話等。在這一節中，主要介紹Internet的工作原理、Internet發展簡史及其提供的主要服務等基礎知識，讓用戶對Internet有個大致的了解。1、Internet概述通過Internet，用戶841、Internet概述

Internet的工作原理Internet是一種全球范圍的基于分組交換原理和TCP/IP的計算機網絡。它將信息進行分組（分割為許多小數據包）后以數據包為單位進行傳輸。Internet在進行信息傳輸時要完成的任務主要有兩項：一是正確分割源文件，以及在目的地將同一源文件的數據包準確地重組起來；二是將數據包準確地送往目的地。1、Internet概述

Internet的工作原理851、Internet概述

Internet發展簡史

Internet起源于20世紀60年代。1968年，基于分組交換原理的計算機網絡——ARPANET。1983年，TCP/IP協議的建立，使計算機通信有了統一的標準。這是計算機網絡發展史上的一個里程碑，網絡從此進入高速發展的時代。1、Internet概述

Internet發展簡史861、Internet概述

Internet提供的主要服務

1．電子郵件2．文件的下載和上傳3．信息查詢4．文件傳輸5．網上聊天6．BBS電子公告欄7．網上游戲8．個人主頁空間9．電子商務1、Internet概述

Internet提供的主要服務871、Internet概述

IP地址和域名

1、IP地址

在Internet上，每一個節點都依靠唯一的IP地址互相區分和相互聯系。IP地址共占用32位，一般以4個十進制數字表示，每個數字之間用小圓點（.）隔開，例如，“05”，這種記錄方法稱為“點—數”記號法。通常用IP地址標識一個網絡和與網絡連接的一臺主機。1、Internet概述

IP地址和域名881、Internet概述

IP地址和域名

2、域名

與網絡上的數字型IP地址相對應的字符型地址，就被稱為域名。TCP/IP中包含著一個域名服務（DomainNameService，DNS）。DNS通過一個名為“解析”的過程將域名轉換為IP地址，或者將IP地址轉換為域名。名字比用點分隔的十進制數IP地址更好記些。既然計算機仍然使用IP地址，那么就必須有一種方法在二者之間進行轉換。DNS使用查找表格的方法來將二者的值關聯起來。

1、Internet概述

IP地址和域名891、Internet概述

IP地址和域名

2、域名

下表1-1中說明了部分組織的域命名約定，和部分國家的域命名約定。1、Internet概述

IP地址和域名901、Internet概述組

織

類

型域命名約定國

家域命名約定國

家域命名約定商業com澳大利亞au莫桑比克mz教育edu加拿大ca尼日利亞ng政府gov中國cn波蘭po國際條約組織int芬蘭fi卡塔爾qa網絡提供商net法國fr薩摩亞群島ws非營利性組織org匈牙利hu瑞典se意大利it阿拉伯聯合酋長國ae日本jp英國uk約旦jo美國us1、Internet概述組織類型域命名約定國家911、Internet概述1、Internet概述921、Internet概述1、Internet概述931、Internet概述1、上網了解Internet提供的服務，并進行具體實現。2、瀏覽熟悉網站，根據域名區分網站屬于的類型。1、Internet概述1、上網了解Internet提供的服942、網頁的設計

網頁的基本元素

常見的網頁元素包括文本、圖片、超鏈接、表格、導航欄、動畫和交互表單。

2、網頁的設計

網頁的基本元素952、網頁的設計

網頁的基本元素

1．文本2．圖片和動畫3．聲音和視頻4．超鏈接5．導航欄6．表格7．表單8．其他常見元素2、網頁的設計

網頁的基本元素962、網頁的設計

網頁布局網頁是否精彩，能否吸引瀏覽者，除了色彩的搭配、文字的變化、圖片的處理等因素外，還有一個非常重要的因素—網頁的布局。

2、網頁的設計

網頁布局972、網頁的設計

網頁布局的基本概念對于初學者，最好應先了解網頁布局的基本概念。

頁面尺寸分辨率為800×600：頁面的顯示尺寸為：780×428個象素；分辨率為1024×768：頁面的顯示尺寸為：1007×600個象素。2、網頁的設計

網頁布局的基本概念982、網頁的設計

網頁布局

⊙整體造型這里是指頁面的整體形象，這種形象應該是一個整體，圖形與文本的結合應該是層疊有序的。雖然顯示器和瀏覽器都是矩形的，但對于頁面的造型，設計者可以充分運用自然界中的各種形狀及它們的組合，如矩形、圓形、三角形、菱形等。

2、網頁的設計

網頁布局992、網頁的設計

網頁布局的一般步驟

（1）構思根據網站內容的整體風格，設計版面布局。不要講究細節，只要有一個輪廓。（2）初步填充內容這一步就要把一些主要的內容放到網頁中，例如，網站的標志、廣告條、菜單、導航條、計數器等。（3）細化在這一步，設計者可以利用網頁編輯工具把草案做成一個簡略的網頁，當然，對每一種元素所占的比例也要有一個詳細的數字，以便以后修改。2、網頁的設計

網頁布局的一般步驟1002、網頁的設計

網頁布局的原則在構思和設計的過程中，設計者還必須要掌握以下幾項原則。（1）平衡性（2）對稱性（3）疏密度2、網頁的設計

網頁布局的原則1012、網頁的設計

網頁布局類型網頁布局大致可分為“國”字型、拐角型、標題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型等。

2、網頁的設計

網頁布局類型1022、網頁的設計2、網頁的設計1032、網頁的設計2、網頁的設計1042、網頁的設計

標題正文型布局

標題正文型布局的最上面是標題或類似的一些東西，下面一般是正文，例如，一些文章頁面或注冊頁面等就屬于這種類型。

左右框架型布局

采用左右框架型布局的網頁分為左、右兩部分，一般左面是導航鏈接，有時最上面會有一個小的標題或標志，右面是正文。大部分大型論壇和網頁教程都使用這種布局，有一些個人網站和企業網站也喜歡采用這種布局。2、網頁的設計

標題正文型布局1052、網頁的設計

上下框架型布局上下框架型布局與左右框架型布局類似，區別僅僅在于這種布局分為上、下兩部分。

綜合框架型布局綜合框架型布局是左右框架型布局與上下框架型布局的結合，相對較復雜，類似于拐角型布局，只是采用了框架結構。

封面型布局封面型布局一般出現在一些網站的首頁，由一些精美的平面設計結合一些小的動畫組成，在頁面中放上幾個簡單的鏈接或者僅僅是一個“進入”的鏈接，甚至直接在圖片上加上鏈接而沒有任何提示。這種布局需要精心設計，能給人帶來賞心悅目的感覺。2、網頁的設計

上下框架型布局1062、網頁的設計

配色原則

網站給人的第一印象來自于視覺，因此，確定網站的色彩相當重要。不同的色彩搭配產生不同的效果，從而使網站給人以不同的視覺效果，吸引訪問者的注意力。

2、網頁的設計

配色原則1072、網頁的設計1．色彩的形成簡單地說，色彩是一種視覺，是光作用于眼睛的結果。紅、綠、藍色的光被稱為三原色光。2．色彩的特征色彩的基本特征主要有色調、亮度和飽和度三個。色調表現色彩的種類，亮度表現色彩的明亮程度，飽和度表現色彩的鮮艷程度。2、網頁的設計1．色彩的形成1082、網頁的設計

配色原則

3．色彩的心理感覺自然界的各種色彩會在人的心中留下不同的印象，產生不同的心理感覺，例如：紅色是一種激奮的色彩，具有刺激效果，能使人產生沖動、憤怒、熱情、活力的感覺；

2、網頁的設計

配色原則1092、網頁的設計

配色原則

4．色彩的分類按照色彩對人們心理的影響可以進行以下分類。

暖色系：紅、橙、橙黃、黃等色彩讓人覺得溫馨、和煦、熱情。

中性系：黃綠、綠等色彩讓人覺得舒適、和諧。

冷色系：青綠、藍綠、藍等色彩讓人覺得寧靜、清涼、高雅。

2、網頁的設計

配色原則1102、網頁的設計

例子設計出售冷食的虛擬店面，應使用消極而沉靜的顏色，使人從心理上感覺涼爽一些。如果要制作一個休閑主題的個人站點，不妨將網站色彩設計為天藍色，如以海水為背景，再搭配一些魚兒的效果會更好。2、網頁的設計

例子1112、網頁的設計

配色原則

5．色彩的選擇和搭配

在制作網站的時候，色彩的選擇和搭配非常重要。一個網站格調的確定，往往取決于色彩的選擇與搭配是否適當。2、網頁的設計

配色原則1122、網頁的設計

網頁布局的常用技術

（1）CSS（層疊樣式表）布局CSS對于初學者來說顯得有點復雜，但它的確是一種好的布局方法。（2）表格布局優勢：能對不同對象加以處理，而又不用擔心不同對象之間的影響。缺點：當設計者使用了過多的表格時，會影響頁面的下載速度。

2、網頁的設計

網頁布局的常用技術1132、網頁的設計（3）框架布局由于框架技術的兼容性問題，框架結構的頁面不太受歡迎。但從布局上考慮，框架結構不失為一個好的布局方法。（4）div+css布局div+css是進階段的，分布模式很隨意。

2、網頁的設計（3）框架布局1142、網頁的設計1、上網查看不同的網頁，分析其網頁的組成元素有哪些。2、打開一些您熟悉的網站，瀏覽網頁，分析其屬于哪種布局和色彩搭配。3、根據自己的經驗和體會，談談對網頁配色的看法。2、網頁的設計1、上網查看不同的網頁，分析其網頁的組成元素有1153、網站設計

網站設計的主要任務

⊙網站架構設計；⊙以瀏覽器為客戶端的Web應用程序開發；⊙系統測試及網站發布。3、網站設計

網站設計的主要任務1163、網站設計

確定網站的類型

門戶網站門戶網站（PortalSite）集合了眾多內容，提供多樣服務。比較知名的中文門戶網站有三類：一類是像新浪、搜狐、網易這樣完全由國內網絡公司經營的網站，網站內容除了搜索引擎外，還包括新聞、娛樂、游戲、文化、體育、健康、科技、財經、教育等若干版塊，以及網上短信、個人主頁空間、免費郵箱等服務項目；3、網站設計

確定網站的類型1173、網站設計

門戶網站第二類是境外投資的網站，如中文雅虎、美國在線等，網站內容以新聞和娛樂為主；第三類是國內傳統媒體辦的網站，以人民網、新華網、央視國際為代表，以提供新聞和時事評論為主。3、網站設計

門戶網站1183、網站設計

普及型網站

此類網站包括企業網站、大學網站、政府網站及數量眾多的個人網站。

3、網站設計

普及型網站1193、網站設計

電子商務類網站

電子商務類網站分為B2B（商家對商家）和B2C（商家對個人客戶）兩種，按照交易過程可分為商品檢索、商品采購、訂單支付三個階段。

3、網站設計

電子商務類網站1203、網站設計

電子商務類網站

具有如下功能：商品發布；商品選購；購物車；在線交易功能；商品交接、資金結算功能。3、網站設計

電子商務類網站1213、網站設計

媒體信息服務類網站媒體信息服務類網站是報社、雜志社、廣播電臺、電視臺等傳統媒體為了樹立自己的網上形象，方便服務對象而建立的網站，主要功能包括：信息發布、電子出版、客戶在線咨詢、網站管理。

辦公事務管理網站辦公事務管理網站是企業事業單位為了實現辦公自動化而建立的內部網站，包括以下主要功能模塊：辦公事務管理、人力資源管理、財務資產管理和網站管理。

商務管理網站商務管理網站是企業內部為了進行廣告及商品管理、客戶管理、合同管理、營銷管理等目的而建立的網上辦公平臺。3、網站設計

媒體信息服務類網站1223、網站設計

網站主題的確定

網站使用的主要題材有：網上求職、網上聊天/ICQ、網上社區/討論/郵件列表、計算機技術、網頁/網站開發、娛樂網站、旅行、參考/資訊、家庭/教育、生活/時尚等。在選擇網站題材的時候要注意以下3點。○主題小而內容精○題材最好是自己擅長的內容3、網站設計

網站主題的確定1233、網站設計

網站名稱的確定

網站名稱也是網站設計的一部分，而且是很關鍵的一個要素。例如，“電腦學習室”和“電腦之家”相比，后者更簡練些；“迷笛樂園”和“MIDI樂園”相比，后者含義更清晰。選擇網站的名稱時要注意以下3點。⊙名稱要端正⊙名稱要易記⊙名稱要有特色3、網站設計

網站名稱的確定1243、網站設計

CI（CorporateIdentity，企業形象）

是指通過強化視覺效果的手段來加深用戶對企業形象的印象。例如，可口可樂公司擁有全球統一的標志、色彩和產品包裝，給人們的印象極為深刻。3、網站設計

CI（CorporateIdentity，企1253、網站設計

設計網站的標志（Logo）

首先設計者需要設計一個網站的標志（Logo）。如同商標一樣，Logo是站點特色和內涵的集中體現。Logo可以是中文、英文字母、符號或圖案，也可以是動物或人物等。例如，新浪網用字母sina加眼睛作為Logo，體現網站的敏銳和動感的特色。3、網站設計

設計網站的標志（Logo）1263、網站設計

設計網站的標準色彩

“標準色彩”是指能體現網站形象和延伸內涵的色彩。例如，IBM的深藍色，肯德基的紅色條紋，Windows的紅、藍、黃、綠色塊，都使瀏覽者覺得很貼切，很和諧。一個網站的標準色彩不宜超過3種。3、網站設計

設計網站的標準色彩1273、網站設計

設計網站的標準字體

標準字體是指用于Logo、標題和主菜單的特有字體。一般網頁默認的字體是宋體。可以使用粗仿宋體，可以用廣告體，可以用手寫體等。

3、網站設計

設計網站的標準字體1283、網站設計

設計網站的宣傳標語

網站的宣傳標語也可以說是網站的精神、網站的目標，最好用一句話甚至一個詞來高度概括。它類似于實際生活中的廣告語句，例如，雀巢的“味道好極了”，Intel的“給你一顆奔騰的心”，給人們留下的印象都極為深刻。3、網站設計

設計網站的宣傳標語1293、網站設計

設計網站的欄目和版塊

網站欄目的實質是一個網站的大綱索引，索引應該將網站的主體明確顯示出來。例如，網易站點分新聞、體育、財經、娛樂、教育等版塊，每個版塊下面有各自的主欄目。3、網站設計

設計網站的欄目和版塊1303、網站設計

申請域名和站點空間

在創建一個Web站點之前，必須先申請域名和站點空間。只有申請了域名和站點空間后，用戶制作的網頁才能發布到Internet上，供他人瀏覽。

3、網站設計

申請域名和站點空間1313、網站設計

申請域名和站點空間