Validweb

Basistools en hulpmiddelen voor de webmaster

Thursday 06 January 2005

Note: this article was published over 4 years ago. Techniques, tools or technologies described in this article could be outdated. Please help me by notifying me of any broken links you might encounter.

Elk begin is moeilijk, zo ook het leren maken van websites. Als webmaster houdt je je met veel zaken bezig, gelukkig zijn er produkten en methodes beschikbaar die je veel werk uit handen nemen. Wat heb je nodig om een site te bouwen? We behandelen de basistechnieken en hulpmiddelen die je helpen bij het ontwikkelen van solide sites.

Let op: Aangezien ik zelf met Windows werk behandel ik hier programma’s voor dit systeem, de meesten hiervan zijn ook op andere systemen te verkrijgen.

Browsers

Tijdens het bouwen zul je je sites vaak moeten testen. Er zijn veel verschillende browsers op de markt en helaas interpreteren ze code niet allemaal hetzelfde. De meest gebruikte browser is helaas Internet Explorer van Microsoft (hierna IE genoemd). Ik zeg helaas omdat deze browser een hoop problemen heeft. De reden voor het grote percentage IE gebruikers is duidelijk, het wordt standaard meegelevert bij Windows en veel gebruikers weten niet dat er ook andere (betere) browsers te vinden zijn.

Zorg ervoor dat je tijdens het testen van je site een browser gebruikt die de standaarden goed heeft geimplementeerd, en als alles naar behoren werkt kun je je CSS aanpassen voor browsers die het weleens mis hebben (kuch IE kuch). Ikzelf werk graag met Mozilla Firefox, deze browser is robuust, snel, veilig en bovendien het meest vooruitstrevend (nee ik werk niet voor Mozilla).

Huidige browsers

Probeer je websites in zo veel mogelijk browsers en op zo veel mogelijk system te testen, het liefst ook in oudere versies van browsers. Welke browsers je wilt ondersteunen hangt af van je publiek, maar als je de inhoud goed scheidt van de vormgeving is het in beginsel voor iedereen mogelijk de inhoud te lezen. Een mooi systeem om te zien hoe je site er in verschillende browsers/systemen uit ziet is Browsercam.

Oudere versies van browsers

HTML Editors

Hoewel er veel WYSIWYG editors op de markt zijn, ben ik een voorstander van het zelf intikken van de (X)HTML code. Programma’s als Frontpage zijn handig voor beginners, maar zorgen vaak voor onoverzichtelijke en incorrecte code. Zorg er dus voor dat je (X)HTML leert en de code zelf intikt, hiermee behoud je controle over je code en zijn problemen makkelijker te identificeren en te verhelpen.

(X)HTML zelf intikken betekent niet dat je geen hulpmiddelen mag gebruiken, veel WYSIWYG editors hebben een code-view waarin code ge-highlite wordt. Hiermee wordt onderscheid gemaakt tussen de (X)HTML tags en inhoud door middel van kleur, de duurdere editors helpen je ook door code uit te lijnen en suggesties te bieden tijdens het schrijven.

Zelf maak ik gebruik van jEdit, een gratis editor voor een groot aantal programmeertalen. De interface ziet er nogal ouderwets uit en dat is even wennen, maar ik heb nog nooit zo’n configureerbare editor gebruikt. Met behulp van macros en een hele rits plugins gaat het schrijven van code nog sneller. Bovendien draait jEdit op een groot aantal besturingssystemen.

Gratis editors

Commerciële editors

Grafische editors

Hoewel niet strikt noodzakelijk voor het bouwen van een site is een grafische editor onmisbaar. Mits met mate gebruikt kunnen afbeeldingen en foto’s een welkome aanvulling zijn op het ontwerp van een site. Houd je afbeeldingen zo klein mogelijk en vermijd belangrijke informatie in afbeeldingen (dit voor mensen die de afbeelding niet te zien krijgen).

Let wel, deze grafische editors zijn vaak niet goedkoop en de beginnende webdesigner wordt aangeraden eerst een trial versie te downloaden (voor studenten zijn er meestal goedkopere versies beschikbaar).

RSS lezers

Een goede webmaster blijft op de hoogte van de laatste ontwikkelingen op het gebied van webdesign. Je kunt natuurlijk je favoriete sites bookmarken en elke dag deze sites afstruinen op zoek naar informatie, maar er is een makkelijkere manier: RSS. Sites die RSS gebruiken zijn vaak te herkennen aan een RSS knop, en in Firefox (versie 0.9 en hoger) verschijnt er een oranje icoontje in beeld.

Bloglines

Ikzelf maak gebruik van de web-based RSS-lezer Bloglines, met dit systeem kan je vanuit elke plaats op de hoogte blijven van jouw favoriete sites. In combinatie met de Firefox extensie voor Bloglines wordt je automatisch gewaarschuwd als er nieuwe informatie wordt gepubliceerd.

Firefox RSS & Bloglines Notifier Icoon
figuur 1: Firefox RSS & Bloglines Notifier Icoon

Firefox

Ook Firefox kan worden gebruikt als RSS-lezer, de RSS feeds worden als een bookmark opgeslagen, het nadeel is dat je geen duidelijk overzicht krijgt van alle sites en nieuwe informatie.

Thunderbird

Een goede stand-alone RSS Lezer is Thunderbird. Deze uitstekende mailclient ondersteunt nu ook RSS feeds en maakt het lezen van je favoriete websites net zo simpel als het ophalen van je mail.

Firefox & Mozilla Extensies

Firefox & Mozilla bieden de mogelijkheid om extensies (ook wel plug-ins genoemd) te installeren die nieuwe functionaliteit aan de browser toevoegen. Bekijk het overzicht van Firefox Extensies om een indruk te krijgen van de beschikbare extensies.

Webdeveloper Extensie

Een handige extensie voor webmasters is de Webdeveloper extensie. Er zijn onder andere opties voor het tijdelijk uitschakelen van CSS, Javascript en afbeeldingen. Ook kun je je CSS in real-time aanpassen en je code valideren vanuit de browser.

Fangs

Met behulp van Fangs is het mogelijk de pagina te bekijken zoals die door een screenreader gelezen zou worden. Dit is nuttig voor het controleren van de structuur en toegankelijkheid van je site.

Ie View

IE View voegt een optie toe aan het context-menu (rechtermuisknop) om de huidige pagina in IE te laden. Erg handig voor het snel testen van je nieuwe ontwerp in IE.

FTP

Om je site uiteindelijk op internet te publiceren moet je de (X)HTML bestanden uploaden naar de server, informatie hierover is te verkrijgen bij je hostingprovider. Er zijn veel FTP programma’s te vinden, ikzelf gebruik SmartFTP; gratis voor particulieren en lijkt in gebruik op Windows Verkenner.

Meer tools

Met bovengenoemde programma’s heb je een goede basis voor het maken van een degelijke website, dit is echter slechts een kleine selectie van het grote aanbod hulpmiddelen.

Update:

Naar aanleiding van het artikel Favourite Mozilla and Firefox extensions op 456 Berea Street heb ik een tweetal nuttige Firefox en Mozilla Extensies toegevoegd. Houd ook de comments in de gaten, er worden een aantal nuttige extensies besproken.

« Ik wil ook een site: CSS Documentstructuur met Javascript »