Websitecursus deel 1 HTML

Maat: px
Weergave met pagina beginnen:

Download "Websitecursus deel 1 HTML"

Transcriptie

1 Websitecursus deel 1 HTML WebCie A Eskwadraat 8 april 2015

2 Inleiding Website cursus in drie delen: HTML CSS Javascript We gaan uit van geen voorkennis. Als je vragen hebt, stel ze!

3 Wat is een Website? Een website is eigenlijk niks meer dan een bestand op een computer (server) die door andere computers opgevraagd kan worden. Als je op je studentenschijf een mapje www aanmaakt, werkt dat als website (www.students.science.uu.nl/~studentnr) Als je met een webbrowser naar een website gaat wordt er altijd gezocht naar een bestand genaamd index.html Het is ook mogelijk om bij A Eskwadraat een website te hosten, vraag de WebCie voor meer informatie.

4 Inleiding HTML HTML (HyperText Markup Language) is een taal die de opmaak van een website bepaalt. In de meest simpele vorm is een website gewoon een HTML bestand dat geopend wordt door een webbrowser. (klik maar eens op bron weergeven als je een website bezoekt) HTML bestaat uit tags Tags geven betekenis of opmaak aan de tekst die tussen de tags staan Tags worden omgeven door <> (bijvoorbeeld <html>) Bij elke begintag hoort een sluittag (Bijvoorbeeld <html>...</html>) Een tag kan attributen bevatten (Bijvoorbeeld <html id="vb">)

5 Basis HTML-tags Een HTML-pagina wordt omgeven door <html> tags Binnen de html-tags komt eerst een <head> tag en daarna een <body> tag De daadwerkelijke website wordt omgeven door <body> tags Overige informatie over de website, zoals de titel wordt omgeven door <head> tags

6 Zelf aan de slag Tips Maak met behulp van de Basis HTML-tags een website met een titel en als inhoud de tekst Hello World Het is mooi (en vaak noodzakelijk) om tags goed te nesten, bijvoorbeeld: <tag1><tag2>..</tag2></tag1> Het is handig om een tab of spaties te gebruiken bij een geneste tag, bijvoorbeeld: <tag1> <tag2>... </tag2> </tag1> Als je niet weet hoe een tag werkt of hoe het eruit hoort te zien, kijk dan op

7 Tekst en opmaak Het is leuk om meer op je website te zetten dan niet opgemaakte tekst. Een paragraaf zet je tussen <p> tags Wil je dikgedrukte tekst? Gebruik dan <b> Of schuin? gebruik dan <i> Voor headers van bijvoorbeeld hoofdstukken of je website gebruik je <h1> Waarbij het getal van 1 t/m 6 kan om aan te duiden hoe groot de header moet zijn. Wil je een enter in je tekst, gebruik dan <br/> Let op! Omdat deze tag geen aparte sluittag heeft wordt hij op een ander manier afgesloten. één van de belangrijkste tags is de <a> tag. Hiermee maak je een link naar een bestand op je computer of naar een andere website. Probeer maar uit!

8 Containers/Layout Het is handig om stukken van je website in blokken te plaatsen, zodat je die later met bijvoorbeeld CSS op de goede plaats kan zetten Hiervoor kan je de <div> tag gebruiken Vanaf HTML5 is het ook mogelijk om <header>, <nav>, <section>, <article>, <aside>, <footer> en <summary> tags te gebruiken, die ongeveer hetzelfde doen, maar soms in sommige browsers extra functionaliteit hebben. De <p> tag is ook een container

9 Geavanceerd Het is ook leuk om in je website tabellen (<table>), lijsten (<ul> en <ol>), plaatjes (<img>) formulieren (<form>) en audio/video (<audio> of <video>) te zetten. Kijk op hoe deze tags werken en zet ze in je website

10 Overzicht We hebben vandaag de basis van HTML behandeld. Wil je hier meer over weten? Kijk dan op Bij de volgende cursus behandelen we de Layout (CSS) en de laatste cursus gaat over interactiviteit (Javascript) Wil je na deze cursus graag meer leren over hoe het is om een grote website te onderhouden? Kom eens langs bij de WebCie!

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

Syllabus Zelf een website bouwen. Artheos

Syllabus Zelf een website bouwen. Artheos Syllabus Zelf een website bouwen Artheos Helma de Boer Artheos Webdiensten & Office Support www.artheos.nl 2012 Inhoud Syllabus Zelf een website bouwen H1 De techniek van een website... 3 1.1 Browser en

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

Extra: Hoe u uw website met HTML kunt verbeteren

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

Nadere informatie

Inhoudsopgave. Stappen 1 Ervaringen 2 Wireframes 3 PIOTR TEKIEN HKU GAME ART GAR-1B

Inhoudsopgave. Stappen 1 Ervaringen 2 Wireframes 3 PIOTR TEKIEN HKU GAME ART GAR-1B Inhoudsopgave Stappen 1 Ervaringen 2 Wireframes 3 PIOTR TEKIEN HKU GAME ART GAR-1B PORTFOLIO 1 - STAPPEN Stappen INTRODUCTIE Voordat ik over mijn stappen vertel, wil ik kort toelichten dat ik eerder een

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

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

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

Nadere informatie

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

Frontend ontwikkeling

Frontend ontwikkeling Frontend ontwikkeling Mark Jansen Edwin Vlieg PHPFreakz ledendag 10 november 2007 Frontend ontwikkeling De interface is je product richting de eindgebruiker Goede PHP code met een slechte interface geeft

Nadere informatie

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

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

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

Web building basis: HTML. Karel Nijs 2008/09

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

Nadere informatie

Html: stramien en tekst

Html: stramien en tekst 1 Html: stramien en tekst De belangrijkste punten van hoofdstuk 1 X X Laat de bestandsnaam van een webpagina eindigen op.html. XX Begin een webpagina met de juiste document type declaration (doctype).

Nadere informatie

Websitecursus deel 3 JavaScript

Websitecursus deel 3 JavaScript Websitecursus deel 3 JavaScript A Eskwadraat WebCie www@a-eskwadraat.nl 12 oktober 2015 Introductie Twee weken geleden HTML Vorige week CSS Deze week JavaScript Javascript JavaScript (ook wel JS) is een

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

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

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

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

Inhoudsopgave Disclaimer... 3 Voorwoord... 4 Inleiding... 5 Het downloaden van XAMPP... 7 Het installeren van XAMPP... 8 Joomla installeren op

Inhoudsopgave Disclaimer... 3 Voorwoord... 4 Inleiding... 5 Het downloaden van XAMPP... 7 Het installeren van XAMPP... 8 Joomla installeren op 1 Inhoudsopgave Disclaimer... 3 Voorwoord... 4 Inleiding... 5 Het downloaden van XAMPP... 7 Het installeren van XAMPP.... 8 Joomla installeren op XAMPP... 15 Handige links... 16 2 Disclaimer Bij de samenstelling

Nadere informatie

OPDRACHTKAART. Thema: Multimedia. Het internet 3. Het World Wide Web MM-05-03-01. Voorkennis: Geen.

OPDRACHTKAART. Thema: Multimedia. Het internet 3. Het World Wide Web MM-05-03-01. Voorkennis: Geen. OPDRACHTKAART MM-05-03-01 Het World Wide Web Voorkennis: Geen. Intro: Deze opdracht gaat over de belangrijkste mogelijkheid van het internet: het surfen op het World Wide Web. Deze opdracht beschrijft

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

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

MailPlus-template voor BrightEdit

MailPlus-template voor BrightEdit Handleiding: MailPlus-template voor BrightEdit Deze handleiding is bedoeld voor MailPlus Partners en in te zetten voor MailPlus Marcom Inhoudsopgave Introductie... 1 1 De Template Manager... 2 1.1 Template

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

De tag aan het begin van het PHPscript is "".

De tag aan het begin van het PHPscript is <?php aan het einde van het PHPscript gebruik je ?>. PHP Les 3 Commando ECHO Interessante links: o http://www.donboscozwijnaarde.be/~moermant/ o http://php.net/manual/en/function.echo.php o http://www.w3schools.com/php/default.asp Wat is PHP? PHP is een

Nadere informatie

Markup: CSS en HTML5. Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen

Markup: CSS en HTML5. Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen Markup: CSS en HTML5 Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen 1 CSS: Waarom ook alweer. HTML was bedoeld voor documentstructuur (text met verschillende levels in headings en body text)

Nadere informatie

HTML5 overzicht Tag Uitleg Versie Attributen

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

Nadere informatie

Week 1 1/4. Week 1 2/4

Week 1 1/4. Week 1 2/4 Week 1 1/4 3. Beschrijf keuzes: Wij hebben gekozen voor Dreamweaver omdat een van ons dit al op zijn/haar laptop had staan. Ook weten we hoe we dit programma moeten gebruiken en kan bijvoorbeeld notepad++

Nadere informatie

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

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

Nadere informatie

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

Foutcontrole met Javascript

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

Nadere informatie

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

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

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

Nadere informatie

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

IAI: Les 2 Vakjes maken. Rick Hazebroek r.hazebroek@cibap.nl

IAI: Les 2 Vakjes maken. Rick Hazebroek r.hazebroek@cibap.nl IAI: Les 2 Vakjes maken Rick Hazebroek r.hazebroek@cibap.nl 1 2 Les 2 Bekijk de powerpoint van deze les Opdracht 1: Vakjes maken Bekijk de tekening op de vorige pagina. Je ziet hier verschillende onderdelen:

Nadere informatie

Nieuwsbrieven versturen met MailPoet

Nieuwsbrieven versturen met MailPoet Nieuwsbrieven versturen met MailPoet Een nieuwe nieuwsbrief maken Om een nieuwe nieuwsbrief te maken klik je op de button nieuwe nieuwsbrief (2). Je kunt ook een reeds bestaande nieuwsbrief dupliceren

Nadere informatie

INTERNET STANDAARDEN HC1

INTERNET STANDAARDEN HC1 9 September 2008 INTERNET STANDAARDEN HC1 Wat is het internet? Wat zijn standaarden? Wat gaan we doen dit jaar? Hogeschool van Amsterdam Instituut voor Interactieve Media Hogeschool van Amsterdam Instituut

Nadere informatie

Dynamische websites met PHP (basis) Karel Nijs 2010/09

Dynamische websites met PHP (basis) Karel Nijs 2010/09 Dynamische websites met PHP (basis) Karel Nijs 2010/09 Leswijze Eerst wat theorie Begeleid met (korte) oefeningen Editor = UltraEdit Geen DreamWeaver Browser = Internet Explorer Vereiste voorkennis: (X)HTML

Nadere informatie

Handleiding Wordpress

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

Nadere informatie

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

MANUAL INTERNETSTANDAARDEN. HvA - CMD Blok 1 2013-14 v1.0

MANUAL INTERNETSTANDAARDEN. HvA - CMD Blok 1 2013-14 v1.0 MANUAL INTERNETSTANDAARDEN HvA - CMD Blok 1 2013-14 v1.0 INHOUD Weekoverzicht... 4 Vakomschrijving... 5 Diagnostische toets (Voor gevorderden)... 8 Blokweek 2... 9 Lees- en werkroutes... 9 Software installeren...

Nadere informatie

ailexpert Tips & Tricks Email design

ailexpert Tips & Tricks Email design ailexpert Tips & Tricks Email design 1 Inleiding E-mail marketing is een vorm van direct marketing waarmee een bedrijf in contact kan komen te staan met haar klanten. De markt van E-mail marketing is de

Nadere informatie

NBTC html wijzigingen juni

NBTC html wijzigingen juni NBTC html wijzigingen juni Verstuurd naar GX: 23 juni 2014 1. Recently viewed Zie Change / Incident 1: Prijzen recently viewed zijn niet correct. Aan de recently viewed items wordt een extra label (met

Nadere informatie

Welkom in de wondere wereld van websites met WordPress.

Welkom in de wondere wereld van websites met WordPress. Welkom in de wondere wereld van websites met WordPress. Alsjeblieft, dit kleine WordPress woordenboekje is voor jou. Want als je voor het eerst een website met WordPress gaat maken kom je misschien woorden

Nadere informatie

programmeren in HTML (5) CSS (3) JavaScript

programmeren in HTML (5) CSS (3) JavaScript programmeren in HTML (5) CSS (3) JavaScript Op dit lesmateriaal is een Creative Commons licentie van toepassing. 2010 Remie remie.woudt@gmail.com Woudt Inhoudsopgave 1 HTML...1 1.1 Wat heb je nodig?...1

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

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

Zelf een webpagina maken met HTML-code

Zelf een webpagina maken met HTML-code Zelf een webpagina maken met HTML-cde Stappenplan: 1. De brncde maken met Kladblk 2. Het resultaat bekijken met Internet Explrer 3. Een tweede webpagina maken en beide pagina s linken 4. De webpagina s

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

GIVE ME A FUCKING
FRONTEND DEVELOPMENT LES 1

GIVE ME A FUCKING <BR> FRONTEND DEVELOPMENT LES 1 GIVE ME A FUCKING FRONTEND DEVELOPMENT LES 1 WAAROM DIT VAK? Nou? Vraag dit aan je studenten, schrijf het eventueel op het bord. Benadruk al deze punten ook. - Materiaalkennis - Hoe weet je wat je

Nadere informatie

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

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

Nadere informatie

Inhoud leereenheid 1. Internet en het World Wide Web. Introductie 15. Leerkern 15. Zelftoets 26. Terugkoppeling 27

Inhoud leereenheid 1. Internet en het World Wide Web. Introductie 15. Leerkern 15. Zelftoets 26. Terugkoppeling 27 Inhoud leereenheid 1 Internet en het World Wide Web Introductie 15 Leerkern 15 1 Webapplicaties en web apps 15 2 Hoe werkt het web 17 2.1 Dubbelklikken op een HTML-bestand 17 2.2 URL in de adresbalk 17

Nadere informatie

Tutorial HTML CSS met Adobe Dreamweaver CSx

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

Nadere informatie

Copyright FRONTBONE 2009, alle rechten voorbehouden +31 (0)20 470 76 98 info@frontbone.com

Copyright FRONTBONE 2009, alle rechten voorbehouden +31 (0)20 470 76 98 info@frontbone.com FRONTBONE stelt jou in staat je eigen werkwijze te hanteren. Deze inleiding is bedoelt om je zo snel mogelijk op weg te helpen. Wanneer je de basisprincipes van het systeem doorhebt, kun je de rest zelf

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

Inhoud. Pagina 2 van 13

Inhoud. Pagina 2 van 13 Code Conventie Inhoud PHP algemeen... 3 Namen van variabelen... 3 Enkele of dubbele aanhalingstekens... 3 Globale variabelen... 3 Namen van functies... 3 Argumenten van functies... 3 Formattering... 4

Nadere informatie

Taak 1.4.10 Apachiis. Inhoud

Taak 1.4.10 Apachiis. Inhoud Taak 1.4.10 Apachiis Inhoud Taak 1.4.10 Apachiis... 1 Inleiding... 2 Functie van een Webserver... 3 Wat is een webserver?... 3 Wat doet een webserver?... 3 Wat is en doet een webserver nu écht?... 3 Stappenplan

Nadere informatie

Om in te loggen in het CMS (Content Management Systeem) gaat u naar http://domeinnaam.nl/admin Hier ziet u het inlogscherm:

Om in te loggen in het CMS (Content Management Systeem) gaat u naar http://domeinnaam.nl/admin Hier ziet u het inlogscherm: CMS Handleiding Inhoudsopgave Inloggen in het CMS... 3 Pagina s toevoegen... 4 Pagina s bewerken... 7 Een link toevoegen... 8 Een afbeelding toevoegen... 10 Foto s plaatsen op de fotopagina... 12 Media...

Nadere informatie

design ook items uitsnijden

design ook items uitsnijden (fig1) Hulplijnen zetten Om het ontwerp netjes uit te snijden is het handig om eerst hulplijnen te zetten. (fig1) Nu is het zaak om eerst voor je zelf te bepalen wat is layout en wat is design. Al het

Nadere informatie

CMS Template Handleiding

CMS Template Handleiding CMS Template Handleiding Inhoudsopgave Inloggen in het CMS... 3 Pagina s toevoegen... 4 Pagina s bewerken... 6 Een link toevoegen... 7 Een afbeelding toevoegen... 9 Foto s plaatsen op de 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

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

Inhoud. Wat zijn webrichtlijnen, waarom zouden we daar iets mee moeten en hoe doe je dat dan?

Inhoud. Wat zijn webrichtlijnen, waarom zouden we daar iets mee moeten en hoe doe je dat dan? Webrichtlijnen Inhoud Wat zijn webrichtlijnen, waarom zouden we daar iets mee moeten en hoe doe je dat dan? Webrichtlijnen? 30 juni 2006: de Tweede kamer neemt het 'Besluit Kwaliteit Rijksoverheidswebsites'

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

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

Welkom in de wondere wereld van websites met WordPress.

Welkom in de wondere wereld van websites met WordPress. Welkom in de wondere wereld van websites met WordPress. Alsjeblieft, dit kleine WordPress woordenboekje is voor jou. Want als je voor het eerst een website met WordPress gaat maken kom je misschien woorden

Nadere informatie

Welkom bij Sitebuilder, een praktijksite maken in 5 stappen.

Welkom bij Sitebuilder, een praktijksite maken in 5 stappen. Welkom bij Sitebuilder, een praktijksite maken in 5 stappen. Wat is sitebuilder Site Builder is een uiterst gebruiksvriendelijk en zeer uitgebreid product waarmee u snel een eigen praktijkwebsite kunt

Nadere informatie

HTML5 & Webdesign. Ontwerp cover: Graficelly, Reeuwijk-Brug. N. van Aken M. den Besten A.C. Gijssen ISBN 978-90-460-0740-2

HTML5 & Webdesign. Ontwerp cover: Graficelly, Reeuwijk-Brug. N. van Aken M. den Besten A.C. Gijssen ISBN 978-90-460-0740-2 Ontwerp cover: Graficelly, Reeuwijk-Brug N. van Aken M. den Besten A.C. Gijssen ISBN 978-90-460-0740-2 Eerste druk 2016 Instruct, Postbus 38, 2410 AA Bodegraven Behoudens uitzondering door de wet gesteld

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&CSS. websites ontwerpen en bouwen JON DUCKETT

HTML&CSS. websites ontwerpen en bouwen JON DUCKETT HTML&CSS websites ontwerpen en bouwen JON DUCKETT inhoud Inleiding 1 Is het moeilijk om te leren? 4 De structuur van dit boek 5 Hoe mensen online gaan 6 Hoe websites gemaakt worden 7 1. Structuur 11 Hoe

Nadere informatie

Het googlebaar van je site maken gebeurt in een paar stappen:

Het googlebaar van je site maken gebeurt in een paar stappen: DR3_fons_les_11_en_les_12 _SEO 2014_11_27_en_2014_12_04 1 CMS is niet optimaal voor SEO = search engine optimalisatie Hoe hoger je op de ranking staat in google, hoe hoger de kans is dat je gevonden wordt.

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

De website Inleiding Internet

De website Inleiding Internet De website Inleiding Internet (Alle inhoud van dit document kun je gebruiken als leidraad, maar het is geenszins compleet!!) Doelen en Doelgroepen Doel(en): Primair: o Basiskennis (theoretisch & praktisch)

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

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

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

Instellingen voor het publiceren opgeven

Instellingen voor het publiceren opgeven 289 Aanvulling hoofdstuk 9 i.p.v. blz. 289 tot en met 308 Instellingen voor het publiceren opgeven Voordat u webpagina s kunt publiceren, moet u eerst de instellingen voor het publiceren opgeven. Anders

Nadere informatie

Test Joomla op je PC 1

Test Joomla op je PC 1 1 Disclaimer Bij de samenstelling van dit ebook is de grootst mogelijke zorg besteed aan de juistheid en correctheid van de informatie die in dit ebook wordt verstrekt. De auteur van dit ebook kan op geen

Nadere informatie

Hoe moet je een prachtige presentatie maken?

Hoe moet je een prachtige presentatie maken? Hoe moet je een prachtige presentatie maken? www.meestermichael.nl Geef de presentatie een titel. Klik dit vak aan om jouw presentatie een ondertitel te geven. Hier kun je je presentatie een titel geven

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

HTML & CSS. Studievaardigheden 2013. Frank Takes (ftakes@liacs.nl) LIACS, Universiteit Leiden

HTML & CSS. Studievaardigheden 2013. Frank Takes (ftakes@liacs.nl) LIACS, Universiteit Leiden HTML & CSS Studievaardigheden 2013 Frank Takes (ftakes@liacs.nl) LIACS, Universiteit Leiden Inleiding Voorkennis: geen Stof: www.w3schools.com en dit college: www.liacs.nl/~ftakes/pdf/htmlcss.pdf Opdracht:

Nadere informatie

HTML 4.01. Hans Roeyen V 3.0

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

Nadere informatie

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

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

Nadere informatie

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

Cursus HTML voor beginners

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

Nadere informatie

Deel I Introductie Web HTML5. Hoorcollege IUW Thema Web 12 november 2015 Christof van Nimwegen

Deel I Introductie Web HTML5. Hoorcollege IUW Thema Web 12 november 2015 Christof van Nimwegen Deel I Introductie Web HTML5 Hoorcollege IUW Thema Web 12 november 2015 Christof van Nimwegen Huishoudelijk: Eén college vervalt! Hoorcollege donderdag 10 december vervalt Deel informatie theorie wordt

Nadere informatie

SEO IS SIMPEL SEARCH ENGINE OPTIMIZATION E-BOOK

SEO IS SIMPEL SEARCH ENGINE OPTIMIZATION E-BOOK SEARCH ENGINE OPTIMIZATION E-BOOK VERSIE: 1.0 DATUM: APRIL 2009 AUTEUR: ERWIN SIGTERMAN WEBSITE: WWW.SIGGYVOLGT.NL E-MAIL: ERWIN@SIGTERMAN.COM INHOUDSOPGAVE 1 Search engine optimalization... 3 URL aanmelden

Nadere informatie

Google Maps op uw site

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

Nadere informatie

voor website beheer met het Website Onderhoud Systeem

voor website beheer met het Website Onderhoud Systeem ^ Handleiding voor website beheer met het Website Onderhoud Systeem Burg. van Roijensingel 13 8011 CT Zwolle info@e-active.nl Tel. 038-4 227 847 Laatst bijgewerkt: 19-07-2005 Inhoudsopgave Inleiding...3

Nadere informatie

Webdesign. cursusjaar 2009-2010. Practicumoefeningen met. (X)HTML en CSS

Webdesign. cursusjaar 2009-2010. Practicumoefeningen met. (X)HTML en CSS Webdesign cursusjaar 2009-2010 Practicumoefeningen met (X)HTML en CSS Departement Informatica Bacheloropeliding Informatiekunde Hans Voorbij (2010) Inhoud 1. Basisoefeningen met HTML...........................................

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

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

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

Nadere informatie

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

Formulier maken en opvangen met php

Formulier maken en opvangen met php Welkom bij mijn PHP tutorial (Deel 2) Ik ga in deze delen PHP uitleggen, dit doe ik in het programma notepad++ (gratis) deze kunt u downloaden van www.richard3332.nl/downloads.php Als u beschikt over dreamweaver

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

NVU-Workshop. Websites bouwen met Nvu. Henk Stoop - Docent Website design - HkeyDesigns - HCC WG Website design - KBO WG ICT-Adviseur

NVU-Workshop. Websites bouwen met Nvu. Henk Stoop - Docent Website design - HkeyDesigns - HCC WG Website design - KBO WG ICT-Adviseur Websites bouwen met Nvu Voorbeeld websites Hkey-Designs Manders mondhygieniste Slaapadvies Sterrenburg Werkplan Henk Stoop - Docent Website design - - HCC WG Website design - KBO WG ICT-Adviseur Workshop:

Nadere informatie

Inleiding website maken

Inleiding website maken Inleiding website maken Bert Dingemans DLA Ontwerp & Software http://www.dla-os.nl bert@dla-os.nl DLA Ontwerp & Software, Culemborg 1 Titel Docent Veronderstelde voorkennis Samenvatting Aantal bijeenkomsten

Nadere informatie

HTML. Links. Hyperlinks. Hans Roeyen V 3.0

HTML. Links. Hyperlinks. Hans Roeyen V 3.0 Links En Hyperlinks Hans Roeyen V 3.0 5 februari 2015 Inhoud 1. Werken met (Hyper)links... 3 1.1. De anchor tag... 3 1.1.1. Het ID attribuut... 3 1.1.2. Oefeningen op linken... 4 1.1.3. Absoluut en relatief

Nadere informatie