資源簡介

(共45張PPT)
第1課
信息之網--接入互聯網
超文本、超鏈接與HTTP
（清華大學版）七年級
上
1
核心素養目標
3
新知講解
5
拓展延伸
7
板書設計
2
新知導入
4
課堂練習
6
課堂總結
課后作業
8
單元導入
本單元你將學習:
萬維網中的網頁是如何互相關聯的
訪問萬維網客戶端的模式有哪些
網絡瀏覽方式經歷哪些變化
如何設計自由行的旅行計劃書
01
單元導入
01
萬維網( world wide web, WWW. 3W或Web)是一種基于互聯網的信息服務系統，由數不清的文檔通過超鏈接連接在一起。萬維網由歐洲核子研究中心( CERN)的高能物理學家率先提出并實現，在經歷30多年的發展之后，現在已經成為一個規模非常龐大的信息海洋，是互聯網最為重要的一種應用。人們可以通過瀏覽器或專用客戶端軟件實現信息的查找、瀏覽與共享。
學習熱身
單元導入
01
網站名稱 主 要 功 能
新浪 提供新聞、娛樂、體育、財經等多種
百度 幫助用戶快速找到互聯網上的信息
微博 允許用戶創建個人或團體賬戶，發布狀態更新、圖片、視頻等
中國大學MOOC 提供各類在線課程，包括高等教育、職業教育、技能培訓等
知網 提供專業領域的資訊、數據、研究成果等
你知道萬維網中的哪些網站？請將網站名稱與主要功能填寫在下表中。
單元導入
你知道嗎？
01
在使用瀏覽器訪問萬維網時，為什么要輸入“WWW"
1989年，在CERN工作的蒂姆.伯納斯.李開發出了世界上第一個Web服務器與可視化Web瀏覽器。這個Web瀏覽器原先被命名為worldwideweb,但為了與萬維網區分，后來改名為nexus。
2017年4月，美國計算機協會宣布蒂姆.伯納斯.李獲得2016年“圖靈獎”，以獎勵其發明萬維網、瀏覽器與允許網頁擴展的基本協議與算法。
“萬維網之父” 蒂姆.伯納斯.李
02
核心素養目標
信息意識
計算思維
數字化學習與創新
信息社會責任
通過瀏覽器或專用客戶端軟件實現信息的查找、瀏覽與共享，并且認識到網絡的利與弊，合理利用網絡，自主維護網絡安全。
將本課所學知識能力靈活性和個性化創新，比如如何更快定位到自己想要查找的網頁，不斷探索新方法和新思路。
能借助學習接入互聯網超文本、超鏈接與HTTP，明確互聯網各個組成部分，并且快速定位到網頁，進而強化個人計算思維。
能夠對接入互聯網超文本、超鏈接與HTTP等形成初步認識，熟練使用和掌握，幫助我們在使用過程中更便捷。
03
新知導入
本課中你將學習:
超文本如何改變信息瀏覽方式
超鏈接如何設置與使用
HTTP有哪些應用
03
新知導入
萬維網被稱為信息的海洋，它由數不清的網頁組成。我們只要在瀏覽器中輸入網址，就可以找到對應的網頁，還可以從這一張網頁跳轉到其他網頁閱讀想要的信息。這些功能的實現與超文本、超鏈接及超文本傳輸協議( hypertext tansfer protocol, HTTP)有關。
03
新知導入
04
新知講解
一、超文本的出現
隨著人類社會的進步，信息呈現爆炸式增長，人們開始面臨大容量信息檢索與閱讀等方面的挑戰。因為傳統的信息檢索，大多是按照紙質文件上的目錄“按圖索驥”：而在內容閱讀方面，大多是沿著“自上而下”的線性順序展開，如圖3.1.1所示。
圖3.1.1 紙質文本的信息與閱讀
04
新知講解
1.創意的形成
1945年科學家范尼瓦布什( Vannevar Bush)發表了一篇名為《按照我們的想象》(As We May Think)的文章，首次提出可以設計一種按照個人興趣或需求訪問與共享知識的設備。該設想雖然在當時未能實現，但對超文本概念的形成，產生了深遠的影響。
20世紀60年代，計算機技術有了長足發展，網絡也開始隱約顯現。科學家泰得.納爾遜( Ted Nelson)寫了一篇名為《一種復雜、可變與不定型的文檔結構》(4 File Structure for the Complex, the Changing and theIndeterminate )的論文，正 式提出了“超文本”(hypertext) 概念。
04
新知講解
探索
選擇一個你喜歡的網站，并通過鼠標切換不同的網頁，讓自己暢游于文本、音頻、圖像、視頻動畫等多種媒體元素構成的網頁空間，進而感受萬維網的超文本給閱讀所帶來的便利與高效。
04
新知講解
超文本就是運用超鏈接(hyper link )技術，將位于不同空間的信息進行組織關聯，從而形成一種網狀文本， 以方便用戶進行交互式的訪問與檢索，如圖3.1.2所示。
圖3.1.2 超文本
04
新知講解
2.顛覆性的意義
超文本的出現徹底改變了人類對信息檢索與閱讀的傳統方式。瀏覽者可以從文檔的一個地方跳轉到另一個地方，也可以從一個文檔直接跳移到另一個文檔，且可以進行返回操作。它可以讓瀏覽者按照個性化需求進行選擇性閱讀，幫助瀏覽者更加全面、深入地了解信息。
超文本的誕生為萬維網的發明提供了重要的技術支撐。它為網頁信息的組織，網站資源的訪問、瀏覽與下載，提供了一種全新的解決思路，網絡交流也因此變得更加便捷、高效、人性化。
04
新知講解
1989年3月，蒂姆.伯納斯.李向CERN提交了一份名為《信息管理：一個提案》的建議書，主張運用超文本技術將CERN內部的各個實驗室連接起來，從而幫助用戶實現網絡信息的共享與訪問。
你知道嗎？
04
知識拓展
你知道超文本一般應用在哪些地方嗎？
1.網頁
超文本最常見的應用是網頁，用戶可以通過點擊鏈接在不同的網頁之間導航。
2.電子書
許多電子書使用超文本格式，允許讀者在章節之間快速跳轉。
04
知識拓展
你知道超文本一般應用在哪些地方嗎？
3.在線百科全書
如維基百科，利用超文本鏈接提供豐富的信息網絡。
4.超媒體
超文本的擴展，除了文本，包括圖像、視頻等多媒體元素。允許用戶在不同類型的媒體之間進行導航。
04
新知講解
二、超鏈接的設置
超鏈接是一種能夠將不同空間的信息進行組織鏈接的技術。如果信息之間存在某種關聯，那么就可以通過超鏈接技術將它們鏈接起來，進而創建成一個超文本。網站中的網頁及其他資源就是通過超鏈接形成一個超文本。
04
新知講解
1.設置對象
網頁中的文本、圖片與按鈕等都是可以用來設置超鏈接的對象。當鼠標光標懸停在被設置對象上時，光標就會變成“凸”。若單擊超鏈接，則會產生從一張網頁跳到另一張網頁， 或者從當前網頁位置跳轉到指定瀏覽處，甚至是彈出下載文件或打開電子郵箱等效果。
04
新知講解
探索
訪問你熟悉的網站，觀察各種網頁中的超鏈接。單擊網頁中的超鏈接后，都會產生哪些效果
04
新知講解
1. 頁面跳轉：最常見的效果是跳轉到另一個網頁或者是完全不同的網站。
2. 打開新窗口或標簽：有些超鏈接設置為在新窗口或新標簽頁中打開，這樣用戶可以同時查看多個頁面。
3. 下載文件：某些超鏈接可能指向文件，單擊后會開始下載該文件。
4. 錨點跳轉
如果超鏈接指向同一頁面的特定部分，單擊后會滾動到該部分內容。
5. 觸發JavaScript事件
某些超鏈接可能與JavaScript代碼關聯，單擊后會觸發特定的腳本。
單擊網頁中的超鏈接后，都會產生哪些效果
04
新知講解
2.網址與城名的格式
超鏈接技術的基本原理是通過設置指向被關聯信息所在的地址，實現跳轉式的訪問。因此，當單擊萬維網上某個超鏈接時，瀏覽器會自動解析該超鏈接所指向的網址，然后打開目標網頁。
網址是統一資源定位符( uniform resource locator, URL) 的俗稱，由域名及其他部分組成，主要用來指定某個網站上具體網頁或者資源的地址。以萬維網上某張網頁為例，其URL的基本格式如圖3.1.3所示。
04
新知講解
http://www.***pa./c**/co***46/index.htm
使用HTTP進行通信
主機名，即訪問網站名稱
路徑即主機上的目錄或文件地址
要訪問的指定網頁
圖3.1.3 網頁的URL
04
新知講解
為什么要在URL前面加不太常用的“//” 符號呢 2019年 10月，蒂姆.伯納斯.李承認，選用“//” 符號確實有欠考慮，因為沒想到萬維網會這么普及，當初只是想用它告知計算機，接下來輸入的是網址而已。
你知道嗎？
04
新知講解
域名是由一串用“.” 分隔的字符組成，一般可分為網絡名、域名主體與城名后綴三部分，主要用來標識某個網站或者某種網絡服務。主機名中的"w.***pa."便是城名，其中“www” 為網域名，“***pa” 為域名主體，"" 為域名后綴。常見的域名后綴及其含義，如表3.1.1所示。
04
新知講解
域名后綴 含 義
.cn 中國國家域名
.com 最流行的頂級域名之一，代表商業和公司
.net 通常用于網絡組織和服務提供商
.org 通常用于非營利組織和服務提供商
.edu 僅限于教育機構使用，如大學和學院
.gov 僅限于政府機構使用
.int 用于國際組織
表3.1.1 常見的域名后綴及其含義
04
知識拓展
關于域名的管理和安全性。
1.管理
域名的管理包括更新注冊信息、續費、轉移域名等。
域名的所有者可以通過域名注冊商的管理面板進行這些操作。
2. 安全性
DNSSEC：系統安全擴展，旨在保護DNS數據的完整性和真實性。
SSL證書：提供加密連接，確保數據傳輸的安全性。
04
新知講解
三、HTTP的應用
HTTP是TCP/IP協議族中用來傳輸超文本和其他資源的應用協議。它支持客戶端與服務器之間，通過請求與響應模式實現萬維網的相關功能。客戶端又稱為用戶端，是指與服務器相對應，為客戶提供本地服務的程序。瀏覽器便是一種通用的客戶端。
HTTP在設計之初，只用在客戶端瀏覽器與服務器之間傳輸網頁文件和相關資源。但隨著萬維網的發展，HTTP 也開始擴大它的功能，并形成如表3.1.2所示的應用。
04
新知講解
表3.1.2 基于HTTP的應用
應用 具體事例
網頁瀏覽 訪問服務器中網頁，并以多樣化的方式瀏覽和交互網頁
文件傳輸 直接從服務器下載文件
圖片和媒體傳輸 獲取服務器上的多媒體文件，并在客戶端上進行顯示或播放
Web服務 向服務器提交數據，實現注冊、存儲、搜索和計算等各種操作
跨城通信 實現不同網站或服務器之間的通信
RESTful API 使用不同請求方法，創建、讀取、更新和刪除位于服務器中資源
04
新知講解
探索
在瀏覽器地址欄中，輸入一個不含http://的網址并按回車鍵頁面會成功跳轉嗎？這樣的設計意圖是什么？
04
新知講解
在瀏覽器地址欄中輸入一個不含http://的網址并按回車鍵，通常情況下，瀏覽器會自動將其視為一個網址，并在前面加上http://或https://然，后進行跳轉。
設計意圖：
1.要是為了提高用戶體驗，使得用戶在輸入網址時更加方便，不必每次都輸入協議前綴。
2.簡化輸入，用戶不需要記住或輸入協議，減少了輸入的復雜性。
3.提高效率，用戶可以更快速地訪問網站，尤其是在移動設備上，輸入完整的 URL 可能比較麻煩。
03
知識拓展
關于HTTP/1.1與HTTP/2的區別
1. 傳輸方式
HTTP/1.1：采用文本格式，使用明文傳輸請求和響應。每個請求和響應都是獨立的，通常每個請求都需要建立一個新的TCP連接，盡管可以通過持久連接（Keep-Alive）來減少連接的建立次數。
HTTP/2：采用二進制格式，使用多路復用（Multiplexing）技術，允許在一個TCP連接上并行發送多個請求和響應，避免了HTTP/1.1中的隊頭阻塞問題。
04
知識拓展
2. 傳輸方式
HTTP/1.1：由于請求是串行處理的，多個請求可能會導致延遲，尤其是在網絡延遲較高的情況下。
HTTP/2：通過多路復用，多個請求可以同時進行，顯著提高了頁面加載速度和響應時間。
3.頭部壓縮
HTTP/1.1：頭部信息以文本形式傳輸，會導致冗余數據，增加帶寬消耗。
HTTP/2：使用HPACK算法對頭部進行壓縮，減少了數據量，提高了效率。
關于HTTP/1.1與HTTP/2的區別
05
課堂練習
挑戰
運用本節課所學知識，制作一份介紹超文本、超鏈接和HTTP知識的PPT，以便初學者參考。
06
拓展延伸
除了萬維網還有哪些網站？
1. 社交媒體網站：如Facebook、Twitter、Instagram、TikTok等，用戶可以在這些平臺上分享內容、互動和交流。
2. 電子商務網站：如Amazon、eBay、淘寶等，用戶可以在線購買商品和服務。
3. 搜索引擎：如Google、Bing、百度等，用戶可以通過這些平臺搜索信息。
06
拓展延伸
除了萬維網還有哪些網站？
4. 新聞網站：如BBC、CNN、新華網等，提供最新的新聞和信息。
5. 論壇和社區網站：如Reddit、知乎、天涯社區等，用戶可以在這些平臺上討論各種話題。
6. 視頻分享網站：如YouTube、Vimeo、Bilibili等，用戶可以上傳、分享和觀看視頻。
06
拓展延伸
如何制作超鏈接？
06
拓展延伸
可以通過哪些方式學習超文本、HTTP的知識？
1.閱讀專業書籍
對于超文本，可以閱讀關于文檔標記語言的書籍。例如，學習 HTML（超文本標記語言）相關的書籍，像《HTML & CSS: Design and Build Websites》。
2.在線課程學習
Coursera、edX 等平臺提供了許多關于網絡技術的課程。例如，在 Coursera 上有 “Web Design for Everybody: Basics of Web Development & Coding” 課程，其中包含了超文本標記語言（HTML）。
06
拓展延伸
可以通過哪些方式學習超文本、HTTP的知識？
3.實際項目實踐
可以嘗試制作個人網頁來學習超文本。從簡單的單頁網站開始，使用 HTML 編寫頁面內容，如創建一個個人簡歷網頁。
4.研究開源項目和代碼示例
在 GitHub 等平臺上有許多開源的網頁項目。可以搜索一些基于 HTML 的項目，研究它們的超文本結構。
07
課堂總結
1
引入新知內容
信息之網--接入互聯網超文本、超鏈接與HTTP
2
超文本的出現
3
超鏈接的設置
4
5
進行課堂練習
1
2
3
4
5
5
進行相關知識拓展
6
HTTP的應用
08
板書設計
信息之網--接入互聯網超文本、超鏈接與HTTP
1.進行新知引入
2.學習新知講解
3.完成課堂練習
4.進行知識拓展
09
課后作業
課后試著創建一個簡單的HTML頁面，包含多個超鏈接，鏈接到其他相關頁面或外部網站。
https://www.21cnjy.com/recruitment/home/fine

展開更多......

收起↑