Agenda. Vandaag. Maandag XML & XHTML CSS XSL XSLT

Maat: px

Weergave met pagina beginnen:

Download "Agenda. Vandaag. Maandag XML & XHTML CSS XSL XSLT"

Antoon Boender
4 jaren geleden
Aantal bezoeken:

1 XML & XHTML

2 Agenda Vandaag XML & XHTML Maandag CSS XSL XSLT

3 Markup talen Presentational markup Procedural markup Descriptive/Generic Markup

4 Markup languages DocBook HTML MathML RTF TeX troff Wikipedia markup language XHTML

5 Document Markup Languages OpenDocument OpenOffice.org XML ReportML SpreadsheetML WordprocessingML

6 META talen SGML XML

7 SGML Komt uit de uitgeverswereld Was er al voor HTML Veel content in deze opmaak

8 XML MATHML Opmaak van Wiskundige formules SAML Security Assertion Markup Language VML Voice Markup language HTML Hypertext Markup Language

9 <MsgRef>2</MsgRef><CmdRef>0</CmdRef><Cmd>SyncHdr</Cmd> SYNCML Synchronisatie van devices Voorbeeld <SyncML> <SyncHdr> <VerDTD>1.0</VerDTD> <VerProto>SyncML/1.0</VerProto> <SessionID>1</SessionID> <MsgID>2</MsgID> <Target><LocURI>IMEI: </LocURI></Target> <Source><LocURI> server</locuri></source> </SyncHdr> <SyncBody> <Status>

10 HTML HTML 2.0 published November 1995 as IETF RFC 1866, and declared obsolete/historic by RFC 2854 in June 2000 HTML 3.2 published January 14, 1997 as a W3C Recommendation HTML 4.0 published December 18, 1997 as a W3C Recommendation HTML 4.01 (minor fixes) published December 24, 1999 as a W3C Recommendation ISO/IEC 15445:2000 ("ISO HTML", based on HTML 4.01 Strict) published May 15, 2000 as an ISO/IEC international standard

11 Dynamic HTML Interactieve websites Combinatie van: HTML Javascript CSS DOM

12 XHTML Extensible Hypertext Markup Language Terug naar af Zuiver Heldere scheiding tussen vormgeving en content

13 Verschillen XHTML HTML Alle tags lowercase (dus ) Alle documenten hebben een doctype en een XHTML namespace Alle documenten moeten welgevormd zijn Alle tags (elementen) moeten worden afgesloten. Ook lege elementen! (<leeg />) Attribuutwaarden tussen dubbele aanhalingstekens Alle tags moeten netjes genest zijn

14 Document type declaration XHTML 1.0 Strict <!DOCTYPE html PUBLIC " //W3C//DTD XHTML 1.0 Strict//EN" " strict.dtd"> 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"> XHTML 1.1

15 Documentstructuur <?xml version="1.0" encoding="iso "?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " <html xmlns=" xml:lang="en"> <head> <title>home Page</title> </head> <body> hallo! </body> </html>

16 Veelgemaakte fouten Lege element sluiten fout: goed: Niet lege elementen sluiten fout: paragraph.another paragraph. goed: paragraph.another paragraph. Fout nesten fout: this is some text. goed: this is some text.

17 Veelgemaakte fouten Ontbrekende alternate text fout: <img src="/images/konijn.png" /> goed: <img src="/images/konijn.png" alt="knuffeldier" /> Tekst direct in body fout: <body>welcome to my page.</body> goed: <body>welcome to my page.</body> Nesten van block level en inline elements fout: <h2>introduction</h2> goed: <h2>introduction</h2>

18 Veelgemaakte fouten Quotes vergeten o fout: <td rowspan=3> o goed: <td rowspan="3"> Letterlijk gebruik van & teken o fout: <title>cars & Trucks</title> o goed: <title>cars & Trucks</title> Alles in lowercase o fout: <BODY>The Best Page Ever</BODY> o goed: <body>the Best Page Ever</body>

19 Verificatie Lokaal of online W3C Validator Tidy Browsers

20 Editors Vi : ) gedit NVU Quanta Bluefish Screem Frontpage : )

21 Layout engines Gecko Mozilla FoundationMozilla Firefox icab icab Company icab KHTML KDE Konqueror Presto Opera Software Opera Tasman Microsoft Internet Explorer for Mac Trident Microsoft Internet Explorer

22 CSS Cascading Style Sheets Scheiden content en vormgeving selector {property: value; property: value; property: value; } p {font family: Arial, sans serif; color: #0000FF; font size: 120%; }

23 CSS Historie CSS1 (1996) pas vanaf 2000 in browsers CSS 2 (1998) Nog steeds niet volledig in browser CSS 2 revison 1 (juni 2005) pragmatisch CSS 3.0 Toekomstmuziek

24 Caccading Author style external: embedded: inline: User style Lokaal CSS bestand User agent style default style sheet van een type browser

25 CSS Zo weinig mogelijk embedded Extern Kies namen juist dus niet.vetrood maar.tussenkop

Vergelijkbare documenten

Frontend ontwikkeling

Frontend ontwikkeling Mark Jansen Edwin Vlieg PHPFreakz ledendag 10 november 2007 Frontend ontwikkeling De interface is je product richting de eindgebruiker Goede PHP code met een slechte interface geeft