Soms word ik wel behoorlijk moe van de eigen levens die de CSS code op de websites soms menen te moeten leiden. Verander je het ene kleine dingetje, is plots je hele layout verprutst en lijkt alles een eigen leven te leiden. Die CSS zit naar mijn mening ook helemaal niet logisch in elkaar, vast weer een bedenksel van een Amerikaan of zo.

Ik heb natuurlijk ook best wel een complexe layout, wat helemaal geregeld wordt via een stylesheet om de saai uitziende html elementen toch een leuk uiterlijk te kunnen geven, zeg maar de botox en fillers voor je website, zonder ziet de website er echt niet uit, voor geen meter en met zou het een plaatje moeten zijn, mits alles goed en logisch in elkaar steekt natuurlijk.

Neem nou de header van de website, dat grijze ding hierboven met die kop van mij en m'n naam erin en een aantal links. Dat lijkt 1 vlak, maar is opgebouwd uit 7 losse vlakken die ook weer onderverdeeld zijn in andere vlakjes, allemaal om de informatie op een leuke en nette manier te presenteren. Zo zijn de bovenste 3 vlakken voor de verdeling van het telefoonnummer, contactadres en de eventuele Facebook pagina link. Daaronder heb je weer 3 vlakken, voor het logo, de naam en slogang en de linkjes voor aanmelden en inloggen e.d. Daaronder heb je 1 breed vlak voor het hoofdmenu met de links. En dit is nog maar de header, de footer, helemaal onderaan de pagina is nog veel erger.

Tussen header en footer moet dus de eigenlijke content komen en dat kan van alles zijn, soms is er een extra menu vereist, de ene keer aan de linkerkant, de andere keer moet er een lijst van items gepresenteerd worden aan de rechterkant, of alle informatie moet gewoon over de volle breedte verdeeld worden. Hierbij gaat het momenteel nog weleens een beetje mis en wordt de informatie niet goed over de beschikbare ruimte verdeeld, waardoor het er soms wat rommelig uit kan zien. Geen nood, hier ben ik al druk mee bezig om er wat meer structuur in aan te brengen.

Wat het nog lastiger maakt is dat alles er ook goed uit moet zien op andere schermen, zoals laptop, desktop, mobiel en tablet en geen enkel device is gelijk en heeft ook lang niet zoveel ruimte als een 27 inch desktop scherm van een Mac mini. Webdesign.was 30 jaar geleden toch een stuk makkelijker hoor, toen had je al die kleine prutsdevices nog niet en hoefde je alleen maar rekening te houden met schermen van 640 * 460, 800 * 600 of 1024 * 768 pixels en als het op het kleinste scherm er goed uit zag, deed dat het vaak ook wel op de grootste, het zij alleen dat de letters mogelijk wat kleiner konden zijn. Tegenwoordig heb je zoveel verschillende formaten schermen en resoluties, het is bijna niet meer te doen zo. Gelukkig voorzien de CSS codes wel in functies om hiermee om te gaan, maar nog is het erg complex.

Wie het ooit heeft verzonnen om te gaan internetten met een mobiele telefoon, moeten ze wat mij betreft levenslang opsluiten, pffff Ik vind het persoonlijk erg onhqandig, dat gepruts op zo'n klein schermpje. Nu gebruik ik dan wel VoiceOver, maar ook dat is niet ideaal en de zoomfuncties werken ook lang niet altijd even lekker, zeker niet in combinatie met VoiceOver. Op een iPad vind ik het ook niet bepaald ideaal, maar toch wel weer wat beter te doen dan op zo'n kleine telefoon.

Een laptop gaat naar mijn mening al weer iets beter dan een iPad, maar van laptops krijg ik al nachtmerries van de toetsenborden, mijn handen zijn gewoon te groot en het typt gewoon niet fijn. Geef mij maar gewoon een lekker groot scherm en een normaal mechanisch toetsenbord en een muis met een draad, die lopen niet weg en zijn nooit leeg.

Maar goed, om weer even terug te komen op mijn verhaal over de website. Momenteel ben ik dus flink aan het worstelen met de layout en daarbij kan het weleens gebeuren dat de informatie ineens totaal anders gepresenteerd wordt of helemaal door elkaar staat. Geen paniek, hier ben ik mee bezig en ben dan op zoek naar de juiste setting. Omdat ik ook met dat multi language gedoe bezig ben kan het ook wel gebeuren dat je ineens teksten ziet staan "No language key found!", dan heb ik natuurlijk met m'n kromme vingers een typefoutje gemaakt en wordt dit zo snel mogelijk hersteld. Allemaal geen schokende dingen dus.

De header is al voorzien van deze multi language mogelijkheden en daarin zijn nu alle teksten opgenomen die vertaald kunnen worden naar een andere taal. Hiervoor gebruik ik taalbestanden met allemaal teksten, de variabelen zijn allemaal gelijk en veranderen dus niet, alleen de tekst binnen die variabele kan veranderen per taal. Het is straks de bedoeling dat de taal van de webbrowser gedetecteerd wordt en dat de website daarop reageert en dat men een schakelaar krijgt om deze taal vast te zetten, zodat na inloggen meteen de juiste taal wordt gekozen. Hoe dit allemaal precies te regelen, weet ik nog niet precies, maar dat komt wel goed.

Oke, weer genoeg bijgekletst, ik ga weer even verder met het aanpassen van de website, want er is best nog wel veel te doen.