Testen van website in diverse browsers?

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Erick Schluter

Erick Schluter

05/02/2010 00:47:00
Quote Anchor link
Net als elke persoon die bezig is met het zorgen dat een website in 'alle' browsers werkt en er hetzelfde uitziet vraag ik me toch altijd af hoe lang het duurt voordat er iemand komt met een verschrikkelijk verhaal over een website die niet in orde blijkt...terwijl ik en een opdrachtgever daar wel al die tijd van uit gingen.

Is er een 100% check om dit soort situaties te voorkomen?

Ik zag bijvoorbeeld laatst met de service 'Browsershots' (welke van een serie browsers screenshots maakt van een website die je opgegeven hebt) dat op het door hen gegenereerde screenshot iets niet in orde bleek...terwijl dat screenshot van een browser was die ik op mijn PC ook had staan...waar het wel in orde is.

Was beide WindowsXP...beide zelfde browserversie e.d., beide op 1024x768...etc. etc.

Kortom: Browsershots vertrouw ik niet meer voor 100%!

De screenshots die ik vraag aan vrienden en kenissen (ja, ik val iedereen gewoon lastig) beschouw ik tegenwoordig als uitgangspunt. Dat zijn in principe de eindgebruikers...met hun gekke grillen en instellingen en weet ik veel wat...en als het bij hun werkt lijkt het mij in orde.

Of toch niet...?

Kan iemand mijn eeuwige twijfel wegnemen en een 100% check noemen? Of moeten we gewoon berusten in het feit dat een website nu eenmaal nooit in 'alle tegenwoordig beschikbare browsers en versies van die browsers' hetzelfde zal worden weergegeven?

Edit:
En dit dus ook zo aan opdrachtgevers uitleggen?
Gewijzigd op 01/01/1970 01:00:00 door Erick Schluter
 
PHP hulp

PHP hulp

06/05/2021 23:16:26
 
Robert Deiman

Robert Deiman

05/02/2010 09:08:00
Quote Anchor link
@Erick
Als je echt alle gekke situaties af wil vangen, ben je wel even bezig. Er zijn een groot aantal verschillende browsers en van elke browser verschillende versies die mensen ook gebruiken.
Helemaal 100% zekerheid heb je nooit in deze gevallen, je moet uitgaan van de grootste gebruikersschare, en hun browsers.

Als jij ervoor zorgt dat je je:
a) goed aan de standaarden houd (heb je al een groot deel van de browsers te pakken waarin het dan goed is)
b) een reset.css gebruikt (omdat je dan de verschillen in hoe browsers iets standaard instellen, meestal margins/paddings, dan al wegneemt)
c) Het test in de meest gebruikte browsers (ie7, ie8, FF2 en hoger, Opera 10 en hoger, Safari)

Dan heb je goede kans dat je nooit iets hoort over dat een website niet goed werkt in browser die en die. Mensen met "bijzondere browsers" zijn er wel aan gewend geraakt om als het niet werkt dit in een andere browser te bekijken die door een grotere schare internetters wordt gebruikt.
 
Erick Schluter

Erick Schluter

05/02/2010 09:24:00
Quote Anchor link
Hey Robert,

Al mijn laatste projecten zijn XHTML strict - W3C gevalideerd, dit vind ik erg belangerijk en neemt inderdaad een hoop zorgen weg, maar niet allemaal.

Waarom browsers deze 'standaarden' negeren is mij echt een raadsel...wie volgt wie daarin? Frustrerend soms.

Anyhoe...

'reset.css'?

Klinkt bekend...Is dat waarin je zegt:

body{margin:0;padding:0;}

etc. etc.

Is er een zogeheten cheatsheet of prototype.css welke ik hiervoor kan gebruiken? Ik kan me herineren zoiets ooit gelezen te hebben...

Ik bedoel een lijst met CSS specificaties die 'alle standaard browser CSS' overzichtelijk presenteert?
Gewijzigd op 01/01/1970 01:00:00 door Erick Schluter
 
Blaat Blaatert

Blaat Blaatert

05/02/2010 09:28:00
Quote Anchor link
Veel voorkomend probleem :)

Vooral de Oude IE browsers zijn een probleem.
Voor het testen op oude IE browsers gebruik ik
IETester. Geweldig ding voor testen van de Microsoft browser.
 
Erick Schluter

Erick Schluter

05/02/2010 09:54:00
Quote Anchor link
IETester is leuk...maar geeft het ook de werkelijkheid weer? Ik heb deze ook geinstalleerd en gebruik deze ook vaak...voor IE6 en IE8...IE7 heb ik geinstalleerd....en ik werk zelf met Firefox.

Ook test ik in Chrome en Safari op mijn eigen PC...en een geheel nooit ter sprake komende browser 'Crazy Browser' genaamd?!

Ik zit altijd maar te twijfelen...
maar mischien is dat juist wel goed, keeps me sharp!
 
Jardin deparis

Jardin deparis

14/05/2010 11:16:03
Quote Anchor link
Is dit wellicht wat voor je? http://browsershots.org/
Duurt soms wel een beetje lang voordat je de uitslag hebt en je
kunt niet echt je site testen maar wel hoe de layout van de eerste
pagina weergegeven wordt..
Gewijzigd op 14/05/2010 11:17:45 door Jardin deparis
 
Kurt Cobain

Kurt Cobain

14/05/2010 12:44:28
Quote Anchor link
Wat je kunt doen, is een aantal VMs opzetten, dat deed ik altijd, gewoon Win98, WinXP, Vista, W7, Ubuntu, Debian, als het je lukt OSx, etc.. Dan op iedere VM een x tal browsers installeren en vervolgens lekker testen. Het makkelijke is namelijk dat je voor het booten de resolutie kunt bijstellen, je ziet het met je eigen ogen, je hoeft niet te dualbooten en vervolgens constant rebooten om het aan te passen, geen andere mensen lastig vallen, je ziet het live en kunt er een screentje van maken en mee doen wat je zelf wilt, ga zo maar door. Dit is het betrouwbaarste omdat je alles met je eigen ogen ziet en goed kunt testen. Screens van browsershots, zie jij daar of iets nog goed werkt met een leuk stukje javascript/jQuery?

Natuurlijk moet je wel VMWare 'kopen', aantal OSen 'kopen', wordt heel 'duur', qua stroom om je computer een paar nachtjes te laten downloaden ;)
 
Tom Tom

Tom Tom

14/05/2010 13:33:57
Quote Anchor link
Ik gebruik tegenwoordig browserlab van adobe.
 

14/05/2010 14:17:12
Quote Anchor link
Gebruik ALTIJD Valid html en css

En gebruik meta tags om bepaalde dingen voor elke browser duidelijk te maken (content type/Language etc..) Ook een favicon werkt vaak niet in elke browser tenzij je de 2 meta tags hiervoor gebruikt.

Doctype mag ook niet ontbreken en een lang code in je <html> tag is ook nooit verkeerd.

Reset.css :
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
    margin:0;
    padding:0;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
fieldset,img {
    border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-style:normal;
    font-weight:normal;
}
ol,ul {
    list-style:none;
}
caption,th {
    text-align:left;
}
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border:0;
}


En gewoon vm's opzetten met diverse windows, linux en mac systemen met daarop elke denkbare browser.

Ook slim om dit te doen op een externe hdd zodat je je website anytime kunt checken.

Groet,
Gewijzigd op 14/05/2010 14:21:11 door
 

14/05/2010 17:37:41
Quote Anchor link
CSS resets heb je in principe niet nodig. Als je ze gebruikt, pas ze dan aan naar wat jij wilt gebruiken. Ze draaien meestal veel meer terug dan nodig is, waardoor je weer meer code moet schrijven, en dus grotere bestanden krijgt (wat je niet wilt, want google rankt nu ook op snelheid, kleiner == snellere laadtijd). Je zou gewoon een soort van base css bestand moeten schrijven (voor als je bijvoorbeeld een liquid design wilt, dat je dan de procenten aan een bepaald aantal px hangt e.d.).
De maker van de bekendste reset zegt ook dat het een begin is, dat je er verder mee moet werken: klik.
Lees ook:
http://meiert.com/en/blog/20080419/reset-style-sheets-are-bad/
http://snook.ca/archives/html_and_css/no_css_reset/
http://meyerweb.com/eric/thoughts/2008/04/17/crafting-ourselves/
Gewijzigd op 14/05/2010 17:37:58 door
 
Jelmer -

Jelmer -

14/05/2010 17:55:42
Quote Anchor link
Als je een CSS reset gebruikt, dan vind ik dit toch wel een hele goeie: SenCSs. Reset alle browsers naar dezelfde basis, zodat ze dezelfde regelhoogtes e.d. hebben. In plaats van dat het alles weggooit, trekt het de verschillen gelijk.
 
Peter ndshomebrew

Peter ndshomebrew

14/05/2010 22:37:22
Quote Anchor link
Ik heb ook wel gehoord dat deze goed is voor het bekijken in verschillende webbrowsers: http://spoon.net/browsers/
 
Elwin - Fratsloos

Elwin - Fratsloos

15/05/2010 16:26:03
Quote Anchor link
Die Browserlab van Adobe is ook niet alles. Het is best leuk, maar erg werkbaar is het niet. Eigenlijk is het gewoon een snellere versie van Browsershots, welke helemaal triest is. Qua snelheid in ieder geval.

Ook IETester kent veel problemen, behalve de instabiliteit. Enkele bestanden (DLL's ed.) zijn gedeeld door de verschillende versies, waardoor het niet 100% te vertrouwen is. Uit eigen ervaring kan ik vertellen dat sites in IETester niet zoals de bedoeling te zien waren, maar op een Windows PC met de 'echte' IE wel.

De JavaScript engine van IETester is verder ook nog een zorgenkindje. Niet snel en werkt minder goed dan van de echte IE.

Ik ben bang dat er geen out-of-the-box oplossing is. Een combinatie van eerder genoemde systemen en programma's zal iedereen al een heel eind op weg helpen.
 
Niels Kieviet

Niels Kieviet

15/05/2010 16:38:35
Quote Anchor link
Dankjewel jelmer, dit helpt ook mij!
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.