第 1 章 認識 HTML 著作權所有 © 旗標出版股份有限公司.

Slides:



Advertisements
Similar presentations
LED CUBE 預期規劃.
Advertisements

Chapter 5 全球資訊網 5-1 World Wide Web 的誕生 5-2 使用Internet Explorer
第1章 网页、网站制作基础 1.1 网页与网站的概念 1.2 Web标准 1.3 网页制作的常用软件 1.4 构成网页的基本元素
网页制作与网站设计教学课件 网页制作与网站设计课程组开发
风 波 鲁 迅 江南水乡风景.
第 1 章 認識HTML.
数据访问页.
DreamWeaver MX (V) 林偉川.
网页设计(1) 第12讲 网页技术简介 马秀麟 2014年5月 2018/9/17 制作人:马秀麟.
程式設計概論 1.1 程式設計概論 程式語言的演進 物件導向程式 程式開發流程 1.2 C++開發工具
Google協作平台.
Q101 在701 SDX Linux上的標準安裝與使用程序v2
第一篇 Unix/Linux 操作介面 第 1 章 Unix/Linux 系統概論 第 2 章 開始使用 Unix/Linux
JDK 安裝教學 (for Win7) Soochow University
第1章 認識Arduino.
網頁製作入門 電算中心 – 蔡京甫.
网页制作与设计 主编 耿 杰 科学出版社.
應用軟體 本節重點: 應用軟體簡介 Word Excel PowerPoint 資料庫Acess.
第 7 章 設定網頁背景與音樂.
R教學 安裝RStudio 羅琪老師.
What’s New in HTML5.
ASP.NET基本設計與操作 建國科技大學 資管系 饒瑞佶 2007年.
安裝JDK 安裝Eclipse Eclipse 中文化
網頁切換移轉 JS vs. ASP.NET.
Word與PowerPoint的結合 建功國小 陳旻杰 健行國小 張慧如.
OpenID與WordPress使用說明
雲端運算的基石(2) 虛擬化技術實作(XP篇─上)
檔案與磁碟的基本介紹.
第二章 SPSS的使用 2.1 啟動SPSS系統 2.2 結束SPSS系統 2.3 資料分析之相關檔案 2.4 如何使用SPSS軟體.
系統設定 IE8相容性檢視
FTP檔案上傳下載 實務與運用.
私立南山高中 信息組 電腦研習 電腦資料的備份 中華民國 99年4月20日 星期二.
網頁切換移轉 JS vs. ASP.NET.
虛擬機器 下載QEMU Windows版 (0.9.1) 下載Kqemu Windows版 安裝QEMU 安裝Kqumu
VS.NET 2003 IDE.
網頁程式設計 本章投影片錄自HTML5、CSS3、RWD、jQuery Mobile跨裝網頁設計 陳惠貞 著 碁峰資訊股份有限公司出版
圖片格式簡介 張啟中.
班級網頁與部落格 自由軟體簡介 校網資源說明 文雅國小 資訊組.
Dreamweaver 8 潘雅真老師.
第 19 章 XML記憶體執行模式.
PowerPoint 2019/4/9.
電子商務新版面問題排除.
Prepare by Jean Huang 黃瀞儀
伸峰科技股份有限公司 李書帆 SanfongWeb 網頁編修 伸峰科技股份有限公司 李書帆
網頁程式概論 建國科技大學資管系 饒瑞佶 2015/9 V1 2016/4 V2 2016/9 V3.
Chime.
Google協作平台+檔案分享(FileZilla+網路芳鄰)
教學媒體作業 歷史系99級 楊琇媚. 教學媒體作業 歷史系99級 楊琇媚.
W3C标准网页制作 主讲教师:张 涛.
個人網路空間 資訊教育.
VS.NET 2003 IDE.
eol ─ 日本全上市公司資訊資料庫 財務資料下載之.csv檔於中文環境下的閱讀方法
利用 EditorConfig 自訂文字編輯器設定
編輯網頁可用那些應用程式? 記事本 Word FrontPage Dreamweaver.
基本指令.
網站的設計 HTML 超文本標記語言( Hyper Text Markup Language)
Dreamweaver 進階網頁製作 B 許天彰.
1. 查詢個人電腦版本 1.進入控制台 2.點選“所有控制台項目” 3.點選“系統”.
Chapter 15 檔案存取 LabVIEW中的檔案存取函數也可將程式中的資料儲存成Excel或Word檔。只要將欲存取的檔案路徑位址透過LabVIEW中的路徑元件告訴檔案存取函數後,LabVIEW便可將資料存成Excel或Word檔;當然也可以將Excel或Word檔的資料讀入LabVIEW的程式中。
ZigBee PRO教學系統 CC2530 實驗.
如何從政大圖書館館藏目錄匯出書目至EndNote
Brief Guide of FrontPage
國立台灣大學 關懷弱勢族群電腦課程 By 資訊工程 黃振修
6.1 動畫檔案的格式 6.2 建立合適的動畫元素.
安裝JDK 配置windows win7 環境變數
小畫家教學 電子版儲存於 學校網頁/學科資訊/電腦科
多站台網路預約系統之 AJAX即時資料更新機制
项目一 了解网站的概念 项目二 创建个人网站“鸿渐工作室” 项目三 制作“鸿渐工作室”的主页 项目四 HTML语言 项目五 制作“家乡特产”网页 项目六 制作“给我留言”网页 项目七 制作“应用技巧”网页 项目八 模板制作及应用.
第五章 自訂佈景主題與文字處理 講授者:詹雅愔.
Develop and Build Drives by Visual C++ IDE
Presentation transcript:

第 1 章 認識 HTML 著作權所有 © 旗標出版股份有限公司

本章提要 什麼是 HTML 如何製作 HTML 文件 瀏覽器與 HTML 文件的關係

什麼是 HTML HTML 與網頁的關係 HTML 文件結構 什麼是 SGML 為什麼要學 HTML

HTML 與網頁的關係 在瀏覽程式中所看到的內容 原始的文件內容 (執行『檢視/原始檔』命令)

HTML 文件結構 在 HTML 文件中由小於 "<" 及大於 ">" 符號所組成的記號稱為標籤 (tag)。 原來 HTML 文件不過就是和一般文字檔一樣, 只是文字中夾雜一些特定的 HTML 標籤。當瀏覽程式在讀取我們的 HTML 文件時, 就會依照各標籤所代表的意義, 將其後的文字做出不同的特殊效果。

什麼是 SGML SGML (Standard Generalized Markup Language) 是一種電子文件交換的國際標準, 其作用是在各種不同類型的電腦世界, 提供一個大家都能使用的文件格式。 將 SGML 拿到任何一種系統上, 只要有 SGML 的語法分析程式 (parser), 就能解讀含有 SGML 的文字檔, 同時也達到檔案能在各種電腦系統上用的目的。

HTML 與 SGML HTML 其實就是依 SGML 為基礎發展而來的, 要學習 HTML 其實不用管什麼是 SGML, 照樣也能做出非常精采的 HTML 文件。 若有興趣更進一步認識 SGML, 可到 http://xml.coverpages.org/sgml.html 看看。

HTML 的標準 HTML 標準的制定單位是 W3C (http://www.w3.org), 目前標準最近版本是 4.01 版, 有興趣者可至 http://www.w3.org/Markup/ 探個究竟。

為什麼要學 HTML 若想學好網頁的製作, 就必須對這個網頁的基本構成要素有一定瞭解, 因為就算使用所見即所得的工具來製作, 最終的製作成果也都是存成 HTML 檔。 有些特效是網頁製作軟體無法做出的, 只要通 HTML, 這時就可以自己動手編輯, 將所需的效果設計出來。

如何製作 HTML 文件 製作流程 規畫文件內容 編輯 HTML 文件 檢視編輯成果 將文件放到伺服器上

製作流程 規劃文件內容 編輯文件 不滿意再回去修改 瀏覽程式預先觀看 放到可供大家存取的 WWW 伺服器 自已先在網路上測試 到適當的地方發佈首頁面世消息 不滿意再回去修改

規劃文件內容 了解您的客戶群, 也就是想吸引什麼樣的人來參觀您的網頁。 蒐集所需的資料。 構思如何安排這些資料。

編輯 HTML 文件 使用一般文書編輯器, 像是漢書、Windows 的記事本、Word…。不過, 在存檔時要記得將副檔名設定成 .htm 或 .html。 使用 HTML 編輯器, 只要選選功能表項目、按按工具列上按鈕, 就能將 HTML 標籤加到文件中, 簡化不少編輯工作。

目前常見的編輯器簡介 Macromedia Dreamweaver FrontPage AceHTML 5 Freeware HotDog

Macromedia Dreamweaver

FrontPage

AceHTML 5 Freeware

HotDog

在 HTML 文件中整合文字以外的多媒體檔案 在瀏覽網頁時, 都會看到不少的圖形, 有些還有動畫、音效等。這些特殊的物件, 都是以單獨的檔案椠於文件之外的, 例如音效可能是 MIDI 、WAVE 檔, 圖形有 JPEG 、GIF 檔等等。 我們必須另外準備這些檔案, 然後在 HTML 文件中用特別的語法來標示這些物件在網頁中出現位置、排列方式等等。

檢視編輯成果 通常我們都會在編輯與檢視成果間來回進行, 以確定顯示效果合適的。所以一個編輯器與瀏覽器整合在一起的環境會比較方便 (這也是很多人選擇使用 Dreamweaver 或 FrontPage 的原因)。

將文件放到伺服器上 WWW 伺服器 網路上提供個人放置 Home Page 的地方

WWW 伺服器 HTML 網頁文件要放到開放給大家存取的 WWW 伺服器上, 注意一定要是一個有提供 WWW (HTTP) 服務的主機才行。

網路上提供個人放置 Home Page 的地方 若您是學生或老師, 通常學校都會提供讓您免費放置的地方。 一般用各 ISP 撥接號的社會人士, 則可以在網路上找提供免費的硬碟空間, 供人申以放置私人的網頁。 若是使用 Windows XP 系統, 還可利用附於 Windows XP 光碟中的 IIS 伺服器程式。

瀏覽器與 HTML 文件的關係 要設計 HTML 文件應考慮使用者 (瀏覽者) 的環境與需求。可注意以下 2 點: 各家瀏覽器會有擴充功能

各家瀏覽器會有擴充功能 各家廠商為了讓自己的瀏覽器有更突出的顯示效果, 除了一些操作上的改進外, 就是支援所謂擴充的 HTML 語法 (HTML extensions), 製作 HTML 網頁文件的人只要用了這些特殊的 HTML 語法, 而使用者也使用支援讓語法的瀏覽器, 就能看到在其它瀏覽器中看不到的效果。

設計 HTML 文件的注意事項 為了使來參觀的人都能看到完整內容, 只用標準的 HTML 語法來編輯是最好的了, 讀者也不會因為使用功能較遜的瀏覽器, 而無法讀到您提供的資訊。 而各瀏覽器廠商對一些 HTML 標準語法的支援不盡相同, 在 Netscape 與 IE 上瀏覽仍會有不同的效果。所以最好自己多先用不同的瀏覽器來測試效果。