Pakistan is getroffen door een immense ramp. Veel mensen, waaronder ikzelf, willen wel de bevolking helpen, maar zijn bang de mega-salarissen van grote organisaties, de taliban of de Pakistaanse regering te steunen. Je zou ervoor kunnen kiezen om wat geld te doneren aan een kleinere organisatie, waarbij bovenstaande gevaren niet spelen, zoals Gender Concerns International.
Giro 15 83 698 t.n.v. Gender Concerns International, Den Haag. Meer info:

2 september 2010: menu - knoppen - plat

Gewijzigd: menu met knoppen met voorvertoning en indicatie bezocht/onbezocht: voorbeeld uitleg

In alle browsers zit een beveiligingslek, waardoor het voor een kwaadaardige site kinderlijk eenvoudig is bezochte sites te achterhalen. Safari heeft dit gat gedicht, en binnenkort volgen meer browsers. Daardoor worden de mogelijkheden om een bezochte link op te maken met css heel sterk beperkt. Hierdoor werkte dit voorbeeld niet meer, nu weer wel.

Om dezelfde reden op de site zelf het systeem met vinkjes en vraagtekens voor bezochte en niet-bezochte pagina's aangepast.

De afgelopen tijd heb ik uitgebreid gewerkt met Jaws, een screenreader. Dit heeft geleid tot nogal wat veranderingen binnen de pagina's met uitleg. Geleidelijk aan zullen de bestaande pagina's worden aangepast. Met een 'normale' browser zul je hier helemaal niets van merken.

De verbeteringen zullen ook doorwerken in de voorbeelden. Deze waren in de regel al relatief goed toegankelijk, maar sommige dingen konden nog wat beter.

2 augustus 2010: links

Gewijzigd: pagina met links toegankelijker gemaakt. Na testen met Jaws, een screenreader, bleek een aantal dingen beter te kunnen. En omdat ik geen rekening meer houd met Internet Explorer 6, waren die verbeteringen nu ook daadwerkelijk mogelijk.

Jaws gaat routinematig gebruikt worden om dingen te testen. Ik ga eerst nog wat oefenen op de site zelf, maar uiteindelijk zal alles ook getest gaan worden in deze screenreader.

30 juli 2010: artikelen

Gewijzigd: alle artikelen maken nu gebruik van een stylesheet voor het printen.

29 juli 2010: artikelen

Nieuw: een pagina met behulp van css printvriendelijk maken: artikel

22 juni 2010:

Inmiddels alles weer opnieuw geïnstalleerd en zo. Voor Internet Explorer 6 zou ik een oude versie van Windows moeten installeren. Dat gaat wat lastig. Het zou wel lukken, maar het kost wat moeite. Omdat ik toch al langere tijd van plan ben niet meer te testen op Internet Explorer 6, lijkt dit het juiste moment.

Vanaf nu test ik dus niet meer in Internet Explorer 6. En maak daar dus ook geen aanpassingen meer voor. Oudere voorbeelden zullen gewoon blijven werken, want Internet Explorer 6 verandert niet. Maar nieuwe voorbeelden worden niet meer getest in deze zwaar verouderde browser.

Bij elk voorbeeld kun je onder Getest in precies vinden voor welke browsers is getest. Zodra ik iets wijzig in een bestaand voorbeeld, verwijder ik daar bij Getest in Internet Explorer 6, omdat ik de wijziging niet heb kunnen testen.

Er is voor particulieren echt geen enkele reden om deze rotbrowser nog te gebruiken. Bedrijven kunnen voor intern gebruik aan Internet Explorer 6 vast zitten, als ze in het verleden zo stom zijn geweest om dingen te maken die alleen in deze browser werken. Maar voor gebruik op Internet kunnen ze 'n andere browser toestaan. Als ze dat niet doen, is dat hun probleem.

In 2014 wordt hoe dan ook elke ondersteuning voor Internet Explorer 6 gestopt, dus dan móéten ze over. Overigens stoppen steeds meer websites ondersteuning voor Internet Explorer 6, dus ik ben bepaald geen uitzondering: Wij stoppen ook

Op nieuwe pagina's op deze site zelf maak ik geen aanpassingen meer voor Internet Explorer 6. Het kan dus prima dat steeds meer pagina's op deze site niet meer goed, of zelfs helemaal niet, te zien zijn in Internet Explorer 6. Zodra een oude pagina wordt gewijzigd, haal ik ook daar de aanpassingen voor Internet Explorer 6 weg.

17 juni 2010:

Forse hardware-problemen gehad. Als het goed is zijn die nu opgelost en kan er weer wat aan de site worden gedaan.

Bij het testen op toegankelijkheid is WebFormator weggevallen. De sneltoets om WebFormator te starten is dezelfde als de sneltoets om de ingebouwde ontwikkeltools in Internet Explorer 8 te starten. In plaats van WebFormator gebruik ik nu Fangs Screen Reader Emulator.

18 mei 2010: forum

Nieuw: forum toegevoegd aan de site. Omdat ik geen tijd heb om alle vragen per e-mail te beantwoorden, hoop ik dat op deze manier op te lossen. Hopelijk gaan meer mensen hier vragen beantwoorden: forum

9 mei 2010: positioneren - kolom

Nieuw: twee of meer kolommen gemeenschappelijke rand en/of achtergrond geven: voorbeeld uitleg

25 april 2010: afbeelding - veranderen

Nieuw: bij hoveren over de afbeelding verandert deze: voorbeeld uitleg

21 april 2010: tekst - invoegen

Nieuw: menu uit een ander bestand invoegen met Server Side Includes (SSI): voorbeeld uitleg

16 april 2010: menu - statisch - horizontaal

Nieuw: horizontale wegwijzer in de vorm van broodkruimels (breadcrumbs): voorbeeld uitleg

6 april 2010: tekst - lijnen

Nieuw: overstrepen, onderstrepen en doorstrepen van tekst in alle soorten en maten: voorbeeld uitleg

21 maart 2010: lijst

Nieuw: positie, kleur, symbool, enz. in een lijst wijzigen: voorbeeld uitleg

11 maart 2010: lay-out - schermvullend (vaste header)

Nieuw: schermvullende lay-out met vaste header en drie kolommen, middelste kan scrollen: voorbeeld uitleg

1 maart 2010: artikelen

Nieuw: doorzichtige border mogelijk maken in Internet Explorer 6: artikel

28 februari 2010: figuren - grafiek

Nieuw: makkelijk aan te passen verticale staafdiagrammen: voorbeeld uitleg

23 februari 2010: afbeelding - video

Nieuw: video in vrijwel elke browser zonder dat JavaScript of installeren van plug-ins nodig is: voorbeeld uitleg

9 februari 2010: tekst - bewerken

Nieuw: toegankelijk formulier met allerlei soorten invoervelden: voorbeeld uitleg

28 december 2009: tekst - effecten

Nieuw: ondoorzichtige tekst op doorzichtige achtergrond, gebruikt rgba: voorbeeld uitleg

19 december 2009: artikelen

Nieuw: hoe krijg ik veilig een gratis bezoekersteller?: artikel

13 december 2009: afbeelding - overig

Nieuw: preloaden van afbeeldingen: voorbeeld uitleg

30 november 2009: tekst - effecten

Nieuw: initiaal ('drop cap') met en zonder gebruik van plaatje: voorbeeld uitleg

23 november 2009: pop-up - tabel

Nieuw: pop-up met Periodiek Systeem en links naar betreffende Wikipedia-pagina's: voorbeeld uitleg

10 november 2009: tekst - bewerken

Nieuw: oplosbare kruiswoordpuzzel met extra toeters en bellen: voorbeeld uitleg

2 november 2008: menu - knoppen - plat

Gewijzigd: menu met knoppen. Bij hoveren verandert de afbeelding: voorbeeld uitleg

Beter toegankelijk gemaakt.

7 oktober 2009: afbeelding - verbergen

Nieuw: link en antwoord op vraag verbergen onder afbeelding: voorbeeld uitleg

29 september 2009: lijst

Nieuw: sitemap met lijnen. Gebruikt geen plaatjes: voorbeeld uitleg

18 september 2009: schaduw

Nieuw: tekst met schaduw (en meer). Gebruikt geen plaatjes of dubbele tekst: voorbeeld uitleg

7 september 2009: menu - statisch - horizontaal

Gewijzigd: menu met verkleurende knoppen met indicatie van huidige, bezochte en onbezochte pagina's: voorbeeld uitleg

Op een of andere manier is dit menu totaal niet gecontroleerd op toegankelijkheid. Alsnog gedaan, wat 'n aantal wijzigingen in de code opleverde.

3 september 2009: kader - ronde hoeken

Nieuw: dubbel kader met ronde hoeken. Hoogte groeit mee met inhoud: voorbeeld uitleg

26 augustus 2009: positioneren - horizontaal

Nieuw: horizontaal én verticaal centreren van blok-element met bekende hoogte en breedte: voorbeeld uitleg

21 augustus 2009: pop-up - tekst

Nieuw: pop-up met kader met ronde hoeken: voorbeeld uitleg

12 augustus 2009: menu - dynamisch- horizontaal

Nieuw: simpel dropdownmenu, twee niveaus diep: voorbeeld uitleg

3 augustus 2009: lijst

Nieuw: lijst met automatische nummering en bijpassende (lelijke) lay-out: voorbeeld uitleg

25 juli 2009

Naslag weer verwijderd. 't Idee was leuk, maar 't was óf zo klein dat 't nutteloos was, óf zo uitgebreid dat 't veel te groot werd. De Naslag werd zelfs groter dan de handleidingen waar ze bij stond.

Ook de reactie-mogelijkheid weer verwijderd omdat 't soms wel tien seconden duurde voordat 't was geladen. Dat is nog niet zo erg, maar daarna werd de pagina weer helemaal bovenaan gezet. Bovendien werkte 't regelmatig helemaal niet.

15 juli 2009: artikelen

Nieuwe categorie: artikelen. Dat zijn er nu nog maar twee, maar zullen er geleidelijk aan meer worden: artikelen

Nieuw: artikelen → lijsten: lijsten met utf-8-codes en entiteiten (bijzondere tekens, accenten, enz.): artikel

Nieuw: artikelen → html → head: charset, tekenset, utf-8, entiteiten, accenten, en dergelijke: artikel

Dit zijn de eerste drie pagina's met een mogelijkheid tot reageren. Geleidelijk aan komt deze mogelijkheid op alle pagina's met een uitleg. Dit is wel experimenteel, als het alleen maar onzinnige reacties op gaat leveren is 't gauw over. Reageren is bedoeld voor vragen, kritiek, enz., niet voor allerlei flauwekul.

Daarnaast zijn dit de eerste pagina's met een Naslag: als je op 'n gemarkeerd woord klikt, zie je snel 'n summiere uitleg van dat woord. Ook dit zal geleidelijk aan op alle pagina's met een uitleg komen te staan.

Voor de Naslag wordt SSI gebruikt, omdat het om 'n tamelijk groot bestand gaat dat voortdurend wijzigt en uiteindelijk op vele tientallen pagina's komt te staan. Daar is SSI (of PHP) geknipt voor. Je kunt in theorie die Naslag natuurlijk ook overal in plakken, maar dat vind ik meer iets voor de lange winteravonden als je niet meer weet wat je moet doen, of als je aan 't revalideren bent van twee gebroken benen en ook tijd te veel hebt.

Voor de reactie-mogelijkheid gebruik ik 'n extern JavaScript. Zo'n reactie-mogelijkheid is zonder JavaScript (of iets als PHP) onmogelijk. Ik gebruik 'n extern JavaScript omdat ik dat er goed uit vindt zien. Ik ben geen PHP- of JavaScript-expert en scripts om op m'n eigen site te zitten vond ik niet goed genoeg. Vandaar 'n kant-en-klaar-oplossing die goed schijnt te werken.

25 mei 2009: tekst - lijnen

Nieuw: schaalbare inhoudsopgave met voorlooppunten: voorbeeld uitleg

15 mei 2009: lay-out - gecentreerd (meescrollende header)

Nieuw: horizontaal gecentreerde lay-out met twee even hoge kolommen. Hele pagina scrollbaar: voorbeeld uitleg

12 mei 2009: figuren - grafiek

Nieuw: makkelijk aan te passen horizontale staafdiagrammen: voorbeeld uitleg

3 mei 2009: figuren - driehoek

Nieuw: schaalbare driehoeken zonder gebruik van een afbeelding: voorbeeld uitleg

29 april 2009: afbeelding - verbergen

Nieuw: afbeeldingen zijn afzonderlijk meer of minder (on)zichtbaar te maken: voorbeeld uitleg

19 april 2009: afbeelding - slideshow

Verbeterd: slideshow met horizontale rij thumbnails en foto's. Gebruikt weinig bandbreedte: voorbeeld uitleg

In Internet Explorer 8 werkte dit door 'n bug alleen in de compatibiliteitsweergave (zoals Internet Explorer 7). Door wat css speciaal voor Internet Explorer 8 werkt deze nu ook in standaardmodus. Waarmee alle voorbeelden nu ook in Internet Explorer 8 in standaardmodus werken.

14 april 2009: afbeelding - veranderen

Verbeterd: van boven, onder of opzij tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

In Internet Explorer 8 werkte dit alleen in de compatibiliteitsweergave (zoals Internet Explorer 7). Door twee kleine aanpassingen werkt het nu ook in de standaardmodus van Internet Explorer 8.

13 april 2009: afbeelding - veranderen

Verbeterd: van bovenaf tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

In Internet Explorer 8 werkte dit alleen in de compatibiliteitsweergave (zoals Internet Explorer 7). Door een kleine aanpassing werkt het nu ook in de standaardmodus van Internet Explorer 8.

13 april 2009: tekst - effecten

Verbeterd: bij overflow wordt tekst onderaan langzaam vager: voorbeeld uitleg

Door een bug in Internet Explorer 8 kwam de afbeelding die voor het vervagen zorgt over de volledige tekst te staan en moest dit voorbeeld in compatibiliteitsweergave (zoals Internet Explorer 7) worden weergegeven. Nu werkt dit ook goed in de standaardmodus van Internet Explorer 8.

12 april 2009: afbeelding - veranderen

Verbeterd: tijdelijk afbeelding door slepen van bovenaf laten overvloeien in nieuwe afbeelding: voorbeeld uitleg

Omdat ook Internet Explorer 8 nog steeds niet de standaardwijze van opacity ondersteunt, moest dit voorbeeld in compatibiliteitsweergave (zoals Internet Explorer 7) worden weergegeven. Nu werkt dit ook goed in de standaardmodus van Internet Explorer 8.

12 april 2009: afbeelding - thumbnails

Verbeterd: hover over een van de thumbnails en de bijbehorende grote afbeelding met bijschrift verschijnt: voorbeeld uitleg

Door een bug in Internet Explorer 8 bleven alle afbeeldingen geopend als je de tab-toets gebruikte en moest dit voorbeeld in compatibiliteitsweergave (zoals Internet Explorer 7) worden weergegeven. Nu werkt dit ook goed in de standaardmodus van Internet Explorer 8.

11 april 2009: afbeelding - slideshow

Verbeterd: slideshow met thumbnail en foto's van verschillende grootte. Gebruikt weinig bandbreedte: voorbeeld uitleg

Door een bug in Internet Explorer 8 bleven (alleen in de download) alle afbeeldingen geopend als je de tab-toets gebruikte en moest dit voorbeeld in compatibiliteitsweergave (zoals Internet Explorer 7) worden weergegeven. Nu werkt dit ook goed in de standaardmodus van Internet Explorer 8.

11 april 2009: afbeelding - slideshow

Verbeterd: slideshow met verticale rij thumbnails en foto's van verschillende grootte. Gebruikt weinig bandbreedte: voorbeeld uitleg

Door een bug in Internet Explorer 8 bleven (alleen in de download) alle afbeeldingen geopend als je de tab-toets gebruikte en moest dit voorbeeld in compatibiliteitsweergave (zoals Internet Explorer 7) worden weergegeven. Nu werkt dit ook goed in de standaardmodus van Internet Explorer 8.

10 april 2009: Internet Explorer 8

Pfff, alles gecontroleerd. Internet Explorer is de enige browser waar je bij elke nieuwe versie álles uitgebreid moet controleren.

Van de 57 voorbeelden zijn er maar liefst negen die niet goed werken. Aangezien alle code aan de standaard voldoet, en aangezien alles werkt in alle andere browsers, laat ik de conclusie over Internet Explorer 8 en of die volledig conform de standaard is, zoals Microsoft beweert, maar aan de lezer over.

Deze negen voorbeelden ga ik omwerken, zodat ze ook in de standaardmodus van Internet Explorer 8 werken. Tot die tijd worden deze voorbeelden in compatibiliteitsweergave (zoals Internet Explorer 7) weergegeven. In de betreffende voorbeelden wordt dit vermeld.

30 maart 2009: Internet Explorer 8

De bugs en afwijkingen van Internet Explorer 8 lijken toch mee te vallen en niet groter te zijn dan bij andere browsers die de standaard respecteren. Het grootste probleem schijnt iets met z-index te zijn, en toevallig hadden de eerste voorbeelden die ik grondig testte daar allemaal mee te maken.

Evenzogoed zal het wel even duren voor alles goed is getest en, als dat nodig is, aangepast.

24 maart 2009: Internet Explorer 8

Het was te mooi... Internet Explorer 8 wijkt op belangrijke punten zoals z-index nog steeds af van de standaard. Heel fijn, nu heb je drie versies van deze baggerbrowser naast elkaar, die alle drie volkomen verschillend werken en geen van drieën volledig volgens de standaard.

Op de plaatsen waar dit speelt komt dit geleidelijk aan in de uitleg erbij te staan. Wel jammer, bij de eerste vluchtige controle leek het 'n goeie browser wat betreft standaarden. Maar ook dit Microsoft-product geeft valid code die goed werkt in alle andere browsers dus regelmatig verkeerd weer.

23 maart 2009: Internet Explorer 8

Op dit moment ben ik bezig alles uitgebreid te testen in Internet Explorer 8. Zodra 'n voorbeeld is getest, staat Internet Explorer 8 in het voorbeeld bij de geteste browsers. Pas als alle voorbeelden zijn getest, zet ik Internet Explorer 8 ook op de 'algemene' pagina's bij de geteste browsers.

Het ongelooflijke is gebeurd: het lijkt erop dat Microsoft eindelijk 'n fatsoenlijke browser heeft gemaakt, wat betreft de standaarden. Bij 'n eerste vluchtige scan leek het overgrote deel van de voorbeelden goed te werken. Dat betekent dat Internet Explorer 8 goed werkt op dezelfde code als Safari, Firefox, Opera en Google Chrome. Maar eigenlijk is dat pas zeker als Internet Explorer 8 bij de geteste browsers staat.

21 maart 2009: tekst - effecten

Nieuw: bij overflow wordt tekst onderaan langzaam vager: voorbeeld uitleg

13 maart 2009: pop-up - tekst

Nieuw: hele simpele pop-up met alleen tekst: voorbeeld uitleg

11 maart 2009: afbeelding - slideshow

Nieuw: slideshow met horizontale rij thumbnails en foto's. Gebruikt weinig bandbreedte: voorbeeld uitleg

8 februari 2009: menu - afbeelding

Nieuw: menu met afbeelding. Elke link heeft 'n bijbehorende vergrote uitsnede: voorbeeld uitleg

2 februari 2009

Waar ik nu aan werk kostte iets meer tijd (eufemisme) dan ik dacht. Over niet al te lange tijd dus weer iets nieuws.

Intussen worden alle handleidingen geleidelijk aan (waar van toepassing) uitgebreid met 'n stukje over :focus, :hover en :active. Op 'n aantal punten worden de handleidingen, naar aanleiding van vragen van mensen die iets niet begrepen, iets duidelijker herschreven. Inmiddels is ook ongeveer de helft van de voorbeelden getest voor Google Chrome. Er was slechts één kleine aanpassing nodig tot nu toe.

Door een verkeerde instelling van mij in OpenOffice waren alle pdf-bestanden ruim twee keer te groot. Hoe stom kun je zijn, grinnik. Dit wordt ook geleidelijk aan weer gecorrigeerd.

7 januari 2009: afbeelding - veranderen

Nieuw: tijdelijk afbeelding door slepen van bovenaf laten overvloeien in nieuwe afbeelding: voorbeeld uitleg

4 januari 2009: afbeelding - veranderen

Verbeterd: van boven, onder of opzij tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Bij slepen vanaf rechts flitste de vervangende afbeelding heel even volledig tevoorschijn in Safari. Nu niet meer.

28 december 2008: tekst - invoegen

Nieuw: tekst uit een ander bestand invoegen met Server Side Includes (SSI): voorbeeld uitleg

20 december 2008: schaduw

Nieuw: blok tekst met schaduw. Schaduw past zich aan grootte blok, lettergrootte, en dergelijke aan: voorbeeld uitleg

17 december 2008: schaduw

Nieuw: schaduw bij een element met een vaste breedte en hoogte, zoals een afbeelding: voorbeeld uitleg

13 december 2008: figuren - pijl

Nieuw: pijl met tekst erin. Pijl past zich aan lettergrootte aan: voorbeeld uitleg

2 december 2008: afbeelding - thumbnails

Verbeterd: hover over een van de thumbnails en de bijbehorende grote afbeelding met bijschrift verschijnt

Het openen van de achter de thumbnails liggende pagina gebeurde bij Internet Explorer 6 en 7 alleen maar als precies op de getallen werd geklikt. Door het toevoegen van hoogte, breedte, cursor en doorzichtig achtergrondplaatje werkt het nu boven de hele thumbnail. voorbeeld uitleg

2 december 2008: menu - dynamisch - horizontaal

Nieuw: kies via een dropdownmenu een afbeelding en open de bijbehorende pagina: voorbeeld uitleg

4 november 2008: sitemap met thumbnails

Toegevoegd: sitemap met thumbnails. Deze is precies hetzelfde als de gewone sitemap, maar met voorvertoningen in de vorm van thumbnails en pop-ups. Omdat dat nogal veel bandbreedte kan kosten, blijft de sitemap zonder thumbnails gewoon bestaan. Sitemap met thumbnails

4 november 2008: tekst - illustraties

Nieuw: pagina met afbeelding, beschrijving en prijs van gereedschappen: voorbeeld uitleg

22 oktober 2008: afbeelding - imagemap

Nieuw: css-imagemap: landkaart met pop-ups van uitsnedes en extra informatie: voorbeeld uitleg

13 oktober 2008: menu - statisch verticaal

Nieuw: verticaal menu met tekeningen. Bij hoveren verkleuren ze: voorbeeld uitleg

11 oktober 2008: positioneren - afbeelding

Nieuw: afbeelding boven andere afbeelding centreren: voorbeeld uitleg

4 oktober 2008: tekst - illustraties

Nieuw: tekst uitlijnen naast een ronde afbeelding: voorbeeld uitleg

29 september 2008: afbeelding - veranderen

Nieuw: afhankelijk van over welk plaatje je hovert, veranderen 1 tot 4 plaatjes tijdelijk: voorbeeld uitleg

26 september 2008: lay-out - schermvullend (meescrollende header)

Nieuw: schermvullende lay-out met header, footer en drie kolommen: voorbeeld uitleg

16 september 2008: kader - ronde hoeken

Nieuw: doorzichtig kader met ronde hoeken. Hoogte groeit mee met inhoud: voorbeeld uitleg

12 september 2008: afbeelding - slideshow

Nieuw: slideshow met verticale rij thumbnails en foto's van verschillende grootte. Gebruikt weinig bandbreedte: voorbeeld uitleg

7 september 2008: afbeelding - slideshow

Nieuw: slideshow met thumbnail en foto's van verschillende grootte. Gebruikt weinig bandbreedte: voorbeeld uitleg

11 augustus 2008: menu - afbeelding

Gewijzigd: menu voor kinderen met tekening en pop-ups. Elk puzzelstukje is een link: voorbeeld uitleg

Werkt nu ook goed met de nieuwe zoom-functie van Firefox 3. Als 'toevallige' bijwerking kan nu ook probleemloos de lettergrootte worden veranderd. Details onder Wijzigingen bij de uitleg.

10 augustus 2008: lay-out - schermvullend (vaste header)

Herschreven: schermvullende lay-out met vaste header, vaste footer en twee kolommen: voorbeeld uitleg

De nieuwe zoom-functie in Firefox 3 zorgde voor kieren tussen de onderdelen. Gelijk zo herschreven dat hij in alle browsers 'n stuk simpeler werkt, en in Internet Explorer 6 (dus) iets lastiger. Details staan in de uitleg bij Wijzigingen.

7 augustus 2008: lay-out - schermvullend (vaste header)

Herschreven: schermvullende lay-out met vaste header en twee kolommen: voorbeeld uitleg

De nieuwe zoom-functie in Firefox 3 zorgde voor kieren tussen de onderdelen. Gelijk zo herschreven dat hij in alle browsers 'n stuk simpeler werkt, en in Internet Explorer 6 (dus) iets lastiger. Details staan in de uitleg bij Wijzigingen.

4 augustus 2008: afbeelding - imagemap

Gewijzigd: css-imagemap: thumbnail met pop-ups met voorvertoning en extra informatie: voorbeeld uitleg

Werkt nu ook goed met de nieuwe zoom-functie in Firefox. Gelijk verbeterd: bij vergroten van alleen de letters verdwijnt het onderschrift onder de thumbnail niet meer gedeeltelijk.

4 augustus 2008: lay-out - gecentreerd (vaste header)

Herschreven: horizontaal gecentreerde lay-out met vaste header, footer en twee kolommen: voorbeeld uitleg

De nieuwe zoom-functie in Firefox 3 zorgde voor kieren tussen de onderdelen. Gelijk zo herschreven dat hij in alle browsers 'n stuk simpeler werkt, en in Internet Explorer 6 (dus) iets lastiger. Details staan in de uitleg bij Wijzigingen.

29 juli 2008: lay-out - gecentreerd (vaste header)

Herschreven: horizontaal gecentreerde lay-out met vaste header en twee kolommen: voorbeeld uitleg

De nieuwe zoom-functie in Firefox 3 zorgde voor kieren tussen de onderdelen. Gelijk zo herschreven dat hij in alle browsers 'n stuk simpeler werkt, en in Internet Explorer 6 (dus) iets lastiger. Details staan in de uitleg bij Wijzigingen. Die nieuwe zoom-functie houdt je wel van de straat, zal ik maar zeggen...

27 juli 2008: afbeelding - thumbnails

Verbeterd: hover over een van de thumbnails naast de tekst en de bijbehorende grote afbeelding verschijnt: voorbeeld uitleg

Bij in- en uitzoomen in Internet Explorer 7 verdween een deel van het onderschrift onder de afbeelding, als dat meerregelig was.

25 juli 2008: afbeelding - veranderen

Verbeterd: van boven, onder of opzij tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Bij gebruik van de nieuwe zoom-functie in Firefox 3 bleef er aan de onderkant en aan de zijkanten een kier over.

(Oenige) typefout in download waardoor slepen vanaf links in Internet Explorer 7 niet werkte.

23 juli 2008: afbeelding - veranderen

Verbeterd: van bovenaf tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Bij gebruik van de nieuwe zoom-functie in Firefox 3 bleef er aan de onderkant een kier over.

21 juli 2008: menu - dynamisch - horizontaal

Verbeterd: simpel dropdownmenu, tot vier niveaus diep: voorbeeld uitleg

Bij inzoomen in Firefox 3 met de nieuwe zoom-functie pasten de knoppen niet meer altijd naast elkaar.

In bepaalde situaties veranderde het menu in moderne kunst bij zoomen in Internet Explorer 7. Mooi, maar onbegrijpelijk.

Diverse kleine wijzigingen.

20 juli 2008: menu - knoppen - met diepte

Verbeterd: menu met knoppen met ronde rand, die aangeeft of link al bezocht is of nog niet: voorbeeld uitleg

De nieuwe zoom-functie van Firefox 3 gaf problemen met deze knoppen. Nu werkt het weer overal goed.

14 juli 2008: pagina met links

Nieuw: pagina met links: links

5 juli 2008: Konqueror

Ik test niet meer in Konqueror. Konqueror heeft heel erg veel dingen die anders werken dan in Safari, Firefox en Opera. Nou geldt dat ook voor Internet Explorer 7 en zeker voor Internet Explorer 6, maar Konqueror wordt door maar heel weinig mensen gebruikt. De tijd die het kost om dingen werkend te krijgen in Konqueror vind ik niet meer opwegen tegen het kleine aantal mensen dat het gebruikt.

Voorzover ik weet werken alle andere browsers die op Linux draaien (met uitzondering van Opera) met Gecko. Dat is zeg maar het weergavedeel van Firefox, dus alle andere browsers op Linux zullen in principe gewoon goed werken.

Dit betekent ook dat ik geleidelijk aan alle aanpassingen voor Konqueror ga verwijderen uit de voorbeelden, waardoor deze soms 'n heel stuk simpeler kunnen worden.

Het zal nog even duren voor overal op de site is verwijderd dat ook in Konqueror is getest. Als het nog in 'n voorbeeld staat, is het in dat voorbeeld nog getest in Konqueror.

Geleidelijk aan ga ik ook ondersteuning voor Internet Explorer 6 afbouwen. Deze weerzinwekkend slechte en onveilige browser had allang verdwenen moeten zijn. Als iets niet (volledig) werkt in Internet Explorer 6, zal ik dat wel steeds melden bij het betreffende voorbeeld. En in principe probeer ik het ook gewoon te laten werken in Internet Explorer 6, maar sommige dingen kunnen gewoon niet in dat wanproduct, terwijl het wel in alle andere browsers goed werkt. Inmiddels gebruiken steeds minder mensen Internet Explorer 6, dus ik wil me niet langer laten afremmen door die steeds kleinere minderheid.

28 juni 2008: positioneren - tekst

Nieuw: verticaal op gelijke afstand zetten van tekst (zoals centreren): voorbeeld uitleg

25 juni 2008: tekst - illustraties

Nieuw: Bij hoveren over sommige woorden komt 'n bijpassende afbeelding tevoorschijn: voorbeeld uitleg

17 juni 2008: afbeelding - veranderen

Gewijzigd: van boven, onder of opzij tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Werkt nu ook (min of meer) in Internet Explorer 6.

15 juni 2008: afbeelding - veranderen

Gewijzigd: van bovenaf tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Werkt nu ook (min of meer) in Internet Explorer 6.

10 juni 2008: menu - dynamisch - verticaal

Nieuw: simpel uitklapmenu, tot drie niveaus diep: voorbeeld uitleg

2 juni 2008: menu - dynamisch - horizontaal

Nieuw: simpel dropdownmenu, tot vier niveaus diep: voorbeeld uitleg

25 mei 2008: positioneren - horizontaal

Nieuw: horizontaal positioneren van pagina of blok-element met bekende breedte: voorbeeld uitleg

12 mei 2008: afbeelding - veranderen

Nieuw: van boven, onder of opzij tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

8 mei 2008: afbeelding - veranderen

Verbeterd: van bovenaf tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

Nieuwe afbeelding openen gebeurt nu alleen als de cursor van boven komt. Nieuwe afbeelding floept niet gelijk meer dicht als je 1 px te laag komt.

Niet verder vertellen, maar dit was dus kennelijk niet goed genoeg getest en zo...

4 mei 2008: afbeelding - veranderen

Nieuw: van bovenaf tijdelijke nieuwe afbeelding over bestaande afbeelding slepen: voorbeeld uitleg

1 mei 2008: tekst - effecten

Nieuw: ondoorzichtige tekst op meegroeiende doorzichtige achtergrond, gebruikt opacity: voorbeeld uitleg

22 april 2008: positioneren - footer

Nieuw: footer altijd onderaan scherm of lager ('sticky footer'): voorbeeld uitleg

18 april 2008: tekst - ankers

Nieuw: doorlopende lange tekst met inhoudsopgave. Inhoudsopgave en tekst kunnen onafhankelijk van elkaar scrollen: voorbeeld uitleg

13 maart 2008

Over 'n tijdje komen er weer nieuwe dingen. Nu er wat inhoud op de site staat, ben ik eerst alles nog 'ns aan 't nalopen en de navigatie aan 't verbeteren en zo.

8 februari 2008: menu - knoppen - plat

Uitgebreid: menu met knoppen met voorvertoning en indicatie bezocht/onbezocht: voorbeeld uitleg

Grotere voorvertoning die gescrolld kan worden toegevoegd.

7 februari 2008: menu - knoppen - plat

Nieuw: menu met knoppen - onbezochte knoppen zijn rood, bezochte groen: voorbeeld uitleg

31 januari 2008: menu - knoppen - plat

Nieuw: menu met knoppen. Bij hoveren verandert de afbeelding: voorbeeld uitleg

27 januari 2008: pop-up - tekst

Nieuw: pop-up met tekst over achtergrond-afbeelding: voorbeeld uitleg

26 januari 2008: afbeelding - imagemap

Nieuw: css-imagemap: thumbnail met pop-ups met voorvertoning en extra informatie: voorbeeld uitleg

11 januari 2008: pop-up - tekst

Nieuw: pop-up met (overdreven zwaar) opgemaakte tekst: voorbeeld uitleg

10 januari 2008: menu - knoppen - plat

Nieuw: menu met knoppen. Tekst bij hoveren verschilt afhankelijk van bezocht/onbezocht: voorbeeld uitleg

5 januari 2008: menu - knoppen - plat

Nieuw: menu met knoppen die doorzichtig worden als link is bezocht: voorbeeld uitleg

2 januari 2008: menu - knoppen - met diepte

Nieuw: menu met knoppen met ronde rand, die aangeeft of link al bezocht is of nog niet: voorbeeld uitleg

2 januari 2008: menu - knoppen - met diepte

Nieuw: menu met knoppen met rand, die aangeeft of link al bezocht is of nog niet: voorbeeld uitleg

1 januari 2008: menu - knoppen - plat

Nieuw: menu met knoppen met voorvertoning en indicatie bezocht/onbezocht: voorbeeld uitleg

30 december 2007: pop-up - plaatjes

Nieuw: pop-up met smileys: voorbeeld uitleg

29 december 2007: afbeelding - thumbnails

Nieuw: hover over een van de thumbnails naast de tekst en de bijbehorende grote afbeelding verschijnt: voorbeeld uitleg

26 december 2007: afbeelding - thumbnails

Nieuw: hover over een van de thumbnails en de bijbehorende grote afbeelding met bijschrift verschijnt: voorbeeld uitleg

23 december 2007: pop-up - plaatjes

Nieuw: beweeg de cursor en er verschijnen smileys: voorbeeld uitleg

17 december 2007: menu - afbeelding

Nieuw: menu voor kinderen met tekening en pop-ups. Elk puzzelstukje is een link: voorbeeld uitleg

6 december 2007: lay-out - gecentreerd (geen header)

Nieuw: horizontaal gecentreerde lay-out met zijvleugels en footer: voorbeeld uitleg

25 november 2007: menu - statisch - horizontaal

Nieuw: menu met verkleurende knoppen met toelichting en indicatie van huidige, bezochte en onbezochte pagina's: voorbeeld uitleg

22 november 2007: algemeen

Toegevoegd: aan alle handleidingen links naar sites en programma's om toegankelijkheid te controleren.

12 november 2007: pop-up - tekst

Nieuw: pop-up met tekst en afbeelding: voorbeeld uitleg

9 november 2007: pop-up - tabel

Nieuw: pop-up met tabel en kader: voorbeeld uitleg