Hoe zit een website in elkaar?

Om beter te kunnen begrijpen hoe een website in elkaar zit, is dit bericht geschreven. Onderstaande kennis is handig als basiskennis om aan de gang te gaan met het zelf maken van websites. Bekijk ook de videohandleiding onder aan de pagina!

Diverse programma’s

Elke website wordt geprogrammeerd. De voorkant is mooi met plaatjes, netjes opgemaakt. Alles heeft zijn vaste plek. Steeds vaker is een website ook interactief. De gebruiker voert iets in en dan gebeurt er iets. Een website kun je uiteen rafelen in diverse delen.

  1. De teksten (plaats van teksten vastgelegd in html)
  2. De opmaak (visuele uitstraling van een website vastgelegd in css)
  3. De functies (het dynamisch maken van een website, vastgelegd in php)
  4. De gegevens  (vastgelegd in een database voor bijvoorbeeld zoekfuncties, vastgelegd in MySQL)

De teksten

Alle websites bestaan uit teksten en vaak ook afbeeldingen of video’s. Deze teksten worden door de gebruikers of webdesigners ingevoerd.

Geschiedenis webdesign

Toen halverwege de jaren negentig van de vorige eeuw de eerste websites verschenen, programmeerden de eigenaars van een website zelf hun eigen website. Dit werd gedaan met behulp van de taal: HTML.

In de eerste jaren zat de opmaak in de html code verweven.

Wilde je een koptekst maken, dan zette je de tekst tussen de volgende code: <H1></H1>

Hoe zo’n kop eruit zag, welke kleur en lettertype, dat werd pas later bepaald.

Om meer te leren over html zou je eens deze online gratis cursus kunnen volgen.Naarmate er meer eisen aan een website werden gesteld (moest natuurlijk mooi en gelikt uitzien) werden er meer codes gebruikt om zelf te kunnen bepalen hoe de pagina eruit kwam te zien.CSS deed zijn intrede.

De opmaak

CSS staat voor Cascading Style Sheets.

Omdat het programmeren van een webpagina steeds onoverzichtelijker werd door alle codes, werd op een gegeven moment steeds meer gebruik gemaakt van CSS.

Alle opmaak elementen werden uit de html codes getrokken en apart in een stylesheet geplaatst.

In de html code werd dan de stylesheet aangeroepen waardoor het als een geheel werkte.

Volg een gratis online CSS cursus.
Of deze duidelijke uitleg over html en css.

 

 

Geschiedenis editors

Al in de tweede helft van de negentiger jaren kon je (gratis) een website maken zonder al te veel kennis van HTML. Je werkte dan met de zogenaamde WYSIWYG-editors. Je hoefde niet elke code in te tikken, dat deed het programma voor je.

 

Bekende programma’s waren Netscape Composer en Frontpage. Ongeveer rond de eeuwwisseling kwam NVU uit, later werd dit KompoZer.KompoZer kon als een van de eerste (gratis) WYSIWYG ontwerpers, een zelfstandige CSS ontwerpen.Al deze programma’s waren gratis.Al had je ook betaalde programma’s zoals bijvoorbeeld Dreamweaver van Adobe, dat nog steeds veel gebruikt wordt.

Weblogs

Na de eeuwwisseling kwamen steeds meer weblogs in beeld.
Dit waren websites die voornamelijk bestonden uit berichten.
Het nieuwste bericht werd steeds bovenaan de pagina geplaatst.

Al voor de eeuwwisseling bestonden er weblogs, maar het principe werd pas na 2000 omarmt door het grote publiek.
Het fenoneem werd zo populair dat tegenwoordig de meeste websites een combinatie zijn van een statische website en een weblog.
Met de groei van de weblogs werden er steeds meer eisen aan de websites gesteld.

Het cms deed zijn intrede.

De functies

Een cms bestaat uit diverse modules.

Om met behulp van deze modules dynamische webpagina’s te kunnen maken heb je een extra programmeertaal nodig, nl.: php.

Omdat php pas sinds 2007 stabiel genoeg was voor gebruik in een cms, is er pas sindsdien op grote schaal gebruik van gemaakt.
Php wordt vaak in combinatie met MySQL gebruikt.

De gegevens

Omdat een weblog heel veel gegevens moet verwerken is het handig om met een database te werken, een relationele database.

Een cms werkt daarom vaak met bijvoorbeeld MySQL.
Dankzij de database zijn de gegevens razendsnel opgezocht.
Het is daarom wel belangrijk dat aan de berichten trefwoorden (tags) en categorieën worden gehangen zodat de database zijn werk kan doen.

WordPress

WordPress werkt met thema’s.

Deze thema’s zijn gebaseerd op CSS. En aangezien het CSS losgekoppeld is van de html, kun je heel gemakkelijk wisselen van uiterlijk zonder de inhoud te verliezen.

Deze thema’s zijn in honderdtallen zoniet in duizendtallen te vinden op het internet. Sommige gratis, andere niet. Je hoeft dus niet eens te kunnen ontwerpen om toch een leuk uiterlijk voor je website te hebben. Ook daarom is WordPress zeer geliefd bij veel webdesigners.

Ga je nu kijken naar WordPress, dan zie je dat WordPress ook is opgedeeld uit verschillende “modules”.

  • De inhoud: pagina’s en berichten
  • Het uiterlijk: thema’s, widgets en menu’s
  • De functionaliteiten: in de vorm van plugins
  • Media: een bibliotheek voor foto’s, video’s en andere bestanden.

Voorkant en achterkant

De voorkant van een WordPress website is die kant die iedere bezoeker krijgt te zien.

De achterkant zie je pas als je ingelogd bent.
Je komt dan op het dashboard terecht.

Hoe heten nu de onderdelen van een webpagina aan de voorkant?
Dat heb ik hier in een videohandleiding aangegeven.
Dit zijn ook het soort video’s dat je kunt vinden in het Premium gedeelte.

Geef een reactie