Microsoft PowerPoint - Ch00-4-XHTML.ppt [相容模式]

Size: px

Start display at page:

Download "Microsoft PowerPoint - Ch00-4-XHTML.ppt [相容模式]"

国活班
5 years ago
Views:

1 Chapter 0-4 (XHTML) 陈瑞奇 (J.C. Chen) 亚洲大学资讯工程学系多媒体网站技术应用整合性课程 IE, Firefox, Safari, Opera, Chrome HTML/CSS DHTML/XHTML/XML JavaScript, JScript, VBScript Java Applet, ActiveX, AJAX Plug-in (eg, Flash, PDF, QuickTime) Windows XP IIS/Apache server MS-Access MS-SQL MySQL Other DBMS Browser Server DataBase Internet TCP/IP HTTP ( 开发人员 ) ASP.NET (Visual C# 2008) ADO/AJAX PHP/JSP/ColdFusion AppServ (Apache+PHP+MySQL) Dreamweaver CS 5 ( 设计人员 ) 网站企划 Photoshop 输出版面 Dreamweaver 网页设计

2 What Is XHTML? XHTML stands for EXtensible HyperText Markup Language XHTML is almost identical to HTML 4.01 XHTML is a stricter and cleaner version of HTML XHTML is HTML defined as an XML application XHTML is a W3C Recommendation of January 2000 XHTML is supported by all major browsers Source: Why XHTML? Many pages on the internet contain "bad" HTML. XHTML is HTML 4.01 redesigned as XML. XML documents must be marked up correctly and "well-formed". Some browsers run on computers, and some browsers run on mobile phones or other small devices. Smaller devices often lack the resources or power to interpret a "bad" markup language. Therefore - by combining the strengths of HTML and XML, XHTML was developed. Source:

3 XHTML 文件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " transitional.dtd"> <html xmlns=" <head> <meta http-equiv="content-type" content="text/html; charset=big5" /> </head> <body> </body> </html> Source: XHTML 元素与属性 <element> 内容 </element> <p> 内容 </p> <element /> <br /> <img src="girl.gif" /> <element 属性 ="value" > <a href=" target="blank">asia University</a>

4 Differences Between XHTML and HTML XHTML elements must be properly nested <b><i>this text is bold and italic</b></i> <b><i>this text is bold and italic</i></b> XHTML elements must always be closed <br> <br /> XHTML elements must be in lowercase <BODY> <body> XHTML documents must have one root element <html> </html> Source: Some More XHTML Syntax Rules Attribute names must be in lower case <a HREF="..."> <a href="..."> Attribute values must be quoted <p align=right> <p align="right"> Attribute minimization is forbidden <input checked> <input checked="checked"> Theid attribute replaces the name attribute

5 Some More XHTML Syntax Rules (cont.) Don t attempt to put a block-level element (such as "<p>", "<h1>"~"<h6>", or "<table>") inside an inline element (such as "<a>", "<span>", "<font>") Don t put "<h1>"~"<h6>", "<p>" inside themselves also Don t use the tags which are not listed in HTM Tag List of W3C Source: XHTML Validation Excercise #3 请将 Homework #1 之 HTML 文件档案改成符合 XHTML 严格要求之 XHTML 文件让同学体验史上超级龟毛的 XHTML XHTML Validator:

6 XHTML XML (Extensible Markup Language) <note> <to>tove</to> <from>jani</from> <heading>reminder</heading> <body>don't forget me this weekend!</body> </note> DTD (Document Type Definition) 定义 XML 文件之结构 ( 元素与属性 ) The XHTML DTD defines mandatory elements <!DOCTYPE Doctype goes here> <html xmlns=" <head> <title>title goes here</title> </head> <body> </body> </html>

7 Three XHTML DTDs XHTML 1.0 Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " XHTML 1.0 Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " transitional.dtd"> XHTML 1.0 Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " frameset.dtd"> meta and HTTP headers <meta http-equiv="content-type" content="text/html; charset=big5" /> <meta http-equiv="refresh" content ="300"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content ="Tue, 02 Mar :47:40 GMT"> <meta http-equiv="date" content ="Tue, 02 Mar :47:40 GMT">

meta and Search Engines <meta name="keywords"

相机,mp3,Gucci,Coach,psp,Wii,iPod" /> <meta

万件以上商品供您挑选, 网络价保证便宜, 更提供分期 0 利率退货免费到府收件, 还有

content="index, follow" /> http://www.im.ncnu.

8 meta and Search Engines <meta name="keywords" content=" 购物,NB, 笔记本电脑,LV,PC, 手机, 相机,mp3,Gucci,Coach,psp,Wii,iPod" /> <meta name="description" content="pchome 在线购物提供 30 万件以上商品供您挑选, 网络价保证便宜, 更提供分期 0 利率退货免费到府收件, 还有 24h 保证到货服务 " /> <meta name="robots" content="index, follow" /> Source:

Source: http://www.w3schools.com/html/html5_intro.

Animation,graphics, music,movies, complicated web

9 Source: HTML5 HTML5was designed to replace both HTML 4, XHTML, and the HTML DOM Level 2. (, including JavaScript) Rich content without plugins Animation,graphics, music,movies, complicated web applications. Cross-platform. a PC, or a Tablet, a Smartphone, or a Smart TV. Source:

final

final 行政院研究發展考核委員會政府網站建置及營運作業參考指引中華民國 99 年 2 月政府網站建置及營運作業參考指引目次前言與導讀... 1 一. 緣由... 1 二. 現行規範應用的運作與問題... 1 三. 政府網站建置與營運作業參考指引之規