LES 6 HTML, STYLE SHEETS EN DE AFBOUW VAN DE WEBSITE

Maat: px
Weergave met pagina beginnen:

Download "LES 6 HTML, STYLE SHEETS EN DE AFBOUW VAN DE WEBSITE"

Transcriptie

1 LES 6 HTML, STYLE SHEETS EN DE AFBOUW VAN DE WEBSITE Eerst wat theorie. Kijkt u eens naar de links. De link Bolnes eerst zonder lijntje onder, en dan met een lijntje boven. Dat resultaat is verkregen door het CSS style element text-decoration te gebruiken. De eerste toont textdecoration:none de tweede text-decoration: overline. Hieronder is een passage uit het html-bestand weergegeven en is text-decoration: overline in de desbetreffende link gezet. <a style= text-decoration:overline; href= vers-bolnesserbocht.html >Bolnes</a> / <a href= vers-drierivierenpunt.html >Slikkerveer</a> / <a href= vers-nieuwcentrum.html >Ridderkerk</a> / <a href= vers-moederenzoon.html >Rijsoord</a> / <a href= vers-wassenaarwaal.html >Oostendam</a> <h3 style="margin-top: 55px;">Bolnesserbocht in De Nieuwe Maas</h3> <p style="margin-top: 30px;"> Bolnesserbocht in De Nieuwe Maas<br> Als je weet dat je ook de links Bolnes, Slikkerveer, etc. andere kleuren kunt geven, trek je niet ten onrechte de conclusie dat er zo een vrolijke boel kan ontstaan, en dat met CSS kennelijk veel mogelijk is op het gebied van het opmaken van webpagina's. Zeker, zeker.

2 CSS externe werkwijze. Een korte STYLE SHEET introductie. Een goed moment om opnieuw aandacht te vragen voor de CSS-werkwijzen. Vanaf Les 3 volgden we een interne CSS-werkwijze, door CSS-style code in het htmlbestand te plaatsen, als onderdeel van HTML code elementen binnen het <body>..</body> deel van een HTML-bestand. Voorbeeld: <h3 style="margin-top: 55px;">Drierivierenpunt Ridderkerk</h3> De externe CSS-werkwijze houdt in dat je de style code op een aparte pagina verzamelt. Voorbeeld: HTML-pagina: <h3>drierivierenpunt Ridderkerk</h3> CSS-pagina: h3 { margin-top: 55px; } De CSS-pagina wordt met een link aan de HTML-pagina gekoppeld. Voorbeeld: Zou je een CSS-pagina opslaan als meezinger.css dan wordt de link zoiets als: <link rel="stylesheet" href="meezinger.css" type="text/css"> De link in de head van de HTML-pagina plaatsen. Voorbeeld: <title>drierivierenpunt Ridderkerk. Te Slikkerveer. Couplet 2 van de Ridderkerkse Meezinger. <meta name=description content= Drierivierenpunt Ridderkerk bezongen in het tweede couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Drierivierenpunt Ridderkerk, De Noord, De Lek, De Nieuwe Maas, Ridderkerk, Meezinger > <link rel="stylesheet" href="meezinger.css" type="text/css"> rel is de verkorting van 'relationship', de link legt een relatie tussen de HTML-pagine en de CSS-pagina, de pagina met de style-elementen, kortom een 'stylesheet' href zijn we al tegengekomen bij de links; het geeft aan welk pad de relatie neemt; in dit geval is er geen pad: het stylesheet 'meezinger.css' bevindt zich in dezelfde map als het html-bestand; het hoeft geen practicum/meezinger.css te worden of nog uitgebreider; alleen: meezinger.css type betreft een css-bestand, en dat is text/css Tot zo ver de korte introductie van de CSS externe werkwijze. We werken het nog verder uit in een nieuw blok lessen. We handhaven thans voor de betrekkelijk kleine website De Ridderkerkse Meezinger de interne CSS-werkwijze. AFRONDING BOUW WEBSITE De voorpagina: de homepage Deze pagina maken naar het voorbeeld van de andere pagina's, met het opvallendste verschil dat we op de plaats van de tekst van het vers, een foto plaatsen. Dat is geen regel. Foto's kun je op alle pagina's plaatsen.maar ik heb een goed gevoel bij deze layout. Hoe zet je een foto in je webpagina?

3 In HTML-CSS-termen behoort een foto tot de categorie: afbeelding, in het Engels: image, hetgeen verkort wordt weergegeven met img. Je moet vertellen waar de afbeelding de foto in ons geval te vinden is. Je moet de bron noemen, in het Engels source, verkort tot src. Er behoort ook een beschrijving bij als terugvaloptievoor het geval er iets is waardoor de foto niet op het scherm wordt geplaatst, en omdat voorlees- en zoekprogramma's het uitlezen op prijs stellen. In het Engels wordt 'alternate' gebruikt, een soort alternatief, in de verkorte vorm: alt. Je kunt er ook nog een titel in zetten: title=.. Dat wordt zoiets als <img src=.. alt=.. title=.. > Met een style=.. erin kun je de presentatie van de foto in de webpagina naar je hand zetten. Hieronder hebben het bestand ingevuld, de korte beschrijving, de afmetingen aangegeven, de foto gecentreerd, en de marges <img src= meezinger.jpg. alt= de bocht in de rivier de Nieuwe Maas ter hoogte van Bolnes, foto Faas van Rietschoten title= de bocht in de rivier de Nieuwe Maas ter hoogte van Bolnes, foto Faas van Rietschoten style= width:550px; height:auto; float:center; margin: 10px 0; > Foto's met de huidige toestellen gemaakt zijn globaal genomen 1 Mb tot 12 MB groot met resoluties van wel enkele duizenden pixels breedte. Voor een 'gewone' homepage (website) die op een beeldscherm wordt geplaatst, waarin je iets wil vertellen en dat opleukt met illustraties wordt wel de vuistregel voor foto's gegeven 0,1 MB (100kB) groot en 500px breed (ongeveer de helft van een tradionele homepage.) Laten we een proef nemen met Paint. Onderstaande foto kwam 4 MB groot en 4000 pixels breed uit het fototoestel. In Paint geplakt, en horizontaal bij pixels 500 ingevuld; daarop werd als grootte 123 kb aangegeven. Meer weten? Kijk eens op sites als Mijn-eigenwebsite.nl. Struin af. Of begin een surftocht vanaf Google.

4 Foto voorpagina 'Bolnesserbocht in de Nieuwe Maas'. Op de voorpagina staan de links naar de vijf pagina's met de verzen. We maken nog link aan voor de voorpagina: <a href="index-practicum.html">home</a>. Op de vijf pagina's met een vers, de naam van de auteur cursief: <p style="fontstyle: italic; font-size: 100%; color: #404040; margin-top: 30px;">Faas van Rietschoten We hebben de bovenmarge weer veranderd, van eerst 100px naar 50px, en nu definitef naar 75px: margin-top:75px; Op de pagina met het eigen vers deactiveren we de pagina-link in het menu. Vervolgens dwingen ons zelf nu de beginners-website als afgerond te beschouwen. We uploaden de tekstbestanden en foto naar de server... en... Het resultaat van het practicum: de kleine website 'De Ridderkerkse Meezinger', staat op Internet. Op het adres De website werd geleidelijk opgebouwd. De opbouw werd uitgelegd. Vanaf Les 1 tot en met deze Les 6, waarin nu nog de definiteve inhoud geheel uitgeschreven wordt vermeld. De website bestaat uit één foto: meezinger.jpg en zes HTML-CSS bestanden: index-practicum.html, vers-bolnesserbocht.html, vers-drierivierenpunt.html, vers-nieuwcentrum.html, vers-moederenzoon.html, vers-wassenaarwaal.html Hieronder alle bestanddelen van de website.

5 VOORPAGINA: DE RIDDERKERKSE MEEZINGER Nieuwe map maken, geef de map de naam: practicum Onderstaand bestand selecteren, kopiëren en in de map practicum opslaan als: indexpracticum.html <!DOCTYPE html> <html lang=nl> <title>de Ridderkerkse Meezinger. Een vijf dorpen lied. Van Faas van Rietschoten. <meta name=description content= De vijf oude kerndorpen van Ridderkerk: Bolnes, Slikkerveer, Ridderkerk, Rijsoord, Oostendam bezongen in de Ridderkerkse Meezinger > <meta name=keywords content= Bolnes, Slikkerveer, Ridderkerk, Rijsoord, Oostendam, De Ridderkerkse Meezinger > <style> a { text-decoration:none; } </style> <body style="background: #dddddd; text-align: center; margin-top: 50px; font-family: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> Home / <a href="vers-bolnesserbocht.html">bolnes</a> / <a href="vers-drierivierenpunt.html">slikkerveer</a> / <a href="vers-nieuwcentrum.html">ridderkerk</a> / <a href="vers-moederenzoon.html">rijsoord</a> / <a href="vers-wassenaarwaal.html">oostendam</a> <img src="meezinger.jpg" alt="foto rivierbocht nieuwe maas ter hoogte van bolnes, foto faas van rietschoten 2014" style="width:650px; height:auto; float:center; margin: 30px 0 15px 0"> <p style="font-size: 75%; color: #404040; margin-top: 5px;">Beeld en tekst: Faas van Rietschoten 2014<br><a href="practicum.html" target="_blank">lesmateriaal</a> </body> </html>

6 FOTO Foto selecteren, kopiëren en in de map practicum opslaan als: meezinger.jpg

7 BOLNES: BOLNESSERBOCHT IN DE NIEUWE MAAS Onderstaand bestand selecteren, kopiëren en in de map practicum opslaan als: versdrierivierenpunt.html <!DOCTYPE html> <html lang=nl> <title>bolnesserbocht in de Nieuwe Maas. Couplet van de Ridderkerkse Meezinger. <meta name=description content= Bolnesserbocht in de Nieuwe Maas bezongen in het eerste couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Bolnes, De Nieuwe Maas, Ridderkerk, Meezinger > <body style="background: cornsilk; text-align: center; margin-top: 50px; fontfamily: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> <a href="index-practicum.html">home</a> / Bolnes / <a href="vers-drierivierenpunt.html">slikkerveer</a> / <a href="vers-nieuwcentrum.html">ridderkerk</a> / <a href="vers-moederenzoon.html">rijsoord</a> / <a href="vers-wassenaarwaal.html">oostendam</a> <h3 style="margin-top: 55px;">Bolnesserbocht in De Nieuwe Maas</h3> <p style="margin-top: 30px;"> Bolnesserbocht in De Nieuwe Maas<br> Daar stroomt heel wat water door heen<br> Hoe houd je het droog<br> Ja, dat is dan de vraag<br> Door dijken op deltaniveau Dijkhuizen verdwenen, de werf op zijn beurt<br> Geen lasser of klinker die niet heeft getreurd<br> Na tijden vol onzekerheid<br> Wordt toch langs de dijk weer geheid De woningen die er nu staan<br> Zijn torens zo hoog als een kraan<br> Zijn torens zo hoog als een kraan <p style="font-style: italic; font-size: 100%; color: #404040; margin-top: 30px;">Faas van Rietschoten </body> </html>

8 SLIKKERVEER: HET DRIERIVIERENPUNT RIDDERKERK Onderstaand bestand selecteren, kopiëren en in de map practicum opslaan als: versdrierivierenpunt.html <!DOCTYPE html> <html lang=nl> <title>drierivierenpunt Ridderkerk. Te Slikkerveer. Couplet 2 van de Ridderkerkse Meezinger. <meta name=description content= Drierivierenpunt Ridderkerk bezongen in het tweede couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Drierivierenpunt Ridderkerk, De Noord, De Lek, De Nieuwe Maas, Ridderkerk, Meezinger > <body style="background: lightcyan; text-align: center; margin-top: 50px; fontfamily: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> <a href="index-practicum.html">home</a> / <a href="vers-bolnesserbocht.html">bolnes</a> / Slikkerveer</a> / <a href="vers-nieuwcentrum.html">ridderkerk</a> / <a href="vers-moederenzoon.html">rijsoord</a> / <a href="vers-wassenaarwaal.html">oostendam</a> <h3 style="margin-top: 55px;">Drierivierenpunt Ridderkerk</h3> <p style="margin-top: 30px;"> Het drierivierenpunt Ridderkerk <br> de Noord, de Lek, de Nieuwe Maas<br> Daar moet u voor <br> naar de wijk Slikkerveer<br> Dat is u op school geleerd De Lek komt uit Maurik, uit Dordrecht de Noord<br> Dan samen op weg als Nieuwe Maas, dat bekoort<br> En wilt u het zelf gadeslaan<br> Dan moet u de dijk overgaan Komt allemaal naar Slikkerveer<br> Er vaart ook een pont heen en weer<br> Er vaart ook een pont heen en weer <p style="font-style: italic; font-size: 100%; color: #404040; margin-top: 30px;">Faas van Rietschoten </body> </html>

9 RIDDERKERK: OP HET NIEUWE CENTRUM VAN RIDDERKERK Onderstaand bestand selecteren en in de map practicum opslaan als: versnieuwcentrum.html <!DOCTYPE html> <html lang=nl> <title>op het nieuwe centrum van Ridderkerk. Couplet 3 van de Ridderkerkse Meezinger. <meta name=description content= Het nieuwe centrum van Ridderkerk bezongen in het derde couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Ridderkerk-Centrum, Nieuwbouw, Ridderkerk, Meezinger > <body style="background: white; text-align: center; margin-top: 75px; font-family: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> <a href="vers-bolnesserbocht.html">bolnes</a> / <a href="vers-drierivierenpunt.html">slikkerveer</a> / Ridderkerk / <a href="vers-moederenzoon.html">rijsoord</a> / <a href="vers-wassenaarwaal.html">oostendam</a> <h3 style="margin-top: 55px;">Op het nieuwe centrum van Ridderkerk</h3> <p style="margin-top: 30px;"> Het nieuwe centrum van Ridderkerk.<br> Daar word je haast sprakeloos van.<br> Modern klassiek, ja, zo wordt het genoemd.<br> De bouw was meteen al beroemd Financiers werkten over. Adviseurs waren druk.<br> Geen alternatieven. Het kon niet meer stuk.<br> Na jaren van centrumgetob,<br> kan men zijn geluk nu niet op. Drink allen op 't goede gebruik.<br> Van 't centrum en trek er op uit.<br> Van 't centrum en trek er op uit. <p style="font-size: 75%; color: #404040; margin-top: 30px;">Faas van Rietschoten <br> <a style="text-decoration: none;" href="index-practicum.html">voorpagina</a> </body> </html>

10 RJSOORD: MOEDER EN ZOON Onderstaand bestand selecteren, kopiëren en in de map practicum opslaan als: versmoederenzoon.html <!DOCTYPE html> <html lang=nl> <title>moeder en zoon over Rijsoord. Couplet 4 van de Ridderkerkse Meezinger. <meta name=description content= Oud en minder oud Rijsoord bezongen in het vierde couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Rijsoord, Ridderkerk, Meezinger > <body style="background: #eeeeee; text-align: center; margin-top: 50px; font-family: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> <a href="index-practicum.html">home</a> / <a href="vers-bolnesserbocht.html">bolnes</a> / <a href="vers-drierivierenpunt.html">slikkerveer</a> / <a href="vers-nieuwcentrum.html">ridderkerk</a> / Rijsoord / <a href="vers-wassenaarwaal.html">oostendam</a> <h3 style="margin-top: 55px;">Moeder en zoon over Rijsoord</h3> <p style="margin-top: 30px;"> "Ma! Strevelshoek, dat is geen Rijsoord.<br> En Wevershoek al evenmin.<br> Hetzelfde geldt voor het Zwaantje, het Zweth,<br> de Kromme, de Schaapherderweg. Want het echte Rijsoord ligt over de brug.<br> Bij tolhuis en molen, op dat kleine stuk."<br> "Daar komt ruzie van, houd je mond.<br> Zulke dingen bazuin je niet rond." "Maar Ma! Het staat wel in het werk:<br> Vijfhonderd jaar oud Ridderkerk.<br> Vijfhonderd jaar oud Ridderkerk." <p style="font-style: italic; font-size: 100%; color: #404040; margin-top: 30px;">Faas van Rietschoten </body> </html>

11 OOSTENDAM: 'WASSENAAR AAN DE WAAL' Onderstaand bestand selecteren, kopiëren in de map practicum opslaan als: verswassenaarwaal.html <!DOCTYPE html> <html lang=nl> <title>wassenaar aan de Waal. Over Oostendam. Couplet 5 van de Ridderkerkse Meezinger. <meta name=description content= Oostendam als 'Wassenaar aan de Waal' bezongen in het vijfde couplet van de Ridderkerkse Meezinger > <meta name=keywords content= Oostendam, De Waal, Ridderkerk, Meezinger > <body style="background: #cae1ff; text-align: center; margin-top: 50px; font-family: helvetica, arial, sans serif; font-size:120%; line-height:130%;"> <a href="index-practicum.html">home</a> / <a href="vers-bolnesserbocht.html">bolnes</a> / <a href="vers-drierivierenpunt.html">slikkerveer</a> / <a href="vers-nieuwcentrum.html">ridderkerk</a> / <a href="vers-moederenzoon.html">rijsoord</a> / Oostendam <h3 style="margin-top: 55px;">'Wassenaar aan de Waal'</h3> <p style="margin-top: 30px;"> De Pruimendijk ging vroeg met pensioen.<br> De dijk had geen kind aan de Waal.<br> Die afgedamd van getijden ontdaan.<br> Als stil binnenwater bleef staan. De Waal werd gezuiverd. Verwijderd de prut.<br> De oevers veranderen in een bouwput.<br> Het Wassenaar komt er nu aan.<br> En Oostendam wordt heel voornaam. Gevraagd werd ook om een beleid.<br> Voor Oostendam als eigen wijk.<br> Voor Oostendam als eigen wijk. <p style="font-style: italic; font-size: 100%; color: #404040; margin-top: 30px;">Faas van Rietschoten </body> </html>

12 In de tweede helft van november hopen we nog een grotere HTML-CSS-website te maken, met toelichtingen. Faas van Rietschoten, 7 november 2014

LES 4 WERKEN EN ERVARING OPDOEN. NOG VIER WEBPAGINA'S MAKEN.

LES 4 WERKEN EN ERVARING OPDOEN. NOG VIER WEBPAGINA'S MAKEN. LES 4 WERKEN EN ERVARING OPDOEN. NOG VIER WEBPAGINA'S MAKEN. In Les 3 hebben we het eerste vers van De Ridderkerkse Meezinger, getiteld: 'Bolnesserbocht in De Nieuwe Maas', verwerkt tot een webpagina,

Nadere informatie

In de map practicum bevinden zich vijf html-bestanden met de vijf verzen van het gedicht 'De Ridderkerkse Meezinger'.

In de map practicum bevinden zich vijf html-bestanden met de vijf verzen van het gedicht 'De Ridderkerkse Meezinger'. LES 5 HET ANKER UITGOOIEN. In de map practicum bevinden zich vijf html-bestanden met de vijf verzen van het gedicht 'De Ridderkerkse Meezinger'. bestand: vers-bolnesserbocht.html vers-drierivierenpunt.html

Nadere informatie

LES 3 WEBPAGINA'S MAKEN MET HTML VOOR DE INHOUD EN MET CSS VOOR DE OPMAAK

LES 3 WEBPAGINA'S MAKEN MET HTML VOOR DE INHOUD EN MET CSS VOOR DE OPMAAK LES 3 WEBPAGINA'S MAKEN MET HTML VOOR DE INHOUD EN MET CSS VOOR DE OPMAAK De webpagina die we in de eerste twee lessen maakten, bestond uit een gedicht van tien woorden. titel van de webpagina

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

HTML en CSS gevorderd

HTML en CSS gevorderd HTML en CSS gevorderd Inhoudsopgave Inleiding! 3 Opbouw webpage en css! 4 DIVʼs of iframes?! 8 Eigen icoon in de adresbalk van de browser! 8 Web-editors! 8 Koppelen van css-bestanden! 9 Browser afhankelijke

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

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

XHTML en CSS. Deel 3. januari 2008 4-9-2008. Lyceum Sancta Maria. Ruud Koortens Frans Peeters

XHTML en CSS. Deel 3. januari 2008 4-9-2008. Lyceum Sancta Maria. Ruud Koortens Frans Peeters XHTML en CSS Deel 3 Ruud Koortens Frans Peeters januari 2008 4-9-2008 Lyceum Sancta Maria 1 2 Inhoudsopgave 1.1.1. Het opmaken van hyperlinks... 1 1.1.2. Kleur... 1 1.1.3. Het gebruik van kleuren bij het

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 Stappenplan: stap 4 HTML, Stylesheets vervolg slides @ vanslooten.com/websitedesign Website-design 1-12-2014

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

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

1. De basis 2. De basis uitbreiden

1. De basis 2. De basis uitbreiden Wordpress Theme Hoe moet je deze reader gebruiken? Deze reader is digitaal, zodat je makkelijk stukjes code kunt kopieren en plakken. 1. De basis 2. De basis uitbreiden Hier aan de linkerkant vind je een

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

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

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>

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

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

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

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

LES 2 INDERDAAD, JE MOET DE WEBBROWSER AANWIJZINGEN GEVEN, MAAR DAN WEL VOLGENS DE AFGESPROKEN REGELS

LES 2 INDERDAAD, JE MOET DE WEBBROWSER AANWIJZINGEN GEVEN, MAAR DAN WEL VOLGENS DE AFGESPROKEN REGELS LES 2 INDERDAAD, JE MOET DE WEBBROWSER AANWIJZINGEN GEVEN, MAAR DAN WEL VOLGENS DE AFGESPROKEN REGELS In les 1 hebben we op een webpagina aan een gedicht de beoogde vorm gegeven. We deden dit met het html-code-element

Nadere informatie

Pro templates. Copyright Starteenwinkel.nl

Pro templates. Copyright Starteenwinkel.nl Pro templates Copyright Starteenwinkel.nl Lees in deze handleiding over: 1. PRO templates; voor wie geschikt? 2. Aan de slag met een PRO template 3. Template Designer 4. Template Vormgever 5. Sliders aanpassen

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

http://blog.seniorennet.be/seniorennet_blogs_tips_trucs Inhoud van dit lesje: 1.Plaatsen van foto of afbeelding van uw harde schijf.

http://blog.seniorennet.be/seniorennet_blogs_tips_trucs Inhoud van dit lesje: 1.Plaatsen van foto of afbeelding van uw harde schijf. Op het blog SeniorenNet Blogs Tips en Trucs vind je in de linkerkolom verschillende mogelijkheden voor Aanmaken van een Internetadres (URL) en Foto s Verkleinen met uitleg. http://blog.seniorennet.be/seniorennet_blogs_tips_trucs

Nadere informatie

Achtergrond en lettertype Opmaak Achtergrond Opmaak Achtergrond Afbeelding in achtergrond

Achtergrond en lettertype Opmaak Achtergrond Opmaak Achtergrond Afbeelding in achtergrond Frontpage Express is het meest eenvoudige programma voor het maken van je homepage. Is het programma niet geïnstalleerd op je PC, dan is het te downloaden en daarna te installeren. We zullen nu een aantal

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

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

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

Handleiding - Styling van OFB Web 4.0

Handleiding - Styling van OFB Web 4.0 Handleiding - Styling van OFB Web 4.0 Versie: 1.0 Inleiding OFB Web is opgebouwd uit controls. De plaatsing en positionering van de controls wordt vastgelegd in de page.aspx. Dit bestand kan gezien worden

Nadere informatie

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

Hand-out Web Technologies, werkcollege 6 Alex Reuneker (a.reuneker@hhs.nl), 2012 Hand-out Web Technologies, werkcollege 6 Alex Reuneker (a.reuneker@hhs.nl), 2012 1. Positie en flow Boxes, block-level en inline elements: Ieder HTML-element wordt, als het ware, als een omkaderd block-

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

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

Dennis Wagenaar 19-04-10 v 1.0

Dennis Wagenaar 19-04-10 v 1.0 Ontwerprapport Save Energy Leiden Dennis Wagenaar 19-04-10 v 1.0 Inhoudsopgave Inleiding...4 1 Grafisch Ontwerp...5 1.1 De website...5 1.2 Header...6 1.3 Menu...6 1.4 Content...7 1.5 Grafieken...7 1.5

Nadere informatie

Hosting. Bestelformulier en domeinnaamcontrole. Januari, 2013. WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland. w: www.wefact.nl e: helpdesk@wefact.

Hosting. Bestelformulier en domeinnaamcontrole. Januari, 2013. WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland. w: www.wefact.nl e: helpdesk@wefact. Hosting Januari, 2013 Bestelformulier en domeinnaamcontrole WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland w: www.wefact.nl e: helpdesk@wefact.nl Introductie Algemeen In deze handleiding wordt uitgelegd

Nadere informatie

HTML. Dennis van Wakeren. CC Naamsvermelding 3.0 Nederland licentie. http://maken.wikiwijs.nl/68933

HTML. Dennis van Wakeren. CC Naamsvermelding 3.0 Nederland licentie. http://maken.wikiwijs.nl/68933 Auteur Laatst gewijzigd Licentie Webadres Dennis van Wakeren 14 December 2015 CC Naamsvermelding 3.0 Nederland licentie http://maken.wikiwijs.nl/68933 Dit lesmateriaal is gemaakt met Wikiwijsleermiddelenplein.

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

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

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

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

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

AutoTrack.nl. Handleiding Implementatie Voorraadlijst

AutoTrack.nl. Handleiding Implementatie Voorraadlijst AutoTrack.nl Handleiding Implementatie Voorraadlijst Basis Implementatie De nieuwe AutoTrack.nl Voorraadlijst kunt u (of uw webbouwer) implementeren door op uw website de URL die u van AutoTrack.nl heeft

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

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

Website maker. Bezoek je domein om de Website maker in te stellen. De volgende melding zal zichtbaar zijn.

Website maker. Bezoek je domein om de Website maker in te stellen. De volgende melding zal zichtbaar zijn. Aan de slag met de Bezoek je domein om de in te stellen. De volgende melding zal zichtbaar zijn. Volg de url 'administratie paneel' om in te loggen en de vervolgens in te stellen. Als eerst krijg je de

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

Een ASP.NET applicatie opzetten. Beginsituatie:

Een ASP.NET applicatie opzetten. Beginsituatie: Hoofdstuk 1 Een ASP.NET applicatie opzetten Beginsituatie: Windows XP Pro, Windows Vista Pro of Windows 7 Pro Visual Studio.NET moet zijn geïnstalleerd. Let hierbij op dat de Express versie niet voldoet.

Nadere informatie

Pro templates. Copyright Starteenwinkel.nl

Pro templates. Copyright Starteenwinkel.nl Pro templates Copyright Starteenwinkel.nl Lees in deze handleiding over: 1. PRO templates; voor wie geschikt? 2. Aan de slag met een PRO template 3. Template Designer 4. Template Editor 5. Sliders aanpassen

Nadere informatie

http://www.zeelandtotaal.nl/les_gevorderd/les_1/index_les_1_gev.php

http://www.zeelandtotaal.nl/les_gevorderd/les_1/index_les_1_gev.php 1 van 7 28-5-2010 12:36 We hebben deze situatie voor ons. Misschien met wat andere kleuren maar dat maakt niet uit. Het belangrijkste is dat de linken op de pagina staan en het logo. Het kan zijn dat je

Nadere informatie

Instellen en werken met Templates

Instellen en werken met Templates Instellen en werken met Templates Pagina 2 van 8 Nationaal Golfpakket F Inhoudsopgave D Instellingen in het golfpakket...5 Aanmaken Templates... 5 Instellen van de templates in het golfpakket... 6 Links

Nadere informatie

Lesbrief Les 2 Basis CSS

Lesbrief Les 2 Basis CSS Lesbrief Les 2 Basis CSS Jullie hebben net de basis uitleg van CSS gehad. Om deze uitleg wat te laten bezinken gaan we aan de slag met de oefenopdracht voor deze week. Lees de opdracht goed door zodat

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

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

Cascading Style Sheets

Cascading Style Sheets Cascading Style Sheets Dit gedeelte wordt uitgebreid besproken in http://www.handleidinghtml.nl/css/index.html 1TIN Internettechnologie 2003-2004 les 07 1 Onderwerpen Cascading model Syntax Toevoegen van

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

HAND- OUT. https://www.uwdomein.com/qzadmin. password: statistieken https://qwikstats.suares.com/www.uwdomein.com. support http://help.suares.

HAND- OUT. https://www.uwdomein.com/qzadmin. password: statistieken https://qwikstats.suares.com/www.uwdomein.com. support http://help.suares. HAND- OUT website: inloggen: login name: password: http://www.uwdomein.com https://www.uwdomein.com/qzadmin statistieken https://qwikstats.suares.com/www.uwdomein.com support http://help.suares.nl/ Kuki+Ko

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

PhotoworkZ pop-up website handleiding

PhotoworkZ pop-up website handleiding PhotoworkZ pop-up website handleiding Inhoudsopgave PhotoworkZ pop-up website handleiding...1 Aanmelden op de admin module...2 Beheer van teksten...3 Tekst downloaden en aanpassen...3 Aanpassen van teksten...4

Nadere informatie

OPDRACHTKAART. Thema: Prepress. InDesign 15. Pagina s PP-01-15-01. Voorkennis: De vorige praktijkopdrachten afgerond.

OPDRACHTKAART. Thema: Prepress. InDesign 15. Pagina s PP-01-15-01. Voorkennis: De vorige praktijkopdrachten afgerond. OPDRACHTKAART PP-01-15-01 Pagina s Voorkennis: De vorige praktijkopdrachten afgerond. Intro: In bijna alle boeken en tijdschriften die je opent, zie je dat de pagina s genummerd zijn. Het is natuurlijk

Nadere informatie

Search Engine Optimization

Search Engine Optimization 19 02, 2009 experience relevance Search Engine Optimization Optimalisatierapport 2006 Outrider North America LLC. All Rights Reserved. Ver:.1 Agenda SEM of Search Engine Marketing Optimalisatierapport

Nadere informatie

Liesbeth Mantel. Mediacollege webdesign professional

Liesbeth Mantel. Mediacollege webdesign professional Liesbeth Mantel Mediacollege webdesign professional Juni 2006 Inhoud 1 Inleiding... 3 2 Grid en layout... 4 3 Kleurenpalet... 5 4 Typografie... 6 5 Navigatie... 7 6 Schetsen... 8 7 Stylesheet... 10 1 Inleiding

Nadere informatie

Sushi MIJN EERSTE WEBSITE EEN WEBPAGINA BEWERKEN. Kaart 1 van 10 Ik ben HTML/CSS aan het leren

Sushi MIJN EERSTE WEBSITE EEN WEBPAGINA BEWERKEN. Kaart 1 van 10 Ik ben HTML/CSS aan het leren MIJN EERSTE WEBSITE Sushi EEN WEBPAGINA BEWERKEN Kaart 1 van 10 We gaan een nieuwe website bouwen! We gaan hem over boeken maken maar je kan hem ook zo maken zoals jij zelf wilt! Download de HTML code

Nadere informatie

Handleiding: Whitelabel Customersite

Handleiding: Whitelabel Customersite ARGEWEB B.V. Handleiding: Whitelabel Customersite Controlportal.nl Argeweb Support 8-1-2009 Handleiding voor het gebruik maken van de Whitelabel Customersite op controlportal.nl, door Resellers van Argeweb.

Nadere informatie

GOOGLE MAPS VERKENNEN

GOOGLE MAPS VERKENNEN Handleiding GOOGLE MAPS VERKENNEN Stap 1 Ga naar maps.google.nl Tik je woonplaats en adres in het zoekvenster. Zoom in tot je huis zichtbaar wordt. Ga via de [terug]pijl (linksboven) terug naar vorige

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

Het scherm is verdeeld in enkele blokken.

Het scherm is verdeeld in enkele blokken. Log in op de achterkant van de website door naar http://www.cbs-sjaloomschool.picto.nl/joomla/administrator te gaan. Ingelogd zie je dit controle paneel. Je ziet het hoofdmenu van het beheerdersaccount.

Nadere informatie

HTML&CSS OEFENBOEKJE. van:

HTML&CSS OEFENBOEKJE. van: HTML&CSS OEFENBOEKJE van: HTML SYNTAX De meeste HTML tags zien eruit zoals hierboven. Een tag om te openen , en een tag om te sluiten . De letters die tussen de staan, geven aan wat voor

Nadere informatie

Les 7. Instap. CSS en views: schilderijen. Pas even de header aan van het thema en zorg ervoor dat er geen websitenaam en slogan te zien is.

Les 7. Instap. CSS en views: schilderijen. Pas even de header aan van het thema en zorg ervoor dat er geen websitenaam en slogan te zien is. Les 7 Instap Pas even de header aan van het thema en zorg ervoor dat er geen websitenaam en slogan te zien is. CSS en views: schilderijen Ons eerste overzicht in de vorige les bestond uit het tonen van

Nadere informatie

Bloggen met blogdirect

Bloggen met blogdirect Bloggen met blogdirect H1 Aanmelden en inloggen H1.1 Aanmelden Ga naar www.blogdirect.nl Klik op registeren. Onderstaand scherm verschijnt: Vul de gegevens in en klik op verzenden. Verzin een gebruikersnaam:

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

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

Jarno Verhoogt 21 mei 2014 Stud. Nr. 500684953 Docent: Joost Faber. Deeltoets 2: Hoe maak je met javascript een eenvoudige slideshow?

Jarno Verhoogt 21 mei 2014 Stud. Nr. 500684953 Docent: Joost Faber. Deeltoets 2: Hoe maak je met javascript een eenvoudige slideshow? Jarno Verhoogt 21 mei 2014 Stud. Nr. 500684953 Docent: Joost Faber Deeltoets 2: Hoe maak je met javascript een eenvoudige slideshow? Inleiding Dit is een eenvoudige handleiding om in javascript een simpele

Nadere informatie

Handleiding Word Press voor de bewoners Westerkaap 1

Handleiding Word Press voor de bewoners Westerkaap 1 1 Handleiding Word Press voor de bewoners Westerkaap 1 Inhoud: Inloggen Pagina 1 Algemeen Pagina 2 Berichten Pagina 2 Bericht bewerken, Linken Pagina 3-4 Plaatje toevoegen bericht Pagina 5-6 Bericht publiceren

Nadere informatie

SAN v3. Update document 2010. uitgebracht door OCEN

SAN v3. Update document 2010. uitgebracht door OCEN SAN v3 Update document 2010 uitgebracht door OCEN Inhoudsopgave. Inleiding...3 1 Navigatie...4 1.1 Navigatie: het menu...4 1.2 Navigatie: dashboard...4 1.3 Navigatie: kruimelpad...4 1.4 Navigatie: iconen

Nadere informatie

Kompozer Webdesign www.acc.dds.nl/lesonline/kompozer/

Kompozer Webdesign www.acc.dds.nl/lesonline/kompozer/ Hier vind je de cursus op het internet: www.acc.dds.nl/acconline/ Kompozer Webdesign www.acc.dds.nl/lesonline/kompozer/ Een bestaande website met kompozer www.acc.dds.nl/lesonline/kompozer/website/ Bestanden

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

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

Inloggen: Opbouw site: Een handleiding/introductie voor de nieuwe site van Fotoclub VPR.

Inloggen: Opbouw site: Een handleiding/introductie voor de nieuwe site van Fotoclub VPR. Een handleiding/introductie voor de nieuwe site van Fotoclub VPR. Inloggen: Als je de site opent dan zie je o.a. bovenstaande afbeelding met het logo van de club en het menu. Om in te loggen klik je helemaal

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

De Kleine WordPress Handleiding

De Kleine WordPress Handleiding Introductie Dit is geen uitgebreide handleiding om een WordPress website of blog mee te bouwen. Het is ook geen overzicht van alle aspecten die een WordPress website zo bijzonder maken en geen verhandeling

Nadere informatie

Websitecheck. Taak en Tekst voor websites die werken. www.jouwsite.nl

Websitecheck. Taak en Tekst voor websites die werken. www.jouwsite.nl Taak en Tekst voor websites die werken www.jouwsite.nl Websitecheck Taak en Tekst, www.taakentekst.nl Buijs Ballotstraat 27A, 2563 ZH Den Haag 06-13935470 1 Websitecheck Website: Eigenaar: Datum: www.jouwsite.nl

Nadere informatie

Handleiding Concrete5 website. Outbound Media

Handleiding Concrete5 website. Outbound Media Handleiding Concrete5 website Outbound Media In deze handleiding behandelen we de basis benodigdheden om uw website up-to-date te kunnen houden. We behandelen: Inloggen editen (bewerken) van tekst een

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

Lab Webdesign: Javascript 11 februari 2008

Lab Webdesign: Javascript 11 februari 2008 H2: BASISBEGRIPPEN In dit hoofdstuk zullen er enkele basisbegrippen worden behandelt PLAATSING VAN JAVASCRIPT-CODE DE SCRIPT-TAG De script-tag geeft aan dat er gebruik zal worden gemaakt van een scripttaal.

Nadere informatie

Handleiding BVBZ site voor Leden

Handleiding BVBZ site voor Leden Fred Maaskant Blad1 van 7 Inleiding De BVBZ site maakt gebruik van Joomla. Deze software maakt het mogelijk voor een ieder die daarvoor in aanmerking komt een artikel aan te leveren voor haar/zijn gedeelte

Nadere informatie

Gevorderd Geld Verdienen Met Internet

Gevorderd Geld Verdienen Met Internet Gevorderd Geld Verdienen Met Internet Zonder enige kosten/moeilijkheden Copyright 2009: "Niets uit deze uitgave mag worden gekopieerd/aangepast zonder toestemming van de auteur. 1 Hee! Bedankt dat je mijn

Nadere informatie

Websites & Zoekmachines

Websites & Zoekmachines Zoekmachines, Wat en Hoe... 2 Wat is een Zoekmachine?... 2 Hoe werkt het?... 2 Meldt Je Site Aan... 3 Meta-data... 3 Links naar je site... 3 De grote 3... 3 Hoe aanmelden?... 3 Wachttijd na aanmelding...

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

Stelt de voorgrondkleur van de tekst van een element in. Stelt in hoe de achtergrondfiguur moet worden herhaald, standaard: repeat.

Stelt de voorgrondkleur van de tekst van een element in. Stelt in hoe de achtergrondfiguur moet worden herhaald, standaard: repeat. OVERZICHT CSS - EIGENSCHAPPEN Eigenschap Beschrijving Mogelijke waarden KLEUR EN ACHTERGROND color Stelt de voorgrondkleur van de tekst van een element in. background-color Stelt de achtergrondkleur van

Nadere informatie

Handleiding bij het Content Management Systeem

Handleiding bij het Content Management Systeem Handleiding bij het Content Management Systeem 1. Content Managent System startvenster 2. Hoe voeg ik een nieuwe gebruiker toe? 3. Hoe maak ik een hoofdmenu-item aan? 4. Hoe koppel ik tekst aan een hoofdmenu-item?

Nadere informatie

Een weblog in 10 minuten!

Een weblog in 10 minuten! Een weblog in 10 minuten! http://weblog.tudelft.nl versie: 1.3.1/ 2009 door: ing. L. Cozijn & drs. Klaassen aangepast door: G. Hoetmer Inhoudsopgave WAT IS EEN WEBLOG... 3 DE TU DELFT EN WEBLOGS... 4 DE

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

Les 13. Voorbereiding

Les 13. Voorbereiding Les 13 Voorbereiding 1. Plaats DEZE TWEE PLUGINS op de server in de map libraries. Deze is nodig voor de werking van Masonry Views en Masonry API 2. Schakel de modules Masonry Views en Masonry API in.

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

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

Handleiding CMS Joomla 3.2 v1.2

Handleiding CMS Joomla 3.2 v1.2 Handleiding CMS Joomla 3.2 v1.2 Inhoudsopgave 1. Inloggen op het CMS-systeem 2. Artikelen en Categorieën beheren 2.1 Aanmaken en beheren van een artikel 2.2 Verwijderen van een artikel 2.3 Aanmaken van

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

Laatst bijgewerkt: 22-1-2016. Versie 1.0

Laatst bijgewerkt: 22-1-2016. Versie 1.0 Laatst bijgewerkt: 22-1-2016 Versie 1.0 INHOUD DEEL 1: VOORBEREIDING 1. Inleiding 2. What the f@*! is Bootstrap?! 3. Bootstrap importeren DEEL 2: PROGRAMMEREN! 4. Ontwerpen 5. De carousel, niet die van

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