Als opdracht voor het vak CSS to the rescue heb ik de artkworks van jaren 80 VHS banden nagemaakt met vanilla CSS. Ik mocht tijdens de opdracht ook geen id’s of classes gebruiken, alleen CSS selectoren.
De meeste elementen zijn met postion absolute en relative gedaan en heb ik text moeten warpen om letters langer te maken. Met behulp van clippath heb ik het voor elkaar gekregen om lastigere vormen te gebruiken. Maar voor andere was het beter om een linear gradient te gebruiken. Dit was makkelijker en scheelde veel tijd en positionering van andere elementen en het eindresultaat is daardoor ook beter.
Om aan te sluiten bij de WCAG toegankelijkheids eisen heb ik een kleur filter gemaakt die er voor zorgt dat bepaalde kleuren genoeg contrast hebben. Mensen met slechter zicht kunnen het dan beter zien.
Om te voorkomen dat bepaalde gebruikers met langzamer internet of mindere hardware de VHS banden niet kunnen inladen heb ik ook een knop toegevoegd die alle styling verwijderd. Dit was ook onderdeel van de opdracht voor het vak.
Naar VHS Banden