1. Inleiding
1.1. De geschiedenis van het Internet en het WWW (World Wide Web)
Het internet is ontstaan in de jaren 60 als initiatief van het Ministerie van Defensie van de Verenigde Staten. Het doel was een gedecentraliseerd netwerk op te zetten dat nog steeds zou werken als bepaalde delen plat zouden liggen. Dus in plaats van lineair geschakelde computers waarbij het hele netwerk plat ligt als er één schakel ontbreekt, werden de computers als een spinnenweb met elkaar verbonden. Dit project heette ARPANET (Advanced Research Projects Agency Network). De afdeling van het Pentagon die zich ging bezig houden met het ontwikkelen van een veilig en betrouwbaar communicatienetwerk voor de defensie werd in 1969 opgericht.
Om het netwerk wereldwijd te kunnen gebruiken, was een standaard protocol nodig. Zo werd de IP technologie (Internet Protocol) ontwikkeld waarin bepaald wordt hoe elektronische boodschappen ingepakt, geadresseerd en verstuurd worden via het netwerk. Dit protocol is in 1977 ontwikkeld en heet TCP/IP (Transmission Control Protocol/ Internet Protocol). TCP/IP maakt het mogelijk om verschillende branches van andere complexe netwerken direct aan het ARPANET te verbinden. Dit nieuwe geheel van netwerken werd al gauw het Internet genoemd.
Door de introductie van de hyperlink, waardoor je tussen de verschillende documenten op internet heen en weer kunt springen (surfen), heeft het internet een belangrijke sprong gemaakt naar wat het op dit moment is.
1.2. HTML
De websites zoals wij ze zien op het internet zijn niet daadwerkelijke bestanden zoals de computer ze binnen krijgt. Ze zijn geschreven in de taal van het web: HTML, wat staat voor HyperText Mark-up language. HyperText verwijst naar het feit dat er binnen de tekst en figuren verbindingen (hyperlinks) zijn naar andere documenten wanneer je erop klikt. Mark-up Language betekent ‘opmaak taal’, dit geeft aan dat HTML eigenlijk een tekstdocument is dat aan een browser (bijvoorbeeld Internet Explorer) vertelt hoe de inhoud van het document moet worden weergegeven.
HTML werkt door zogenaamde tags (labels). Als je bijvoorbeeld tekst dikgedrukt wilt weergeven, dan doe je dit door om die tekst tags te plaatsen. Deze vertellen aan de browser dat de tekst dikgedrukt getoond moet worden. Dit ziet er als volgt uit:
Als je bijvoorbeeld tekst <b>dikgedrukt</b> wilt weergeven
Er bestaan veel verschillende soorten tags. De meeste worden gebruikt in paren, zoals in bovenstaand voorbeeld, en ze zijn herkenbaar aan de haken waarin ze worden weergegeven ("<" en ">").
Een HTML-bestand is tenminste opgebouwd uit de volgende componenten:
<HTML>
<head>
<title>Dit is de titel</title>
<meta http-equiv="Content-Type" content="text/XHTML; charset=iso-8859-1">
</head>
<body>
Dit is de inhoud.
</body>
</HTML>
Het begint altijd met <HTML> zodat het voor de browser duidelijk is dat het om HTML gaat. Merk op dat een HTML-bestand aan het einde wordt afgesloten met </HTML>. Verder is er een header met overkoepelende aspecten zoals een titel en een code voor de karakterset. Verder naar beneden begint de body, hierbinnen staat de daadwerkelijke inhoud van de pagina. Als de body geopend wordt is het mogelijk een achtergrondkleur en een tekstkleur aan te geven, op deze manier: <body bgcolor="#FFFFFF" text="#000000">. De webpagina die je op basis van de bovenstaande HTML verkrijgt is een witte pagina met zwarte tekst.
Om meer inzicht te krijgen in HTML code kun je kiezen voor 'View Source' in het menu van de browser. Je krijgt dan een venster met de broncode van de site waar je op dat moment bent. Meer informatie is te vinden op: http://www.handleidinghtml.nl/.
Hoewel je websites kunt maken door in een eenvoudige teksteditor direct de HTML code in te typen, vinden veel mensen het handiger om met een zogenaamde What You See Is What You Get (WYSIWYG) editor als dreamweaver te werken.
XHTML is de huidige standaard voor HTML, XHTML vervangt HTML. HTML wordt in overeenstemming gebracht met XML ofwel eXtensible Markup Language. XML is een meta taal, een aantal regels die ontwikkelaars kunnen gebruiken om hun eigen taal in overeenstemming te brengen met een algemene standaard. XML is ook markup-based netzo als HTML wat ervoor zorgt dat de syntax grotendeels hetzelfde is. XHTML is een variant die ontwikkelaars gebruiken voor de markup van webpagina’s. Het verschil tussen HTML en XHTML is dat XHTML alleen wordt gebruikt voor de inhoud van de pagina maar niet voor de presentatie van de pagina daarvoor worden Cascading Styles Sheets gebruikt, dit wordt behandeld in hoofdstuk 8.
1.3. Dreamweaver
Dreamweaver is een HTML-editor. Dit programma maakt het mogelijk om op een eenvoudige wijze professionele websites te maken. Veel bedrijven maken gebruik van Dreamweaver voor hun professionele website. Het programma is ook zeer geschikt voor het maken van meer simpelere websites.
In Dreamweaver werk je aan je pagina zoals deze ook daadwerkelijk bekeken gaat worden door gebruikers van Internet. Dus, als je de achtergrondkleur van je site wilt veranderen, een plaatje wilt invoegen of een link wilt maken, dan kun je dit doen met het gebruik van knoppen en menu's en het resultaat van deze acties zijn direct zichtbaar. De achterliggende HTML code wordt door Dreamweaver automatisch gegenereerd. Als designer kun je hierdoor dus volledig richten op de look en feel van je site zonder bezig te zijn met de codering. Dreamweaver geeft je echter wel de mogelijkheid om zelf code te schrijven.
Naast Dreamweaver zijn er verschillende andere HTML-editors op de markt, waarvan Microsoft Frontpage waarschijnlijk het meest bekend is. Voor veel mensen is het maar een kleine stap naar Frontpage, omdat ze al gewend zijn aan de andere Microsoft pakketten als Word en Excel. Je zult echter merken, dat ook Dreamweaver zeer eenvoudig is in gebruik. Veel bedrijven kiezen voor Dreamweaver omdat het schonere HTML genereert en een krachtiger pakket is. Het is bovendien zeer goed te combineren met andere software pakketten als Flash en Fireworks.
Dreamweaver kan op de PC en ook op Apple computers geïnstalleerd worden. In principe werkt het programma op beide systemen hetzelfde. Toch zijn er enkele kleine verschillen. De sneltoetsen op de PC werken door de control-toets te gebruiken, terwijl op Apple computers de apple-toets gebruikt moet worden. Daarnaast wordt er verschillend omgegaan met kleuren en fonts.
1.4. Macromedia
Dreamweaver werd uitgebracht door softwarebedrijf Macromedia, dat inmiddels is overgenomen door Adobe. Een voordeel van dit bedrijf is dat ze zelf geen browser ontwikkelen. Hierdoor wordt er veel aandacht besteed aan de HTML en wordt het zo goed mogelijk passend gemaakt voor elke browser. Dreamweaver maakt zelfs af en toe twee codes, één voor Netscape Navigator en één voor Internet Explorer. Macromedia is dus platform onafhankelijk.
Naast Dreamweaver was Macromedia ook verantwoordelijk voor de pakketten Flash en Fireworks. Met Flash is het mogelijk bewegende beelden te maken die op het internet gebruikt kunnen worden. Voor meer uitleg over Flash moet je echt bij de Flash cursus zijn. Fireworks is een beeldbewerkingprogramma van Macromedia en is heel goed in het combineren van vector georiënteerde afbeeldingen en afbeeldingen opgebouwd uit pixels. Fireworks lijkt op Photoshop, maar is in tegenstelling tot Photoshop echt gericht op het maken van afbeeldingen voor Internet. Als je al wat langer aan de gang bent met webdesign, zal je merken dat je steeds meer aan je sites wilt toevoegen om ze nog aantrekkelijker te maken voor je publiek. Een groot voordeel van Dreamweaver is dat het eenvoudig te combineren is met de andere software pakketten van Macromedia. Als je Dreamweaver eenmaal onder de knie hebt, zal je merken dat de andere pakketten eenvoudig te leren zijn, aangezien ze gebruik maken van dezelfde soort technieken en goed op elkaar zijn ingesteld.
1.5. Dreamweaver downloaden en installeren
Dreamweaver kan van de site www.adobe.com worden gedownload. Je kunt kiezen of je het programma koopt of dat je het 30 dagen uitprobeert. De gratis probeerversie heeft de volledige functionaliteit. Na 30 dagen werkt het programma niet meer en zal je een licentie moeten kopen.
1.6. Systeemeisen
De minimale systeemeisen voor Dreamweaver MX 2004 zijn:
|
Windows
|
Macintosh
|
Disclaimer: De gratis online cursussen zijn beschikbaar gesteld en ontwikkeld door het bedrijf Learnit. Deze cursus is gratis maar mag niet gebruikt worden voor commerciële doeleinden. Dit werk is auteursrechtelijk beschermd; het auteursrecht ervan berust bij Learnit.


