Ik kom er niet uit :-( Pagina scrollt niet.

[wendy jansen]

Continue hoor ik dat er mensen zijn die niet kunnen scrollen op mijn pagina.
Ze kunnen een deel van de foto's zien maar scrollen lukt niet.
Andere mensen hebben hier geen probleem mee en zien de website zoals ik hem ook zie en bedoeld heb.
Nu ben ik eigenlijk een redelijke leek op dit gebied en heb me helemaal suf gezocht maar ik kom er niet uit.
Misschien is het het makkelijkst dat ik het adres van mijn site geef, ik hoop dat iemand mij hier verder mee kan helpen.
Ik zal je zeer dankbaar zijn.

Met vriendelijke groet,
Wendy

www.agency4models.nl

 

[dinoshop]

kan zijn dat ze niet goed compatible zijn moeten ze bij extra even omzetten , dan zal de site normaal moeten werken.

 

[csshunter]

Hoi Wendy,
Horen wij hier zachtjes "helluppie" roepen?
Daar komen de redders al aangesneld!

Maar ... waar ligt het grootste probleem:

• Bij de pagina's met verticaal scrollen? (zoals de AboutUs-pagina)
• Of bij de pagina's met horizontaal scrollen? (de FashionModels-pagina)
• Of alle twee de soorten?

En: wat is er precies aan de hand?

• De scrollbar is er helemaal niet > er kan niet gescrolld worden.
• De scrollbar is te kort > er kan maar beperkt gescrolld worden.
• De scrollbar schijnt het wel te doen, maar er komen geen foto's meer.

Van dat soort.

Ook is het handig om te weten wie er precies last van hebben.
Met de browser Firefox op mijn desktop met Windows XP, en een beeldscherm van 1280*1024px heb ik er geen last van; en zowaar ook niet in Internet Explorer 7.
Heb je een idee wie de mensen zijn die niet kunnen scrollen?

• Hangt het van de browser af?
• Hangt het van het beeldschermformaat af?
• Hangt het van het type pc af (desktop, tablet, pods, pads, enz.)?

En ja, zelf begin ik ook al zachtjes "hellup" te roepen, als ik bv. zie:

• Homepage: 21 Errors, vindt de html-validator
• About Us: 167 Errors, 3 warnings.
• Fashion Models: 63 Errors.

Onder de fouten zitten bv. missende start- of eind-tags van een aantal elementen. En dat soort dingen wil wel eens tevergeefs een beroep doen op de foutafhandeling door de browsers (die dat ook op een verschillende manier kunnen doen). Om het voorzichtig uit te drukken!

Vandaar dat het me wenselijk lijkt om een prioriteitenlijst te gaan opstellen: waar de ergste problemen zitten, zodat die (hopelijk) opgelost kunnen worden zonder dat er een algehele 100% foutcorrectie moet plaatsvinden...
Maar daarvoor moet dus eerst een diagnose gemaakt worden van waar, bij wie, en hoe de scroll-problemen zich voordoen.

Hoei!

Met vriendelijke groet,
CSShunter
____________
PS:
Wat dinoshop bedoelt, zal zijn dat bezoekers met Internet Explorer 9 (of 8) hun browser-instelling in de compatibiliteitsmodus moeten zetten (wat een woord toch).
Maar het is vooralsnog nog niet gezegd dat alleen die surfers er last van hebben, en het staat ook niet erg professioneel om van je bezoekers te vragen hun instellingen te wijzigen. De website moet gewoon goed zijn en cross-browser werken!

 

[taeser]

Csshunter: hier met chrome en internet explorer en met resolutie op 1024*768 op de FashionModels pagina geen horizontale scrollbar te zien.
De 3de foto is maar voor de helft te zien.
Misschien heb je er iets aan.

gr leon

 

[csshunter]

Ja, bedankt, ik zie 'm!
Dit is bij een resolutie van 1024*768px ook zo in Firefox, Opera en Safari: in alle browsers dus.

• Er is geen verticale scrollbar rechts om naar beneden te kunnen en de horizontale scrollbar te kunnen zien en bedienen.

Er het speelt bv. ook op de homepage: daar blijven de onderkanten van de foto's buiten beeld en is er onderaan ook geen horizontale scrollbar om de laatste foto te kunnen zien.
En op de AboutUs-pagina: daar is onder de zaaglijn ook niets meer te zien.

De oorzaak is dat in de body de overflow op "hidden" is gezet, bij een vastgeprikte hoogte van 100% van de schermhoogte.
Als de inhoud er dan bij een bepaalde schermhoogte niet op past, dan kan er niet meer gescrolld worden naar onder de schermhoogte van de bezoeker.

• De oplossing is dan ook: de body {overflow: hidden;} uit de css halen (agency4models.css).
• Nadeel bij de pagina's met de opmaak van de AboutUs-pagina: er komen dan 2 verticale scrollbars. Maar dat ligt aan het ontwerp.
• Om het links-rechts springen van de pagina's tegen te gaan bij resoluties die wel groot genoeg zijn: zie De Springende Pagina.

Pfff, ontsnapt! Want (reactie nr. #3) ik kreeg het aardig benauwd.

Met vriendelijke groet,
CSShunter
__________
PS: Bij het maken van de site is kennelijk gezondigd tegen de Gouden Regel 3. Anders was het al veel eerder gebleken!

 

[taeser]

Pfff, ontsnapt! Want (reactie nr. #3) ik kreeg het aardig benauwd.

Haha, is zekers cynisch bedoelt.

gr leon

 

[csshunter]

@taeser:
Hoi Leon,
Nou, eigenlijk niet zo cynisch: echt opgelucht voor Wendy dat het met een kleine css-ingreep lijkt te lukken.
Je zal bij een draaiende bedrijfssite maar voor je kiezen krijgen dat ie 't niet goed doet en er per pagina tussen de 20 en 150 html-fouten in kunnen zitten.

• Als het aan de html-errors zou liggen: welke daarvan (of, erger: welke combinatie daarvan) voor een niet goed werkende opmaak zorgen, kom je pas achter bij het herstelwerk. En daar zit dan ook nog het risico in dat er bij gecorrigeerde html blijkt dat de structuur en/of css-opbouw niet meer gaat doen wat je wilde.

Nu kan Wendy op haar gemak als "achtergrond-activiteit" de html-errors gaan wegwerken, of dat uitbesteden, zonder dat sommige bezoekers/klanten met een niet-scrollbare site zijn opgezadeld, en er grote delen van missen.

En de knipoog was ook voor mijzelf en ons als helpmij'ers: ik zag het mezelf nog niet doen om al die errors door te vlooien cq. te corrigeren om een antwoord op de vraag te kunnen leveren.

Met vriendelijke groet,
CSShunter

 

[wendy jansen]

Bedankt voor tip! Ik heb zelf bij de pagina About us geen extra scrollbalk maar ik heb met Internet Explorer wel een verticale scrollbalk in de homepage van het model ( maakt niet uit welke ), Firefox geeft de pagina wel goed weer. Heeft iemand een idee hoe ik dit nu weer op kan lossen?
Alvast bedankt voor de moeite die jullie nemen

 

[csshunter]

Hoi Wendy,
In Internet Explorer 7 en IE8 is er bv. op de pagina angel.agency4models.nl géén verticale scrollbar, alleen in IE9.

Nu heb ik geen IE9 (en door de frame-opbouw is het een beetje onoverzichtelijk hoe alles precies in elkaar steekt), maar heb je al eens geprobeerd:

• de hoogte van 100% te verwijderen uit de <table width="2750" height="100%"> ?
• of anders IE9 te forceren zich als IE8 te gedragen door in de <head> een <meta>
  in te voegen met <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" /> ?

Met vriendelijke groet,
CSShunter

 

[wendy jansen]

Ik heb de height 100% verwijderd en dat werkt Nogmaals bedankt! Nu nog even een paar websites aanpassen :-(
Ik denk dat ik nu langzamerhand over ga stappen naar een wordpress site. Voor goede ideeën houd ik mij altijd aanbevolen.

 

[csshunter]

Hoi Wendy,
O ja, vergat ik helemaal te melden: op de homepage zit er zelfs bij een resolutie van 1280*1024px (net) een horizontale scrollbar onder de 3 foto's, die niet nodig is. Ook zitten de 3 niet mooi gecentreerd.
Wat je kan doen, is de #container-breedte op 100% zetten ipv de huidige 90%:

<div id="container" style="width: 100%">

En dan in de <table> van de #maincontent telkens bij de links een gelijke padding L/R opgeven:

<a style="padding: 20px 25px" class="imageholderT" target="_self" href="modelsspecials.html">...enz.
<a style="padding: 20px 25px" class="imageholderT" target="_self" href="modelsfashion.html">... enz.
<a style="padding: 20px 25px" class="imageholderT" target="_top" href="modelsspecials.html">... enz.

=======
Verder is hier ook de rechter scrollbar voor de bezoeker overbodig (en erg opvallend): die scrollt ruim een schermhoogte naar beneden waar je alleen een grote hoeveelheid grijze tekst op de net iets grijzere background kan waarnemen: niet te lezen!
Wie zo slim is om deze teksten te selecteren ziet ze echter heel duidelijk in blauw op helder wit:

Dan blijkt het duplicaat-tekst te zijn van wat ook al op een andere pagina staat! :shocked:

• Is het soms alleen voor zoekmachines bedoeld?
• Voor een gewone bezoeker oogt het niet erg professioneel.
• Google houdt niet van "hidden tekst" (tekstkleur hetzelfde als backgroundkleur: in strijd met de Webmaster Guidelines, zie hier), en twee bijna dezelfde tinten grijs komen daar wel heel erg dicht bij in de buurt.
• Google heeft ook een kijkje op "duplicate content", wat bv. afgestraft kan worden met het buiten het indexeren houden één van de twee pagina's en/of het lager ranken van het totaal (zie hier).
• Mijn advies zou zijn om de hele grijze tekst van de voorpagina er uit te slopen: ook het visitekaartje wordt er dan een stuk beter op!
• Eventueel kan je wel 1 of 2 korte regels met goede trefwoorden toevoegen, waar ook de bezoeker/ster wat aan heeft: zoals een summiere beschrijving van de hoofdzaken van wat het bureau is en doet. Dan snijdt het mes aan 2 kanten.

Met vriendelijke groet,
CSShunter