緒論 網(wǎng)頁設計基礎簡介 教學內(nèi)容1） Internet 先驅(qū)J.C.R Licklider ：一位擁有心理學博士學位的心理學教授，在1966年被請到美國國防高級研究計劃局來領(lǐng)導

緒論 網(wǎng)頁設計基礎簡介 教學內(nèi)容

1） Internet 先驅(qū)

J.C.R Licklider ：一位擁有心理學博士學位的心理學教授，在1966年被請到美國國防高級研究計劃局來領(lǐng)導指令和控制技術(shù)的研究工作。

Larry Roberts：被尊稱為“阿帕網(wǎng)之父”，從1966年開始支出阿帕網(wǎng)的技術(shù)工作。

Tim Berners-Lee ：“萬維網(wǎng)之父”，開發(fā)了第一個所見即所得的超文本瀏覽器/編輯器World Wide Web ，通過一種超文本方式，把網(wǎng)絡上不同計算機內(nèi)的信息有機地結(jié)合在一起，并且可以通過超文本傳輸協(xié)議（HTTP ）從一臺Web 服務器轉(zhuǎn)到另一臺Web 服務器上檢索信息。 什么是超文本？

超文本（Hypertext ）基本上是一般的文本文件，只是在文本文件中另含有鏈接（Link ）及其他文件的引用（Pointer ），我們只要單擊這些引用，即可鏈接其他相關(guān)文件。

2） Web 的歷史

ML ：Markup Language，標記語言

什么是標記語言？

特指用一系列約定好的標記來對電子文檔進行標記，來實現(xiàn)對電子文檔的語義、結(jié)構(gòu)、格式的定義。這些標記必須能夠和容易的和內(nèi)容相區(qū)分，易于識別。標記語言必須定義什么樣的標記是允許的，什么樣的標記是必須的，標記是如何與文檔的內(nèi)容向區(qū)分的，以及標記的含義是什么。 GML ：①Generalized Markup Language，通用標記語言; ②Geography Markup Language，地理標記語言

GML 標準化后出現(xiàn)了SGML ：Standard Generalized Markup Language，標準通用標記語言

SMIL ：Synchronized Multimedia Integration Language，同步多媒體集成語言 CML : Chemical Markup Language，化學標記語言

SVG ：Scalable Vector Graphics，可伸縮矢量圖形

OEB ：Open eBook，開放式電子圖書

3） Web 1.0 vs. Web 2.0

什么是Web 2.0？

Web 2.0并不是一個具體的事物，而是一個階段，是促成這個階段的各種技術(shù)和相關(guān)的產(chǎn)品服務的一個總稱，與之相對應的是靜態(tài)HTML 的WWW 時代，可以稱之為Web 1.0?？偨Y(jié)起來，Web 2.0的大概特征是：與前幾年的網(wǎng)絡應用相比，用戶從內(nèi)容的消費者變成了內(nèi)容的創(chuàng)造者；用戶從聚集在門戶網(wǎng)站和BBS 等公共空間，到分散至個體網(wǎng)絡日志（Blog ）的包產(chǎn)到戶和全民織網(wǎng)。信息正在日益呈現(xiàn)離散的趨勢，分散的“信息島”與曾經(jīng)一統(tǒng)天下的門戶網(wǎng)站也形成了分庭抗禮之勢。

我們無法說，Web 2.0是什么，但是可以說，那些是Web 2.0。

4） Web 2.0

AJAX ：AJAX 不是一個技術(shù)，它實際上是幾種技術(shù)，每種技術(shù)都有其獨特這處，合在一起就成了一個功能強大的新技術(shù)，這種新技術(shù)可以使得用戶提交數(shù)據(jù)后頁面本身不刷新，帶來更好的用戶體驗。

RSS ：(Rich Site Summary)是一種用于共享新聞和其他Web 內(nèi)容的數(shù)據(jù)交換規(guī)范。讀者可以通過RSS 訂閱一個Blog ，確知該Blog 最近的更新。

IM ：即時通訊工具，QQ 、MSN 、Skype 等均屬此類。

Bookmark ：也稱Tag 或Tagging ，書簽、標簽之意。它可以讓你把喜愛的網(wǎng)站隨時加入自己的網(wǎng)絡書簽中；你可以用多個關(guān)鍵詞而不是分類來標示和整理你的書簽，并與其他人共享。 Blog ：網(wǎng)絡日志，個人或群體以時間順序所作的一種記錄，且不斷更新。Blog 之間的交流主要是通過反向引用（TrackBack ）和留言/評論（Comment ）的方式來進行的。Blog 的作者（Blogger ），既是這個Blog 的創(chuàng)作人，也是其檔案管理人。

Podcasting ：播客，它是數(shù)字廣播技術(shù)的一種，出現(xiàn)初期借助一個叫iPodder 的軟件與一些便攜播放器相結(jié)合而實現(xiàn)。Podcasting 錄制的是網(wǎng)絡廣播或類似的網(wǎng)絡聲訊節(jié)目，網(wǎng)友可將網(wǎng)上的廣播節(jié)目下載到自己的iPod 、MP3播放器或其它便攜式數(shù)碼聲訊播放器中隨身收聽，不必端坐電腦前，也不必實時收聽，享受隨時隨地的自由。更有意義的是，你還可以自己制作聲音節(jié)目，并將其上傳到網(wǎng)上與廣大網(wǎng)友分享。

Wiki ：Wiki 一詞來源于夏威夷語的“wee kee wee kee”，原本是“快點”的意思，它是網(wǎng)上免費的百科全書，它依靠眾多投稿人來增加和修改其條目。想像一下：一組人坐在一塊白板面前，任何人都可以在上面添加想法，做出修改，甚至擦掉一點東西，你就可以對Wiki 有了個大致的印象。

Witkey ：人的知識、智慧、經(jīng)驗、技能通過互聯(lián)網(wǎng)轉(zhuǎn)換成實際收益的互聯(lián)網(wǎng)新模式。主要應用包括解決科學、技術(shù)、工作、生活、學習等領(lǐng)域的問題。

P2P ：P2P 直接將人們聯(lián)系起來，讓人們通過互聯(lián)網(wǎng)直接交互。P2P 使得網(wǎng)絡上的溝通變得容易、更直接共享和交互，真正地消除中間商。P2P 就是人可以直接連接到其他用戶的計算機、交換文件，而不是像過去那樣連接到服務器去瀏覽與下載。P2P 另一個重要特點是改變互聯(lián)網(wǎng)現(xiàn)在的以大網(wǎng)站為中心的狀態(tài)、重返" 非中心化" ，并把權(quán)力交還給用戶。平常使用eMule 、BitTorrent 等均屬于此類。

SNS ：Social Networking Software/Service/Sites/Systems的縮寫，即社會交往軟件（或服務、網(wǎng)站、系統(tǒng)）。目前，新一代的SNS 技術(shù)使社會交往超越了單純的網(wǎng)絡交友，而逐步成為了一種新的網(wǎng)絡生存方式，SNS 的邏輯是通過老朋友，認識新朋友，不斷擴展自己的人脈，使自己獲得更廣闊的發(fā)展空間。如MySpace 。

5） Web Standards

Web 2.0最大的特點之一是用戶參與，一個網(wǎng)站如何吸引最多的用戶，最基本的條件之一是不管用戶使用什么樣的瀏覽器，網(wǎng)站都應該是可以正常瀏覽的，這時候Web 標準就應運而生了。 Web 標準的一個最基本理念就是對網(wǎng)頁進行分層。

6） What we will learn

帶create 的說明該項可以作為一個單獨的文件存在，比如CSS 可以放在擴展名為.css 的文件中。

為什么不講工具的使用？

7） 編輯器

Microsoft Expression Web Designer是2007年微軟剛剛推出的取代FrontPage 的網(wǎng)頁設計軟件，使用這個軟件的目的是為了和以后學習ASP .NET時保持一致性。

選擇Macromedia Dreamweaver 8.02是因為這款軟件太經(jīng)典了，在網(wǎng)頁設計領(lǐng)域占有非常重要的地位。

8） 瀏覽器

測試網(wǎng)頁在多種不同內(nèi)核的瀏覽器中的兼容性

9） 驗證工具

驗證網(wǎng)頁是否符合XHTML 和CSS 標準。

第一章 Web 基礎與概述 教學內(nèi)容

1） Web

PPT1——

1989年8月6日，Tim Bernes-Lee 發(fā)布了World Wide Web 。最初，Tim Berners-Lee 曾經(jīng)考慮把World Wide Web叫做“信息挖掘(Mining of Information, MOI)”，但是他覺得這個名字有點過于自負，所以舍棄了這個名字。

交叉引用的萬維網(wǎng)：35年以前，美國心理學家米爾格倫(Stanley Milgram)在《今日心理學》雜志上提出“六度分割（Six Degrees of Separation ）”的理論：任何兩個陌生人都可以通過“親友的親友”建立聯(lián)系，而這兩個人之間的親友數(shù)量大約是5；最新的實驗結(jié)果來自哥倫比亞大學社會學系的瓦茨（Duncan Watts）領(lǐng)導的研究小組。《科學》雜志發(fā)表了他們關(guān)于在世界范圍內(nèi)大規(guī)模檢驗“六度分割”假說的論文。瓦茨的研究結(jié)果表明：從一個網(wǎng)頁達到任何另外一個平均只需點擊19次。

超鏈接：是當今世界萬維網(wǎng)的基礎，是網(wǎng)頁制作的基礎技術(shù)，是有效實現(xiàn)信息資源共享的關(guān)鍵。 PPT2——

uniform 有制服的意思，如果大家都穿上了制服，那么就可以說大家的著裝是“統(tǒng)一的”，URL 中的uniform 即指統(tǒng)一。

詞匯

既然是8位二進制數(shù)，那么每個數(shù)的最大值只能是255。

4個點分的十進制數(shù)轉(zhuǎn)換為二進制表示可以代表更多的含義，如網(wǎng)絡號、主機號等，這是《計算機網(wǎng)絡》中藥講授的內(nèi)容，此處不再深入。

PPT7——

端口就像管道一樣，服務器端程序需要使用不同的端口來響應客戶端程序的請求，這樣不致引起混亂。

常用服務的默認端口應該能夠記住，但這是《計算機網(wǎng)絡》中要求的內(nèi)容，此處只作簡單介紹。 3） 域名與

PPT8——

江蘇的同學的身份證號碼前三位是什么？320！在居民身份證這個系統(tǒng)中，320代表的就是江蘇，但是你很可能知道某位同學是江蘇人，但是不知道他/她的身份證號碼前三位是320。這是因為名稱（江蘇）比代碼（320）更好記。域名和IP 地址的關(guān)系也和這個類似，域名更容易記憶。比如中國礦業(yè)大學的域名為cumt.edu.cn ，管理學院的域名為sm.cumt.edu.cn 。 域名的分類——

①類別頂級域名：由于Internet 最初是在美國發(fā)源的，當時人們按用途把它們分為幾個大類，它們分別以不同的后綴結(jié)尾：

URL

這類域名可以稱為類別域名，其中，.edu, .gov 和.mil 一般只為美國專用，而.com, .net 和.org 在全世界范圍內(nèi)通用。

②地理頂級域名:隨著越來越多的國家和地區(qū)接入Internet ，出現(xiàn)了地理頂級域名，共有243個國家和地區(qū)的代碼，如.cn 代表中國，.hk, .mo和.tw 分別代表中國的香港、澳門和臺灣地區(qū)。

能不能在地理頂級域名中實現(xiàn)和類別頂級域名中類似的按用途分類呢？答案是肯定的，地理頂級域名中分設了不同意義的二級域名，主要包括類別域和行政區(qū)域。cumt.edu.cn 中的edu 就是cn 頂級域名下的二級類別域名，xz.js.cn 中的js 則是cn 頂級域名下的二級行政區(qū)域名。2002年12月開始，cn 頂級域名下的二級域名開放注冊，受到了中國國內(nèi)網(wǎng)站的青睞，這樣，cn 頂級域名下的二級域名也就不再局限為類別域和行政域了。

③新頂級域名:根據(jù)Internet 發(fā)展的需要，從2001年開始使用的新頂級域名有7

個：.aero, .biz, .coop, .info, .museum, .name, .pro

PPT9——

我們可以把整個域名系統(tǒng)看作是一棵倒立的樹，對于每個域名來說，可以把它們看作是這棵樹上的一個分支。

PPT10——

從資源管理器，我們可以很清楚地看到，文件系統(tǒng)(file system)也可以看作一棵樹，事實上，這個控件正是Treeview 。

PPT11——

雖然域名容易記憶，但是它不能標識主機的位置，比如單從sina.com.cn 這個域名來看只能說這臺主機可能在中國大陸；路由器等網(wǎng)絡設備需要使用IP 地址進行運算（轉(zhuǎn)化為二進制后運算）以確定該主機的具體位置，這個過程就是所謂的域名解析。

在通過局域網(wǎng)接入Internet 時，有時我們需要手動設置訪問Internet 的DNS 服務器地址，如下圖所示。

如果不填寫如上圖所示的

DNS 服務器地址，那么通過域名是無法訪問到網(wǎng)站的。

在瀏覽器的地址欄中，輸入dangdang.com.cn 和211.100.16.198都可以正確訪問當當網(wǎng)上書城的網(wǎng)站。但是，由于一些Web 服務器的特殊設置（如Web 服務器綁定了多個IP ），使用IP 地址并不一定能夠正常訪問網(wǎng)站。

怎樣從一個域名得到一臺主機的IP 呢？介紹兩個常用的DOS 下的網(wǎng)絡命令。

①ping ：用于驗證與遠程計算機的連接。

②tracert ：用于路由診斷。

圖中加方框的字符串即為域名dangdang.com.cn 對應的IP 地址。

PPT12——

該圖解釋了域名和IP 地址的層次關(guān)系。對于一個域名或IP 地址來說，按照從右到左的順序，該主機的位置越來越具體。

PPT13——

和域名注冊相關(guān)的兩個英文單詞：

① registrar 注冊機構(gòu)

② registrant 注冊人

它們的關(guān)系和employer 和employee 類似。

有人總結(jié)出來域名選擇A to F：A cronym （盡量使用縮寫）, B enefit （足夠吸引人以帶來利益）, C haracter （盡量只使用字母）, D otcom （Dotcom 是最廣泛使用的域名）, E xtension （注冊擴展域名以防惡意注冊）, F ree （盡量不要使用免費域名）。

域名相關(guān)的三個機構(gòu)：

①國際互聯(lián)網(wǎng)名稱和地址分配組織(The Internet Corporation for Assigned Names and Numbers, ICANN)：http://www.icann.org

②國際互聯(lián)網(wǎng)絡信息中心(The Internet’s Network Information Center,

InterNIC) ：http://www.internic.net

③中國互聯(lián)網(wǎng)絡信息中心(China Internet Network Information Center, CNNIC)：http://www.cnnic.net

在UNIX 系統(tǒng)中，有一個命令叫做whois ，可以用它來查詢域名的域注冊信息，Windows 用戶可以使用InterNIC 和CNNIC 提供的在線whois 服務中查詢：

6.cn （六間房視頻）和g.cn 可以說是世界上最短的域名。

對于這種太長的域名，事實上沒有任何好處，只能把它加入收藏夾以便下次訪問。

PPT14——

通常直接域名只能訪問到一個網(wǎng)站的首頁。

最常見的協(xié)議還有FTP （File Transfer Protocol），即文件傳輸協(xié)議，DOS 下FTP 的使用方法——幾個主要的命令ftp , open , ls , get , set 。

協(xié)議的英文是protocol ，這里使用的是scheme ，“架構(gòu)”之意，因為像

maito:cumtzzp@163.com中的mailto 不是一個具體的協(xié)議（和郵件相關(guān)的協(xié)議有POP3和SMTP ），所以用scheme 包含的范圍更廣一些。

4） 靜態(tài)頁面與動態(tài)頁面