Extra: Hoe u uw website met HTML kunt verbeteren

Maat: px
Weergave met pagina beginnen:

Download "Extra: Hoe u uw website met HTML kunt verbeteren"

Transcriptie

1 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 van HTML-tags hoe de pagina weergegeven moet worden op het scherm. HTML HTML is geen programmeertaal zoals vaak gedacht wordt. De HTML-tags zijn vergelijkbaar met bouwstenen uit een lego-set. Er is een bepaald aantal stenen met een vooraf bepaalde vorm die naar eigen smaak kunnen worden samengevoegd tot een bouwwerk, of beter gezegd een webpagina. Net als lego is ook HTML eenvoudig te leren, terwijl je er toch hele ingewikkelde dingen mee kunt doen. Even een uitleg van enkele belangrijke HTML termen. Iedere webpagina bevat gegevens. Deze gegevens hebben de vorm van elementen. Zo zijn er elementen voor tekst, plaatjes, formulieren, tabellen, etc. Ieder element bestaat uit drie delen: een begintag, de inhoud en een eindtag. Verder heeft een element verschillende attributen. Zo heeft het element "tekst" bijvoorbeeld als attributen "lettertype" en "lettergrootte". Tenslotte hebben de attributen weer verschillende waarden. Zo heeft de tekst een bepaald lettertype, bijvoorbeeld Arial of Courier. Als er geen waarde wordt opgegeven, dan wordt de standaardwaarde voor het betreffende attribuut gebruikt. Zoals gezegd bestaat een element uit een begintag, de inhoud en een eindtag. Maar wat zijn nu tags? Een tag is een stukje HTML code dat tussen twee haken: < en > staat. Een voorbeeld van een tag is <HTML> en ook </HTML> is een tag. Het eerste voorbeeld is een begintag, het tweede een eindtag. Een eindtag is identiek aan de begintag, maar dan met een / er voor. Er zijn ook een paar elementen die geen inhoud hebben. Deze hebben daarom wel een begintag, maar geen eindtag. Maar voor nu is dit alles wat u moet weten om aan de slag te kunnen gaan met HTML. 2Com2 internet & communicatie 131 maak je eigen website met webxpress

2 Basis opzet HTML webpagina Het volgende voorbeeld bevat het basismodel van iedere HTML pagina. HTML <HTML> <HEAD> <TITLE>Titel van de pagina</title> </HEAD> <BODY> Inhoud van je pagina. </BODY> </HTML> Hier volgt een uitleg van de verschillende tags die hier gebruikt worden. <HTML> Deze tag wordt gebruikt om het begin van een HTML document aan te geven. Als u een HTML bestand maakt, begint u dus altijd met <HTML>. <HEAD> De <HEAD> tag wordt gebruikt om belangrijke informatie over de pagina in op te nemen. Deze informatie is (vrijwel altijd) onzichtbaar voor de bezoeker van uw pagina. U vindt hier bijvoorbeeld de titel van de pagina. <TITLE> en </TITLE> De <TITLE> tag is de begintag van de titel van uw pagina. Na deze begintag typt u dus de gewenste titel voor uw pagina. Deze titel ziet de bezoeker van uw website linksboven in het browserscherm. Vervolgens sluit u de tag met </TITLE>. </HEAD> Dit is de eindtag van de HEAD. Onthoud dat praktisch alle vormgevingselementen bestaan uit een begintag en een eindtag. <BODY> en </BODY> De <BODY> en </BODY> tags zijn veruit de belangrijkste tags in ieder HTML document. De werkelijke inhoud van uw pagina komt tussen deze tags te staan. De <BODY> tag komt tussen de <HTML> en </HTML> tags en na de </HEAD> tag. </HTML> Deze eindtag markeert het einde van een HTML document. Dit is dus de laatste tag die u gebruikt bij het maken van je pagina. Nog een opmerking: HTML behandelt hoofdletters en kleine letters hetzelfde. Het maakt dus niet uit of u <TITLE> of <title> typt. 2Com2 internet & communicatie 132 maak je eigen website met webxpress

3 WebXpress en de HTML weergave WebXpress vertaalt uw webpagina in HTML, de taal die gebruikt wordt om uw pagina weer te geven. Het leuke is dat u deze HTML code ook kunt zien. U kunt dus een pagina maken en de vertaling in HTML bekijken. Zo gaat u naar de HTML weergave te gaan: Klik op de tab HTML En zo komt u weer terug in de ontwerp weergave: Klik op de tab Ontwerpen 2Com2 internet & communicatie 133 maak je eigen website met webxpress

4 HTML en tekstopmaak Er zijn verschillende tags die u helpen de tekst te structureren en op te maken. Zo kunt u een overzichtelijke en mooie pagina maken. Hier volgt een uitleg van de verschillende tekst-tags. Headings: HTML heeft zes verschillende headings (koppen), genummerd van 1 tot 6, waarbij 1 de grootste tekst maakt. Een voorbeeld van een heading tag: begintag: <H1> eindtag: </H1>. Dit zijn de begin- en eindtag van H1. H3 is ongeveer de normale tekstgrootte. Paragrafen: Lege ruimtes in uw HTML code, zoals spaties, enters en inspring-ruimte, worden altijd weergegeven als een enkele spatie indien u de HTML pagina in de browser bekijkt. Dit is handig, omdat u niet meer hoeft te letten op de lengte van uw zinnen. De browser zet de woorden namelijk automatisch op een nieuwe regel als hij een regel heeft volgeschreven. Voor de leesbaarheid is het handiger om de regels niet breder te maken dan je beeldscherm. Headings Paragrafen Het aanbrengen van structuur in uw tekst doet u met de <P> tag. Deze paragraaf tag begint een nieuwe regel en doet dit na een lege regel erboven vrij te hebben gehouden. De <P> tag heeft wel een eindtag, </P>, maar deze hoeft u niet te gebruiken. De <P> tag heeft ook een attributen. Een attribuut is een instelmogelijkheid. Bijvoorbeeld: align. Met align kun je aangeven of u de tekst in de paragraaf links, midden of rechts wilt uitlijnen. Standaard is align ingesteld op left (links). <P align= left > Zo schrijft u de tag als je de paragraaf links wilt uitlijnen</p> <P align="center">zo schrijft u de tag als je de paragraaf in het midden wilt uitlijnen</p> <P align="right">zo schrijft u de tag als je de paragraaf rechts wilt uitlijnen</p> Bold, Italic, Underline: dit zijn een aantal speciale tekststijlen. Bold, Italic, Underline Met de <B> tag krijgt u vetgedrukte tekst. Bijvoorbeeld: <B>Dit is vet</b> Met de <I> tag krijgt u scheefgedrukte tekst. Bijvoorbeeld: <I>Dit is italic</i> Met de <U> tag krijgt u onderstreepte tekst. Bijvoorbeeld: <U>Dit is onderstreept</u>. De HTML code van de teksten in vet, scheefgedrukt en 2Com2 internet & communicatie 134 maak je eigen website met webxpress

5 onderstreept zier er als volgt uit: <P><STRONG>Dit is vet </STRONG></P> <P><EM>Dit is italic</em> </P> <P><U>Dit is onderstreept</u> </P> Dit is vet Dit is italic Dit is onderstreept Type 3 zinnen: dit is vet, Dit is italic en Dit is onderstreept. Maak de bedoelde zinnen vet, italic en onderstreept. Ga naar de HTML weergave en bekijk de HTML code. 2Com2 internet & communicatie 135 maak je eigen website met webxpress

6 HTML en basis tabelopmaak Het gebruik van tabellen is een van de handigste functies in HTML. Practisch iedere webmaster krijgt er vroeg of laat mee te maken. Goed omgaan met tabellen is nogal moeilijk. U zult gauw in staat zijn eenvoudige tabellen te maken. Complexe tabellen vergen gewoon veel oefening en ervaring. Het volgende voorbeeld bevat het basismodel van iedere HTML tabel. <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> De tabel begint met de <TABLE> tag gevolgd door de tag. Vervolgens begint een rij met de tag (Table Row). Iedere cel in een rij begint met tag <TD> (Table Data). Na deze tag plaatst u de informatie die u in de cel op wilt nemen. De eindtags: </TD> en </TR> zijn niet verplicht. Een nieuwe cel begint u dan weer met: <TD>. Heeft u alle cellen binnen een rij ingevuld dan begint u de volgende rij met:. Zo vult u de hele tabel in. Uiteindelijk sluit u de tabel met de eindtag: </TABLE>. Attributen van de <TABLE> tag: width: hiermee stelt u de breedte in van de tabel. Dit kunt u doen in een percentage of pixels. border: met dit attribuut stelt u de dikte van de rand van de tabel in. De waarde 0 betekent: geen rand. cellpadding: hiermee kunt u een witruimte creëren tussen de rand van de cel en de inhoud van de cel. De waarde is in pixels. De standaardwaarde is 1. cellspacing: dit stelt een ruimte in tussen de verschillende cellen in een tabel. De waarde is in pixels. De standaardwaarde is hier 1. Voeg een tabel van 2 rijen en 2 toe aan een lege webpagina Klik op de tab HTML om de HTML te bekijken. A1 B1 A2 B2 2Com2 internet & communicatie 136 maak je eigen website met webxpress

7 HTML en tabelkleuren In een aantal stappen wordt nu uitgelegd hoe we deze basistabel kunnen verfraaien. De HTML code van de basis tabel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> A1 A2 B1 B2 Voeg een tabel van 3 rijen en 2 toe aan een lege pagina. Vul de cellen met Titel 1, Titel 2, A1, B1, A2 en B2 zoals aangegeven in het voorbeeld. Ga naar de HTML weergave en bekijk de HTML code. Tabelkleuren Het inkleuren van vakken kan met het bgcolor attribuut. bgcolor: hiermee stelt u de achtergrondkleur in van de hele tabel. De waarde van de kleur moet hexadecimaal worden opgegeven. Geel is bijvoorbeeld: #FF0000 De HTML code voor het inkleuren van de hele tabel met geel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 bgcolor=#ffff00 border=1> A1 A2 B1 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en kleur deze, net als in het voorbeeld, de hele tabel door toevoeging van een kleur met bgcolor aan de <TABLE> tag 2Com2 internet & communicatie 137 maak je eigen website met webxpress

8 De HTML code voor het inkleuren van de titelregel met geel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> <TR bgcolor=#ffff00> A1 A2 B1 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en kleur, net als in het voorbeeld de bovenste rij cellen door toevoeging van het bgcolor attribuut aan de tag De HTML code voor het inkleuren van een cel met geel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> <TD bgcolor=#ffff00>a1</td> </TR> A1 A2 B1 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en kleur deze, net als in het voorbeeld de bovenste rij cellen door toevoeging van het bgcolor attribuut aan de <TD> tag 2Com2 internet & communicatie 138 maak je eigen website met webxpress

9 HTML en tabelranden In een aantal vervolgstappen wordt nu uitgelegd hoe we deze basistabel kunnen verfraaien. De HTML code van de basis tabel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> A1 B1 A2 B2 Voeg een tabel van 3 rijen en 2 toe aan een lege pagina. Vul de cellen zoals aangegeven in het voorbeeld. Ga naar de HTML weergave en bekijk de HTML code. Tabelranden Het vormgeven van de tabelranden kan met het border en cellspacing attribuut. border: met dit attribuut stelt u de dikte van de rand van de tabel in. De waarde wordt weergegeven in aantallen pixels. Een waarde 0 betekent geen rand. cellspacing: hiermee stelt u de ruimte in tussen de verschillende cellen in een tabel. Ook nu is de waarde weer in aantallen pixels. De standaardwaarde is hier 2. De HTML code voor een tabel met een hele dikke rand ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=10> A1 B1 A2 B2 2Com2 internet & communicatie 139 maak je eigen website met webxpress

10 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en pas de randdikte aan door de waarde van het border attribuut van de <TABLE> tag te wijzigen in 10 De HTML code voor een tabel met onzichtbare lijnen ziet er als volgt uit. <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=0> A1 B1 A2 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 en vul de cellen. Ga naar de HTML weergave en pas de randdikte aan door de waarde van het border attribuut van te wijzigen in 0. Ga daarna weer terug naar de Ontwerpen De HTML code voor een tabel met (zichtbare tabellijnen) veel ruimte tussen de cellen ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=10 cellpadding=1 border=2> A1 B1 A2 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en pas de weergave 2Com2 internet & communicatie 140 maak je eigen website met webxpress

11 aan door de waarde van het cellspacing en cellborder attribuut te wijzigen in 10 2Com2 internet & communicatie 141 maak je eigen website met webxpress

12 HTML en tabelgrootte In een aantal stappen wordt nu uitgelegd hoe we deze basistabel verder kunnen verfraaien. De HTML code van de basis tabel ziet er als volgt uit: <TABLE style="width: 100%" cellspacing=1 cellpadding=1 border=1> A1 B1 A2 B2 Tabelgrootte De breedte van de tabel kan worden ingesteld met het width attribuut. width: hiermee stelt u de breedte in van de tabel. Dit kunt u doen in een percentage of pixels. De HTML code voor het instellen van de tabel op een vaste breedte van 400 pixels ziet er als volgt uit: <TABLE cellspacing=1 cellpadding=1 width=400px border=1> A1 B1 A2 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 Ga naar de HTML weergave en pas de breedte van de tabel aan door de waarde van het width attribuut van de <TABLE> tag beide te wijzigen in 400px (pixels) De breedte van een cel kan ook met het width attribuut 2Com2 internet & communicatie 142 maak je eigen website met webxpress

13 ingesteld worden. De HTML code voor het instellen van de breedte van de eerste kolom op 250 pixels en tweede kolom op 150 pixels ziet er als volgt uit: <TABLE cellspacing=1 cellpadding=1 width=400px border=1> <TD width=250>titel 1</TD> <TD width=150>titel 2</TD></TR> <TD width=250>a1</td> <TD width=150>b1</td></tr> <TD width=250>a2</td> <TD width=150>b2</td></tr></tbody></table> A1 B1 A2 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 en vul de cellen Ga naar de HTML weergave en pas de breedte van de tabel aan door de waarde van het width attribuut van de <TABLE> tag beide te wijzigen in 400px (pixels) De hoogte van een cel kan met het height attribuut ingesteld worden. Height: dit stelt de hoogte in van de cel. U kunt de waarden opgeven in pixels en percentages. De HTML code voor het definiëren van verschillende hoogtes voor de titelregel en cellen ziet er als volgt uit: <TABLE cellpadding=1 width=400 border=2> <TR height=30> <TD width=250>titel 1</TD> <TD width=150>titel 2</TD></TR> <TR height=60> <TD width=250>a1</td> <TD width=150>b1</td></tr> <TR height=60> <TD width=250>a2</td> <TD width=150>b2</td></tr></tbody></table> A1 B1 A2 B2 Voeg een nieuwe tabel toe van 3 rijen en 2 2Com2 internet & communicatie 143 maak je eigen website met webxpress

14 Ga naar de HTML weergave en pas de breedte van de tabel aan door de waarde van het width attribuut van de <TABLE> tag beide te wijzigen in 400px (pixels) 2Com2 internet & communicatie 144 maak je eigen website met webxpress

15 HTML en tekstuitlijning in tabellen In een aantal stappen wordt nu uitgelegd hoe we deze basistabel nog meer kunnen verfraaien. De HTML code van een basis tabel ziet er als volgt uit: <TABLE cellpadding=1 width=400 border=1> <TD>Titel 2</TD> <TD>Titel 3</TD></TR> <TD>B1</TD> <TD>C1</TD></TR> <TD>B2</TD> <TD>C2</TD></TR></TBODY></TABLE> Titel 3 A1 B1 C1 A2 B2 C2 Tekstuitlijning Het uitlijnen van teksten kan met het align en valign attribuut. align: hiermee kunt u de inhoud van de hele rij horizontaal uitlijnen, de waarden zijn: left, center en right. De standaard waarde is left. valign: hiermee kunt u de verticale uitlijning van de inhoud van de rij bepalen. Mogelijke waarden: top, center en bottom. De standaard waarde is center. Het horizontaal uitlijnen van teksten in de hele tabel. De HTML code ziet er als volgt uit: < TABLE width="100%" border="1" cellpading=1 cellspacing=1> <TD align= left >Titel 1</TD> <TD align= center >Titel 2</TD> <TD align= right >Titel 3</TD> </TR> <TD align= left >A1</TD> <TD align= center >B1</TD> <TD align= right>c1</td> </TR> <TD align= left >A2</TD> <TD align= center >B2</TD> <TD align= right>c2</td> </TR> </TABLE> Titel 3 A1 B1 C1 A2 B2 C2 2Com2 internet & communicatie 145 maak je eigen website met webxpress

16 Voeg een nieuwe tabel toe van 3 rijen en 3 Vul de cellen Ga naar de HTML weergave en lijn de teksten in de linkerkolom links uit, centreer de teksten in de middelste kolom en lijn de teksten in de rechterkolom rechts uit Het vertikaal uitlijnen van teksten in de hele tabel. De HTML code ziet er als volgt uit: < TABLE width="100%" border="1" cellpading=1 cellspacing=1> <TD align= left valign= top >Titel 1</TD> <TD align= center valign= center >Titel 2</TD> <TD align= right valig= bottom >Titel 3</TD> </TR> <TD align= left valign= top >A1</TD> <TD align= center valign= center >B1</TD> <TD align= right valig= bottom >C1</TD></TR> <TD align= left valign= top >A2</TD> <TD align= center valign= center >B2</TD> <TD align= right valig= bottom >C2</TD></TR> </TABLE> Titel 1 A1 A2 Titel 2 B1 B2 Titel 3 C1 C2 Voeg een nieuwe tabel toe van 3 rijen en 3 Ga naar de HTML weergave en lijn de teksten in de linkerkolom links en boven uit, centreer de teksten in de middelste kolom en lijn de teksten in de rechterkolom rechts en beneden uit 2Com2 internet & communicatie 146 maak je eigen website met webxpress

17 HTML en samenvoegen van cellen In deze laatste stap een aantal stappen wordt uitgelegd hoe we deze basistabel helemaal naar onze hand kunnen zetten. De HTML code van een basis tabel ziet er als volgt uit: <TABLE cellpadding=1 width="100%" border=1> <TD>Titel 2</TD> <TD>Titel 3</TD></TR> <TD>B1</TD> <TD>C1</TD></TR> <TD>B2</TD> <TD>C2</TD></TR></TBODY></TABLE> Titel 3 A1 B1 C2 B1 B2 C2 Samenvoegen van cellen Het samenvoegen van cellen kan met het colspan en rowspan attribuut. colspan: bepaalt het aantal dat de cel inneemt. rowspan: bepaalt het aantal rijen dat de cel inneemt. Het samenvoegen van de drie titelcellen tot één cel ziet er in HTML als volgt uit: <TABLE cellpadding=1 width="100%" border=1> <TD colspan=3>titel van tabel</td></tr> <TD>B1</TD> <TD>C1</TD></TR> <TD>B2</TD> <TD>C2</TD></TR></TBODY></TABLE> Titel van tabel A1 B1 C1 B1 B2 C2 Voeg een nieuwe tabel toe van 3 rijen en 3 Ga naar de HTML weergave voeg de cellen van de titelrij samen 2Com2 internet & communicatie 147 maak je eigen website met webxpress

18 Het samenvoegen van de A1 en B1 cel tot X cel ziet er in HTML als volgt uit: <TABLE cellpadding=1 width="100%" border=1> <TD rowspan=3>x</td> <TD>Titel 2</TD> <TD>Titel 3</TD></TR> <TD>B1</TD> <TD>C1</TD></TR> <TD>B2</TD> <TD>C2</TD></TR></TBODY></TABLE> Voeg een nieuwe tabel toe van 3 rijen en 3 en vul de cellen. Ga naar de HTML weergave voeg de cellen van de eerste kolom samen. Ga daarna weer terug naar de Ontwerpen En natuurlijk kunnen colspan en rowspan ook gecombineerd worden, dit ziet er in HTML als volgt uit: X Titel 2 Titel 3 B1 C1 B2 C2 <TABLE cellpadding=1 width="100%" border=1> <TD colspan=3>titel van tabel</td></tr> <TD rowspan=2>a1</td> <TD>B1</TD> <TD>C1</TD></TR> <TD>B2</TD> <TD>C2</TD></TR></TBODY></TABLE> X Titel van tabel B1 B2 C1 C2 Voeg een nieuwe tabel toe van 3 rijen en 3 Ga naar de HTML weergave voeg de cellen van de eerste rij en de A1 en de A2 cellen samen 2Com2 internet & communicatie 148 maak je eigen website met webxpress

Met het element kan je een tabel invoegen, met
sluit je de tabel terug af.

Met het element <table> kan je een tabel invoegen, met </table> sluit je de tabel terug af. Les 7: Tabellen. Tabellen is iets dat veel en graag gebruikt wordt, met tabellen kun je immers een heleboel zaken overzichtelijker weergeven. Een tabel aanmaken in Html vergt wat inspanning omdat je met

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

Handleiding tabel binnen Tridion

Handleiding tabel binnen Tridion Handleiding tabel binnen Tridion 1. Tabel maken... 2 2. Tabblad Table... 4 3. Tabblad Row... 5 4. Tabblad Column... 5 5. Tabblad Cell... 6 6. Tabel bewerken... 8 7. Achtergrondkleur, tabelrand, header...

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 Webbuilding basis vorige les HTML intro Browsers HTML elementen HTML basis tags HTML attributen HTML kleuren HTML formattering Extra: HTML entities Webbuilding

Nadere informatie

HTML. Tabellen. Hans Roeyen V 3.0

HTML. Tabellen. Hans Roeyen V 3.0 Tabellen Hans Roeyen V 3.0 12 februari 2015 Inhoud 1. Tabellen... 3 1.1. De Tabel tags... 3 1.1.1. Het border attribuut... 4 1.2. De Tabel cellen... 4 1.3. Alignering en spanning... 8 1.1.2. De align attributen...

Nadere informatie

Uitleg invoegen en bewerken van tabellen

Uitleg invoegen en bewerken van tabellen Uitleg invoegen en bewerken van tabellen De werking van de nieuwe teksteditor is op hoofdlijnen vergelijkbaar met die van de oude teksteditor, maar wat betreft het invoegen en bewerken van tabellen is

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

Informatica. 2 e graad 2 e jaar

Informatica. 2 e graad 2 e jaar Informatica 2 e graad 2 e jaar Inhoudstafel Inhoudstafel... 2 1. Wat is XHTML en hoe werkt het?... 3 2. Tags... 6 2.1. Wat zijn Tags?... 6 2.2. Basisstructuur van een webpagina... 7 3. Soorten Tags...

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

Internet en website. Voorwaarden voor een goede website:

Internet en website. Voorwaarden voor een goede website: Internet en website Inleiding Zoals reeds aangehaald is internet een belangrijk onderdeel geworden ter info en activiteiten van een visclub. Vele visclubs en ook andere verenigingen communiceren met elkaar

Nadere informatie

Website met Wordpress

Website met Wordpress Website met Wordpress 5. Tabellen Onderwerpen van deze les: Editor Tiny MCE toevoegen Tabellen maken met TinyMCE WP-Table reloaded installeren en gebruiken Excel importeren in WP-Table reloaded Content

Nadere informatie

HANDLEIDING I-MATE. Inhoud. I-Mate handleiding

HANDLEIDING I-MATE. Inhoud. I-Mate handleiding HANDLEIDING I-MATE Inhoud I-Mate handleiding 1. Opstarten van I-Mate 2. Opbouw van I-Mate 3. Een pagina in de editor openen 4. Tekst invoeren en aanpassen 5. Tekst opmaken 6. Lijsten aanmaken 7. Een horizontale

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

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

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

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

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

15. Tabellen. 1. wat rijen, kolommen en cellen zijn; 2. rijen en kolommen invoegen; 3. een tabel invoegen en weer verwijderen;

15. Tabellen. 1. wat rijen, kolommen en cellen zijn; 2. rijen en kolommen invoegen; 3. een tabel invoegen en weer verwijderen; 15. Tabellen Misschien heeft u al eens geprobeerd om gegevens in een aantal kolommen te plaatsen door gebruik te maken van spaties, kolommen of tabs. Dat verloopt goed totdat u gegevens wilt wijzigen of

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

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

Uw TEKSTEDITOR - alle iconen op een rij

Uw TEKSTEDITOR - alle iconen op een rij Uw TEKSTEDITOR - alle iconen op een rij Hieronder ziet u alle functionaliteiten van uw teksteditor onder elkaar ( op alfabetische volgorde). Afbeelding (zie foto) Bestanden (zie link) Broncode Citaat Documenten

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

HTML 5 en CSS 3. Truus de Bont. CC Naamsvermelding 3.0 Nederland licentie. https://maken.wikiwijs.nl/65505

HTML 5 en CSS 3. Truus de Bont. CC Naamsvermelding 3.0 Nederland licentie. https://maken.wikiwijs.nl/65505 HTML 5 en CSS 3 Auteur Laatst gewijzigd Licentie Webadres Truus de Bont 14 september 2015 CC Naamsvermelding 3.0 Nederland licentie https://maken.wikiwijs.nl/65505 Dit lesmateriaal is gemaakt met Wikiwijs

Nadere informatie

De tekstverwerker. Afb. 1 de tekstverwerker

De tekstverwerker. Afb. 1 de tekstverwerker De tekstverwerker De tekstverwerker is een module die u bij het vullen van uw website veel zult gebruiken. Naast de module tekst maken onder andere de modules Aankondigingen en Events ook gebruik van de

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

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 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

Descendant selectors toepassen

Descendant selectors toepassen HTML EN CSS de basis Oefening 13.4 Descendant selectors toepassen Maak een lijst binnen een definitielijstlijst en geef de binnenste lijst een totaal andere vormgeving. 13.7 Verticaal navigatieblok Een

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

Checklist websiteonderhoud divosa.nl

Checklist websiteonderhoud divosa.nl Checklist websiteonderhoud divosa.nl 1. Tekst opschonen Zorg altijd dat je gekopieerde tekst vanuit Word of e-mailberichten is opgeschoond voordat je deze in de editor van Drupal zet. Plak je tekst eerst

Nadere informatie

Gebruikershandleiding

Gebruikershandleiding Gebruikershandleiding Datum 1 september 2005 Versie 1.0 Copyright Ni-Frith Media Systems 1 / 59 1 Inleiding... 4 1.1 Let op:... 4 2 De werking... 5 2.1 Templates... 5 2.2 Schematisch... 6 3 De structuur

Nadere informatie

Handleiding voor het Huisstijlhandboek

Handleiding voor het Huisstijlhandboek Datum 23.03.11 pagina 1 / 21 Handleiding voor het Huisstijlhandboek Voor klanten van Dim is het mogelijk om een online huisstijlhandboek te realiseren. Dit huisstijlhandboek behelst alle uitingen van de

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

Er is nog heel wat voor nodig om van alle losse HTML-code

Er is nog heel wat voor nodig om van alle losse HTML-code Boxmodel, weergavemodel en positionering 9 Er is nog heel wat voor nodig om van alle losse HTML-code een toonbare pagina te maken, meer dan u misschien op het eerste gezicht denkt. Als de HTML-code is

Nadere informatie

Hoofdstuk 27: Celopmaak* 2010

Hoofdstuk 27: Celopmaak* 2010 Hoofdstuk 27: Celopmaak* 2010 27.0 Inleiding In dit deel wordt beschreven hoe je het werk er goed kunt laten uitzien. Besproken zal worden wat er binnenin de cel en aan de celgrenzen gebeurt en wanneer

Nadere informatie

Programmeren in MyShop

Programmeren in MyShop Programmeren in MyShop Wat leer je in dit hoofdstuk: - Wat HTML en CSS is - (Een heel klein beetje) HTML - (Een heel klein beetje) CSS - Een aangepaste footer maken ( deurmat ) Eindresultaat Je gaat je

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

HTML KISS-proof. ( Keep It Simply Stupid)

HTML KISS-proof. ( Keep It Simply Stupid) HTML KISS-proof ( Keep It Simply Stupid) Een stap-voor-stap minicursus basisvaardigheden HTML. Voor diegenen onder ons die graag een HTML-homepage willen maken, snel resultaat willen, maar er nog helemaal

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

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

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

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

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

Whitepaper. E-mail design best practices

Whitepaper. E-mail design best practices Whitepaper E-mail design best practices 14 tips voor het design van je e-mail Versterk de boodschap van je uiting Best practices voor je e-mail design Het design speelt een grote rol in de eerste indruk

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

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

Editie 2010. Handleiding Tiny MCE. Tiny MCE Uitgebreide handleiding Sanmax bvba Mieënbroekstraat 33 3600 Genk T 070.250.236 E info@sanmax.

Editie 2010. Handleiding Tiny MCE. Tiny MCE Uitgebreide handleiding Sanmax bvba Mieënbroekstraat 33 3600 Genk T 070.250.236 E info@sanmax. Editie 2010 Handleiding Tiny Tiny Uitgebreide handleiding Sanmax bvba Mieënbroekstraat 33 3600 Genk T 070.250.236 E info@sanmax.be Sanmax Tiny handleiding Inhoudsopgave Deel 1: Inleiding... 3 Deel 2: icoontjes

Nadere informatie

Safira CMS Handleiding

Safira CMS Handleiding Safira CMS Handleiding Inhoudsopgave 1Mappen en artikelen... 2 1.11.1 Naam wijzigen map/ pagina... 3 1.21.2 Website structuur: nieuwe pagina aanmaken, pagina verwijderen, pagina blokkeren, structuur wijzigen...

Nadere informatie

Handleiding bij de onderhoudsmodule van de Hermes CMS website.

Handleiding bij de onderhoudsmodule van de Hermes CMS website. Handleiding bij de onderhoudsmodule van de Hermes CMS website. Voor wie? U wilt uw bedrijf professioneel voor stellen? U wenst uw website graag zelf te onderhouden? U wenst het budget laag te houden? Wat?

Nadere informatie

<meta name=description content= de tekst die in zoekresultaten bij de link te lezen is /> Author Description Favicon

Nadere informatie

Les 6 Kalender maken. Gerkje Gouweouwe

Les 6 Kalender maken. Gerkje Gouweouwe 2014 Les 6 Kalender maken Gerkje Gouweouwe 25-5-2014 LES 6 KALENDER MAKEN IN WORD. Open Word, klik Tabblad Invoegen klik onder Tabel op het Vinkje en kies Tabel invoegen onderstaand scherm verschijnt.

Nadere informatie

HTML. KISS-proof. ( Keep It Simply Stupid)

HTML. KISS-proof. ( Keep It Simply Stupid) HTML KISS-proof ( Keep It Simply Stupid) Een stap-voor-stap minicursus basisvaardigheden HTML. Voor diegenen die graag een HTML-homepage willen maken, snel resultaat willen, maar er nog helemaal niets

Nadere informatie

Wat is een child-theme?

Wat is een child-theme? Child theme Waarschuwing 1. Het maken van een child theme is relatief eenvoudig, u hebt er wel FTP toegang voor nodig bij uw provider. 2. Het is soms lastig om precies uit te vinden welke css codes u moet

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

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

R5.0. Bijlage I. Wysiwyg editor. Handleiding. Clixmaster Studio. Gebruikershandleidingen

R5.0. Bijlage I. Wysiwyg editor. Handleiding. Clixmaster Studio. Gebruikershandleidingen Bijlage I R5.0 Wysiwyg editor Gebruikershandleidingen Clixmaster Studio Handleiding 1/8 Bijlage I Wysiwyg editor 2010 Clixmaster BV Alle rechten voorbehouden. Niets uit deze uitgave mag worden verveelvoudigd,

Nadere informatie

Zelf een eenvoudige website opzetten. Jorrit Groenevelt & Arjan Kraak Juni 2013

Zelf een eenvoudige website opzetten. Jorrit Groenevelt & Arjan Kraak Juni 2013 Zelf een eenvoudige website opzetten Jorrit Groenevelt & Arjan Kraak Juni 2013 1 Inleiding/Doel Een onmisbaar onderdeel van het starten van een bedrijf is het opzetten van een website. Een onderneming

Nadere informatie

PLAKKEN Nadat u een gedeelte heeft geknipt of gekopieerd kunt u met dit icoon de selectie weer in het veld plakken.

PLAKKEN Nadat u een gedeelte heeft geknipt of gekopieerd kunt u met dit icoon de selectie weer in het veld plakken. KNIPPEN Als u na de selectie van een gedeelte van een tekst of een afbeelding op dit icoon klikt, knipt u de selectie uit het veld. Op deze manier kunt u het geselecteerde verwijderen, maar het ook juist

Nadere informatie

Hoofdstuk 7: Tabellen 166

Hoofdstuk 7: Tabellen 166 Hoofdstuk 7: Tabellen 166 7. Tabellen 7.1. Werken met tabellen 7.1.1. Wat is Een tabel bestaat uit rijen en kolommen met cellen waarin je tekst, figuren en andere webelementen kan invoegen. Je kan tabellen

Nadere informatie

Hoe een bericht toevoegen, wijzigen en verwijderen werd al besproken in lesje 2.

Hoe een bericht toevoegen, wijzigen en verwijderen werd al besproken in lesje 2. Bericht vorm geven Hoe een bericht toevoegen, wijzigen en verwijderen werd al besproken in lesje 2. Log in op u blog. Klik op Toevoegen Figuur 1 Het is ook mogelijk om smileys in uw tekst in te voegen

Nadere informatie

Hand-out Web Technologies, werkcollege 5 Alex Reuneker 2012

Hand-out Web Technologies, werkcollege 5 Alex Reuneker 2012 Hand-out Web Technologies, werkcollege 5 Alex Reuneker (a.reuneker@hhs.nl), 2012 1. Groeperen (div- en span-elementen) : Het HTML-element div is een block-level element (zie hand-out bij het

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

Websitecursus deel 2 CSS

Websitecursus deel 2 CSS Websitecursus deel 2 CSS A Eskwadraat WebCie www@a-eskwadraat.nl 5 oktober 2015 Introductie Vorige week HTML Deze week CSS Volgende week Javascript CSS CSS (Cascading Style Sheets) bepalen hoe een website

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

HANDLEIDING HOE AANPASSINGEN AAN JE WEBSITE TOEBRENGEN? 1 DE BASIS... 2 A INLOGGEN... 2 B HOE GA JE NAAR EEN BEPAALDE PAGINA OP DE WEBSITE?...

HANDLEIDING HOE AANPASSINGEN AAN JE WEBSITE TOEBRENGEN? 1 DE BASIS... 2 A INLOGGEN... 2 B HOE GA JE NAAR EEN BEPAALDE PAGINA OP DE WEBSITE?... HANDLEIDING HOE AANPASSINGEN AAN JE WEBSITE TOEBRENGEN? INHOUD 1 DE BASIS... 2 A INLOGGEN... 2 B HOE GA JE NAAR EEN BEPAALDE PAGINA OP DE WEBSITE?... 2 C TEKST AANPASSEN... 2 D JE WILT JE AANPASSINGEN

Nadere informatie

Stap 3 Wat kunnen we met de inhoud?

Stap 3 Wat kunnen we met de inhoud? Stap 3 Wat kunnen we met de inhoud? We gaan in deze stap eens bestuderen wat we zoal voor mogelijkheden hebben om tekst op te maken en links in te voegen. Kompozer heeft voor de meest voorkomende zaken

Nadere informatie

Toelichting Tabellen. Tabel opmaken

Toelichting Tabellen. Tabel opmaken Versie 0615.03 Toelichting Tabellen Met de tabelfunctie is het mogelijk om een eenvoudige tabellen in Docufiller te plaatsen. Het is mogelijk om een tabel vanaf het begin op te maken of een volledige tabel

Nadere informatie

A Inloggen. B - Wachtwoord Veranderen

A Inloggen. B - Wachtwoord Veranderen A Inloggen 1. Ga naar http://webtinq.nl 2. Klik op de knop "Login". 3. Voer het e-mail adres en wachtwoord in dat je hebt gekregen. 4. Klik op de knop "Login". 5. Je bent nu ingelogd! B - Wachtwoord Veranderen

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

Schoolwebsite.nu. Snel aan de slag met uw website. Versie 4.0

Schoolwebsite.nu. Snel aan de slag met uw website. Versie 4.0 Schoolwebsite.nu Snel aan de slag met uw website Versie 4.0 Inhoudsopgave Inhoudsopgave... 2 1 Inleiding... 3 2 Voor dat u begint... 4 3 Teksten op de website... 6 4 Groepspagina s... 8 5 De groepspagina...

Nadere informatie

Handleiding CMS VOORKANT

Handleiding CMS VOORKANT Handleiding CMS VOORKANT Inhoudsopgave Pagina 1. Toegang tot het CMS... 3 2. Artikel toevoegen... 4 3. Artikel bewerken... 5 4. Artikel kopiëren of verwijderen... 6 5. Afbeelding, link of tabel invoegen...

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

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

Hier komt alle informatie over je webpagina, welke niet zichtbaar is op de webpagina zelf.

Hier komt alle informatie over je webpagina, welke niet zichtbaar is op de webpagina zelf. Elke website begint met een basisstructuur. Deze basisstructuur is opgebouwd uit drie tags. Je gebruikt eerst de - tag welke aangeeft wat voor type document het is. Dan de - tag. Hier komt

Nadere informatie

Werken met de editor in het beheerpaneel

Werken met de editor in het beheerpaneel Werken met de editor in het beheerpaneel In het beheerpaneel van i-reserve wordt op een aantal schermen gewerkt met een editor. Bijvoorbeeld bij de e- mail en factuur templates, maar ook in het product-detailscherm.

Nadere informatie

4. De homepagina maken

4. De homepagina maken 95 4. De homepagina maken Als u een thema heeft geïnstalleerd, is al een aantal onderdelen ingevuld als voorbeeld. Naast de header staan er ook voorbeeldteksten, afbeeldingen, hyperlinks en soms nog andere

Nadere informatie

Voorbeeld: In een tekstverwerker staat: Dit is scheve tekst Om in HTML hetzelfde effect te krijgen moet er staan: dit is scheve tekst

Voorbeeld: In een tekstverwerker staat: Dit is scheve tekst Om in HTML hetzelfde effect te krijgen moet er staan: <i>dit is scheve tekst</i> Wat is HTML? HTML staat voor HyperText Markup Language. Een HTML tekst bestaat uit zogenaamde platte tekst (ook wel de eerste 128 tekens van ASCII genoemd). In tegenstelling tot bijvoorbeeld tekstverwerker

Nadere informatie

Je ziet het ontwerpscherm voor je. Ontwerpen is actief en dat zie je aan de linkeronderkant van je scherm net boven de taakbalk.

Je ziet het ontwerpscherm voor je. Ontwerpen is actief en dat zie je aan de linkeronderkant van je scherm net boven de taakbalk. Inhoudsopgave frontpage 2003... 2 een thema gebruiken... 4 afbeeldingen op de pagina zetten... 5 knoppen maken... 8 knoppen maken in linkerframe... 10 een tabel maken... 12 opdrachten... 14 een fotopagina

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

Min-height en min-width

Min-height en min-width Oefening 15.5 Min-height en min-width Maak op van uw een webpagina s een div die u voorziet van een geschikte waarde voor min-height en min-width. Laat zien wat er gebeurt als u het lettertype verkleint

Nadere informatie

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com Welkom bij mijn website tutorial (Deel 7) 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

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

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

Handleiding Tridion voor authors en editors

Handleiding Tridion voor authors en editors Handleiding Tridion voor authors en editors Wijzigen van items van vóór de herimplementatie (mei 2009) Telefoon helpdesk: 7500 E-mail: helpdesktridion@gmail.com. Juli 2009 Een bestaand item wijzigen Het

Nadere informatie

1click updatemodule. Hoe bereiken? U kunt uw CMS eenvoudig bereiken door vlak achter uw domeinnaam /cms te plaatsen. Bv. www.uwsite.be/cms.

1click updatemodule. Hoe bereiken? U kunt uw CMS eenvoudig bereiken door vlak achter uw domeinnaam /cms te plaatsen. Bv. www.uwsite.be/cms. 1click updatemodule Introductie 1Click Light is wat men in de termen van het vak noemt een CMS of Content Management System. Wanneer we dit letterlijk vertalen betekent dit Inhoud Beheer Systeem. Kort

Nadere informatie

Les 1a: Downloaden en instellen van software Software gebruik

Les 1a: Downloaden en instellen van software Software gebruik Les 1a: Downloaden en instellen van software Software gebruik Eisen computer Deze e-cursus heb ik geschreven voor gebruikers van een Windows computer. Zelf gebruik ik voor deze cursus Windows 7. Mocht

Nadere informatie

Introductie 2. Inloggen 3. Dashboard 4. Pagina aanmaken / bewerken 5. Bericht toevoegen / bewerken 6. Afbeelding toevoegen 7. De tekstbewerker 11

Introductie 2. Inloggen 3. Dashboard 4. Pagina aanmaken / bewerken 5. Bericht toevoegen / bewerken 6. Afbeelding toevoegen 7. De tekstbewerker 11 I n h o u d s o p g ave Introductie 2 Inloggen 3 Dashboard 4 Pagina aanmaken / bewerken 5 Bericht toevoegen / bewerken 6 Afbeelding toevoegen 7 De tekstbewerker 11 Menu toevoegen / aanpassen 12 I n t ro

Nadere informatie

Historische filmrecensie Hotel Rwanda digitaal dossier klas 3V

Historische filmrecensie Hotel Rwanda digitaal dossier klas 3V Historische filmrecensie Hotel Rwanda digitaal dossier klas 3V Wij bekijken met elkaar de film Hotel Rwanda. In deze film komen verschillende onderwerpen van de geschiedenislessen van afgelopen schooljaar

Nadere informatie

Werken in html. Linda le Grand. CC Naamsvermelding-GelijkDelen 3.0 Nederland licentie.

Werken in html. Linda le Grand. CC Naamsvermelding-GelijkDelen 3.0 Nederland licentie. Auteur Linda le Grand Laatst gewijzigd 05 August 2013 Licentie CC Naamsvermelding-GelijkDelen 3.0 Nederland licentie Webadres http://maken.wikiwijs.nl/45861 Dit lesmateriaal is gemaakt met Wikiwijs Maken

Nadere informatie

I Het maken van een nieuwsbrief

I Het maken van een nieuwsbrief I Het maken van een nieuwsbrief Wat leer je? Veel bedrijven publiceren een korte nieuwsbrief waar zij hun personeel op de hoogte houden van belangrijke ontwikkelingen binnen het bedrijf. Hier meldt men

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

Versie: 1.0 Gemaakt door: Whisper380 Eigenaar: Whisper380-computerhulp Datum: 23-1-2011

Versie: 1.0 Gemaakt door: Whisper380 Eigenaar: Whisper380-computerhulp Datum: 23-1-2011 Versie: 1.0 Gemaakt door: Whisper380 Eigenaar: Whisper380-computerhulp Datum: 23-1-2011 1 Inhoudsopgave Wat gaan we doen?... 4 Eerst wat uitleg:... 4 Wat is HTML:... 4 Wat is CSS:... 4 Wat is het resultaat

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

De tekst staat nu aan de linkerkant. De tekst staat nu aan de rechterkant. De tekst staat nu in het midden.

De tekst staat nu aan de linkerkant. De tekst staat nu aan de rechterkant. De tekst staat nu in het midden. 1. Uitlijnen Uitlijnen: De manier waarop een regel wordt getoond. Dit kan op vier verschillende manieren. We geven hieronder vier voorbeelden. A. Links uitlijnen De tekst staat nu aan de linkerkant. B.

Nadere informatie

Een pagina toevoegen en/of bewerken.

Een pagina toevoegen en/of bewerken. Een pagina toevoegen en/of bewerken. Na het inloggen in het CMS zie u het volgende: 2 3. Een klik op dit menu geeft een overzicht van alle pagina s waar de website op dat moment uit bestaat: 2. Een klik

Nadere informatie

E.M. van Nieuwaal. Frontpage 2003. Jouw vak op het leerlingenweb. Copyright 2008. http://cursus.anguillanova.nl

E.M. van Nieuwaal. Frontpage 2003. Jouw vak op het leerlingenweb. Copyright 2008. http://cursus.anguillanova.nl Frontpage 2003 Jouw vak op het leerlingenweb E.M. van Nieuwaal Copyright 2008 http://cursus.anguillanova.nl Inleiding... 3 1. Ontwerp een sitemap... 4 2. Index.htm... 4 3. Nieuwe pagina s maken... 7 4.

Nadere informatie

Inhalen les 7 (versie B)

Inhalen les 7 (versie B) Inhalen les 7 (versie B) Stap 1: Open de startmap van les 6 De map heet Startmap Les 6. Als je de map hebt geöpend zie je verschillende bestanden en een map Website. Wij gebruiken nu alleen de map Website.

Nadere informatie

Leren werken met Excel en Tabellen maken

Leren werken met Excel en Tabellen maken Leren werken met Excel en Tabellen maken Loek Halman & Josja Rokven I. Leren werken met Excel Instructie Excel is een van de meest gebruikte programma s. Het is bijna onmisbaar voor iedereen de veel met

Nadere informatie

Module 4 Opmaak van een werkblad en cellen

Module 4 Opmaak van een werkblad en cellen Module 4 Opmaak van een werkblad en cellen Kolombreedte en rijhoogte#breedtehoogte Opmaak van cellen Lettertype Uitlijning Opvulling Randen Getallen Datum en tijd Voorwaardelijke opmaak Gebruik van thema's

Nadere informatie

Opdrachtgever: Avpec1910 Auteur: Avalon Systems Versie: 1.0 Datum: 12/01/2011. Handleiding WYSIWYG HTML editor: CKEditor

Opdrachtgever: Avpec1910 Auteur: Avalon Systems Versie: 1.0 Datum: 12/01/2011. Handleiding WYSIWYG HTML editor: CKEditor Opdrachtgever: Avpec1910 Auteur: Avalon Systems Versie: 1.0 Datum: 12/01/2011 Handleiding WYSIWYG HTML editor: CKEditor Inhoud 1 Inleiding... 3 2 WYSIWYG editor... 4 2.1 Iconen toegelicht... 5 2.2 Maximaliseren...

Nadere informatie