TYPO3 webdesign
TYPO3 templating
Nadat het grafisch ontwerp naar wens is gemaakt en dit na eventuele aanpassingen is goedgekeurd dient het ontwerp worden omgezet naar een HTML template met bijbehorende CSS. In dit template kan TYPO3 automatisch de content van de site zetten (parsen), zoals tekst, beeld, formulieren, applicaties etc.
TYPO3 responsive webdesign
Is het PC-tijdperk voorbij? Gaat het in de toekomst alleen nog maar om mobile devices? Feit is dat van business naar consumer een mobiele presentatie al erg belangrijk is!
Mobile First!
Het internet wordt dus steeds populairder op allerlei mobile devices, zoals iPhones, Androids, iPads e.d. In sommige gevallen is het aantal bezoeken met een device aan een website groter dan middels een PC of laptop. Vandaar de term tegenwoordig Mobile First!
Met de implementatie van HTML5 sinds TYPO3 4.7 is het eenvoudiger om een website zo vorm te geven dat deze op de meest voorkomende apparaten goed en leesbaar wordt weergegeven. De layout wordt dan vaak vloeiend aangepast aan de breedte van het scherm.
TYPO3 responsive website
Deze automatische aanpassing van breedte, het onder elkaar zetten van kolommen, het aanpassen van afmetingen van het menu, foto's, formulieren etc., wordt responsive webdesign genoemd. Met TYPO3 is het zeer goed mogelijk om responsive websites te ontwikkelen en dit heeft ook sterk de voorkeur om bezoekers een goede presentatie te geven van uw website.
Scheiden structuur, content en vormgeving
Door middel van gebruik van TYPO3 kunnen structuur, content en vormgeving netjes worden gescheiden. De content, zoals teksten, formulier en foto's, kan eenvoudig door de redacteur aangemaakt en gewijzigd worden in de backend van TYPO3. De structuur wordt bepaald door de HTML templates en de vormgeving door de CSS.
Voordelen scheiding structuur en vormgeving
Layout-wijziging
Het is relatief eenvoudig om de gehele vormgeving over de hele site aan te passen, zonder dat de structuur of de content aangepast hoeft te worden.
Bandbreedte
De bestanden worden kleiner en kunnen gecached worden. Dit betekent een snellere site en goedkoper in hosting.
Overzichtelijk en eenvoudig
De inhoud en structuur van de pagina's zijn voor ontwikkelaars eenvoudig. Dit is handig voor toekomstig onderhoud.
Consistente layout
Consistentie in het uiterlijk van de site maakt een site beter herkenbaar en dus beter bruikbaar.
Browser onafhankelijk
De site doet het ook nog op apparaten die minder goed met vormgeving omgaan, zoals hele oude browsers, tekstbrowsers, telefoons, PDA's etc. Wanneer webstandaarden ook nog in acht worden genomen kunnen bijvoorbeeld ook gehandicapten de site ook benaderen.
Semantische opbouw volgens webrichtlijnen
Wij bouwen templates zo veel mogelijk semantisch op volgens webrichtlijnen. Behalve een duidelijke opbouw, het scheiden van content, stuctuur en vormgeving, een goede accessibility en het voldoen aan de modernste eisen, heeft dit bijvoorbeeld ook zeer veel voordelen voor zoekmachine noteringen. Leest u hier meer over :
webrichtlijnen, zoals de overheid die adviseert >>
een goede webpagina is ingedeeld als een boek >>
TYPO3 templates
HTML
HTML is de opmaaktaal om documenten zoals webpagina's op het World Wide Web te specificeren. HTML bestaat uit platte tekst met markeringstekens (tags) die aangeven hoe tekst en beeld moeten worden gepresenteerd.
XHTML
XHTML is een herformulering van HTML, maar dan als een XML applicatie. In de praktijk blijkt echter dat XHTML gebruikt wordt als HTML 4.01 om ervoor te zorgen dat oude browsers ook nog goed de pagina weergeven.
HTML5
Sinds TYPO3 4.7 is de standaard de nieuwe HTML 5 geworden. Dit betekent een moderne aanpak, waarbij compatibility voor oude browsers middels javascript gewaarborgd kan worden. Tevens kan gemakkelijker voor mobile devices een responsive design worden geïmplementeerd.
CSS
Waar het echter om gaat is om de structuur van HTML documenten goed te scheiden van de vormgeving. CSS (Cascading Style Sheets) werd geïntroduceerd door het W3C als hulpmiddel bij het bepalen van de vormgeving van een HTML document. CSS fungeren als zogenaamde 'stijlsjablonen', waarmee de weergave van elementen in een browser bepaald kan worden.
Javascript
JavaScript is een veelgebruikte scripttaal om webpagina's interactief te maken en webapplicaties te ontwikkelen, niet te verwarren met Java.