Hoi Loes,
TEST-TEST-TEST
Deze keer alleen maar goede berichten!
Ik heb de virtuele pannenkoek met smaak opgepeuzeld, en met m'n mond vol de volgende browsers getest op wat er nu tevoorschijn komt, voor
alle pagina's van de site:
- Internet Explorer 6
- Internet Explorer 7
- Internet Explorer 8
- Firefox
- Chrome
- Opera
- Safari
Internet Explorer 9 (die is er ook sinds kort) heb ik niet kunnen testen, want deze kan alleen draaien als je op Windows Vista of Windows 7 werkt. Ik ben een tevreden gebruiker van Windows XP, en daar kan geen IE9 op. Maar ik verwacht niet dat IE9 problemen zal opleveren.
- Anders moet iemand met IE9 het hier maar even melden.
=====
Over browsers gesproken
Het is heel makkelijk om zelf je website-resultaten op verschillende browsers te testen. Je kunt namelijk op je PC verschillende browsers gewoon naast elkaar installeren, want ze bijten elkaar niet.
- Wat (op een enkele uitzondering na) niet kan, is verschillende versies van één browser naast elkaar installeren. Dus bv. IE6, IE7 en IE8 kunnen niet tegelijkertijd *).
- Het enige is, dat ze allemaal graag je standaard-browser willen worden. Dus moet je bij de installatie-opties even opletten dat je dat uitvinkt als je dat niet wilt.
- Downloads: Firefox, Chrome, Safari, Opera (Opera NL).
Wat ook kan, is een webpagina opgeven bij
www.browsershots.org.
- Daar kan je aangeven welke browsers je getest wilt hebben (ook voor andere computersystemen dan Windows).
- Het resultaat is (na soms flinke tijd wachten; er is een wachtrij afhankelijk van hoe druk het is) een serie screenshots. Je kunt er dus niet op klikken om te zien of het allemaal werkt. Maar je kunt wel zien of de layout van de pagina klopt.
- Ik heb de kraam zonet aangevraagd voor een aantal browsers. Het resultaat komt hier tevoorschijn.
Maar tegen zelf testen in echte browsers kan natuurlijk niets op: dat is het echte leven!
Voor de webmakerij
Wat ik zou doen: in elk geval Firefox binnenhalen, en dan
bij het maken van webpagina's Firefox gebruiken om het resultaat te bezichtigen. Voor 99% gaat het dan ook goed in de andere browsers.
Vervolgens kan je zo nodig voor Internet Explorer aanpassingen toevoegen, voor als die het niet goed doet. Dat is beter dan andersom: een pagina die voor IE gemaakt is, en het niet goed in de andere browsers doet, valt veel slechter te corrigeren.
- Dat was juist de makke van Frontpage: dan kan je beter uithuilen en helemaal opnieuw beginnen, maar dan goed.
======
KompoZer en andere WYSIWYG-webeditors
Welk gratis editors bestaan er nog meer waar ik wat aan zou kunnen hebben behalve dan frontpage?
Naast KompoZer weet ik niet een goeie die een ontwerp-weergave heeft waarin je WhatYouSeeIsWhatYouGet aan de slag kunt gaan. Er zijn onnoemelijk veel gratis webeditors die beloven dat ze heel makkelijk en heel goed zijn, maar in de praktijk is 98% domweg erg slecht.
Verder zijn er ook een aantal goede html-editors in omloop die alleen met pure code werken, zoals
HTML-Kit (
video). Maar die hebben dus geen ontwerp-weergave, waarin je makkelijk dingen kunt regelen zonder je om de codes te hoeven bekommeren.
Een derde type zijn de Kladblok-achtigen, bv.
Notepad++. Dat is de Spartaanse methode, want die hebben géén ontwerp-weergave, en ook géén knoppen om code-elementen in te voegen. Daarin doe je alles zelf: alle codes tik je er met de hand in. Voordeel t.o.v. het gewone Kladblok (Notepad): de codes staan er in mooi gesorteerde kleuren in, en nog een paar handigheidjes. Maar het werk moet je dus zelf doen.
Mijn conclusie: ik zou niet verder zoeken dan KompoZer.
=====
Frames...?
... wel blij met deze Kompozer. Ziet er goed uit maar wel beperkt, ondersteunt geen frames oa.
Dat is eigenlijk heel verstandig van KompoZer!
De toelichting in hun
FAQ is:
What about frames?
Frames are evil. KompoZer is not capable handling framesets. The only thing you can do is creating the frameset file in a external editor and edit the containing frame pages in KompoZer. But the better way is, just not to use any frames.
Waarom zijn frames zo boosaardig? Ze zijn (1) gebruikersonvriendelijk: je kunt bv. nooit een rechtstreekse link naar een bepaalde pagina opgeven. En ze zijn (2) zoekmachine-onvriendelijk.
Kortom: niet aan frames beginnen!
=====
Geen frames (en geen tabellen) voor de opmaak: wat wel?
Wat dan wel? Waarschijnlijk zijn je achterliggende gedachten bij de frames:
"dan hoef ik niet steeds op elke pagina hetzelfde in te plakken" en ook
"dan hoef ik die standaard-elementen niet op elke pagina te wijzigen, als ik er iets in wil veranderen".
Maar hiervoor zijn twee uitstekende andere oplossingen:
- Alle opmaak van een pagina kan geregeld worden met CSS.
- Alle elementen die op elke pagina hetzelfde moeten blijven, kunnen heel makkelijk ingevoegd worden met PHP.
=====
CSS
Op je site staat al één en ander aan CSS, namelijk in de <head>, tussen
<style type="text/css"> en
</style>. Daarnaast staan er ook opmaak-opdrachten in de <body>, bv.:
HTML:
<p class="MsoNormal" style="MARGIN: 0cm 0cm 10pt" align="left">
<font size="2" face="Verdana" color="#000000">
Behalve dat hierin afgekeurde html-eigenschappen worden gebruikt, kan hetzelfde veel beter met een paar extra regels van de CSS in de <head> bereikt worden. Zo worden de opmaak van de pagina en de inhoud van de pagina mooi gescheiden.
De volgende stap is, dat je niet steeds al die CSS-regels op elke pagina opnieuw in de <head> gaat zetten, maar dat je één tekstbestandje maakt met alle CSS er in, en dan dat ene
.css bestand op elke pagina met één regeltje oproept:
HTML:
<link rel="stylesheet" type="text/css" href="toebehoren/opmaak.css">
Dat scheelt behoorlijk aan werk op de pagina's (bij een wijziging hoef je alleen maar het CSS-bestand te veranderen, en het werkt meteen op alle pagina's tegelijk).
De html-code in de <body> wordt hiermee ook super eenvoudig, en heel goed herkenbaar. Bv. iets als deze pagina-structuur:
HTML:
<body>
<div id="banner">banner</div>
<div id="boven">boven</div>
<div id="links">links</div>
<div id="hoofd">hoofd</div>
<div id="rechts">rechts</div>
<div id="onder">onder</div>
</body>
CSS maakt de website ook een stuk sneller: als op de eerste pagina het CSS-bestand is ingeladen, staat het al op de computer van de bezoeker, en kan meteen gebruikt worden voor alle volgende pagina's.
Goed voor de webbouwer en goed voor de bezoeker: wat wil een mens nog meer?!
PHP
Met PHP kan je heel makkelijk een bepaald fragment, dat altijd hetzelfde is (bv. de #header), op elke pagina laten invoegen. Dat werkt min of meer hetzelfde als CSS: je maakt één apart bestandje met het code-fragment, en dat wordt op elke pagina met 1 regeltje code opgehaald.
Zo, ik denk dat je hiermee wel even voort kunt...
... en dit zijn dan meteen de belangrijkste ingrediënten waarmee je op een goede dag het beslag kunt maken voor het bakken van een puike website die niet die 29 fouten kan vertonen.
Met vriendelijke groet,
CSShunter
__________
*) Eventueel wel met een truc, als je er een zg. "virtuele PC" voor gebruikt; dat is een soort parallel-systeem.
