Pagina pas weergeven als alle content geladen is zonder JS

[Ripley]

Ik weet dat over het bovenstaande topic veel te vinden is. Toch heb ik hierover een vraag.

Voor een site die ik een rustige uitstraling wil meegeven wil ik voorkomen dat de bezoekers de index pagina opgebouwd zien worden. Nu is dit redelijk eenvoudig te realiseren zo blijkt bijvoorbeeld op
deze en op deze site.

De oplossingen die bovenstaande (en andere sites) geven leveren echter een probleem op voor de bezoekers van de site die JS uit hebben staan of geen java geïnstalleerd hebben. De content wordt nl. in eerste instantie onzichtbaar gemaakt en met een onload trigger wordt deze weer door een javascript getoond. Òf de content wordt bedekt door een div die, wanneer alles geladen is, hidden wordt gemaakt. Voor de mensen zonder JS betekend dit dat ze de website nooit te zien krijgen.

Is er een manier om bovenstaande te realiseren zonder JS of met JS maar dan zodanig dat de javalozen onder ons toch een website te zien krijgen?

[CodeCaster]

Ik denk dat je een probleem zoekt waar het niet is. Sowieso is het aantal gebruikers van browsers waarin JavaScript uitgeschakeld is al miniem, en zijn degenen díe ze gebruiken al gewend aan het "schokkerig" laden van webpagina's.

Sowieso wordt een pagina niet schokkerig opgebouwd wanneer alle elementel al correct gepositioneerd en gevormd zijn, hierbij speelt css een grote rol. Vaak wanneer pagina's ineens verspringen komt dit doordat de width- en height-tags van diverse elementen niet gespecificeerd zijn. Zorg dus eerst dat de afmetingen van alle elementen correct zijn vóór er verder enige content geladen wordt.

En verder hoeft er geen Java geïnstalleerd te zijn voor het correct kunnen parsen van JavaScript.

[Cartman!]

Precies, Java != JavaScript.

Ik vind het persoonlijk vreselijk irritant als de pagina pas zichtbaar is als alles geladen is. Stel nou dat ik een hele slome verbinding heb (of via mn telefoon zit te internetten), en jij hebt wat grote foto's op je pagina dan zit ik oneindig te laden terwijl dit niet nodig is.

edit: en die 2 voorbeelden geven hier 404's... kan aan mn verbinding liggen maar toch

[ Voor 12% gewijzigd door Cartman! op 06-09-2007 10:08 ]

[Padschild]

Cartman! schreef op donderdag 06 september 2007 @ 10:07:
Precies, Java != JavaScript.

Ik vind het persoonlijk vreselijk irritant als de pagina pas zichtbaar is als alles geladen is. Stel nou dat ik een hele slome verbinding heb (of via mn telefoon zit te internetten), en jij hebt wat grote foto's op je pagina dan zit ik oneindig te laden terwijl dit niet nodig is.

edit: en die 2 voorbeelden geven hier 404's... kan aan mn verbinding liggen maar toch

Inderdaad, ik denk dat het vreselijk irritant is om een soort gordijn voor je content te houden. Als je gewoon de breedte en hoogte van je content juist defineert, zie ik geen problemen van het verspringen van content. Pak het probleem bij de bron aan en ga geen oplossing voor een probleem zoeken dat in weze niet bestaat.

Die linkjes werken bij mij wel.

Heb je het trouwens dan over alleen je website (backgrounds en dergelijke) of ook over content (bijvoorbeeld foto's van een half MB) ? Ik persoonlijk zou het niet erg vinden als het even wat langer en schokkerig duurt als deze geladen zijn. Waar ik wel een hekel aan heb is als je gigantische lijst met foto's hebt, waar voor elke foto die geladen wordt, alles verspringt. Dat is echter gewoon op te lossen.

[Ripley]

Ik heb mijn bericht nog eens doorgelezen maar er staat nergens dat de site schokkerig zou worden geladen. Dit is ook niet het geval aangezien alles netjes gepositioneerd is. De landingspagina (90kB) wordt echter wel object voor object geladen wat bij sommige mensen als onrustig zou kunnen overkomen.

Nu ik lees dat er ook mensen zijn die het juist irritant vinden om even niets te zien bij het laden van de pagina zal ik er nog eens serieus over nadenken dit door te voeren op de site. De vraag is waar de balans ligt tussen de mensen die het onrustig vinden de site opgebouwd te zien worden en diegenen die 1 of 2 seconden moeten wachten op de content.

Overigens heb ik op sites die statistieken bijhouden over het internet cijfers gezien tussen de 5% en 10% voor browsers waarbij JS uit staat. Dat vind ik geen gering percentage.

[ Voor 11% gewijzigd door Ripley op 06-09-2007 12:03 ]

[koekiemonster]

Ripley schreef op donderdag 06 september 2007 @ 11:57:
Ik heb mijn bericht nog eens doorgelezen maar er staat nergens dat de site schokkerig zou worden geladen. Dit is ook niet het geval aangezien alles netjes gepositioneerd is. De landingspagina (90kB) wordt echter wel object voor object geladen wat bij sommige mensen als onrustig zou kunnen overkomen.

Nu ik lees dat er ook mensen zijn die het juist irritant vinden om even niets te zien bij het laden van de pagina zal ik er nog eens serieus over nadenken dit door te voeren op de site. De vraag is waar de balans ligt tussen de mensen die het onrustig vinden de site opgebouwd te zien worden en diegenen die 1 of 2 seconden moeten wachten op de content.

Overigens heb ik op sites die statistieken bijhouden over het internet cijfers gezien tussen de 5% en 10% voor browsers waarbij JS uit staat. Dat vind ik geen gering percentage.

Volgens mij heb je je vraag al beantwoord.
Een dergelijke oplossing kan vrijwel niet zonder JS, maar dat heeft dus nu al 2 grote nadelen:

1. Mensen met een trage verbinding zitten te wachten op informatie, terwijl ze vaak niet perse op images of layout zitten te wachten, maar op puur op de tekst van een pagina. Wachten is nooit leuk.
2. 10% heeft dus geen JS, wat het dus niet echt aantrekkelijk maakt om te kiezen voor bovenstaande oplossing

Met twee problemen van deze omvang lijkt het mij duidelijk dat het niet superverstandig is om te kezen voor de JS oplossing.
Er is nog een andere oplossing, maar die is verre van netjes.
Tabellen bouwen zichzelf namelijk op per kolom. Als je om je gehele site een table plaats met 1 row en daarin je content, dan is de kans redelijk groot dat de pagina pas getoond wordt als de table geheel is ingeladen. Ik heb dit nog niet geprobeerd, maar zou best wel eens kunnen werken. Ook dit is geen ideale oplossing, maar in mijn ogen een betere dan de JS hide / show div.

[Ripley]

Bedankt voor de feedback. De content verbergen tot deze geladen is, door deze in een tabel te plaatsen, werkt inderdaad. Dat had ik al geprobeerd maar deze oplossing is, zoals je al suggereerd, niet echt wenselijk. Het kan dus overigens wel zonder JS.

Het is ook mogelijk om mbv JS de content eerst te 'hidden' en wanneer alles geladen is weer 'visible' te maken. Op deze manier hebben de javalozen nergens last van. Nadeel is wel dat je heel even een flikkering ziet aan het begin van het inladen vd pagina. Op deze site wordt hier een oplossing voor geboden maar deze krijg ik niet werkend.

Inmiddels ben ik me maar aan het richten op de volgorde waarin de content geladen wordt. Hier valt namelijk nog veel winst te behalen als het gaat om een rustige schermopbouw.

[crisp]

HTML:

<style type="text/css">
body { display: none; }
</style>
<body>
...
<style type="text/css">
body { display: block; }
</style>
</body>

Niet valid en ranzig enzo, maar might do the trick

[Verwijderd]

crisp schreef op donderdag 06 september 2007 @ 23:43:
Niet valid en ranzig enzo, maar might do the trick

Zal de renderer de display: block; al niet uitvoeren voordat alle media binnen is ? Misschien kun je wel zoiets doen met javascript. Dus in de head een scriptje maken die de pagina verbergt en een onload om hem weer zichtbaar te maken. Mensen zonder JS hebben dan geen probleem.

[ Voor 51% gewijzigd door Verwijderd op 06-09-2007 23:53 ]

[crisp]

Verwijderd schreef op donderdag 06 september 2007 @ 23:51:
[...]

Zal de renderer de display: block; al niet uitvoeren voordat alle media binnen is ?

Dat waarschijnlijk wel, maar voor externe media is het sowieso verstandig om de afmetingen al in de broncode op te nemen.

[Verwijderd]

Met window.addEventListener de BODY verbergen, en met window.onload weer zichtbaar maken? Hoewel er maar beperkte ondersteuning voor window.addEventListener is, schijnt daar ook weer een oplossing voor te zijn.

[Cartman!]

Treador, de TS vroeg n oplossing _zonder_ javascript.

[Verwijderd]

Cartman! schreef op vrijdag 07 september 2007 @ 13:10:
Treador, de TS vroeg n oplossing _zonder_ javascript.

Of een oplossing die ook toegankelijk is voor mensen die JavaScript niet aan hebben staan.

[Ripley]

Verwijderd schreef op vrijdag 07 september 2007 @ 13:58:
[...]
Of een oplossing die ook toegankelijk is voor mensen die JavaScript niet aan hebben staan.

Inderdaad, het ging er mij niet zozeer om of dit mét of zonder JS kon worden bereikt maar meer dat bezoekers die JS uit hebben staan er geen hinder van zouden ondervinden.

Dat de 5-10% javalozen onder de bezoekers de site opgebouwd zien worden vind ik niet zo'n probleem. Wel dat ze in het geheel geen website te zien zouden krijgen omdat deze pas met een JS zichtbaar wordt. Daarom vallen de eerste twee 'oplossingen' uit mijn TS af.

Bedankt voor de suggesties, ik zal ze van het weekend gaan uitproberen ...

[Wokkels]

Ik haal nog even een quote van boven:

Cartman! schreef op donderdag 06 september 2007 @ 10:07:
Precies, Java != JavaScript.

Je hebt het telkens over 'javalozen', maar die kunnen nog steeds JS uitvoeren hoor. En de oplossingen in je linkjes werken met JS, niet met java. Dus of java wel of niet geinstalleerd is heeft hiermee helemaal niets te maken.

[Ripley]

Wokkels schreef op zaterdag 08 september 2007 @ 01:58:
Ik haal nog even een quote van boven:

[...]

Je hebt het telkens over 'javalozen', maar die kunnen nog steeds JS uitvoeren hoor. En de oplossingen in je linkjes werken met JS, niet met java. Dus of java wel of niet geinstalleerd is heeft hiermee helemaal niets te maken.

Wanneer ik niet had uitgelegd wat ik onder 'javalozen' verstond had ik me deze opmerking kunnen voorstellen. In drie van mijn vier posts in deze topic heb ik echter vermeld wat ik hieronder versta. Namelijk internetters die een browser gebruiken waarbij JS uit staat.