INTERNET STANDAARDEN HC1

9 September 2008

INTERNET STANDAARDEN HC1 Wat is het internet? Wat zijn standaarden? Wat gaan we doen dit jaar?

Hogeschool van Amsterdam – Instituut voor Interactieve Media


2


3

RULES OF ENGAGEMENT Als wij praten zijn jullie stil, bij vragen steek je je hand op; Een laptop is enkel nodig als wij dat zeggen; Koffie (cq drinken) wordt gedoogd , eten niet; Ruim je eigen troep op; Je pakt pas in als wij aangeven dat de les voorbij is; Ja, je mag naar het toilet. Hogeschool van Amsterdam – Instituut voor Interactieve Media

17

VANDAAG Internet Standaarden (PIST) Internet Standaardisering Ontwikkeling van websites XHTML Hogeschool van Amsterdam – Instituut voor Interactieve Media

18

INTERNET STANDAARDEN (PIST) XHTML en CSS Semantiek en Scheiding van vormgeving en inhoud 4 Hoorcolleges (op maandag) Leesopdrachten (CSS; Lie & Bos) Tentamen (15 okober 18:00 – 20:00)

5 Practica Praktijkopdrachten Portfolio website (eindopdracht) Hogeschool van Amsterdam – Instituut voor Interactieve Media

19

ONSTAAN VAN HET INTERNET


20

HET INTERNET ‐ 1962 Massachusets Institute of Technology (MIT) ‘Galactisch netwerk’ van J.C.R. Licklider Hoofd Computer Research @ DARPA


21

HET INTERNET ‐ 1965 L. G. Roberts @ MIT: Eerste verbinding tussen 2 computers (TX‐2 en Q‐32)


22

HET INTERNET ‐ 1967 Presentatie ARPANET door L. G. Roberts Standaard snelheid van 2.5kbps naar 50kbps Bolt Beranek and Newman (BBN) winnen de rechten om te ontwikkelen 1961

1967

MIT Massachusets Institute of Technology, USA RAND militair onderzoek, USA NPL National Physics Laboratory, UK Hogeschool van Amsterdam – Instituut voor Interactieve Media

23

HET INTERNET ‐ 1969 Het internet bestaat reeds uit 4 hosts

University of California, Los Angeles (UCLA) Stanford Research Institute (SRI) University of California, Santa Barbara (UCSB) University of Utah (UU)


24

HET INTERNET ‐ 1972 Presentatie van ARPANET op International Computer Communication Conference (ICCC) door Bob Kahn van BBN, eerste e‐mail!


25

HET INTERNET ‐ 1983 1 januari 1983, overgang van NCP naar TCP/IP MFENET BITNET HEPNET SPAN CSNET DECNet USENET NSFNET SNa JANET PSI CO+RE UUNET 50.000 netwerken, op 7 continenten en de ruimte Hogeschool van Amsterdam – Instituut voor Interactieve Media

26

HET INTERNET ‐ 1989 Tim Berners‐Lee @ CERN bedenkt Hypertext


27

HET INTERNET ANNO 1998


28

HET INTERNET ‐ 1992 World Wide Web Consortium (W3C)


29

STANDAARDISERING ‐ ONE WORLD WIDE WEB Communicatie, commercie en delen van informatie. Ongeacht hardware, software, infrastructuur, moedertaal, cultuur, locatie, fysieke of mentale vermogen.


30

STANDAARDISERING – W3C STANDAARDEN


31

EEN WEBSITE OPVRAGEN Wat gebeurt er als je een URL intypt Maak met je buurman een schets Ongeveer 5 minuten


32

EEN WEBSITE OPVRAGEN www.csszengarden.com HTTPREQUEST Ik wil de pagina www.csszengarden.com Hier is de pagina www.csszengarden

HTTPRESPONSE Hogeschool van Amsterdam – Instituut voor Interactieve Media

33

EEN WEBSITE OPVRAGEN


34

EEN WEBSITE BEKIJKEN


35



36



37



38



39


In het college word hier de pagina csszengarden.com met een screenreader opgelezen deze is in de PDF-versie van het college niet beschikbaar


40

PAUZE (10 MINUTEN) Discussiepunten: Waarom houdt microsoft zich niet aan de standaarden van het W3C? Is het als webdesigner nuttig om alle browsers te ondersteunen? Hoe belangrijk is het dat je internetpagina door blinden bekeken kan worden? Hogeschool van Amsterdam – Instituut voor Interactieve Media

41

MAKEN VAN EEN WEBSITE

USABILITY

Techniek Hogeschool van Amsterdam – Instituut voor Interactieve Media

42

MAKEN VAN EEN WEBSITE

USABILITY

Techniek Hogeschool van Amsterdam – Instituut voor Interactieve Media

43

XHTML BASICS Boek Titel Inhoudsopgave Inhoud Hoofdstukken

Titel Alinea’s Afbeeldingen Vetgedrukte woorden Italic woorden

Antwoordkaart


44

XHTML BASICS Pagina Header Title

Body Heading Alinea’s Vetgedrukte woorden Italic woorden ...

Afbeeldingen Links Formulieren Hogeschool van Amsterdam – Instituut voor Interactieve Media

45

BASISRECEPT XHTML

(355 – 368)

Elementen ‘genest’ in andere elementen Begin:

<...>

Eind:


46

BASISRECEPT XHTML

(355 – 368)

Element Lorem ipsum dolor Begin tag

Inhoud


Eind tag

47

BASISRECEPT XHTML

(355 – 368)

... ... Hogeschool van Amsterdam – Instituut voor Interactieve Media

48

NESTEN HTML elementen zijn ‘genest’

Lorem ipsum dolor sit amet

49

NESTEN Geneste elementen mogen NIET overlappen

Fout:
text text text

Goed:
text text text

50

NESTEN IN EEN BOOM, DOM? xhtml

head

title

body

h1

strong

p

ul

a

em


51

BASISRECEPT XHTML

xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

Dit is de titel ...

... Hogeschool van Amsterdam – Instituut voor Interactieve Media

52

ANATOMIE VAN EEN TAG xhtml tag tagtype

attribuut waarde


53

3 TYPEN TAGS Block level Inline Invisible


54

BLOCK LEVEL TAGS
...

...

...


55

INLINE TAGS ... ... Geen ...

... Geen ...


56

INVISIBLE TAGS
... ...


57

ZONDER LINKS GEEN WEB

Æ


BELANGRIJK!

58

SEMANTISCH OPMAKEN se∙man∙tiek (de ~ (v.)) 1. leer van de betekenis van de woorden en woordgroepen => betekenisleer 2. [fil.] leer van de interpretatie van formele systemen

Juiste ‘tag’ bij de juiste tekst Hogeschool van Amsterdam – Instituut voor Interactieve Media

59

BELANGRIJKSTE PUNTEN

Standaardisering – W3C Opvragen van een site Nesten van elementen XHTML Boomstructuur Block vs. Inline vs. Invisible Links zijn de ducktape van het WWW Semantisch opmaken


60


61

OPDRACHT(EN) Voor hoorcollege 2: Lezen uit CSS; Lie & Bos Chapter 2 – Chapter 3 –

CSS The amazing em unit and other best practices

Proeftentamen maken 100 Minuten Open boek Eén A4 met handgeschreven aantekeningen Hogeschool van Amsterdam – Instituut voor Interactieve Media

62

GEBRUIKTE BRONNEN

http://www.isoc.org/internet/history/brief.shtml http://www.computerhistory.org/internet_history/ http://www.w3c.org http://www.csszengarden.com

Lie, Bos. Cascading Style Sheets: Designing for the web. Addison‐Wesley. ISBN: 0321193121 Shea, Holzschlag. The zen of css design: visual enlightment for the web. New‐Riders. ISBN: 0321303474 Hogeschool van Amsterdam – Instituut voor Interactieve Media

63

INTERNET STANDAARDEN HC1

Recommend Documents

...