5. Inhoud, structuur en opmaak met HTML en CSS

Maat: px
Weergave met pagina beginnen:

Download "5. Inhoud, structuur en opmaak met HTML en CSS"

Transcriptie

1 5. Inhoud, structuur en opmaak met HTML en CSS Het oorspronkelijke doel van HTML was tekstinformatie via het "internet" uitwisselbaar maken onafhankelijk van het computersysteem of het besturingssysteem. HTMLmarkeringen moesten het mogelijk maken om informatie zo te structureren dat een PARSER annex BROWSER die informatie zou kunnen weergeven. Al snel zag ook de bedrijfswereld en de hobby'ist de mogelijkheden van HTML in om zichzelf via het internet (lees: www) voor te stellen. Daarom ontstond al snel de vraag om naast structuurmarkeringen ook stijl- en opmaakmarkeringen aan HTML toe te voegen en werd het oorspronkelijke doel van HTML wat over het hoofd gezien. Met de volgende HTML-code kon u bijvoorbeeld de grootte en de kleur van een bepaald tekstdeel instellen: <font size= 10 color= blue >een stuk tekst</font> Hierdoor ging het oorspronkelijke doel van HTML een beetje verloren. In XHTML ( de nieuwste versie van HTML) mag u om die reden enkel HTML-markeringen gebruiken die iets te maken hebben met de structuur van de pagina. HTML dient voor structuur een inhoud Lijst van alle markup in XHTML 1.1 Markering (tag) beschrijving <! > Een commentaarregel van de webmaster <!DOCTYPE> <a> <abbr> <acronym> <address> <area> <b> <base> <bdo> <big> <blockquote> Het documenttype anker (link) samenvatting acroniem adres Definieert een bepaalde aanklikbare zone in een image map Vetgedrukte tekst Definieert een basis-url voor alle links in de pagina. Definieert de schrijfrichting van de tekst. grote tekst Een lang citaat. Het body-element van de webpagina. Kris Merckx Webontwikkeling Copyright: Creative Commons License 39

2 <br> <button> <caption> <cite> <code> <col> <colgroup> <dd> <del> <div> <dfn> <dl> <dt> <em> <fieldset> <form> <frame> <frameset> line break, lijneinde drukknop table caption citaat weergave van computercode Definieert attributen van tabelkolommen Een groep tabelkolommen. Omschrijving van een definitie Verwijderde tekst Een onderdeel van een document Een begrip uit een definitie Een definitielijst Een definitieterm Beklemtoonde tekst Een verzameling formulierelementen (meestal weergeven als een lijn rond een formulier) Formulier. Een onderliggend venster: HTML kan diverse pagina's in één venster weergeven. Een verzameling van frames <h1> to <h6> Titels van niveau 1 tot 6 <head> <hr> <html> <i> <iframe> <img> <input> <ins> <kbd> <label> <legend> <li> <link> <map> <meta> De HEAD-sectie van een webpagina een regel of lijn HTML-document schuingedrukte tekst Een frame in een ander frame Een afbeelding Een invoerelement in een formulier. Ingevoerde tekst Toetsenbordtekst Een label voor een formulierelement De titel van een frameset. Een onderdeel of element van een lijst. Het 'adres' van een bronbestand (css, javascript...) Een image map Meta-informatie over de pagina Kris Merckx Webontwikkeling Copyright: Creative Commons License 40

3 <noframes> <noscript> <object> <ol> <optgroup> <option> <p> <param> <pre> <q> <samp> <script> <select> <small> <span> <strong> <style> <sub> <sup> <table> <tbody> <td> <textarea> <tfoot> <th> <thead> <title> <tr> <tt> <ul> <var> Een noframes-onderdeel voor webbrowsers die frames niet kunnen weergeven. Een noscript-gedeelte voor webbrowsers die geen scriptingtalen ondersteunen. Een ingesloten object (vb. een Flashbestand) Een genummerde lijst Een groep opties in een formulier. Een optie uit een vervolgkeuzelijst. Een alinea Een parameter voor een object. Vooraf opgemaakte tekst. Een kort citaat. Een voorbeeld van computercode. Een ingevoegd (uitvoerbaar) script. Een vervolgkeuzelijst. Smalle tekst Een bepaald onderdeel in een tekst. Vette tekst Een stijldefinitie (CSS) Kleine tekst onder de regel. Kleine tekst boven de regel (zoals bij vierkante meter) een tabel het 'body'-element van de tabel. Een tabelcel Een groot invoerveld voor tekst in een formulier. De voet van een tabel. De kop van een tabel De kop van een tabel Titel van het HTML-document. Een tabelrij teletype text Niet-genummerde lijst Een variabele Kris Merckx Webontwikkeling Copyright: Creative Commons License 41

4 Tabellen voor opmaak? Dan zit u grondig fout... De bedoeling van een (HTML-)tabel is elementen met elkaar vergelijken. Appelen Peren kleur groen groen vorm rond met kleine inzakking bovenaan boom appelaar perelaar rond met langwerpige afgeronde uitstulping bovenaan Webdesigners gingen al snel tabellen gebruiken als een middel om afbeeldingen exact te positioneren op een pagina. Programma's als Adobe Photoshop maken het zelfs mogelijk om een ontwerp van een afbeelding in stukken te snijden: onderdelen zoals knoppen, banners enz. komen op die manier in verschillende tabelcellen te staan. In heel wat websites (en vaak niet op de minste) worden tabellen gebruikt voor de vormgeving van de webpagina. Het is immers de makkelijkste manier om snel een layout van een webpagina te maken. Ook in Dreamweaver zitten een massa kant-en-klare sjablonen voor webpagina's waarbij wordt uitgegaan van tabellen. Het gaat inderdaad snel om op die manier een layout te bouwen... Maar bij elke aanpassing van de stijl of vormgeving in de toekomst, moet u van nul af aan opnieuw beginnen. De inhouden zitten immers in tabellen en moeten opnieuw worden ingegeven. Tabellen maken het ook behoorlijk moeilijk om webpagina's on-the-fly weer te geven op andere andere platformen (zoals gsm's enz.). Inhoud, structuur en opmaak gescheiden houden We moeten trachten zoveel mogelijk inhoud, structuur en opmaak te scheiden. Tekstverwerkers zoals Microsoft Word gooien alles op een hoopje: een gebruiker tikt een tekst in zonder dat hij hoeft na te denken over enige vorm van structuur en kan meteen ook de tekst opmaken met lettertypes, kleuren enz. Het (correcte) aanmaken van een webpagina kan je best vergelijken met het opstellen van een krantenartikel. De redacteur bepaalt de structuur van alle artikels 1. een kop of titel 2. een korte inleiding of beschrijving 3. een tekst onderverdeeld in alinea's 4. de naam van de auteur 5. een quote Een journalist schrijft een artikel en houdt daarbij rekening met de opgegeven structuur Redacteurs, marketeers en layoutmensen leggen een stijl en opmaak voor de gehele krant vast. Kris Merckx Webontwikkeling Copyright: Creative Commons License 42

5 De layoutafdeling geeft alle structurele elementen een vooraf bepaalde opmaak of stijl. De krant wordt gepubliceerd. Webdesigners nemen al deze taken vaak in hun ééntje voor hun rekening waardoor het gevaar bestaat de verschillende stappen op een hoopje te gooien. Probeer echter steeds rekening te houden met de verschillende fasen in het ontwerp: 1. structuur 2. inhoud 3. opmaak 4. publicatie Ruwweg kunnen we het als volgt stellen: De inhoud van uw webpagina bestaat uit platte tekst zonder opmaak waarbij u echter een structuur vooropstelt. U legt de structuur vast met behulp van HTML 1. een kop of titel: H1, H een korte inleiding of beschrijving: metagegevens in de head (description), een p-markering een tekst onderverdeeld in alinea's: een tekst gemarkeerd door diverse p- tags 4. de naam van de auteur: een label-markering 5. een quote: een blockquote-markering De layout voor de verschillende HTML-elementen (h1, h2, p, label, blockquote...) legt u vast met CSS. Tekstonderdelen insluiten in HTML-markeringen Stop elke tekstonderdeel van uw webpagina in een structurele markering. Schrijf tekst dus steeds in een alinea, quote of titel. Plak tekst nooit los in de body zonder de tekst tussen een markering te plaatsen. Het onderstaande voorbeeld leidt tot een verkeerd gebruik van HTML: </body> Dit is mijn tekst. Correct gebruik: <p> </body> Dit is mijn tekst. Kris Merckx Webontwikkeling Copyright: Creative Commons License 43

6 U kan uiteraard net zoals in een geschreven of gedrukte tekst meerdere alinea's aan een webpagina toevoegen: <p> <p> </body> Dit is een alinea. Dit is nog een alinea. In de BODY-sectie van de webpagina plaatst u dus alle tekstonderdelen tussen "structuur"markeringen. Uw browser parst de structuur-markeringen en geeft ze in de weergave een standaardopmaak: <h>-markeringen staan op afzonderlijke regels en worden groter weergegeven <p>-markeringen starten op een nieuwe regel <ul>- en <li>-markeringen worden als een lijst met "bullets" weergegeven... CSS zorgt voor opmaak en stijl (Cascading Style Sheets) Inhoud en structuur van opmaak scheiden U kan ook markeringen opnemen om de tekst meteen vorm te geven. Zoals hogerop reeds gezegd, is dit een verouderde en achterhaalde techniek van webdesign. Wilt u toekomstgericht denken en werken en vooral tijd besparen op langere termijn, neemt u voor de opmaak uw toevlucht tot CSS of Cascading Style Sheets. HTML-markeringen structureren de diverse onderdelen van de tekstuele inhoud, CSS zorgt voor de opmaak van de diverse onderdelen. De vorm van CSS CSS bepaalt de opmaak of de stijl van de diverse tekstonderdelen: u past een sjabloon toe! U kan dit sjabloon op 2 manieren toekennen: Een sjabloon zorgt voor een eenduidige vorm en layout! In de head tussen <style> en </style> Kris Merckx Webontwikkeling Copyright: Creative Commons License 44

7 In een gekoppeld extern bestand: <link href="stijl.css" rel="stylesheet" type="text/css"> U kan op heel eenvoudige wijze een stijl toekennen aan elke structuurmatige HTMLmarkering: HTML-markering{ eigenschap:waarde; andere eigenschap:waarde; De op die manier door CSS geselecteerde HTML-markering heten we een SELECTOR. Bijvoorbeeld: p{ text-align:center; width:300px; background-color:#cccccc; color:red; Het bovenstaande voorbeeld maakt alle alinea's op dezelfde manier op: tekst van de alinea's wordt gecentreerd de alinea's krijgen een breedte van 300 pixels de alinea's krijgen een lichtgrijze achtergrondkleur tekstkleur van de alinea's is rood Stijlen groeperen Als u voor diverse elementen dezelfde eigenschappen wil instellen, kan u eenvoudig stijlen groeperen. Bijvoorbeeld: aan alle soorten koppen dezelfde kleur toekennen: <html> </html> <head> </head> </body> <style> h1,h2,h3{color:red; </style> <h1>kop 1</h1> <h2>kop 2</h2> <h3>kop 3</h3> Kris Merckx Webontwikkeling Copyright: Creative Commons License 45

8 U kan daarnaast voor elk element afzonderlijk nog aparte eigenschappen vormgeven: <html> <head> <style> h1,h2,h3{ color:red; padding:10px; h1 { border:3px solid black; h2 { border:2px solid blue; h3 { border:1px solid yellow; </style> </head> <h1>kop 1</h1> <h2>kop 2</h2> <h3>kop 3</h3> </body> </html> Stijlklassen: een verschillende opmaak voor dezelfde elementen In het bovenstaande voorbeeld worden alle door CSS geselecteerde HTML-elementen op dezelfde manier opgemaakt. In de praktijk betekent dit dat alle <p>-markeringen, alle <h1>-markeringen enz. op dezelfde manier worden weergegeven. Alhoevel dit voor eenvormigheid in stijl zorgt, is dit ook niet altijd wat u wenst. Een inleiding van een tekst wordt bijvoorbeeld anders weergegeven dan de rest van de alinea's. We nemen een krantenartikel als voorbeeld. De tekst van het artikel bestaat uit een schuingedrukte inleiding. De rest van de tekst wordt normaal weergegeven. Toch staat zowel de inleiding als de rest van de tekst gemarkeerd tussen <p>-tags. In het onderstaande voorbeeld worden alle alinea's inclusief de inleiding uitgevuld en van een blauwe tekst voorzien. <html> <head> <style> p{ text-align:justify; color: blue; Kris Merckx Webontwikkeling Copyright: Creative Commons License 46

9 </head> </style> <h1>schrijven op een foton</h1> <p>amerikaanse natuurkundigen hebben het logo van hun universiteit op één enkel lichtdeeltje getekend. Hoogleraar John Howell van de universiteit van Rochester publiceerde het resultaat van zijn team in de gerenommeerde Physical Review Letters. <p>het klinkt onmogelijk, maar we slaan geen nullen en énen op, maar het hele plaatje, in lichtvorm, aldus project John Howell. Inderdaad onmogelijk, want we geloven er dan ook geen barst van. <p>het sprookje gaat zo: er werd precies één foton door een raster gestuurd waarin een patroon was gemaakt, in dit geval de letters UR. Door de ingewikkelde kwantumeigenschappen van licht, immers deeltje én golf tegelijkertijd, nam het foton het patroon over. Mooi. <p>vervolgens werd het foton afgeremd in een magisch doosje vol cesiumgas van 100 graden celsius, waarin de lichtdeeltjes blijkbaar gecomprimeerd en bewaard kunnen worden. Later kan de foton weer tevoorschijn worden getoverd, en uit de foton het letterpatroon worden gedistilleerd. </html> </body> We willen de inleiding echter schuingedrukt weergeven: de inleiding hoort tot een aparte klasse (een geval apart ;-)). Aan de betrokken alinea kennen we een class-attribuut toe met de naam "inleiding". <p class="inleiding"> vervolgens maken we de klasse aan in het stijlsjabloon: p.inleiding{ font-style: italic; Een klasse moet zelfs niet toegekend worden aan een welbepaald HTML-element. U kan ook een losstaande klasse definiëren en die aan meerdere HTML-elementen toekennen. Het voorbeeld p.inleiding{ font-style:italic; maakt alle <p>-tags met de klasse "inleiding" schuingedrukt. Het voorbeeld.inleiding{ font-style:italic; Kris Merckx Webontwikkeling Copyright: Creative Commons License 47

10 maakt ALLE elementen (dus niet alleen de <p>-tags) met de klasse "inleiding" schuingedrukt. Stijlen en klassen combineren U kan meerdere klassen definieren en ze aan een en hetzelfde element toekennen. Bijvoorbeeld:.inleiding{.opmerking{ font-style:italic; border:1px solid red; Alle elementen met de klasse "inleiding" worden schuingedrukt. Alle elementen met de klasse "opmerking" krijgen een rode rand van 1 pixel. U kan de beide klassen nu aan een element toekennen door de benamingen voor de klassen in het attribuut CLASS op te nemen, gescheiden door een spatie. <p class="opmerking inleiding">tekst De volgorde waarin u de klassen opneemt, speelt geen rol voor de weergave. U mag dus even goed <p class="inleiding opmerking">tekst schrijven. Ook in het stijlschema kan u klassen combineren. Bijvoorbeeld:.inleiding{ background-color:#cccccc;.opmerking{ color:red;.opmerking.inleiding{ border:1px solid black; Het bovenstaande stijlsjabloon heeft het volgende resultaat: Alle elementen met de klasse "inleiding" krijgen een grijze achtergrondkleur. In alle elementen met de klasse "opmerking" wordt de tekst rood weergegeven. Alle elementen met beide klassen krijgen een zwarte boord van 1 pixel. Kris Merckx Webontwikkeling Copyright: Creative Commons License 48

11 ID-selectoren: doelgericht stijlen toekennen Het gebruik van klassen wordt momenteel ondersteund in HTML en XML-gebaseerde formaten als SVG en MathML, maar niet zo goed in XML zelf. U kan echter doelgericht een welbepaald element selecteren door aan het element waaraan u een bepaalde stijl wil toekennen, een ID toe te kennen. Bijvoorbeeld: <p id="inleiding">tekst In het stijlsjabloon gebruikt u in dit geval niet meer de puntnotatie (.inleiding), maar de #- notatie (#inleiding). p#inleiding{font-style:italic; of #inleiding{font-style:italic; Hou er rekening mee dat CSS hoofdlettergevoelig (case-sensitive) is. Als u voor de benamingen van uw selectoren in het stijlschema hoofdletters gebruikt, moet u die hoofdletters ook in de attribuutwaarden gebruiken. Bijvoorbeeld: De CSS-notatie: #Inleiding{ De HTML-notatie: <p id="inleiding">tekst Fout zou zijn: <p id="inleiding">tekst zou tot een foutieve weergave leiden. Een klasse gebruikt u dus best als u aan meerdere elementen dezelfde stijl wil toekennen. ID-selectoren gebruikt u in het geval u aan een welbepaald element een stijl wil toekennen. Kris Merckx Webontwikkeling Copyright: Creative Commons License 49

12 Attribuutselectoren: een krachtig instrument U kan ook alle elementen die een bepaald attribuut bevatten, van een specifieke stijl voorzien. Bijvoorbeeld: Alle afbeeldingen met een TITLE-attribuut een groene boord geven. De HTML-code: <img src="afbeelding.jpg" title="mijn foto"> <img src="afbeelding.jpg"> De CSS-notatie: img[title]{ border:1px solid green; Alle afbeeldingen met het attribuut TITLE krijgen een groene boord, alle afbeeldingen zonder het attribuut TITLE krijgen geen boord. Niet alleen kan u stijlen toekennen aan HTML-elementen met een welbepaald attribuut, u kan zelfs stijlen toekennen aan elementen met een bepaalde attribuutwaarde. Praktische voorbeelden: 1. Links naar welbepaalde websites een andere kleur geven 2. JPG-afbeeldingen een groene rand geven, PNG-afbeeldingen een blauwe rand geven Kris Merckx Webontwikkeling Copyright: Creative Commons License 50

HTML5 overzicht Tag Uitleg Versie Attributen

HTML5 overzicht Tag Uitleg Versie Attributen HTML5 overzicht Tag Uitleg Versie Attributen Commentaarregel toevoegen 4 en 5 Geen Document 4 en 5 Geen Hyperlink 4 en 5 href ping Samenvoeging van een woord 4 en

Nadere informatie

HTML krijgt een standaard opmaak van de browser

HTML krijgt een standaard opmaak van de browser 1 HTML krijgt een standaard opmaak van de browser Een link in HTML In HTML maakt u een link met de HTML-markering (HTML-tag) . Een a-tag (anchor, anker) heeft een attribuutwaarde nodig om de link te

Nadere informatie

Internet_html.doc 1/6

Internet_html.doc 1/6 Internet_html.doc 1/6 Internet html. HTML syntax en regels Een HTML-element is opgebouwd uit een startmarkering en een eindemarkering (behalve enkele speciale markeringen zoals bvb. , , ).

Nadere informatie

Werken met afbeeldingen in webpagina's

Werken met afbeeldingen in webpagina's Werken met afbeeldingen in webpagina's In webpagina's komen heel vaak afbeeldingen voor. Toch gaan webpagina's helemaal anders om met afbeeldingen dan bijvoorbeeld een PowerPoint-presentatie of een Word-document.

Nadere informatie

Besproken in de cursus Vervolg Webdesign CC19VO08

Besproken in de cursus Vervolg Webdesign CC19VO08 Besproken in de cursus Vervolg Webdesign CC19VO08 De verwijzingen in het blauw zijn naar het digitale boek Macromedia Dreamweaver 8 (Macromedia-Dreamweaver-8-Training-from-the-Source-2006.chm) Besproken

Nadere informatie

Websites maken met HTML, CSS en Dreamweaver en zonder JAVA, of JAVA-script of Flash

Websites maken met HTML, CSS en Dreamweaver en zonder JAVA, of JAVA-script of Flash Websites maken met HTML, CSS en Dreamweaver en zonder JAVA, of JAVA-script of Flash INHOUDSOPGAVE Inleiding DEEL I: THEORIE Hoofdstuk 1: Richtlijnen Webstandaarden Voordelen Hoofdstuk 2: HTML De geschiedenis

Nadere informatie

Schrijven voor het web. 1TIN Internettechonologie 2003-2004 les 02 1

Schrijven voor het web. 1TIN Internettechonologie 2003-2004 les 02 1 Schrijven voor het web 1TIN Internettechonologie 2003-2004 les 02 1 Verschillen met gewone teksten niet noodzakelijk sequentieel lezen webpagina globaal lezen (geen details) beantwoorden aan doel van bezoek?

Nadere informatie

Frontend ontwikkeling

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

Nadere informatie

WEBDESIGN. html tags. Neem de grondbeginselen van html door via de online cursus op de informaticasite of via instruct-online

WEBDESIGN. html tags. Neem de grondbeginselen van html door via de online cursus op de informaticasite of via instruct-online WEBDESIGN html tags HTML is de taal waarop internetsites gebaseerd zijn. Bij het onderdeel webdesign maken we gebruik van een van de bovenstaande webeditors die ons helpen bij het (automatisch) creëren

Nadere informatie

Een verticale vormgeving is makkelijker en sneller te realiseren dan een horizontale.

Een verticale vormgeving is makkelijker en sneller te realiseren dan een horizontale. Een HTML-sjabloon Denk goed na hoe je webpagina er moet uitzien. Wil je een webpagina met een horizontale vormgeving (zoals bij een schermpresentatie)? Wil je een webpagina met een verticale vormgeving

Nadere informatie

Cursus HTML voor beginners

Cursus HTML voor beginners Cursus HTML voor beginners Gebruikte bron: /www.handleidinghtml.nl/ HTML is de taal waarmee je documenten (webpagina's) maakt die bekeken kunnen worden op het World Wide Web. HTML staat voor HyperText

Nadere informatie

Introductie. Wat is HTML?

Introductie. Wat is HTML? Introductie Wat is HTML? Hypertext Markup Language (HTML) is de taal van het World Wide Web. Elk document op het web is geschreven in HTML en alle onderdelen - zoals de opmaak van documenten, koppelingen,

Nadere informatie

Web building basis: HTML. Karel Nijs 2008/09

Web building basis: HTML. Karel Nijs 2008/09 Web building basis: HTML Karel Nijs 2008/09 Web building basis eerste les HTML intro Browsers HTML elementen HTML basis tags HTML attributen HTML kleuren HTML formattering Extra: HTML entities Web building

Nadere informatie

Cluster 1 Realiseert. 4 Beschrijving van de beroepssituatie behorende bij deze leereenheid

Cluster 1 Realiseert. 4 Beschrijving van de beroepssituatie behorende bij deze leereenheid LEEREENHEID HTML/CSS Dit document bestaat uit twee onderdelen - Onderdeel Leereenheid - Onderdeel Onderwijsproduct 1 Naam leereenheid In deze tabel staat de naam en het type van de leereenheid Leereenheid

Nadere informatie

Het Wepsysteem. Het Wepsysteem wordt op maat gebouwd, gekoppeld aan de gewenste functionaliteiten en lay-out van de site. Versie september 2010

Het Wepsysteem. Het Wepsysteem wordt op maat gebouwd, gekoppeld aan de gewenste functionaliteiten en lay-out van de site. Versie september 2010 Het Wepsysteem Het Wepsysteem is een content management systeem, een systeem om zonder veel kennis van html of andere internettalen een website te onderhouden en uit te breiden. Met het Content Management

Nadere informatie

Module IV - Cascading Style Sheets (CSS)

Module IV - Cascading Style Sheets (CSS) Module IV - Cascading Style Sheets (CSS) Cascading Style Sheets kunnen we het best vergelijken met opmaakprofielen binnen tekstverwerkers zoals Microsoft Word, Corel WordPerfect, OpenOffice Opmaakprofielen,

Nadere informatie

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor KNKV verenigingen Versie 0.4 Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

HTML in Outlook 2007. Hoe zorgt u ervoor dat uw email goed in beeld komt?

HTML in Outlook 2007. Hoe zorgt u ervoor dat uw email goed in beeld komt? HTML in Outlook 2007 Hoe zorgt u ervoor dat uw email goed in beeld komt? HTML in Outlook 2007 Inleiding Emark Mail biedt u de mogelijkheid om kant en klare HTML nieuwsbrieven in te laden en te versturen.

Nadere informatie

Toelichting op enkele knoppen: (als u de muis bij een knop houdt, verschijnt een tekst met een korte aanwijzing (tooltip) bij deze knop).

Toelichting op enkele knoppen: (als u de muis bij een knop houdt, verschijnt een tekst met een korte aanwijzing (tooltip) bij deze knop). FAQ Leerlingdossier & handelingsplannen Welke mogelijkheden biedt de online tekstverwerker in ESIS? De online tekstverwerker beschikt over veel mogelijkheden voor het bewerken van tekst. U vindt de online

Nadere informatie

Extra: Hoe u uw website met HTML kunt verbeteren

Extra: Hoe u uw website met HTML kunt verbeteren Extra: Hoe u uw website met HTML kunt verbeteren HTML is een afkorting van Hyper Text Markup Language. Zoals de term al zegt is het een "opmaak taal", dat wil zeggen het vertelt de browser door middel

Nadere informatie

Met CSS kan je je webpagina's vormgeven. Je kan elementen een plaats geven en hun uitzicht bepalen.

Met CSS kan je je webpagina's vormgeven. Je kan elementen een plaats geven en hun uitzicht bepalen. CSS Met CSS kan je je webpagina's vormgeven. Je kan elementen een plaats geven en hun uitzicht bepalen. In CSS maken we een onderscheid tussen 2 soorten elementen in een webpagina: 1. Sommige elementen

Nadere informatie

LES 8: CSS. Lesoverzicht: Aan de slag Wat is CSS Kleuren Tekst Blokken Lijsten en tabellen Responsive website W3chools Samenvatting.

LES 8: CSS. Lesoverzicht: Aan de slag Wat is CSS Kleuren Tekst Blokken Lijsten en tabellen Responsive website W3chools Samenvatting. LES 8: CSS Lesoverzicht: Aan de slag Wat is CSS Kleuren Tekst Blokken Lijsten en tabellen Responsive website W3chools Samenvatting Tijd: 5 minuten Doel: Aan het einde van deze les kun je CSS in de WordPress

Nadere informatie

Module V - XML. Stefan Flipkens - Cursus: Internet - Intranet (2004-2005) V 1

Module V - XML. Stefan Flipkens - Cursus: Internet - Intranet (2004-2005) V 1 Module V - XML Extensible Markub Language is een eenvoudig en flexibel text-formaat voor de opslag van data. Het is een meta opmaak (markup) taal voor de beschrijving van gestructureerde gegevens. De stukjes

Nadere informatie

Handleiding. Beheeromgeving

Handleiding. Beheeromgeving Handleiding Beheeromgeving Kant en Klare Site Veluwelaan 80 8443 AH Heerenveen www.kantenklaresite.nl - info@kantenklaresite.nl - fax: 084-8368243 KvK 01134248 Inhoud Inloggen op de beheeromgeving...3

Nadere informatie

Websitecursus deel 1 HTML

Websitecursus deel 1 HTML Websitecursus deel 1 HTML WebCie A Eskwadraat www@a-eskwadraat.nl 8 april 2015 Inleiding Website cursus in drie delen: HTML CSS Javascript We gaan uit van geen voorkennis. Als je vragen hebt, stel ze!

Nadere informatie

Titel: flashvars.html

Titel: flashvars.html Data uitwisselen met Flash: the easiest way Kris Merckx www.ardeco.be Macromedia Flash-bestanden kunnen opgenomen worden in HTML. Een Flashfilm (*.swf) kan tekst, afbeeldingen, film, geluid en vectorbeelden

Nadere informatie

HTML en CSS. Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen.

HTML en CSS. Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen. Terminologie HTML en CSS HTML: Hyper Markup language Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen. CSS: Cascading StyleSheet stylesheet for

Nadere informatie

6. De sitemap of stamboom van uw website

6. De sitemap of stamboom van uw website 6. De sitemap of stamboom van uw website Dynamisch of statisch? CMS of Dreamweaver? Een databankgestuurde website en CMS Grotere websites hebben nood aan een eenvoudiger manier om informatie toe te voegen,

Nadere informatie

Startpagina. Inloggen

Startpagina. Inloggen Handleiding gebruik Mira website Startpagina Als je naar de Mira website gaat (http://www.mira.be/) zal je nergens een login-functie zien. Deze is bewust verborgen gehouden om geen inbrekers aan te lokken.

Nadere informatie

Leerlingdossier & handelingsplannen. Welke mogelijkheden biedt de online tekstverwerker in ESIS? FAQ

Leerlingdossier & handelingsplannen. Welke mogelijkheden biedt de online tekstverwerker in ESIS? FAQ FAQ Leerlingdossier & handelingsplannen Welke mogelijkheden biedt de online tekstverwerker in ESIS? De online tekstverwerker beschikt over veel mogelijkheden voor het bewerken van tekst. U vindt de online

Nadere informatie

HTML. Formulieren. Hans Roeyen V 3.0

HTML. Formulieren. Hans Roeyen V 3.0 Formulieren Hans Roeyen V 3.0 26 februari 2015 Inhoud 1. Formulieren... 3 1.1. De form tag... 3 1.1.1. Het action attribute... 4 1.1.2. Het method attribute... 4 1.2. De input tag... 4 1.3. Soorten input

Nadere informatie

HTML Editor: de eerste stappen

HTML Editor: de eerste stappen LES 18 HTML Editor: de eerste stappen In deze les leert u werken met HTML Editor. Daarbij geven we tevens een inleiding tot HTML. Hoewel op dit moment HTML versie 4.01 in gebruik is, maakt de HTML Editor

Nadere informatie

2. KENNISMAKEN MET DE PROGRAMMA'S

2. KENNISMAKEN MET DE PROGRAMMA'S Deze cursus is geschreven ter vervanging van de eerste twee les-stencils over HTML die we sinds 1997 op de PCW gebruikten. 'HTML voor beginners' helpt je een eind op weg met het maken van je eigen website.

Nadere informatie

Internet Standaarden HC4

Internet Standaarden HC4 Internet Standaarden HC4 Hogeschool van Amsterdam - Instituut voor Interactieve Media 1 Invloed van Games Laatste ontwikkelingen Gebruik van Games 11 oktober 2007 Hogeschool van Amsterdam - Instituut voor

Nadere informatie

HTML 4.01. Hans Roeyen V 3.0

HTML 4.01. Hans Roeyen V 3.0 4.01 Hans Roeyen V 3.0 29 januari 2015 1. Inleiding... 3 1.1. Een HTML bestand aanmaken.... 3 1.2. Een verklaring van de gebruikte elementen... 4 1.3. HTML Tags... 5 1.3.1. Tag attributen... 5 1.4. Basis

Nadere informatie

Besluit Kwaliteit Rijksoverheidswebsites

Besluit Kwaliteit Rijksoverheidswebsites Besluit Kwaliteit Rijksoverheidswebsites De Minister van Binnenlandse Zaken en Koninkrijksrelaties, Overwegende dat de Tweede Kamer bij motie van de leden Aasted-Madsen en Fierens d.d. 26 april 2006 (Kamerstukken

Nadere informatie

Agenda HTML. Wat is HTML? Hoe ziet een HTML-file eruit? Waarom HTML leren? Waarin maak je een HTML-bestand?

Agenda HTML. Wat is HTML? Hoe ziet een HTML-file eruit? Waarom HTML leren? Waarin maak je een HTML-bestand? HTML HyperText Markup Language Aniel Bhulai E-mail: abhulai@cs.vu.nl Agenda HTML algemeen Aantal tags HTML met stijl (CSS, DHTML) Demo Vragen vrije Univers iteit amsterdam 1 2 Opmaaktaal Letter Kleur Plaatjes

Nadere informatie

HTML-EDITOR GEBRUIKEN

HTML-EDITOR GEBRUIKEN HTML-EDITOR GEBRUIKEN Over TinyMCE TinyMCE is een kleine What-You-See-Is-What-You-Get (WYSIWYG) editor voor teksten. De bediening vindt plaats in de web browsers, zoals MSIE of Mozilla. Het werken met

Nadere informatie

Les W-01: HTML. Een website bouwen in HTML. 2006, David Lans

Les W-01: HTML. Een website bouwen in HTML. 2006, David Lans Les W-01: HTML 1.0 HTML Websites zijn opgebouwd uit afzonderlijke webpagina s. Deze webpagina s zijn geschreven in een aparte taal, HTML. De afkorting HTML staat voor Hyper Text Markup Language. Vrij vertaald

Nadere informatie

Google Maps op uw site

Google Maps op uw site Google Maps op uw site 1. Ga naar maps.google.com en voer het gezochte adres in. 2. Klik op de knop Zoeken in Maps. 3. U kan naar de gewenste positie zoomen en kiezen voor de satellietweergave of de gewone

Nadere informatie

4. Plak de gekopieerde tekst op de plaats van de cursor als pure tekst. 5. Plak de gekopieerde tekst op de plaats van de cursor vanuit Word

4. Plak de gekopieerde tekst op de plaats van de cursor als pure tekst. 5. Plak de gekopieerde tekst op de plaats van de cursor vanuit Word 1. Code. Toon HTML code van de tekst 2. Verwijder de opmaak van de geselecteerde tekst. 3. Plak de gekopieerde tekst op de plaats van de cursor 4. Plak de gekopieerde tekst op de plaats van de cursor als

Nadere informatie

GVR Soft s HTMLcursus

GVR Soft s HTMLcursus GVR Soft s HTMLcursus Index en snelzoek pagina Les 1: De basis - De basis tags: , , en tags - Het nesten van tags - Achtergrond- en tekstkleur - De basiskleuren - Kleurenkiezer - Een

Nadere informatie

Leerlingdossier & handelingsplannen

Leerlingdossier & handelingsplannen FAQ Leerlingdossier & handelingsplannen Welke mogelijkheden biedt de online tekstverwerker in ESIS? De online tekstverwerker beschikt over veel mogelijkheden voor het bewerken van tekst. U vindt de online

Nadere informatie

Handleiding Lay-outs bewerken voor LogiVert 5

Handleiding Lay-outs bewerken voor LogiVert 5 Hoofdstuk: Inleiding Handleiding Lay-outs bewerken voor LogiVert 5 Copyrights : 20 LogiVert BV Website : www.logivert.com V.0.3 5-5-2009 Toevoegingen aan stap voor stap V.0.2 9-4-2009 Tweede opzet V. 0.

Nadere informatie

1. Open het programma KompoZer Het grote witte vlak is een nog lege webpagina. Deze gaan we nu van inhoud voorzien.

1. Open het programma KompoZer Het grote witte vlak is een nog lege webpagina. Deze gaan we nu van inhoud voorzien. Minicursus KompoZer In deze cursus ga je leren werken met het computerprogramma KompoZer. Stapsgewijs maak je een voorbeeldsite. Daarna kun je alles wat je geleerd hebt gebruiken om je eigen website te

Nadere informatie

HTML richtlijnen e-mail marketing. part of the valley

HTML richtlijnen e-mail marketing. part of the valley e-mail marketing pagina 2/9 geschreven door Maarten van Benthem, front-end developer datum 1 oktober 2009 versie 1.0 Copyright Alle rechten voorbehouden. De inhoud van dit document blijft eigendom van

Nadere informatie

De categorie Forms in het paneel Insert

De categorie Forms in het paneel Insert Formulieren Invulformulieren bieden u de mogelijkheid om te communiceren met de bezoekers van uw website. Ze geven de bezoeker de mogelijkheid om feedback te geven, informatie door te spelen, informatie

Nadere informatie

Publicatie formulieren en surveys

Publicatie formulieren en surveys Handleiding: Publicatie formulieren en surveys Deze handleiding is in te zetten voor MailPlus Marcom en MailPlus ecom. Inhoudsopgave Introductie... 1 1 Formulieren integreren... 2 1.1 Formulieren integereren

Nadere informatie

HTML BASISCURSUS. ICT HTML basiscursus 1

HTML BASISCURSUS. ICT HTML basiscursus 1 HTML BASISCURSUS ICT HTML basiscursus 1 inleiding De algemene structuur van een webpagina is als volgt : Mijn

Nadere informatie

Natuurlijk moet je niet element invoeren, maar de afgesproken benamingen, meestal afkortingen: zo staat p voor alinea en h1 voor een grote kop.

Natuurlijk moet je niet element invoeren, maar de afgesproken benamingen, meestal afkortingen: zo staat p voor alinea en h1 voor een grote kop. HTML-elementen Met de markeertaal HTML bouw je webpagina's en kan je ze eveneens aan elkaar koppelen (linken). Een webpagina bouw je niet met een tekstverwerker. Je schrijft hem best in code. Een browser

Nadere informatie

WebHare en Microsoft Word

WebHare en Microsoft Word WebHare en Microsoft Word Optimaliseer uw Word documenten voor gebruik met WebHare Werken met alinea s Opmaakprofielen Afbeeldingen Datum: Maart 2010 Aantal pagina's: 26 Versie: 2.6 Doelgroep: Content

Nadere informatie

3 Website opbouwen: vervolg

3 Website opbouwen: vervolg 3 Website opbouwen: vervolg 3.1 Elementen 3.1.1 Bestand Op je website kan je een bestand plaatsen (doc, pdf, ) dat door je bezoekers gedownload kan worden 3.1.2 Links. Zowel bij het typen van tekst (2.1.1)

Nadere informatie

Handleiding Content Management Systeem

Handleiding Content Management Systeem Handleiding Content Management Systeem Inhoudsopgave Inhoudsopgave... 2 1. Inloggen... 3 2. Paginavolgorde... 3 3. Pagina en menutitel... 3 4. Pagina s bewerken... 4 5. De tekstverwerker... 4 6. Interne

Nadere informatie

Een website ontwerpen in Dreamweaver met de opmaakweergave

Een website ontwerpen in Dreamweaver met de opmaakweergave Een website ontwerpen in Dreamweaver met de opmaakweergave door G. Van Soest Met Dreamweaver kan je zeer snel een website in elkaar bouwen; ook het onderhoud van een website is met Dreamweaver uiterst

Nadere informatie

Foutcontrole met Javascript

Foutcontrole met Javascript Foutcontrole met Javascript Pol Van Dingenen Yannick Van Hauwe INLEIDING Het controleren van de gegevens die ingevuld zijn in formulieren is heel erg belangrijk. In de praktijk is enkel en alleen controle

Nadere informatie

De frameset uit de afbeelding wordt op de volgende manier gedefinieerd:

De frameset uit de afbeelding wordt op de volgende manier gedefinieerd: FRAMES GEBRUIKEN Met frames kan het venster van een browser zo worden ingedeeld, dat er meerdere webpagina's tegelijk getoond kunnen worden. In de afbeelding hieronder staat een webpagina met frames. We

Nadere informatie

Handleiding wordpress

Handleiding wordpress Handleiding wordpress Wordpress versie 3.0.4 Handleiding versie 1.1 Auteur Website Geert Hoekzema www.geerthoekzema.nl www.geerthoekzema.nl geert@geerthoekzema.nl 1 Inhoudsopgave Inleiding... 3 Beginnen

Nadere informatie

FrontPage. Kies Bestand, nieuw en kies vervolgens Website met één pagina: Kies bij voorkeur een locatie:

FrontPage. Kies Bestand, nieuw en kies vervolgens Website met één pagina: Kies bij voorkeur een locatie: 1 FrontPage Kies Bestand, nieuw en kies vervolgens Website met één pagina: Kies bij voorkeur een locatie: Merk op dat de ene pagina die al aangemaakt is 'index.htm' heet. Dit is belangrijk De startpagina

Nadere informatie

Eenvoud, kracht en snelheid

Eenvoud, kracht en snelheid OpenIMS Open Informatie Management Server Eenvoud, kracht en snelheid TinyMCE Handleiding Open Informatie Management Server www.openims.com OpenSesame ICT BV www.osict.com INHOUDSOPGAVE 1 WYSIWYG EDITOR...

Nadere informatie

Webrichtlijnen onderzoek gemeente Westland

Webrichtlijnen onderzoek gemeente Westland Webrichtlijnen onderzoek gemeente Westland Accessibility webrichtlijnen Hieronder zijn de richtlijnen opgesteld na onderzoek op de website van de gemeente Westland, deze test ook wel de 126 webrichtlijnen

Nadere informatie

EBUILDER HANDLEIDING. De Ebuilder is een product van EXED internet www.exed.nl. info@exed.nl EXED CMS UITLEG

EBUILDER HANDLEIDING. De Ebuilder is een product van EXED internet www.exed.nl. info@exed.nl EXED CMS UITLEG EBUILDER HANDLEIDING De Ebuilder is een product van EXED internet www.exed.nl info@exed.nl 1 INHOUDSOPGAVE Inleiding Een korte introductie over het Ebuilder» Navigatie» Snelnavigatie Pagina s Hier vind

Nadere informatie

Tutorial HTML CSS met Adobe Dreamweaver CSx

Tutorial HTML CSS met Adobe Dreamweaver CSx Tutorial HTML CSS met Adobe Dreamweaver CSx Johan Smits, Saxion, Minor Internetmarketing, WCM1, week 4 Introductie Bij het werken met content op een website is het van groot belang om tekst en vormgeving

Nadere informatie

Een webpagina maken. Een website bouwen met HTML en CSS practicum 1

Een webpagina maken. Een website bouwen met HTML en CSS practicum 1 Een webpagina maken De komende periode wordt in 8 practica een aantal technieken behandeld, die je nodig hebt om een (eenvoudige) website te kunnen bouwen. Nadat je deze 8 practica hebt doorgewerkt, moet

Nadere informatie

HTML Graphics. Hans Roeyen V 3.0

HTML Graphics. Hans Roeyen V 3.0 HTML Graphics Hans Roeyen V 3.0 19 maart 2015 Inhoud 1. HTML5 Canvas... 3 1.1. Het Canvas element... 3 2. SVG Element... 9 2.1. SVG vergeleken met Canvas... 9 2.2. Een cirkel tekenen met SVG... 10 2.2.1.

Nadere informatie

Welkom bij mijn website tutorial (Deel 2)

Welkom bij mijn website tutorial (Deel 2) Welkom bij mijn website tutorial (Deel 2) Ik ga uit van Microsoft XP voor de duidelijkheid. Ik heb dus geen idee of de programma s die ik gebruik ook op Vista werken. Notepad++ werkt zowieso op xp en Vista.

Nadere informatie

Handleiding Mijneigenweb.nl

Handleiding Mijneigenweb.nl Handleiding Mijneigenweb.nl Inhoud 1 Inloggen 2 Kleurenschema en lettertype 2.1 Kies een standaard kleurenschema 2.2 Kleurenschema en lettertypes aanpassen/ zelf samenstellen 3 Logo 4 Visual 4.1 Eigen

Nadere informatie

Handleiding Wordpress

Handleiding Wordpress Handleiding Wordpress Inhoudsopgave 1. Inloggen 2. Berichten en Pagina s 3. Afbeeldingen en video s 4. Weblinks 1. Inloggen 1.1 Inloggen bij Wordpress We starten met het inloggen op je WordPress gebaseerde

Nadere informatie

HTML Editor: tabellen en hyperlinks

HTML Editor: tabellen en hyperlinks LES 19 HTML Editor: tabellen en hyperlinks In deze les leert u nog iets meer over HTML en de HTML Editor van OpenOffice.org. U leert hoe u absolute en relatieve hyperlinks maakt. We staan even stil bij

Nadere informatie

Central Station. CS website

Central Station. CS website Central Station CS website Versie 1.0 18-05-2007 Inhoud Inleiding...3 1 De website...4 2 Het content management systeem...5 2.1 Inloggen in het CMS... 5 2.2 Boomstructuur... 5 2.3 Maptypen... 6 2.4 Aanmaken

Nadere informatie

WEBSITE-DESIGN CHRIS VERMAAS & FJODOR VAN SLOOTEN 2014-201000018-1B

WEBSITE-DESIGN CHRIS VERMAAS & FJODOR VAN SLOOTEN 2014-201000018-1B WEBSITE-DESIGN CHRIS VERMAAS & FJODOR VAN SLOOTEN 2014-201000018-1B WEBSITE-DESIGN INHOUD COLLEGE Afronding vak JQuery, mail(formulieren) en social media Testen Website-design 5-1-2015 2 AFRONDING VAK

Nadere informatie

Bonus hoofdstukken. 1 HTML, CSS en JavaScript. 2 Een website bouwen

Bonus hoofdstukken. 1 HTML, CSS en JavaScript. 2 Een website bouwen Bonus hoofdstukken 1 HTML, CSS en JavaScript 2 Een website bouwen 1 HTML, CSS en JavaScript De belangrijkste punten van bonushoofdstuk 1 XX HTML is een taal waarmee u de inhoud en structuur van een webpagina

Nadere informatie

Van Dreamweaver CS4 naar CS5

Van Dreamweaver CS4 naar CS5 Danny Devriendt Van Dreamweaver CS4 naar CS5 Beknopte overstapgids www.wwwsoft.be Bijlage gratis te downloaden bij Basiscursus webdesign Dreamweaver CS4 WWW-Soft GCV 2010 www.wwwsoft.be CS5 Nieuw in Dreamweaver

Nadere informatie

Inhoudsopgave. Inhoudsopgave... 2. 1. Inleiding... 3. 2. Het begin... 4. 3. Opmaak... 6. 5. Formulieren... 16. 6. Editors... 23. 7. Webbrowsers...

Inhoudsopgave. Inhoudsopgave... 2. 1. Inleiding... 3. 2. Het begin... 4. 3. Opmaak... 6. 5. Formulieren... 16. 6. Editors... 23. 7. Webbrowsers... 1 Inhoudsopgave Inhoudsopgave... 2 1. Inleiding... 3 2. Het begin.... 4 3. Opmaak... 6 5. Formulieren... 16 6. Editors... 23 7. Webbrowsers... 24 8. Webhosting... 25 9. Website uploaden... 27 10. Website

Nadere informatie

Deze opdracht vraagt uitbreiding van jullie doorheen de lessen. We gaan zelf een ontwerp

Deze opdracht vraagt uitbreiding van jullie doorheen de lessen. We gaan zelf een ontwerp DOORLOPENDE OPDRACHT KINEPOLIS Beste studenten, Deze opdracht vraagt uitbreiding van jullie doorheen de lessen. We gaan zelf een ontwerp maken/ code schrijven voor de Kinepolis website. Wat hoort er thuis

Nadere informatie

4.1 4.2 5.1 5.2 6.1 6.2 6.3 6.4

4.1 4.2 5.1 5.2 6.1 6.2 6.3 6.4 Handleiding CMS Inhoud 1 Inloggen 2 Algemeen 3 Hoofdmenu 4 Pagina s 4.1 Pagina s algemeen 4.2 Pagina aanpassen 5 Items 5.1 Items algemeen 5.2 Item aanpassen 6 Editor 6.1 Editor algemeen 6.2 Afbeeldingen

Nadere informatie

Frontpage 2003. Een web aanmaken in Frontpage doe je zo: 1 Start Frontpage op. Het openingsvenster van Frontpage verschijnt.

Frontpage 2003. Een web aanmaken in Frontpage doe je zo: 1 Start Frontpage op. Het openingsvenster van Frontpage verschijnt. opmerking In deze instructie wordt een web gemaakt met frames. Het voorbeeld behandelt een digitaal portfolio, maar natuurlijk kun je de instructies gebruiken voor elk web met frames, ongeacht het onderwerp.

Nadere informatie

Bsc5 bk5100 - TOI. Proces- en presentatieportfolio Inleiding websites maken met Macromedia Dreamweaver. Technisch Ontwerp en Informatica

Bsc5 bk5100 - TOI. Proces- en presentatieportfolio Inleiding websites maken met Macromedia Dreamweaver. Technisch Ontwerp en Informatica Proces- en presentatieportfolio Technisch Ontwerp en Informatica http://toi.bk.tudelft.nl/bsc5 toi@bk.tudelft.nl Procesportfolio [week 2 t/m 17] voortgang en verloop van het ontwerpproces GEEN productpresentatie

Nadere informatie

Y.S. Lubbers en W. Witvoet

Y.S. Lubbers en W. Witvoet WEBDESIGN Eigen Site Evaluatie door: Y.S. Lubbers en W. Witvoet 1 Summary Summary Prefix 1. Content en structuur gescheiden houden 2. Grammaticaal correcte en beschrijvende markup 3. Kopregels 4. Client-

Nadere informatie

Toetsmatrijs Web Markup

Toetsmatrijs Web Markup Toetsmatrijs Web Markup Deze toetsmatrijs verstrekt de leerdoelen en toetscriteria voor het vak Web Markup competentienummers of C 1.1 Een eenvoudige webpagina bouwen, testen en publiceren op het web HTML,

Nadere informatie

Handleiding Wordpress

Handleiding Wordpress Handleiding Wordpress V 1.0 Door Inhoud Inloggen op de website... 3 Het Dashboard... 4 Berichten... 5 Berichten aanmaken... 5 Berichten bewerken... 6 Pagina's... 7 Pagina's aanmaken... 7 Pagina's bewerken...

Nadere informatie

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme >

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Basis-theme Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Naam invullen en de code van basis-theme kopiëren en erin plakken

Nadere informatie

Globale kennismaking

Globale kennismaking Globale kennismaking Kennismaking Tesla CMS 1. Dashboard 2. pagina beheer - pagina aanmaken - pagina aanpassen - pagina verwijderen - pagina seo opties - zichtbaarheid pagina 3. subpagina beheer - subpagina

Nadere informatie

Dreamweaver 8 de basis

Dreamweaver 8 de basis Dreamweaver 8 de basis [p 2] Andere titels in deze serie: Flash 8 Eric Diender Html en css Andree Hollander Photoshop cs2 Kerver & Toebosch Php5 en mysql Ghica van Emde Boas SQL Stan Segers Visual C# Sander

Nadere informatie

Handleiding OpenOrg.nl

Handleiding OpenOrg.nl Handleiding OpenOrg.nl 1. Inleiding OpenOrg.nl is een wiki, een webtoepassing waarmee webdocumenten gezamenlijk kunnen worden bewerkt. Meerdere personen kunnen elkaars documenten en bijdragen aanvullen

Nadere informatie

HTML voor nieuwsbrieven

HTML voor nieuwsbrieven Voorwaarden en specificaties HTML voor nieuwsbrieven HTML e mails zoals wij die versturen, voldoen aan een aantal richtlijnen voor een optimale verzending en aflevering van nieuwsbrieven. Op advies van

Nadere informatie

WYSIWYG editor. De knoppen worden besproken beginnend bovenaan van links naar rechts.

WYSIWYG editor. De knoppen worden besproken beginnend bovenaan van links naar rechts. WYSIWYG editor Handleiding Mimar CMS Website De knoppenbalk van de editor lijkt in grote mate op die van Microsoft Word en zal er dus vertrouwd uitzien. De functies van de knoppen kunnen enigszins afwijken

Nadere informatie

Inleiding. Als u zelf uw website niet bijhoudt dan kan uw webmaster deze tips gebruiken.

Inleiding. Als u zelf uw website niet bijhoudt dan kan uw webmaster deze tips gebruiken. Tips & Tricks Inleiding In dit overzicht vindt u een aantal tips die u kunt volgen. Het zijn slechts tips en adviezen dus als u of uw webmaster andere manieren hebben voor een perfect resultaat dan is

Nadere informatie

Software 1. Basis HTML. bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2009-2010 semester 1

Software 1. Basis HTML. bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2009-2010 semester 1 Software 1 Basis HTML bachelor grafische en digitale media cross-media ontwerp & grafimediatechnologie academiejaar 2009-2010 semester 1 Alain Simons alain.simons@artesis.be Basis HTML 1. Introductie 2.

Nadere informatie

O.O.P.-Project Toegankelijke Webportalen aan de K.U.Leuven

O.O.P.-Project Toegankelijke Webportalen aan de K.U.Leuven KATHOLIEKE UNIVERSITEIT LEUVEN O.O.P.-Project Toegankelijke Webportalen aan de K.U.Leuven Richtlijnen voor het maken van toegankelijke webpagina's Auteurs: Nadia Diraä & Christophe Strobbe email: nadia.diraa@esat.kuleuven.be

Nadere informatie

Proefles informatica op het Alberdingk Thijm College. Het maken van een website met de tekstverwerker Kladblok of TextWrangler

Proefles informatica op het Alberdingk Thijm College. Het maken van een website met de tekstverwerker Kladblok of TextWrangler Proefles informatica op het Alberdingk Thijm College Het maken van een website met de tekstverwerker Kladblok of TextWrangler 1 Start het programma kladblok: (Start à Programma s à Bureau-accessoires à

Nadere informatie

Highpotech IT. Nieuwsbrief. Een webpagina maken. heeft een zekere es- verhouding van 4:3

Highpotech IT. Nieuwsbrief. Een webpagina maken. heeft een zekere es- verhouding van 4:3 Uitgave 6 versie 2 Augustus 2010 Highpotech IT Nieuwsbrief Een webpagina maken Eerdere uitgaven Een website wordt weergegeven op een hoek waarvan de verhoudingen dicht in de Werken met Excel beeldscherm

Nadere informatie

Hand-out Web Technologies, werkcollege 4 Alex Reuneker (a.reuneker@hhs.nl), 2012

Hand-out Web Technologies, werkcollege 4 Alex Reuneker (a.reuneker@hhs.nl), 2012 Hand-out Web Technologies, werkcollege 4 Alex Reuneker (a.reuneker@hhs.nl), 2012 1. Id s en klassen (id- en class-attributen) id-attribuut: Elk HTML-element kan gespecificeerd worden door middel van een

Nadere informatie

CURSUS DIGITAAL ATELIER Photoshop/ Illustrator/ Indesign

CURSUS DIGITAAL ATELIER Photoshop/ Illustrator/ Indesign CURSUS DIGITAAL ATELIER Photoshop/ Illustrator/ Indesign EEN DOCUMENT DRUKKLAAR MAKEN A. Waar moet ik absoluut op letten? B. Hoe doe ik dit? 3. Een preflight pakket maken in Indesign 4. Drukklare PDF maken

Nadere informatie

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor NHV verenigingen Versie 0.2 Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Handleiding teksteditor

Handleiding teksteditor In deze handleiding leggen we de werking van de teksteditor uit. De teksteditor wordt gebruikt voor het bewerken van tekst. Uw tekstpagina s bewerkt u met deze editor, maar u vindt m op vele plekken terug.

Nadere informatie

Inleiding. 3.. Widget maken. 7... Widget publiceren. 8...Widget aanpassen. 9...Mini widget. 13...Banners

Inleiding. 3.. Widget maken. 7... Widget publiceren. 8...Widget aanpassen. 9...Mini widget. 13...Banners Handleiding Inleiding 3.. Widget maken 7... Widget publiceren 8...Widget aanpassen 9...Mini widget 13...Banners 2 2 Widget maken Als u ingelogd bent in uw account dan komt u terecht in een keuzemenu. Als

Nadere informatie

Handleiding website. Inloggen Start uw internet browser en ga naar http://www.rbaoreven.nl/.

Handleiding website. Inloggen Start uw internet browser en ga naar http://www.rbaoreven.nl/. Handleiding website In deze handleiding staat alles wat u nodig heeft om een bericht op de website van de Reddingsbrigade Aoreven Heythuysen te plaatsen. Alles wordt in woord en beeld uitgelegd. Inloggen

Nadere informatie

Trippeltrap Content Management System

Trippeltrap Content Management System Handleiding Trippeltrap Content Management System versie 2.4 Aanmelden Voordat u de tekst op uw webpagina kunt aanpassen, moet u zich eerst aanmelden. Bovenaan de pagina vindt u een link naar het intranet.

Nadere informatie

Template maken voor Webshops van FreeWebShop

Template maken voor Webshops van FreeWebShop Template maken voor Webshops van FreeWebShop Versie 1 Peter Jan van Tuil Maart 2011 info@van-tuil.info De uitdaging. Een kennis die een site wil hebben, een webshop. Het grafisch ontwerp is er al. Voor

Nadere informatie