Mijn site is prima maar in IE een ramp!

[csshunter]

(dit is even een vul-reactie'tje, om van het reclameblokje rechtsboven op het forum af te komen: anders komen de afbeeldingen hieronder niet in verhouding!)

x
x
x
x
x
x
x
x
x
x
x
x
x

(dit zal wel genoeg zijn)

 

[csshunter]

Hier dan de echte

Hoi Spikkeltje,
Ja, dat IE-proof zal wel gaan lukken, denk ik.
Dat je even niets gehoord hebt, betekent niet dat de behandeling van de patiënt gestaakt is.
Bij het verzinnen van een mooi blokje voor rechtsboven kwam ik er namelijk op uit dat we ons toch eerst om het model van de site moeten bekommeren om later geen onwelkome verrassingen tegen het lijf te lopen.

De valkuil is de breedte van de site, en het al of niet liquidiseren.
Zoals de site nu (liquid) is, worden het bij breedbeeldschermen erg lange regels in de content, zoals ik eerder al opmerkte.
Er is verder een minimale breedte ingesteld, dat is op zich niet kwaad.
Maar ... een jaar of wat geleden waren er alleen maar desktops met een klein scala aan mogelijke resoluties van de monitor. Je pakte de smalste die op een bepaald moment in omloop was (eerst 800px, later 1024px), dat maakte je tot vaste breedte, en dan was je klaar.

Op heden is dat totaal veranderd: er zijn opeens weer allerlei mogelijke schermbreedtes vanwege de nieuwerwetsigheden aan laptops, tablets, pods-pads, mobieltjes, enz.
Daar kan je rekening mee houden met "responsive layouts": die reageren op de maten van het apparaat = voor diverse breedtes/hoogtes kan je een aangepaste layout toedienen. - Dat is wel even een werkje ...
Ik wil proberen alles zo veel mogelijk op één css-systeem te laten draaien, zonder aangepaste vormen. En: zonder dat bezoekers met kleinere / smallere beeldschermen een horizontale scrollbar voor hun snufferd krijgen, want dat is onvriendelijk en lastig in het gebruik.

Gevolg voor de topbalk: het wolkje moet veel smaller worden, anders past de combi van linkerblokje / wolkje / rechterblokje er bij de smallere formaten niet mooi op.

Met wat experimenteren kom ik op de volgende principes uit.
Aan de linkerkant steeds wat het nu is, rechts hoe het kan worden.

=======
Resolutie 1680*1050px

Er is een gecentreerd middendeel waar alles in zit. De regellengte van de content-kolom is niet te groot. Links-rechts whiplash wordt vermeden: menu en inhoud zitten compact naast elkaar, witte pagina-background niet te overheersend.
Met de kolommen links en rechts naast de pagina, waar je zo'n hekel aan hebt, vind ik het erg meevallen: als die ook het lichtblauw van de topstrook krijgen, vallen ze nauwelijks op als kolommen.

=======
Resolutie > 1680*1050px
Voor deze super-breedbeelders geldt hetzelfde. De paginabreedte blijft hetzelfde, alleen het lichtblauw links en rechts wordt uitgebreid.

=======
Resolutie 1280*1024px

Hier blijft de aanblik zo ongeveer zoals deze was. De topstrook is nu symmetrisch en vult de hele breedte.

=======
Resolutie 1024*768px
Sommige desktop-bezoekers hebben deze resolutie misschien nog, en verder geldt deze voor de grotere tablets in landscape-stand.

Ook weer vergelijkbare uitkomst.

=======
Resolutie 768*1024px
Dit zijn de grotere tablets in portret-stand.

Hier is geen horizontale scrollbar nodig, en men kan makkelijk veel lezen.

=======
Resolutie 800*600px
Kleine tablets in landscape.

Ook hier nu geen horizontale scrollbar nodig. De topstrook past er nog precies op.

=======
Resolutie 600*800px
Kleine tablets in portret.

Nog steeds geen horizontale scrollbar, maar het wolkje overlapt nu het logo en het andere blauwe blokje; daar moet nog een voorziening op gemaakt worden (men kan zijn/haar tablet natuurlijk altijd kantelen in de landscape-stand om alles te kunnen zien).

=======
Resolutie 480*320px
Mobieltje in landscape.

Nog steeds geen horizontale scrollbar. Het wolkje duikt uit zichzelf naar beneden. Er zal een aangepast menu in de breedte moeten komen, dan kan de inhoud daaronder over de volle breedte.

=======
Resolutie 320*480px
Mobieltje in portret.

Nog steeds geen horizontale scrollbar. Ook hier is een aangepast menu nodig, zodat men geen RSI-vingers krijgt van het verticaal scrollen.

=======
Dit model met alleen de bovenstrook op zijn plaats (en nog niet 100% vormgegeven):

• Test (werkexemplaar): grmc-nw7.htm

Wat dacht je hiervan?

Met vriendelijke groet,
CSShunter

 

[Spikkeltje]

Wow...!!! Wat ik hier van denk?
Euh... Dat je een standbeeld verdient!! :thumb:

Wauw, wat mooi zeg, echt geweldig! Ik sta er echt van te kijken (die KLOEINK die je net hoorde, was m'n onderkaak die m'n bureau raakte), maarre is dat één CSS? Hoe doet 'ie dat dan, op al die formaten het beeld aanpassen? Denk dat m'n bezoekers uiteindelijk wel heel blij zullen zijn straks, die met een mobieltje rennen nu meestal gillend weg

Ben echt blij weer wat van je te horen, was al bang dat je het opgegeven had, zit zelf al máánden met die site te worstelen (nou ja, met dat IE-gedeelte dan en dat niet-werkende formulier enzo, de rest had ik nog niet eens aan gedacht) dus had het je niet kwalijk genomen...

 

[csshunter]

Mooi, dan kan ik rustig doorbreien.
Bovenstaande "screenshots" zijn namelijk gedeeltelijk montage-plaatjes, het echte werk voor onder de kopstrook moet nog komen.

/ Bij de KLOEINK die ik net hoorde was ik al naar het raam gelopen. Even kijken of iemand na een uitglijder op een glad stukje ijs onder de sneeuw soms eerste hulp nodig had, maar gelukkig valt het mee. /

... maarre is dat één CSS? Hoe doet 'ie dat dan, op al die formaten het beeld aanpassen?

Jazeker, het is één CSS , kijk maar in de broncode van de grmc-nw7.htm:

• De <body> geeft de pagina-breedte aan, staat in het midden en heeft een maximale breedte van 1280px. Daarmee gaat de breedte voor breedbeelders niet uit de klauw lopen. Zit de schermbreedte onder de 1280, dan wordt het 100% = schermbreed.
• De #header heeft L en R altijd 2% van de schermbreedte als padding > dan komen het logo en het andere blauwe blokje niet stuik tegen de zijkanten. Hoe smaller het scherm, hoe meer woekeren het met de breedte is: door het % hoeft er minder gewoekerd te worden.
• Het logo heeft een {float:left} en drijft altijd zo ver als toegestaan is naar de linkerkant van het scherm.
• Het andere blauwe blokje heeft een {float:right} en drijft altijd bijna tegen de rechter zijkant aan.
• Het wolkje drijft niet, maar zit er gecentreerd tussen in en wordt er tussenuit geknepen als de ruimte te smal wordt.
• Bij nog smaller passen ook de twee drijvers niet meer naast elkaar, en dan duikt de laatste vanzelf naar beneden.

Op dergelijke manier moet dit nu volgehouden gaan worden voor wat onder de topstrook komt.

Het leuke met css is, dat je voor je neus ziet gebeuren wat je goed (of fout) hebt gedaan: zet het browserwindow niet op vol formaat, en ga dan de zijkanten heen en weer slepen.

• Dit is wel een leuke om met de rechter onderhoek te gaan cirkelen, daar gaan de afbeeldingen ook meeschalen afhankelijk van de beschikbare breedte c.q. hoogte: reisverslag/13.htm
• Ook deze Elastico Style is op desktop altijd prijs: bij elke resolutie van 800*600px of hoger (in die tijd, 2006, waren er nog geen mini-schermpjes).
• Nog een voorbeeld van de css-toverkunsten: de onvolprezen CSS Zen Garden. Daar is er één html-pagina waar alle teksten in staan, die met telkens een ander css-stylesheet totaal van aanblik verandert (bv. deze of deze of deze; er zijn in totaal ruim 200 verschillende ontwerpen bij dezelfde pagina: aan de html-code is niets veranderd!).
• Als je uitgekeken bent, heb ik ook nog wat om te lezen (ik moet jou ook een beetje bezig houden ):
  The Graphical Designer and the CSS Zen Guru.

Wordt vervolgd!
CSShunter

 

[csshunter]

Alvast even gekeken in IE7 naar het contactformulier:

• Formulier komt helemaal zichtbaar tevoorschijn.
• De Recapcha is er, en is klikbaar voor verversing in andere woorden.
• Testberichtje verstuurd (aldus).
• Na de klik op Verzend: tegenberichtje "Bericht ontvangen. Bedankt, enz." of woorden van gelijke strekking.
• Een paar seconden later verdween deze mededeling en werd ik doorverbonden met de homepage.

Lijkt het dus helemaal te doen?

Terzijde: hé daar zie ik opeens de kerstificering van je site. Grappig! - Die doet het niet in IE7 (en bij andere browsers wat nukken & grillen: menu en scrollbar niet helemaal beschikbaar).
Toevallig hield ik me van de kerst ook bezig met een sneeuwscript (zij het zonder kersttakjes en zonder muziekje), ook geschikt voor andere gelegenheden, op eigen server (geen iframe).
Ici met hulst of ijspret *): grmc-gesneeuwificeerd.htm en grmc-geschaatsificeerd.htm​

Groetjes,
CSShunter
____
*) Hm, doet het ook niet in IE; ligt waarschijnlijk aan één van de andere scripts op de pagina (ik verdenk de facebook-widget).

 

[csshunter]

Ha Spikkeltje,
Zo, het model onder de topbalk is klaar, en ook het wolkje drijft nu steeds op zijn plaats.
De aanblik wordt als volgt.

• NB: In het content-gedeelte zit nu maar 1 item, maar er kunnen er zoveel komen als nodig: verticaal voegt de pagina zich vanzelf naar de benodigde hoogte. Ook de menu-kolom kan naar beneden uitgebreid worden.

Resolutie 320*480px
Mobieltje in portret.
Links wat je ziet bij het openen van de site. In het midden het menu als je naar beneden scrollt. En rechts de inhoud als je naar rechts scrollt (nog net een leesbaar kolommetje).

=======
Resolutie 480*320px
Mobieltje in landscape.
Als je het mobieltje kantelt, hoef je niet meer L/R te scrollen. Links weer bij opening van de pagina, in het midden als je wat naar beneden scrollt, en rechts als je nog wat meer naar beneden scrollt.

=======
Resolutie 600*800px
Kleine tablets in portret.

=======
Resolutie 800*600px
Kleine tablets in landscape.

=======
Resolutie 768*1024px
Grotere tablets in portret-stand.

=======
Resolutie 1024*768px
Grotere tablets in landscape, sommige desktop-bezoekers.

=======
Resolutie 1280*1024px
Desktoppers.

=======
Resolutie 1680*1050px en hoger
Desktoppers en breedbeelders

=======

• Om de mobieltjes te gerieven, is het logo-blokje (en het rechterblokje) wat minder hoog: dan past het wolkje er goed op bij openen van de pagina.
• Het rechterblokje is in de breedte schalend gemaakt: hoe smaller het scherm, des te smaller het blokje. Daarmee blijft er steeds zoveel mogelijk middenruimte over voor het wolkje, zodat dit er zo lang mogelijk tussen kan blijven staan en niet hoeft te duiken. Voor de hogere resoluties is er een maximum-breedte toegevoegd: hoogstens net zo breed als het logoblokje.
• Het menu is nu nog een afbeelding, de rest is nu live.

Test: grmc-model-05.htm

De marsroute zal verder als volgt gaan: eerst het menu in werking krijgen (ook voor IE), dan de #content-blokken opmaken, en daarna het interactieve speelgoed voor de hovers.
Tenslotte het sociale gebeuren inplanten, en kijken wat er wel/niet aan verdere javascripts nodig is.
En ook nog: checken of alle hovers en links het doen op touchscreens!

Wordt vervolgd!
CSShunter

 

[Spikkeltje]

Hij wordt mooi zeg! Wat vind jij: de contentblokjes wel of niet met schaduw? Ik durf bijna niets te vragen, ik wil je creatieve proces niet verstoren
Geschaatsificeerd vind ik 'm trouwens ook prachtig haha, maar da's alleen voor het winterseizoen! (Nu dus, want terwijl ik dit typ, dwarrelen de sneeuwvlokken langs de ramen... Ga proberen m'n man over te halen naar de stad te gaan, maar denk dat ik nul op het rekest krijg :d)

Ik hoop dat het straks gaat lukken jouw CSS op mijn site te zetten, hopelijk wil je me ook daarmee helpen want wellicht moet er e.e.a. aangepast worden in de html? Ik denk het wel, vooral op de contactpagina en de eerste pagina, want die sociale media-dingesen doen het volgens mij ook niet altijd naar behoren. De Google +-button is bijvoorbeeld niet te zien in IE, ik weet niet waarom. Krijg ook de plaatjes Like, FB en + niet naast elkaar, staat altijd (veel) ruimte tussen. Maar ik kreeg ze valid, en dat vond ik al heel wat. Het grote werk aan de site hoe 'ie nu is, is trouwens niet door mij gedaan, maar dat wist je al. Laat staan dat ik zou kunnen wat jij voor elkaar krijgt. Ik blijf me verbazen!

 

[Spikkeltje]

Oh, ik zie het al; de contentblokken komen pas in een later stadium aan de beurt.
(Lé-zen Spikkeltje, lé-zen!! )

Ik hou m'n mond al. En wacht in spanning af op het vervolg

 

[csshunter]

Hoi Spikkeltje,

Ik hoop dat het straks gaat lukken jouw CSS op mijn site te zetten, hopelijk wil je me ook daarmee helpen ...

Dat zou wel een mooie zijn: je eerst lekker maken, en dan laten dobberen!
Maar lang, lang geleden (in #13: 'Wijzigingen doorvoeren') had ik al een gebruiksaanwijzing beloofd ... voor als alles klaar en in orde bevonden is.

=======

... want wellicht moet er e.e.a. aangepast worden in de html? Ik denk het wel ...

Zeker weten, omdat nu ook het model enigszins is aangepakt. D.w.z. in alle pagina's zal de html wat anders moeten gaan worden.

=======
Voortgangsrapportage menu
Het hoofdmenu als volgt aangepakt:

• Opschrift 'Navigatie Overzicht' kan zonder bezwaar weggelaten worden: spreekt voor zich, en maakt de opmaak ook rustiger.
• Hoogte van de items iets kleiner gemaakt, dan past het volledige hoofdmenu op een resolutie van 1024*768px:

--->

• De harmonika-uitvoering vond ik niet zo duidelijk (oranje uitklapbalkje boven het item, niet als een soort onderstreping er onder), en bij de submenu's wordt het een beetje veel blauw, zodat je niet precies weet waar je nu zit. Verder schuift een hover het hele menu naar beneden (wat niet echt nodig is) en zelfs ook alle content die verder in de linkerkolom zit. Bij een hover naar de submenu's duiken die ook naar beneden. Maakt de bediening beetje ingewikkeld.
• Menu-items laten stilstaan, oranje accent bij hover gehandhaafd (maar nu als randje), behoeverde items iets laten oplichten, en de driekleurigheid van de site (blauw-geel-oranje) doorgezet in de submenu's.
• Alle 'Over' items ander kleurtje > zie je meteen wat de intro is en wat de voorbeelden zijn.
• Volgorde items aangepast: 'Contact' onderaan, de gebruikelijke plek. Komt ook goed uit voor de hoogte: nu komt het opdrachtgevers-submenu niet zo ver naar beneden.
• Suggestie: het item 'Pers' vervangen door 'Teksten voor de pers', om misverstanden te voorkomen ('Pers' wordt in websites vaak gebruikt om persartikelen over een bedrijf te showen).
• Suggestie: het item 'SEO' vervangen door 'Zoekmachine teksten' (lang niet iedere potentiële klant voor SEO-teksten zal het woord 'SEO' kennen, en via het submenu komt SEO als SEO-trefwoord ook prima aan bod).
• Hoofdmenu + uitklappende submenu's nu ook begaanbaar met IE.
• Menukolom ook beschaduwd.

Voor m'n beurt gaand, ook alvast de schaduw om de content heen gezet. Alles staat nu 3D boven het lichte luchtige achtergrondblauw.

Toen ik het zo zag, leek me ook het logo wat beter uitkomen in eenzelfde soort strakkere vormgeving > meer eenheid.

Volgende stap: rest menukolom.

NB:

• Als je eenmaal het model te pakken hebt, is het prettige van css dat je alles in een handomdraai naar hartelust (hartenlust, bah) kunt aanpassen: tekstkleuren, achtergrondkleuren, randkleuren, randdiktes, enz. enz. - Dus als je ergens iets op een andere manier opgemaakt wilt zien: geen enkel probleem.
• In de toelichting beperk ik me hier tot de hoofdlijnen, want voor je het weet zit je met details (en dan nog niet eens alle) op een pagina of 80 (als hier, ook een renovatie). Maar als je vragen hebt: vragen!
• De geschetste marsroute is ook met de dikke viltstift op de kaart getekend: er zijn nog meer dingen aan bezienswaardigheden en controlepunten onderweg die het nodig hebben om even bij stil te blijven staan. Bv. een door de bezoeker ingestelde lettergrootte 'Extra Groot' in Internet Explorer (hier op halve grootte):

--->

PS: tot dusverre is er nog geen druppel javascript aan te pas gekomen: alles is puur html en css (en een paar images).

Oei, vergeet ik bijna, de spanning zal ondraaglijk zijn: test grmc-model-07.htm

Tot de volgende keer!
CSShunter

 

[Spikkeltje]

Hi CSS Hunter,

Hij wordt geweldig!! Ben het met je eens trouwens, "teksten voor de pers" staat beter en is duidelijker. "Zoekmachine teksten" twijfel ik nog een beetje over, je zit dan eigenlijk met hetzelfde probleem als toen met dat "Navigatie overzicht", namelijk een overbodige spatie. Zónder spatie (zoekmachineteksten) is echter ook geen gezicht, en op zich denk ik dat "zoekmachine teksten" wel handig is qua vindbaarheid van m'n site.

Kan ik dit wat jij nu gemaakt hebt, straks gemakkelijk invoegen als zo'n PHP-ding? Dus wat ik nu ook heb? (Anders moet ik bij een eventuele wijziging álle pagina's aanpassen, zucht. is bij het menu trouwens nog niet eens zo'n probleem, straks bij het bloggedoe wordt het lastiger, omdat er vaak blogs bijkomen).
Wat mij trouwens opvalt: je hebt in versie 7 het wolkje iets minder intens geel gemaakt en het oranje (in het logo) iets minder intens oranje. Ik ben nogal van de felle kleuren, maar zie wel dat dat nog niet eens zo verkeerd is, het oogt rustiger volgens mij. Maar mag dat wolkje een héél klein beetje geler? Staat dat?

Moet er wel bij zeggen dat ik altijd van alles verzin, maar dat dat dan achteraf niet zo leuk staat bijvoorbeeld. Omdat ik er gewoon geen verstand van heb. (Ik ben er dus ook zo eentje die een muur roze verft en er daarna achterkomt dat het wel een tintje lichter gemogen had. Of een paar tintjes. Dit tot groot genoegen -ahum- van m'n eega.) Ik weet niet wat voor achtergrond jij hebt, maar volgens mij heb jij hier héél veel verstand van, dus op dat punt kan ik gewoon beter m'n mond houden

 

[csshunter]

Hoi Spikkeltje,

Zoekmachine teksten

Oeps , zomaar zonder erg een SOS ingevoegd! *) Maar de straf kan niet heel groot zijn: in het submenu stond ook 2x een SOS.
Ik denk dat je er met een tussenstreepje met ere van af komt (en ook zonder SEO-schade), en voor het tweede subitem met omkering der woorden:

Zoekmachine teksten > Zoekmachine-teksten
SEO teksten         > SEO-teksten
SEO Voorbeelden     > Voorbeelden SEO

=======

... straks gemakkelijk invoegen als zo'n PHP-ding?

Jazeker, sprak een geruststellende stem: staakt uw zorgelijke zuchten.

=======

Het oranje (in het logo) iets minder intens oranje. Ik ben nogal van de felle kleuren, maar zie wel dat dat nog niet eens zo verkeerd is, het oogt rustiger volgens mij.

Ja, het is wat rustiger. Maar het het donkerder oranje heb ik er vooral ten behoeve van de leesbaarheid / toegankelijkheid in gezet.
Met de Color Contrast Analyser is het resultaat voor de witte letters op oranje achtergrond van de oude versie:

Kleurverschil:       308    bij drempelwaarde van 400 (liefst 500).
Helderheidsverschil:  77    bij drempelwaarde van 125.
Contrastverhouding:  2,0:1  bij drempel tussen tenminste 3:1 en 5:1 (liefst 7:1).

In de nieuwe versie:

Kleurverschil:       380    bijna goed.
Helderheidsverschil: 109    begint ook in de buurt te komen.
Contrastverhouding:  2,8:1  begint ook in de buurt te komen.

Daarbij peppen de paarse schaduwlettertjes dit nog wat op:

Kleurverschil:       430    voldoende.
Helderheidsverschil: 155    ruim voldoende.
Contrastverhouding:  6,2:1  prima.

=======

... Maar mag dat wolkje een héél klein beetje geler? Staat dat?

Uw wens is koningin! Natuurlijk mag dat, en het staat ook wel. Ik had deze versie er in gezet om te kijken hoe het zou staan en te kunnen vergelijken. Meestal is het goed om een vers product even een nachtje te laten betijen, en er een volgende keer onbevangener tegenover te staan ter beoordeling. Nu ik 'm weer terug zie, vind ik ook de onderkant wat te smoezelig geworden.
Maar ... eigenlijk hoort het mooi maken van de images (en het voor internet optimaliseren) pas helemaal op het laatst, als de rest helemaal klaar is qua structuur en opmaak. Dan heb je (a) het complete overzicht, en kan je (b) zo veel mogelijk images combineren (= snelheid van de pagina opvoeren).
Daarbij had ik ook het wat mooier maken van het wolkje op het oog: was niet echt een wollig wolkje, maar erg plat.

=======

Ik weet niet wat voor achtergrond jij hebt ...

Nogal divers (o.a. op middelbare school 'typisch bèta' genoemd; toch interesse in schone schrijfkunst; vaste fotograaf geweest van een beeldende kunstenaars-kollektief, in de tijd dat alles met een k geschreven werd; afgestudeerd in gamma; autodidact op webgebied, voorliefde voor accessibility en usability).

- Primaire kleuren zijn helder en blikvangers, maar hebben de neiging om te veel op de voorgrond te treden. Afhankelijk van het ontwerp moet je dan af en toe wat dempen: bv. door een mengkleur te gebruiken, of door de kleurverzadiging wat te minderen (= tikkie grijs er in zetten), of spelen met de helderheid (= tikkie meer wit).

• Kijk maar eens kritisch naar kleuren in reclame-gebruik: bedrijven die een uitstraling 'simpel, voor iedereen, goedkoop' willen hebben, gebruiken vaak knallende kleuren. Zaken die 'diversiteit, kwaliteit, oog voor detail' in het vaandel hebben, zijn wat terughoudender en genuanceerder in kleurgebruik. Vergelijk bv.: Ranzijn en Intratuin, of C1000 en AlbertH.
• Voor jouw site denk ik dat de uitstraling moet zijn: helder, aansprekend, subtiel.

Wat voor een website ook enorm meespeelt: de ene monitor is de andere niet, nog los van de instellingen aan helderheid / contrast / verzadiging die de pc-bezitter er op los laat. Een site die flits is op het ene beeldscherm, kan flets zijn op het andere. Of een site die prachtig genuanceerd overkomt op het ene scherm, kan overmatig knallen op het andere. De kunst is om een soortement gemiddelde uit te vinden, waarbij noch het ene uiterste noch het andere uiterste te veel moet inleveren.

Maar het iedereen naar de zin maken zal per definitie niet kunnen: de ogen van de toeschouwers verschillen ook nog, en niet zo zuinig!

• Bv. 1 op 12 mannen heeft een vorm van kleurenblindheid (zie).
• En 40% van het surfend publiek heeft een contrastvermogen dat op 1/3 ligt van het contrastvermogen van een 20-jarige jongeling (zie en zie).
• Plus: het individuele verschil der smaken: gelukkig maar, anders werd het leven heel saai.
• Plus: het collectieve verschil der smaken: kan per doelgroep verschillen (ook afhankelijk van de behoefte van een doelgroep-lid om zich te conformeren aan de 'norm' van de doelgroep of de trendsetters ervan: het kuddegedrag!). - Bv. al die o zo stoere schiet-ze-dood-spellen hebben een vergelijkbaar type beeldmateriaal, kennelijk voor de verkoopcijfers: het "daar wil ik bij horen" syndroom. Over fantasie gesproken!

=======

Ik ben er dus ook zo eentje die een muur roze verft en er daarna achterkomt dat het wel een tintje lichter gemogen had. Of een paar tintjes.

Of juist donkerder! De kleur in je emmertje (en de kleur van het gedrukte plaatje op het deksel!) is in 99% van de gevallen anders dan wanneer de verf eenmaal opgedroogd op de muur zit. Enkele factoren:

• De oude ondergrondkleur, die er al/niet doorheen komt schijnen.
• Er op smeren bij kunstlicht, en bij daglicht iets heel anders zien.
• De hoeveelheid krijt in een verfpot: veel krijt = droogt witter op dan je denkt.
• De verdunning en de schildermethode: opbrengen met de kwast of met een roller.

Tip voor de volgende kamer: eerst laagje wit om oude kleur terug te dringen, proefvlakje maken van 50x50cm > laten drogen & beoordelen voordat je de emmer leegkiepert. Voorzichtig met het proefvlakje: bij nog eens overschilderen kan 't donkerder worden dan de rest en dat is ook geen gezicht.

======
Maar om terug te komen op het onderwerp:

• Hier alvast een vers wolkje, en streepjes in het menu erbij: grmc-model-07a.htm

Wordt vervolgd!
Met vriendelijke groet,
CSShunter
__________
*) Ouder gewoonte: vroeger wilden sommige browsers niet bij een verbindingsstreepje afbreken en naar een volgende regel gaan, waardoor dan een overflow ontstond: buiten de oevers van de breedte treden (bij letterformaat opschalen door de bezoeker).

 

[Spikkeltje]

Ik kan hier wel een heel verhaal neerpennen, maar je hebt gewoon gelijk. De simpele, goedkope bedrijven gebruiken inderdaad vaak knalkleuren, de kwaliteitsbedrijven zijn subtieler. Ongelooflijk dat ik me dit nooit heb gerealiseerd- maar wellicht komt het nog naar voren in de opleiding die ik momenteel aan het volgen ben

Leuk ook om iets meer te weten over je achtergrond, ik begrijp nu -denk ik- beter waarom je technische kennis zo sterk combineert met het gevoel voor kleur en vormgeving. Ik vroeg het omdat mijn broer erover denkt om een opleiding te gaan volgen, dit om zijn kennis op programmeergebied (heet dat zo? Ik bedoel i.i.g. het ontwerpen en bouwen van websites) te vergroten. En, om eerlijk te zijn, omdat ik zelf ook wel nieuwsgierig was. Je bent toch diegene die al úúúren zoet is met mijn site en er al heel wat aan verbeterd heeft, mijn dank daarvoor!

Enne, voor wat betreft de verfpot: ik laat tegenwoordig gewoon m'n man meebeslissen Die houdt van wit, dus weinig kans op te 'knal' haha. Mocht ik 'm een keer willen verrassen met een verfje op de muur, dan zal ik je tips in gedachten houden!

 

[csshunter]

Weer een stukje verder:

De rest van de menukolom
Het huidige onderste deel van de menukolom is een soort grabbelton.
Dat idee wordt versterkt door de tag-cloud.

De tag-cloud
Tag-clouds worden meestal gebruikt om (automatisch) aan te geven hoe populair een bepaalde tag is: hoe meer beklikt (of: hoe meer items met die tag er zijn), des te groter en vetter de naam van de tag.

• Hier heeft de tag-cloud een heel andere functie: het is geen cloud van tags maar een carrousel van pagina's! Het groter/vetter worden heeft daarbij geen inherente betekenis, het is alleen een visueel kunstje en heeft niets met de belangrijkheid van een item te maken. De cloud is in wezen structuurloos.
  
  En dat is nummer 1 op het lijstje "Top 10 Information Architecture Mistakes" van usability-expert Jakob Nielsen: no structure.
  
  
• Ga je met de muis op de wolk af, dan begint deze te bewegen! Ga ik met m'n muis naar bv. 'Briefing schrijven', dan vliegt die tag net weg! Maar hoe valt het ding in vredesnaam te stoppen, hoe kan je klikken op een bewegend item dat je aanspreekt? Voordat de gemiddelde bezoeker dat doorheeft, is er kostbare tijd verstreken (waarin iets op de site gelezen kon worden). Daarbij moet je ook maar voldoende muis-bedreven zijn om de draaimolen stil te zetten.
  
  Nummer 7 op de Top 10: Uncontrollable Navigation Elements
  "Typically, anything that moves and bounces detracts from Web usability; when navigation moves while users are trying to find their way, it's deadly. (...) Two common offenders here are (...), and elements that move, spin, or rotate of their own accord."
  
  
• Als je met enig geduld de tag-cloud gaat close-readen, kom je er achter dat hier niets anders staat dan ... het rijtje vaste links dat er onder ook wordt aangeboden!
  Dat is dus dubbel op, en extra verwarrend: de bezoeker krijgt veel te veel keuzemogelijkheden voorgelegd.
  
  Nummer 9 op de Top 10: Too Many Navigation Techniques
  Vgl. ook, eveneens van Nielsen:
  "Aesthetic and minimalist design. Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility."
  
  
• Tenslotte werkt de tag-cloud niet in IE en er is een speciaal javascript voor nodig...

De vermoedens zullen de goede kant op wijzen : de onontkoombare conclusie is dat de tag-cloud zal moeten verdwijnen.

=======
Het "Tekstschrijvers-Blog"
Wat dan wel met de grabbelton? - In elk geval de kleuren van de links duidelijker maken.
Maar eigenlijk staan er 3 verschillende types onderwerpen in het amorfe lijstje:

1. Onderwerpen die de kandidaat-klant moet weten over opdrachten aan een tekstschrijver.
2. Onderwerpen die tips over tekstschrijverij zijn.
3. Onderwerpen die "echte" blog-artikelen zijn.

Dan zijn daar mooi rubriekjes van te maken! Zo komt er meer structuur, en weet de lieve lezer beter wat hij/zij bij een onderwerp kan verwachten.
Je zou dat analoog aan het hoofdmenu in rubriekjes + hover-submenu's kunnen opdelen, maar dan wordt het "meer van hetzelfde" en wordt de menu-kolom zo erg lange lijst-achtig.
Nu zijn er per rubriekje (momenteel) niet zo heel veel onderwerpen. Wat je daarom ook kunt doen: de rubrieksnamen als kopje nemen (er hoeft toch niet op geklikt te worden), en de items er gewoon onder zetten, maar minder groot dan de hoofdmenu-items.

• Wat ik bedoel is dit: grmc-model-08.htm
  Aan de rechterkant even een vul-blok neergezet, anders is het daar zo kaal.
  Een "Opdracht voor tekst" als onderwerp lijkt me duidelijker dan "Briefing schrijven", want dat lijkt in het algemeen over briefings te gaan terwijl het hier specifiek om het briefen van een tekstschrijver gaat.

Uitzondering kan het echte blog-deel worden: als je van plan bent daar every nu en dan nieuwe artikelen aan toe te voegen. Dan wordt het wat veel van het goede, en zou je kunnen volstaan met één link: naar het laatste blog-artikel.
Op die pagina kunnen dan ook de links naar eerdere blogs komen (al of niet in een mini-menuutje).

In de menu-kolom kan daarbij ... de tag-cloud terug komen! - Maar dan als illustratie: dan breekt het wat, en komt ook het wolkje terug.

• Wat ik bedoel is zoiets: grmc-model-09.htm

Wat denk je?

Met vriendelijke groet,
CSShunter

 

[Spikkeltje]

Hi hi,

We waren er even een weekendje tussenuit, maar inmiddels weer aan de slag! Zie dat jij ook niet bepaald stilzit, wat wordt 'ie móói! :thumb:
Vind je voorbeeld-9 echt geweldig, leuk dat plaatje met die wolk! Ik vraag me alleen af hoe ik dat dan op de blogpagina moet doen, een aparte CSS maken met alleen het blogmenu erin (dat minimenuutje dus)? Zou dat kunnen?

Er gaan namelijk, als ik straks een goedwerkende site heb cool, nog heel wat blogberichten bijkomen, dit is althans de bedoeling. Deze wil ik uiteraard ook graag bereikbaar maken, want een blog zonder lezers is vrij zinloos...

 

[csshunter]

Hoi Spikkeltje,

Vind je voorbeeld-9 echt geweldig

Mooi, dan houden we het onderwolkje er in. (met t.z.t. andere blog-titel-namen)

=======

hoe ... op de blogpagina moet doen, een aparte CSS?

Inderdaad, maar die aanvullende blog-css kan wel opgenomen worden in het algemene stylesheet; dat scheelt downloaden van een extra stylesheet. Verder kan op de blogpagina's een aparte blogmenu-php-include komen, dan heb je daar ook geen omkijken meer naar.

• Staat op m'n ToDo-lijstje.

=======
De content-kolom
In de huidige gedaante zijn de tekstblokken geïnspireerd op het Wordpress blog-uiterlijk: telkens een datum, een kop, het begin van een artikel, en dan een klikbaar vervolg.

De site heeft echter een tweeledig karakter:

1. Enerzijds bestaat het uit een statisch gedeelte, waarin informatie, toelichting en voorbeelden worden gegeven. Momenteel is dat het grootste deel van de site. Misschien dat er af en toe eens een aanvulling of nieuw voorbeeld bij komt, maar deze romp moet altijd beschikbaar zijn voor de opdrachtgevers-in-spe.
2. Anderzijds is er een dynamisch deel: het blog-gedeelte, waarin telkens nieuwe pennevruchten te nuttigen zullen zijn.

Dit heeft enige consequenties voor de opmaak!

Bij de statische pagina's is de fabricage-datum irrelevant. De op zich leuke kalenderblaadjes in de kop hebben voor de lezer geen toegevoegde waarde. Dat de vier tekstblokken op de homepage geschreven zijn op resp. 30 april, 12 januari, 14 mei en 27 juni (jaartal ontbreekt overigens), is overbodige extra info. Bij vermelding van het jaartal kan het zelfs averechts werken en leiden tot een reactie: "O, dat is nogal oud - misschien is het wel niet actueel meer".

• Ergo: op de statische pagina's de data schrappen, dat maakt de pagina's ook overzichtelijker.
• Het uitklappen zou ik juist wel (ook) toepassen op de statische pagina's: zodat die niet te lang worden en met een snelle scroll gekoppensneld kunnen worden.

Interne links
Deze zou ik tot een minimum beperken: anders wordt de bezoeker uitgedaagd om zich van de ene naar de andere pagina te slingeren (en de draad kwijt te raken) voordat een pagina goed en wel gelezen is.
Voor andere pagina's zal het menu duidelijk genoeg zijn. Alleen als het erg handig is voor het gebruiksgemak zou ik een enkele interne link plaatsen.

=======
Uitklapmechaniek.
Het hiervoor gebruikte javascript (collapse_expand_single_item.js) is behoorlijk uit de tijd. Er zit code in die bestemd was voor eerder dan Internet Explorer 5 (!), en voor Netscape 5 en eerder (Netscape 9 was de laatste, en is al jaren afgedankt).
Het script vraagt ook dat in de html-code telkens handmatig de nodige eigenschappen (id's en onclick's) worden ingevuld, en dat ook het pijltje er tekens als voorgrond-image in gezet wordt:

<p class="read_more" onclick="shoh('first');">
    <img id="imgfirst" class="pijl" src="images/arrow.png" alt="meer over tekstschrijver Linda">
    Lees meer over Linda
</p>
<div id="first" style="display: none;">
    <p class="indexblue">Natuurlijk ... </p>
</div>

<p class="read_more" onclick="shoh('sec');">
    <img id="imgsec" class="pijl" src="images/arrow.png" alt="tekstschrijver portfolio">
    Over mijn portfolio
</p>
<div id="sec" style="display: none;">
    <p class="indexblue">Via het navigatiemenu ... </p>
</div>

Dit leidt er verder toe dat er dubbels in komen als javascript uitgeschakeld staat. Dan wordt het (ook in een tekstbrowser of voorleesbrowser):

meer over tekstschrijver Linda Lees meer over Linda​

Het "Lees meer" doet vermoeden dat er een aan te klikken link is, maar die is in een tekstbrowser onvindbaar. En de tekst volgt vanzelf...

Dat kan dus beter :

• Een modern javascript waar alle huidige browsers mee uit de voeten kunnen (ook Internet Explorer m.i.v. nummertje 7; die al niet meer gebruikt wordt).
• Een volledig unobtrusive javascript: dat niet in de weg staat of onduidelijkheden veroorzaakt als javascript uitgeschakeld is (zie hier).
• En een erg makkelijke manier om de Lees Meer's in de pagina-code te zetten, er zijn alleen twee classes nodig:

<div class="meer">Meer over Linda Groesbeek</div>
<div class="meerText">
   <p>Natuurlijk ... </p>
</div>

<div class="meer">Meer over mijn portfolio</div>
<div class="meerText">
   <p>Via het menu ... </p>
</div>

Voor de visuele surfers met javascript worden de links en pijltjes er volautomatisch bij gezet. Ze hoeven ook niet genummerd te worden of een eigen id te krijgen: dat regelt het javascript zelf (hoeveel Lees Meer's er ook op een pagina zijn). Voor de scriptlozen is het "Meer over..." een tussenkopje geworden.

=======
Nieuws!
Wat me opeens opviel: er is geen Nieuws-pagina. De terugkomende bezoekers weet niet of er wel/niet iets veranderd of bijgekomen is op de site: daarvoor moeten alle items langsgelopen worden...
Een mogelijkheid zou zijn: een aparte Nieuws-pagina instellen, en die opnemen in het hoofdmenu (meteen onder Home). Maar dat maakt het menu weer erg vol.
Je zou ook alle nieuws kunnen opnemen in het blog-gedeelte, maar daar gaat niet iedereen vanzelf kijken.

• Suggestie: in het eerste tekstblok van de homepage een duidelijk link "Nieuws" opnemen, die een bladwijzer is naar helemaal onderop de homepage. In dat laatste tekstblok kunnen dan de updates vermeld worden + hun links.

=======
Fotootje
Kon het niet laten dat wat op te pimpen (contaminerend gesproken).

=======
De geanimeerde pen
Deze wijst nu van de pagina af, waar de bezoeker niet moet zijn: ik zou 'm in spiegelbeeld zetten, dan blijft de lezer bij de les (en is de pen voor rechtshandigen ook makkelijker te [be]grijpen).
Verder is de animatie erg snel afgesteld, en verloopt schoksgewijs. Na twee keer kijken weet je het al, en dan werkt het alleen maar afleidend en storend: "Het lijkt wel een reclame-bannertje".

• Oplossing: veel trager maken, en vloeiende in- en uit-faders maken (de bestandsgrootte hoeft niet toe te nemen, blijft 30kB).

=======
De koppen
Deze staan nu in Times New Roman, wat nogal afwijkt van de Arial voor de rest van de pagina. Persoonlijk vind ik de Times in cursief beter bij de Arial passen dan rechtop; maar dat kan natuurlijk ook als je dat mooier vindt.

=======
De breadcrumbs
Om bovenaan elke pagina een kruimelpad te maken, maakt de opmaak weer drukker. Maar met een handig css-automaatje kan je het menu laten oplichten bij de rubriek waar de pagina in zit, dan ziet de bezoeker ook bij welk navigatie-onderdeel de actuele geopende pagina hoort.

=======
Deze versie

• Het resultaat is nu: grmc-model-13.htm
  
  
• De knalgele tussenkopjes in het menu onopvallender gemaakt: kaderloos en geen geel > rustiger.
• NB: Hij doet het nog steeds in Internet Explorer en op verschillende schermen.
• Ook nog steeds valid xhtml1.0-Strict.
• Het nieuwe uitklap-javascript zit nu onderaan in de broncode, maar kan als alles klaar is een apart js-bestandje worden dat op elke pagina aangehaakt wordt.

Volgende stappen
De social-media-links fabrieken + het footertje, daarna eens kijken of de content-blokken op de andere pagina's dan de homepage op dezelfde manier kunnen. Ook nog op de ToDo: wolkjes-teksten andere pagina's bekijken.

Wordt vervolgd!
CSShunter
_______

straks een goedwerkende site ... nog heel wat blogberichten

Hoef je helemaal niet mee te wachten. - Op voorraad hebben heeft ook z'n voordelen.

 

[Spikkeltje]

Wauw, hij wordt PRACHTIG! Dat verhaal over het Javascript begrijp ik niet helemaal, ik weet alleen dat ik jouw voorbeeld erg mooi vind :thumb:

Waar ik een beetje mee zit is het oplichtende stukje in het menu; kan dat als ik er een php-include van maak? Weet 'ie dat dan "per pagina" nog te vinden? Ik vind het wel erg mooi en praktisch!

Wat ik ook heel leuk vind trouwens, zijn je plaatjes. GroesbeekMC natuurlijk (de pen, die idd de site ín veel beter staat), maar ook Aap Noot Mies. Kan ik die ook gewoon gebruiken, of heb je die ergens vandaan gehaald om een plaatje te hebben? De blogberichten alvast schrijven is op zich wel een goed idee, maar staat -wegens privé omstandigheden- iets verder op de baan momenteel. Ik heb er overigens wel eentje in de maak

PS Moet ik al e.e.a. opslaan, of blijft alles gewoon op jouw server staan? Inclusief plaatjes e.d.?

 

[csshunter]

Hoi Spikkeltje,

verhaal over het Javascript begrijp ik niet helemaal

Hoeft ook niet, het enige wat je moet begrijpen is het stukje html dat voor de uitklappers op de pagina's moet komen > en dat is eenvoudiger dan het nu is.

=======

... het oplichtende stukje in het menu; kan dat als ik er een php-include van maak? Weet 'ie dat dan "per pagina" nog te vinden?

Goeie vraag! - Jazekers, dat is het "handige css-automaatje", en dat werkt als volgt:
Elke pagina uit het hoofdmenu heeft een <body>-tag met een eigen id, bv.:

• de homepage heeft: <body id="home">
• de artikelen-pagina's hebben: <body id="art">
• enz.

Deze <body>-tag staat altijd op de pagina zelf, en niet in de php-include.
In het menu (dat wel een php-include is) heeft elke pagina ter identificatie een class met dezelfde naamgeving:

<ul id="menu">
	<li class="home"><a href="/">Home</a></li>
	<li class="art"><a href="offmedia.html">Artikelen</a></li>
enz.

En in de css staat dit:

/* ====== highlight actuele pagina in menu: textcolor, schaduw en actual-pijltje ===== */ 
#home .home > a,
#art  .art  > a,
... enz. {
	color: yellow;
	text-shadow: 1px 1px 0 #000000;
	background: url(images/gbmc-menu-actual-pijltje.png) no-repeat 175px -4px;
	}

De truc is nu:

• De include met het menu is voor alle pagina's hetzelfde. Daar staan alleen de .home, .art enz. classes in die uit zichzelf niets doen.
• Als de pagina de homepage is, dan is er dus een #home. Als er een #home is die verderop in de code gevolgd wordt door een .home (d.w.z. die .Home is dan het "Home" menu-item), dan schrijft de css voor dat de link <a> van dat item het groene pijltje moet krijgen (+ gele kleur en zwarte schaduw).
• En anders niet! - Als de pagina niet de homepage is, dan is er op die pagina géén .home die door een #home wordt voorafgegaan, en dan gebeurt er niets met het "Home" item: er komt er géén groen pijltje, en de kleur/schaduw blijft normaal.
• Op de andere pagina's gaat dat precies zo: alleen de artikelen-pagina's hebben de #art in de <body> staan, en daar gaat de #art .art > a {...} werken, met weer het pijltje enz. als resultaat: nu bij het "Artikelen" item van het hoofdmenu.

Als je het weet: een simpele toepassing van het cascade-principe van css, maar zééér doeltreffend!

• Kijk, deze grmc-model-13a.htm is identiek aan de nummer 13 (helemaal niets veranderd aan het menu, dat later de include wordt), alleen is hier een <body id="art"> gebruikt: nu is "Artikelen" uitgelicht.
• En hier grmc-model-13b.htm met weer hetzelfde menu, maar nu met <body id="briefing"> op de pagina: nu staat het pijltje bij "Opdracht voor tekst".

=======

... Aap Noot Mies. Kan ik die ook gewoon gebruiken, of heb je die ergens vandaan gehaald om een plaatje te hebben?

• Alle twee: ik heb het origineel van internet geplukt, maar er zijn zoveel identieke of vrijwel identieke letterplankjes op Google-afbeeldingen (zie hier), dat niet te achterhalen is wie het copyright op die afbeeldingen heeft.
• Bovendien: ik heb maar een deel van zo'n letterplankjes-afbeelding gebruikt, en zodanig bewerkt (verkleind, rechtgezet, verscherpt, kleurnuances aangepast, belettering aangepast enz.) dat niet meer te zien is welk origineel het was.
• Plus: een essentiële wijziging aangebracht die de afbeelding in subtiel verband brengt met de tekst ernaast (voor wie er niet overheen kijkt).
• Daarmee is het een cartoon geworden, wat vergelijkbaar is met een parodie: en daarvoor is er een uitzondering in de auteurswet (zie hier). D.w.z. ondergetekende heeft lijkt me een "origineel werk" gemaakt, is dan "de maker" en heeft het copyright op de afbeelding.

Kortom: ik zie niet dat er iemand gauw een rechtszaak wegens auteursrechtschending op touw zal zetten > dus je kan 'm gewoon gebruiken.

=======

Moet ik al e.e.a. opslaan, of blijft alles gewoon op jouw server staan? Inclusief plaatjes e.d.?

Nop, je hoeft nog niets te doen. Ik ben nog enigszins helegaar niet klaar!
T.z.t. (we zijn er nog niet...) zal ik alles in een aparte directory zetten, incl. de php-includes en voorbeeld-pagina's, zodat je 'm in werking kan zien. En dan alles (bestanden, mapjes, scripts, plaatjes, css) inzippen, zodat het makkelijk te grijpen is. - Nu staat alles nog dwars door allerlei andere snoepjes en troepjes op m'n server.

Wordt vervolgd!
CSShunter

 

[Spikkeltje]

Plus: een essentiële wijziging aangebracht die de afbeelding in subtiel verband brengt met de tekst ernaast (voor wie er niet overheen kijkt).
Daarmee is het een cartoon geworden, wat vergelijkbaar is met een parodie: en daarvoor is er een uitzondering in de auteurswet (zie hier). D.w.z. ondergetekende heeft lijkt me een "origineel werk" gemaakt, is dan "de maker" en heeft het copyright op de afbeelding.

Wow, da's smart! (Ik had 'm gezien, maar pas de tweede keer, zat té erg op het uiterlijk van de site zelf te letten ) Mooi verzonnen, hoef ik meteen niet meer bang te zijn voor juridisch geharrewar

Dat met die pijltjes: ik probeer het te begrijpen, kom er ook best een eind mee, dus ik dénk dat ik er wel uit kom. Mocht ik in de verre toekomst besluiten om nog een of meerdere categorieën toe te voegen aan m'n menu, dan moet ik die dus een aparte <li class> geven? (Alleen de hoofditems dan, het submenu volgens mij niet.) Niet dat ik dit vooralsnog van plan ben, ik ga de vlag uitsteken als die site van mij ein-de-lijk IE-proof en volledig werkend is en me eerst een paar maanden wentelen in euforie . Maar je weet maar nooit wat de toekomst brengt!

Je laatste opm.: okee, ik download gewoon nog even helemaal niets, ik wacht in spanning af en laat mij aangenaam verrassen! Dat zip-gedoe ga ik echter nog even nalezen elders op het web, ik ben een ramp met zip-bestanden (vraag me niet waarom, ik heb geen idee) en unzip ze altijd naar een plaats waar ik ze niet wil hebben. Of waar ze niet werken. Of allebei.

Hoop snel weer wat van je te horen, thanks in advance!

 

[csshunter]

Hoi Spikkeltje,

pas de tweede keer

Ja, verwachtingspatronen in de hersenpan gaan vaak autonoom hun gang ("Lees maar, er staat niet wat er staat").
Ik heb er nog een hovertje bij gemaakt, zodat wie 'm met de muis raakt, 'm kan zien omklappen naar van AMN naar ANM.

=======

... categorieën toe te voegen aan m'n menu, dan moet ik die dus een aparte <li class> geven?

Gesnopen: helemaal correct! (en die pagina+class ook even opnemen in het css-rijtje)

=======

... zip-gedoe ga ik nog even nalezen

Ik gooi meestal m'n Verkenner open in het mapje waar iets moet komen, daarna open ik de Zip (in een kleiner venster), en dan sleep ik wat ik hebben moet naar de rechterkant van de Verkenner > zip-zoef: daar staat ie. Gaat ook met hele mappen en hun inhoud, als die in de Zip staan.

=======
Voortgang
Heb bedacht dat alle sociale media mooi in het footerbalkje kunnen komen, is vrijwel klaar (om de paar dagen kan ik er wat aan doen).
Tegelijk bezig iets voor de cookie-melding te maken (wat volgens de nieuwe cookie-wet verplicht is). Dat is nog niet af, maar zal iets in deze geest worden:

• Tussenresultaat: tests/grmc-model-15.htm
• Toelichting volgt nog.

=======
Mijlpaal
We hebben een mijlpaal bereikt! Dit topic is inmiddels al meer dan 1000 keer bekeken, dus we hebben ook variaties van vingerkijkende voortgangsvolgers die de tergende typo's van het tumultueus toetsentikken toeschouwen!

Zelf ook benieuwd wat we nog tegen gaan komen en hoe het afloopt (en wanneer):
wordt vervolgd!
CSShunter

 

[Spikkeltje]

Haha, leuk zeg die cookie!

Ben ook héél blij met m'n footer, heb alleen wel een vraagje over het sociale media-gebeuren: wil je *smeek* dan ook (meteen of aan het einde van het traject, wat voor jou het prettigst werkt) even kijken naar de contactpagina? Daar heb ik die Twitterwidget en het contactformulier, maar nu met de aangepaste site, weet ik straks niet meer hoe (en of) dat spul nog werkt!

Denk dat m'n broer de link naar zijn pagina ook heel erg leuk gaat vinden (mooi met dat logo ) maar moet er niet tevens een linkje naar de jouwe komen? Want jij bent degene die die hele site zit aan te passen nu, bij nacht en ontij zelfs. Ere wie ere toekomt tenslotte!