Hieronder zie je twee HTML/CSS tips. Deze tips kun je gebruiken voor je HTMl website, maar ik laat je ook zien hoe je ze kunt doorvoeren in Joomla en Wordpress.
De onderstaande tips waren oorspronkelijk gepubliceerd op mindertaardema.nl maar ik heb ze nu dus verhuisd naar deze website.
Tip 1: Cirkels
Zoals je waarschijnlijk wel weet, wordt het uiterlijk van je website voor een groot deel bepaald door CSS. Met CSS kun je alle elementen op je website voorzien van uiterlijke kenmerken. Met CSS kun je hele leuke dingen doen. Hieronder vind je daarvan een voorbeeld.
In de onderstaande video laat ik je zien hoe je met CSS mooie, aanklikbare cirkels maakt, zonder dat je daarvoor afbeeldingen gebruikt. Vervolgens zie je hoe je deze cirkels kunt gebruiken in Joomla en Wordpress.
Doordat er geen afbeeldingen gebruikt worden voor het maken van de cirkels, blijft je site dus licht. Immers, elke afbeelding betekent meer kilobytes om te laden, dus een langer laadtijd.
In dit ZIP bestand vind je de code om de CSS cirkels mee te maken.
Hier vind je de site om je viewport te bekijken.
Tip 2: Overgangen
In deze tweede tip wil ik je nog een stukje CSS code laten zien, waarmee je sommige zaken op je website iets subtieler kunt laten tonen. Namelijk een CSS effect waarmee je mooie overgangen kunt maken. Dus, weer iets om leuk mee te "prutsen" ;-)
We gaan verder met de cirkel uit de video van de eerste tip en we voegen een mooi overgangseffect toe. De video is gemaakt in Wordpress en Joomla, maar je kunt de HTML code die je ziet ook gebruiken in een HTML website.
Het hele voorbeeld wat je in de video ziet, kun je hier downloaden als ZIP bestand.