Head First – HTML with CSS & XHTML
Chapter 5 - 7
Video introer til Dreamweaver CS3
How to create a website with Dreamweaver CS4 (text tutorial)
Diskussion om Notepad vs Dreamweaver vs Frontpage
http://www.headfirstlabs.com/books/hfhtml/chapter5/completedmypod/
Vi kigger lidt på sourcefilerne i mappen HF_HTML_CSS_Code_win\chapter5\mypod-work
HTML historie, W3C, doctypes, W3C Validator
Structure (Information) versus style (style, presentation)
Markup Language (ML) => Focus on the structure of the information
Some HTML history(p.228)
1986: SGML (Standart Generalised Markup Language)
1989: Tim Berners Lee invented the WWW in Cern.
1991: HTML1.0: <h1 >,<h6>, <p>, <li> : pure text structure
1993: <img>, <embed><object> : media elements
1994: Browser war: Netscape vs Explorer
Try some old browsers on http://www.dejavu.org/emulator.htm
<font> :Typografi = style
<background>,<frame>,<blink>, <bgsound>
Platform independant ? Meaning of tags ? Standards ? Structure versus Style?
There guidelines from the World Wide Web Consortium (W3C)
From HTML => HTML4.01 transitional => HTML 4.01 strict
The HTML 4.01 recomendation from W3C (24/12 1999)
Webvillle guide to Strict HTML4.01 (Worddok with scanned page from the textbook)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Start of a HTML4.01 strict document.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Head First Lounge</title>
</head>
Guidelines for a HTML4.01 strict document
Chapter 7. Moving to XHTML
There isn't so much difference between HTML4.01 strict and XHTML1.0 strict standard! Except:
<img src=”drinks.gif” alt=”Drinks” />remember the alt attribute in images
Start of a XHTML 1.0 Strict document
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
</body>
</html>
Utf-8 er en lidt nyere version af ISO-8859-1
The first 256 characters of Unicode character-sets correspond to the 256 characters of ISO-8859-1.
Læs evt. også
http://www.html.dk/tutorials/xhtml/lektion1.asp
http://en.wikipedia.org/wiki/XHTML
W3C recommend that HTML documents are validated according to W3C doctype standards.
Mulighed for 1. Test på uploadet site 2. Test af fil på harddisken 3. Paste html koden ind i et tekst felt.
Dreamweaver har også en indbygget validator som findes under file>validate>markup (shift+F6). Denne validering skal dog helst eftertjekkes i W3C's validator.
1. Lav henholdsvis et HTML4.01 strict dokument og xhtml1.0 strict dokument.via Dreamweaver. Gem dokumenterne som henholdsvis html4_01S.html og xhtml1S.html.
2. Be the validator and make ex_be.jpg (scanned picture) hint: Webvillle guide to Strict HTML4.01 (Worddok with scanned page from the textbook)
3. Change this webpage (segway page) so that it validates to the XHTML1 Strict strandard.
4. Lav et xhtml1 strict document om din første computer. Find nogle passende jpeg, gif og png på nettet. Lav evt. noget i stil med myPod i kapitel 5.
5. Make an ordered list with links to 5 different webpages. Test each of these pages with the validator and write which HTML standard they follow.
6.Explain: Why should you use XHTML1 strict on you webpages ?
7.Explain: What is the differens between Transitional and Strict standards ?
8. What is XML used for ? Make an example of a XML document that is not XHTML. hint: google.com or w3schools.com
