2. Grafische elementen aan uw Web-pagina toevoegen

Marc van Oostendorp

Hoofdstuk uit het boek, oorspronkelijk verschenen bij A.W. Bruna Informatica, 1996.

In het vorige hoofdstuk hebben we uiterst gedisciplineerd zeer spartaanse Web-pagina's gemaakt. Deze pagina's kunnen misschien door iedereen met een Internet-aansluiting bekeken worden, maar erg aantrekkelijk zien ze er nog niet uit. Daar gaan we in dit hoofdstuk iets aaan doen. We gaan alle mogelijke soorten van vormgevingselementen toevoegen, waarmee uw pagina's er net zo spannend en aantrekkelijk uitzien als een willekeurige professionele site.

Vooraf wil ik u toch op het hart drukken om ondanks alle multimedia-geweld iets van de aangeleerde spartaanse discipline te behouden. Toen tien jaar geleden de eerste programma's voor desk top publishing op de markt kwamen, zag menig clubblaadje er jarenlang uit alsof er een letterkast op was omgevallen. Omdat die blaadjes door al dat geweld nauwelijks te lezen waren en omdat hun redacteuren zo langzamerhand uitgespeeld raakten met hun grafische speelgoed, is die rage overgewaaid. Maar hetzelfde fenomeen vinden we nu op het Internet -- en vaak nog erger omdat op het Web nu eenmaal nog meer mogelijk is. De eigenlijke inhoud van een site is daarmee soms letterlijk onvindbaar geworden.

Terwijl u met dit hoofdstuk bezig bent kunt u natuurlijk uw creatieve instincten uitleven zoveel u wilt. En ook daarna mag u elke grafische truuk toepassen die uw wilt -- we leven per slot van rekening in een vrij land. Maar wanneer u een serieuze Web-pagina wilt publiceren, moet u er wel voor zorgen dat die site op de eerste plaats helder is. Alleen als een grafisch element bijdraagt aan de overdracht van de boodschap van uw pagina, kunt u hem opnemen. In alle andere gevallen kunt u hem beter weglaten.

Kleurenschema's

Eerst gaan we onze pagina's maar eens inkleuren. Tot nu toe hebben we gebruik gemaakt van het standaardkleuren-repertoire van Netscape. Het scherm zelf was daarbij grijs of in een enkel geval wit; de lopende tekst was zwart, koppelingen waren blauw op het moment dat ze nog niet gebruikt waren en paars wanneer ze dat al wel waren.

Iets meer dan een jaar geleden zagen alle pagina's op het Web er zo uit. Tegenwoordig moet je pagina's met deze standaardkleuren met een lantaarntje zoeken. Vrijwel elke ontwerper van Web-pagina's voegt wel een kleurtje toe aan zijn werk.

Netscape biedt u de mogelijkheid uit een aantal kleurenschema’s te kiezen voor uw pagina’s. U vindt deze schema’s op de wanneer u de mogelijkheid Document van het menu Properties kiest en dan de afdeling Appearance. U krijgt dan het volgende venster te zien.

U kiest nu bovenaan de mogelijkheid Use custom colors (Gebruik speciale kleuren). Daaronder vindt u een rolmenu met kleurenschema’s. Wanneer u op het pijltje naast het menu klikt, ziet u de verschillende schema’s.

Wanneer u een van de schema’s kiest, ziet u eronder een voorbeeld hoe de pagina met het schema eruit zou zien.

Wanneer u nu op OK klikt, neemt de pagina de door u geselecteerde kleuren aan.

Zelfgedefinieerde kleuren

Behalve door door gebruik te maken van de voorgedefinieerde kleurenschema's van Netscape kunt u ook kleur anbrengen in uw Web-pagina's door zelf bij elkaar passende kleuren te kiezen.

U kiest daarvoor nogmaals de mogelijkheid Document van het menu Properties en vervolgens de afdeling Appearance. Onder het venster met kleurenschema’s vindt u een aantal knoppen waarmee u de kleuren van respectievelijk de gewone tekst, de nog niet gevolgde koppelingen, de al wel gevolgde koppelingen en de koppelingen die de gebruiker al wel heeft geselecteerd, maar nog niet gekozen. Wanneer u op één van deze knoppen klikt, verschijnt een kleurenschema.

Door eerst op een kleur te klikken, en vervolgens op het woord OK, neemt het element van uw keuze de gewenste kleur aan.

U kunt ook zelf kleuren aanmaken. Letterlijk miljoenen kleurschakeringen kunt u maken door gebruik te maken van het zogenaamde 'palet'. Alle kleuren die op het meest geavanceerde kleurenscherm kunnen weergegeven, kunt u op een Web-pagina aanbrengen. Om zelf een kleur te maken klikt u in het kleurenvenster op de knop Aangepaste kleuren definiëren. U krijgt dan weer een nieuw venster.

Rechts vindt u naast elkaar een breder en een minder breed venster. In het bredere venster kunt u een kleur naar uw keuze aanwijzen. In het smalle venstertje rechts daarvan kunt u aanwijzen in welke donkerschakering u de kleur wilt zien.

Bij het aanbrengen van kleuren dient u wel met een aantal zaken rekening te houden. In de eerste plaats dient een kleurenschema de leesbaarheid van een pagina nooit te verminderen. Een al te felle achtergrondkleur is daarom meestal taboe; wanneer een pagina de gebruikers hoofdpijn bezorgt, schiet hij zijn doel voorbij.

Om dezelfde reden dient u uiterst voorzichtig om te gaan met de combinatie van achtergrondkleur en tekstkleur. Op pagina's met veel tekst kunt u beter geen lichte letters op een donkere achtergrond plaatsen. Het is een ijzeren wet dat lezers zich veel moeilijker kunnen concentreren op een witte tekst tegen een zwarte achtergrond dan op een zwate tekst tegen een lichte achtergrond. Die wet geldt nog steeds in de wereld van modems en beeldschermen.

Het is nog iets sterker. Niet alleen kunt u het best een donkere tekst plaatsen op een lichte achtergrond., u moet zelfs het contrast tussen de twee zo sterk mogelijk maken. Het is met name belangrijk dat de kleuren die u kiest niet alleen op uw eigen scherm goed bij elkaar passen en een leesbaar resultaat opleveren, maar dat dit ook gebeurt op beeldschermen met een veel minder hoge kwaliteit. Ook mensen met een relatief eenvoudig beeldscherm moeten uw pagina's goed kunnen bekijken. Volgens mijn ervaring is het aantal mensen dat nog niet zoveel kleurnuances aankan, moeilijk te overschatten. Een goed ontwerp voor het Web is op zoveel mogelijk systemen te bekijken.

De kleuren van gedeelten van de tekst veranderen

Tot nu toe hebben we gewerkt met kleurenschema's, waarmee we een hele pagina in een keer van kleur konden doen veranderen. Het is ook mogelijk om slechts een gedeelte van de tekst een andere kleur te geven; bijvoorbeeld een woord dat u eruit wilt laten springen, of een kopje. U selecteert daarvoor eerst het gedeelte dat u een afwijkende kleur wilt geven.

Vervolgens klikt u op de knop middenin de bovenste knoppenbalk van het Netscape, waarop een aantal vierkantjes in verschillende kleuren te zien zijn.

U krijgt nu het vertrouwde kleurenpalet te zien. Ook in dit geval kunt u elke kleur gebruiken die u wilt. En ook in dit geval dient u wel rekening te blijven houden met de leesbaarheid.

Werken met kleuren en kleurenschema's

Wanneer uw Web-site uit meerdere pagina's bestaat, kunt u met het juist gebruik van kleuren de samenhang tussen die pagina's benadrukken.

Het meest voor de hand ligt om een 'huisstijl' te maken, die in het geval van een Web-site voor een bedrijf kan aansluiten bij de manier waarop het bedrijf zich in zijn papieren publikaties presenteert. U kiest of creëert een bepaald kleurenschema en zorgt ervoor dat alle pagina's op uw site aan dat schema voldoen.

Een andere mogelijkheid is om de verschillende pagina's juist verschillende kleuren mee te geven. Het voordeel daarvan is dat iemand die regelmatig gebruik maakt van uw site na enige tijd aan de kleur al kan zien waar hij zich bevindt.

Een grotere site voldoet vaak aan het volgende schema. Er is een welkomstpagina (een homepage) waarvandaan de gebruiker kan doorklikken naar een aantal hoofdcategorieën. Op de pagina's voor deze hoofdcategorieën kan de gebruiker dan eventueel nog een keer doorklikken om de informatie waarnaar hij eigenlijk op zoek is te vinden.

De site bestaat zo dus uit drie niveaus: het niveau van de homepage, het niveau van de hoofdcategorie en het niveau van de eigenlijke informatie. Bij heel grote sites kan dit aantal vanzelfsprekend nog groeien. Door nu elk niveau een andere kleur te geven helpt u de bezoekers van uw site zich een gevoel te vormen hoe diep ze in uw site gedrongen zijn en hoever ze dus waarschijnlijk nog af zijn van de gezochte informatie. U kunt bijvoorbeeld de achtergrond van de welkomstpagina lichtblauw maken, de achtergrond van de pagina's met categorieën wit met een vleugje blauw en de achtergrond van de pagina's met informatie wit. De bezoeker ziet dan als het ware langzaam de lucht opklaren naarmate hij het antwoord op zijn vraag nadert.

Een andere mogelijkheid is om elke hoofdcategorie een andere kleur te geven. Wanneer u op een site informatie aanbiedt over een camping waar ook vakantiehuisjes worden verhuurd, kunt u bijvoorbeeld een set pagina's maken met donkergroene tekst over de camping, een set met donkerpaarse tekst over de vakantiehuisjes, een set met donkerrode tekst over activiteiten op de camping en een set met donkerblauwe tekst over de geschiedenis van het terrein.

Overigens is het wanneer u verschillende kleurenschema's op uw site gebruikt raadzaam op een andere manier aan te geven dat de pagina's bij elkaar horen. Dit kunt u bijvoorbeeld bereiken door alle pagina's dezelfde structuur mee te geven (eerst een kopje, dan de naam van het bedrijf en een telefoonnummer, etc.) of door elke pagina te tooien met een logo. De manier om zo'n logo aan te brengen wordt besproken in de volgende paragraaf.

Afbeeldingen

Behalve met kleuren kunt u een pagina ook versieren met grafische elementen, zoals foto's en illustraties. Hiervoor moet u afbeeldingen in uw pagina opnemen. Web-pagina’s zonder afbeeldingen zijn bijna niet meer te vinden.

Er zijn grofweg drie manieren om aan een elektronische afbeelding te komen: u kunt zelf iets ontwerpen in een tekenprogramma op uw computer, u kunt een bestaande afbeelding op papier inscannen, of u kunt een al bestaande elektronische afbeelding van het Internet halen.

De eerste mogelijkheid is in sommige opzichten de gemakkelijkste. Wanneer u zelf iets maakt, spelen er geen auteursrechtenkwesties en hebt u bovendien grootte en precisie van de afbeelding zelf in de hand. In sommige gevallen zult u echter niet beperkt willen worden door uw eigen mogelijkheden. Het is bijvoorbeeld nogal bewerkelijk om een afbeelding met fotografische precisie puntje voor puntje op te bouwen in Microsoft Paint. In dat geval zult u uw toevlucht moeten nemen tot een van de andere twee methoden.

Op de juiste manier om een afbeelding van het Internet te halen, ga ik hieronder uitgebreid in. Om een afbeelding te scannen heeft u natuurlijk een speciaal stuk software en ook enkele bijzondere software-programma's nodig. Aan de andere kant hebben veel kopieerwinkels tegenwoordig een scanner waarmee ze elke willekeurige afbeelding kunnen onzetten in een grafisch bestand van elk willekeurig formaat. Wanneer u een al bestaande afbeelding gebruikt -- of deze nu al in elektronsich formaat bestond of nog niet -- dient u zich af te vragen hoe u de auteursrechten voor deze afbeelding kunt regelen.

Afbeeldingen kunnen op een computer op een groot aantal verschillende manieren worden opgeslagen. Zoals er veel soorten tekstbestanden zijn -- een voor Word, een voor WordPerfect, enzovoort -- die onderling niet uitwisselbaar zijn, zo zijn er ook veel verschillende formaten plaatjes op een computer. Die formaten zijn onderling niet automatisch uitwisselbaar: met de meeste programma's kunt u wel het ene soort afbeelding bekijken, maar niet het andere soort.

De meeste Web-bladerprogramma's kunnen twee soorten afbeeldingen weergeven: zogenaamde GIF- en JPEG-bestanden. De namen van deze bestanden eindigen respectievelijk op de uitgang gif en jpeg of jpg. Beide zijn zogenaamde gecomprimeerde bestandsformaten, hetgeen wil zeggen dat ze betrekkelijk weinig kilobytes in beslag nemen en daarom uiterst geschikt zijn voor verzending over een netwerk, waar elke byte informatie immers tijd (en dus geld) kost. Ze bereiken die bezuiniging echter alleen ten koste van een zeker verlies aan kwaliteit. Echt loepzuivere, haarscherpe afbeeldingen komt u op het Web niet tegen en kunt u ook zelf niet op uw pagina's opnemen.

Er zijn overigens wel verschillen tussen de twee soorten formaten, waarmee u rekening moet houden wanneer u een afbeelding naar een van deze formaten wilt converteren -- zie hiervoor het kader elders op deze bladzijde -- maar die geen invloed hebben op de manier waarop u ze op de pagina plaatst.

Soorten grafische formaten

Afbeeldingen leveren over het algemeen tamelijk grote bestanden op. Dat een plaatje soms meer zegt dan duizend woorden is in de wereld van computers letterlijk waar -- zelfs een klein plaatje neemt vaak nog meer ruimte in beslag dan een lange tekst.

GIF en JPEG zijn gecomprimeerde bestandsformaten. Dat wil zeggen dat ze zo zijn ingericht dat ze zo min mogelijk informatie nodig hebben. Ze gooien overbodige of voorspelbare informatie daarvoor weg, onder de aanname dat deze wel weer zal worden bijgevoegd door het programma waarmee de gebruiker de afbeeldingen bekijkt. Het werkt volgens hetzelfde principe als geconcentreerd vruchtensap: de fabrikant perst zoveel mogelijk water uit zijn produkt, zodat het goedkoop verstuurd kan worden. De consument voegt vervolgens water toe voordat hij het spul kan drinken.

Omdat er informatie is weggegooid, is de kwaliteit van het eindprodukt bijna nooit zo hoog als dat van de afbeelding waarmee begonnen was: aangelengde geconcentreerde limonade is lang niet zo lekker als vers sinaasappelsap. Nu werkt de compressie bij JPEG op een iets andere manier dan bij GIF. De twee soorten formaten zijn daarom geschikt voor verschillende soorten afbeeldingen.

GIF is vooral geschikt voor logo's en eenvoudige tekeningen met grote egaal gekleurde vlakken en niet al te veel verschillende kleuren. Hoe meer kleuren u gebruikt, des te groter wordt het bestand. Bovendien zijn GIF-afbeeldingen niet altijd even scherp; dit formaat is daardoor minder geschikt voor bijvoorbeeld foto's. Een typische GIF-afbeelding is de volgende.

Bij JPEG is de situatie nagenoeg omgekeerd. Dit formaat is juist uiterst geschikt voor het weergeven van fotografische afbeeldingen, maar afbeeldingen met grote egaal gekleurde vlakken worden in dit formaat vaak vlekkerig. Een typische JPEG-afbeelding is de volgende.

Bij het ene extreem -- afbeeldingen die bestaan uit een groot rood en een groot wit vlak -- en bij het andere -- bont gekleurde kleurenfoto's -- is de keuze niet moeilijk. Ligt een afbeelding tussen de twee extremen in, dan zult u even moeten uitproberen welke keuze het beste en het kleinste resultaat oplevert. Er zijn overigens nog wel een paar verschillen. Zo is het met GIF mogelijk kleine animaties te maken. Dit onderwerp komt later in dit hoofdstuk uitgebreid aan de orde.

Afbeeldingen converteren naar GIF en JPEG

Wanneer u met een professioneel grafisch pakket voor de bewerking van afbeeldingen werkt, zoals Photoshop van Adobe, zult u geen probleem hebben om uw afbeeldingen in GIF of JPEG op te slaan. Zeker de meest recente versies van deze pakketten bieden de gebruiker alle mogelijkheid om een afbeelding in een van deze twee formaten te bewaren.

Heeft u deze pakketten niet in uw bezit en wilt u alleen op incidentele basis afbeeldingen bewerken voor plaatsing op uw Web-pagina's, dan zijn verdere maatregelen noodzakelijk.

Het meest gebruikte bestandsformaat in Windows heet bitmap. De namen van bitmap-afbeeldingen eindigen op de uitgang bmp. Een bitmap-afbeelding kunt u bijvoorbeeld aanmaken in het programma Paintbrush in Windows 3.1 of Paint in Windows 95.

Er is op dit moment één Web-bladerprogramma dat bitmap-bestanden kan vertonen: Microsofts Internet Explorer. Wanneer u uw pagina's maakt voor en doelgroep waarvan u zeker weet dat de leden dit programma gebruiken, kunt u dit soort afbeeldingen direct in uw pagina's opnemen. U dient er dan wel rekening mee te houden dat bitmap-afbeeldingen meestal een stuk groter zijn dan afbeeldingen in GIF- of JPEG-formaat.

Waarschijnlijk is er slechts één situatie waarin dit alles geen bezwaar is: wanneer u pagina's maakt die alleen bedoeld zijn voor een intranet van een bedrijf -- een puur bedrijfsintern netwerksysteem dat gebaseerd is op Internet-technologie maar dat meestal niet door mensen buiten het bedrijf te raadplegen is. Wanneer u pagina's ontwerpt voor een intranet bij een bedrijf dat Windows en de Internet Explorer gebruikt, hoeft u dus geen conversie te plegen. Zelfs de relatieve grootte van de bestanden hoeft dan geen bezwaar te zijn, omdat een bedrijfsintern netwerk als het goed is vele malen sneller is dan het Internet.

Om een bitmap-afbeelding om te kunnen zetten naar een gecomprimeerd formaat, heeft u een speciaal programma nodig. Het meest populaire instrument voor dit soort omzettingen is op dit moment waarschijnlijk het shareware-programma LView. U kunt dit programma vinden op het Internet-adres ftp://ftp.std.com/ftp/vendors/mmedia/lview/. Uit de lijst die u nu ziet, kiest u het programma lviewpro.zip. Dit is een ingepakt bestand, dat u eerst dient uit te pakken en vervolgens te starten. Het programma installeert zich dan zelf.

U kunt nu (met de mogelijkheid Open in het menu File) de afbeelding openen in Lview.

Eventueel kunt u Lview gebruiken om de afbeelding verder te bewerken. Dit programma is vooral interessant omdat u de afbeeldingen nu kunt opbergen als GIF of JPEG. U kiest hiervoor de mogelijkheid Save As in het menu File. U krijgt dan het volgende venster te zien.

Onderin vindt een veld waarnaast staat Opslaan als. Door op het pijltje naast dit veld te klikken krijgt u een lijst met bestandsformaten te zien.

U kunt nu kiezen tussen een van de twee GIF-formaten (GIF87 of GIF89) of het JPEG-formaat. In elk geval wordt het bestand wanneer u vervolgens op OK klikt in de juiste vorm opgeslagen. De afbeelding is nu gereed voor publicatie op het Internet. U kunt hem nu plaatsen op uw Web-pagina.

Een afbeelding plaatsen op een Web-pagina

We keren nu terug naar het bewerkingsgedeelte van Netscape Navigator Gold. Hier kiest u de mogelijkheid Image in het menu Insert.

Er verschijnt dan een nieuw venster, waarin u alle belangrijke gegevens over de afbeelding kunt invoeren.

Vul in het bovenste witte veld in ieder geval de padnaam in van de afbeelding die u wilt plaatsen. Wanneer u deze naam niet meer weet, kunt u door de mapstructuur van uw computer navigeren door te klikken op de knop Browse naast het tekstveld.

Het veld Alternative Representations -- Text is ook zeer belangrijk. Geef op deze plaats een tekst in die mensen te zien krijgen als het Web-programma geen afbeeldingen laat zien.

In de velden rechtsonder (Space around image) kunt u eventueel aangeven of en hoeveel witte ruimte u om uw afbeelding heen wilt hebben. De eenheidsmaat is de pixel, een standaard in de computergrafiek --het is een lichtpuntje op een beeldscherm-- en normaal gesproken is de instelling 0: er wordt geen witte ruimte om de afbeelding heen vrijgelaten.

In het midden van het venster vindt u een aantal knoppen waarmee u kunt opgeven hoe de afbeeldingen precies moeten worden geplaatst ten opzichte van de rest van de tekst.

De letterreeksen xyz geeft aan hoe de tekst naast de afbeelding geplaatst zal worden wanneer u die knop kiest. De overige velden kunt u voorlopig even leeg laten. Klik op OK wanneer u klaar bent. Uw afbeelding is dan opgenomen in de pagina.

Pagina’s met afbeeldingen op de computer

Wanneer u een afbeelding op een Web-pagina plaatst, bestaat het resultaat technisch uit twee bestanden:

  1. een bestand met de afbeelding
  2. de eigenlijke Web-pagina met ergens de aanduiding: op deze plaats moet de afbeelding worden geplaatst die zich bevindt op de volgende plaats op het Internet.

Om een pagina met een afbeelding te publiceren, dient u allebei de bestanden op de computer te plaatsen waarop u uw Web-activiteiten publiceert. Vergeet u de afbeelding te plaatsen, dan krijgt de gebruiker bij de meeste Web-bladerprogramma's een symbool te zien dat weergeeft dat de afbeelding ontbreekt.

Afbeeldingen van anderen gebruiken

U hoeft niet altijd al uw afbeeldingen zelf te maken. U kunt ze ook van het Internet afhalen. Technisch kunt u elke afbeelding die u in uw bladerprogramma te zien krijgt, opslaan en gebruiken in uw eigen pagina's. Juridisch zitten er nog wel wat haken en ogen aan, want alle illustraties op het Internet zijn auteursrechtelijk beschermd.

Eerst even de techniek. Stel dat u in de Internet Explorer een afbeelding ziet, die u graag wilt gebruiken in ue Web-pagina. U plaatst dan uw muis boven de afbeelding en klikt op de rechtermuisknop. U krijgt dan een klein menuutje te zien.

In dit menuutje kiest u de mogelijkheid Save Picture As (Kies afbeelding als). Vervolgens kunt u de afbeelding op uw eigen harde schijf opslaan. In het bladergedeelte van Netscape gaat u op dezelfde manier te werk. Alleen heet de mogelijkheid die u in het menuutje moet selecteren niet Save Picture As maar Save Image As. Image is een ander Engels woord voor afbeelding.

Zoals hierboven opgemerkt, zitten er ook nog wat auteursrechtelijke kanten aan de zaak. U dient ervan uit te gaan dat u geen enkele pagina mag publiceren zonder uitdrukkelijke toestemming van de maker. U moet dus altijd in ieder geval even kontakt opnemen met de beheerder van de Web-pagina in kwestie -- als het goed is kunt u zijn elektronische-postadres ergens op de pagina vinden.

Auteursrecht op het Internet

Het zal u niet verbazen dat op het Internet uitgebreide --vooral Engelstalige --informatie over auteursrechten te vinden zijn. Een belangrijke site is bijvoorbeeld de Copyright Website op http://www.benedict.com/.

In het Nederlands is er een Website te vinden van Buma-Stemra, de organisatie die de auteursrechten regelt van musici, tekstschrijvers en anderen (http://www.buma.nl).

Hier vindt u onder andere de complete tekst van de Nederlandse Auteurswet.

Er zijn overigens een paar gevallen waar dit auteursrecht niet meer geldt. Over een foto of een illustratie uit de vorige eeuw hoeft niemand meer auteursrechten te betalen. Ook degene die zo'n afbeelding inscant en op het Internet plaatst, verkrijgt daarmee geen speciale rechten. Pas op het moment dat hij of zij de afbeelding op de een of andere manier bewerkt heeft -- veranders, of zelfs alleen hier en daar geretoucheerd -- kan hij of zij rechten doen gelden over de afbeelding. Tenzij u de oorspronkelijke afbeelding goed kent, is dit natuurlijk niet altijd even duidelijk te zien.

Daarnaast zijn er op het Internet her en der enkele archieven met gratis clip-art te vinden -- afbeeldingen waarover de maker geen auterusrechten wil laten gelden en dit expliciet vermeldt. Deze afbeeldingen kunt u natuurlijk vrijelijk gebruiken. Een belangrijk overzicht van dit soort clip-art is te vinden op de pagina van Netscape (http://home.netscape.com/assist/net_sites/starter/samples/index.html).

Het belangrijkste overzicht is echter waarschijnlijk te vinden op de site van de Internet-catalogus Yahoo! op het adres (http://www.yahoo.com/Computers_and_Internet/Multimedia/Pictures/Clip_Art/).

Er is ook een nieuwsgroep waarin Internet-gebruikers zelfgemaakte afbeeldingen met elkaar uitwisselen: alt.binaries.clip-art.

Auteursrechtelijke problemen

Hoewel u in de praktijk weinig problemen hoeft te verwachten wanneer u zich aan de hier genoemde vuistregels houdt, blijven er juridisch veel gecompliceerde gevallen. Zo lijkt er auteursrechtelijk weinig bezwaar tegen het maken van een koppeling naar een andere pagina. Maar technisch is het opnemen van een afbeelding in een pagina niet veel anders dan het maken van een koppeling: afbeelding en eigenlijke Web-pagina kunnen zich zelfs fysiek op twee volstrekt verschillende plaatsen bevinden, zoals we hierboven hebben gezien.

Wanneer u dus een afbeelding op deze manier op uw pagina citeert, is het feitelijk maar de vraag of u op die manier het auteursrecht schendt -- u verspreidt de afbeelding immers niet zelf, u verspreidt eigenlijk alleen een koppeling naar die afbeelding. Ik zou het er overigens maar niet op wagen -- het blijft op het Internet toch in de regel verreweg het verstandigst om dit soort zaken niet zonder wederzijdse toestemming te doen.

Overigens is het technisch gezien minder verstandig om op deze manier afbeeldingen in pagina's op te nemen. Het bladerprogramma van de gebruiker moet nu immers zijn informatie van twee verschillende computers afhalen: eerst de Web-pagina van uw systeem en vervolgens de afbeelding van de computer van de andere. Dit komt de snelheid niet ten goede. Bovendien: als de ander kwaad wil, kan hij de afbeelding te allen tijde een andere naam geven of zelfs geheel en al verwijderen. Uw gebruikers krijgen de afbeelding dan niet te zien en dat maakt op zijn zachtst gezegd een weinig professionele indruk.

Afbeeldingen op de achtergrond

Op sommige Web-pagina's wordt een afbeelding ook als achtergrond gebruikt. De tekst lijkt dan te worden afgedrukt op een bepaald patroon dat zich een aantal maal herhaalt.

Een enkele keer lijkt de hele pagina ook te zijn afgedrukt op een grote tekening.

Ook dit soort afbeeldingen zijn in GIF- of JPEG-formaat. U kunt ze op de volgende manier plaatsen op de pagina. In het menu Properties kiest u de mogelijkheid Document en tenslotte de afdeling Appearance. U krijgt dan een vertrouwd venster te zien.

Boven het onderste veld ziet u de tekst Background Image (Achtergrondplaatje). Wanneer u voor de zin Use Image (Gebruik een afbeelding) een vinkje zet, kunt u in het tekstveld erachter de naam van het bestand zetten waarin de afbeelding kan worden gevonden. Door hierna op OK te klikken, komt het plaatje als achtergrond op uw pagina te staan.

Nog sterker dan bij het werken met kleurenschema's, dient u bij het werken met achtergrondafbeeldingen goed op te letten of uw pagina voldoende leesbaar blijft. Een al te druk patroon kan uw lezers enorm afleiden, als het uw pagina's al niet volkomen onleesbaar maakt.

Wanneer u een achtergrondafbeelding op uw pagina opneemt, lijkt het misschien onzinnig om ook nog een achtergrondkleur te specificeren. Wanneer de achtergrondafbeelding redelijk groot is, en u bovendien uw vormgeving tot in de uiterste perfectie wilt regelen, heeft deze kleur toch een beperkt nut.

Veel bladerprogramma's vertonen namelijk de tekst al aan de gebruiker, terwijl de afbeeldingen nog moeten worden geladen. In eerste instantie ziet de gebruiker die tekst dus ook tegen een blanco-achtergrond. Die achtergrond heeft dan wel de kleur die u hier specificeert. Het is een effect dat slechts enkele gebruikers zullen zien, en dan nog slechts gedurende enkele seconden. Maar het is wel een effect dat bijdraagt aan de professionele indruk die uw pagina's maken.

Net als andere soorten afbeeldingen, kunt u ook achtergrondjes overnemen van andere Web-pagina's. Wanneer u een pagina op het Web tegenkomt met een interessante achtergrond, en u werkt met Netscape 3.0 of hoger, dan kopieert u deze achtergrond als volgt naar de harde schijf. U klikt ergens op een leeg gedeelte van de pagina met de rechtermuisknop. Er verschijnt dan een menuutje.

In dit menuutje kiest u de mogelijkheid Save Background As. Vervolgens kunt u een naam opgeven voor het bestand om het te bewaren.

Met Internet Explorer gaat u op vrijwel identieke manier te werk. Het menuutje ziet er iets anders uit, maar de keuzemogelijkheid is precies dezelfde: Save Background As.

Er zijn ook enkele archieven met achtergrondjes op het Internet te vinden. Een bekend archief is bijvoorbeeld Texture Land (http://www.meat.com/textures/).

De firma Netscape biedt zelf ook een lijst met afbeeldingen die als achtergrond gebruikt kunnen worden op het adres http://home.netscape.com/assist/net_sites/starter/samples/patterns.html. De belangrijkste lijst van lijsten achtergrondplaatjes is te vinden bij Yahoo! (http://www.yahoo.com/Computers_and_Internet/Internet/World_Wide_Web/Page_Design_and_Layout/Backgrounds/).

Afbeeldingen als opmaakelementen

U kunt afbeeldingen gebruiken als illustraties en als achtergrond. U kunt ze ook gebruiken om de standaardopmaakelementen die Netscape biedt te verbeteren. In hoofdstuk 1 hebben we onder andere gezien hoe we horizontale lijnen in een pagina kunnen plaatsen en hoe zogenaamde ongeordende lijsten worden voorafgegaan door gevulde rondjes.

We hebben daarbij steeds gebruik gemaakt van standaard-elementen. Hoewel u de horizontale lijnen op een aantal manieren aan de opmaak van de pagina kunt aanpassen, zijn de mogelijkheden ervan toch beperkt. In een krullende lijn, zoals we die wel hebben ingevoegd toen we werkten met de Wizard, kunnen we die standaardlijn echter niet veranderen. Nu we eenmaal met afbeeldingen kunnen werken, is dat ook niet meer nodig. In plaats van een lijn kunnen we immers ook een afbeelding van een lijn invoegen. Hetzelfde geldt voor andere grafische opmaakelementen, zoals de markeringstekens bij ongeordende lijsten.

Er zijn enkele archieven van dit soort afbeeldingen die u gratis kunt gebruiken. De lijnen en de bolletjes die Netscape met zijn Wizard aanbiedt, kunt u ook nog een keer vinden op het adres http://home.netscape.com/assist/net_sites/starter/samples/rules.html. Een andere pagina is Buttons, Cubes and Bars op http://www.cbil.vcu.edu:8080/gifs/bullet.html.

Alweer is Yahoo! de plaats waar u het best terecht kunt voor een overzicht van (bijna) alle pagina’s met lijnen, bolletjes en andere afbeeldingen die u kunt gebruiken als opmaakelementen.

Doorzichtige GIF-afbeeldingen

Wanneer u werkt met een achtergrondkleur of een achtergrondpatroon en een afbeelding op de voorgrond, kan het resultaat niet altijd even mooi zijn.

De afbeelding past nu niet mooi op de pagina. Er zit een witte rechthoekige rand omheen. Het zou mooier zijn als die rand de kleur van de achtergrond aannam. In plaats van het doorzichtige gedeelte komt dan de achtergrondkleur tevoorschijn. In het bovenstaande voorbeeld zouden we de witte kleur doorzichtig kunnen maken.

Wanneer de afbeelding in GIF-formaat is opgeslagen, kunt u precies dit effect bewerkstelligen. U heeft hier wel een speciaal programma voor nodig. Er zijn verschillende programma's op het Internet te vinden waarmee u één kleur in een GIF-plaatje 'doorzichtig' kunt maken; een lijst van dergelijke programma’s kunt u vinden bij Yahoo! op het adres http://www.yahoo.com/Computers_and_Internet/Internet/World_Wide_Web/Programming/Transparent_Images/.

Een aardig programma is de On-the-fly point-and-click GIF transparentizer (vrij vertaald: Klaar-terwijl-u-wacht-wijs-en-klik-GIF-transparant-maker). Dit programma werkt op het Internet. U kunt naar de Nederlandse versie van het programma gaan op het adres http://www.inf.fu-berlin.de/~leitner/trans/dutch.html. U ziet dan de volgende bladzijde.

In het witte invul-venster dient u het volledige Internet-adres in te vullen van de afbeelding die u gedeeltelijk transparant wilt maken. Het is dus voor dit programma absoluut noodzakelijk dat uw afbeelding tijdelijk ergens op het Internet staat. Sluit af met Enter. U krijgt dan uw eigen afbeelding op een aparte pagina te zien.

Klik op de kleur die u transparant wilt maken. In dit voorbeeld is dat wit. Er komt dan een nieuwe bladzijde waarop een nieuwe versie van uw afbeelding staat -- deze maal met een doorzichtige achtergrond. U dient deze afbeelding op de gebruikelijke manier van de Web-pagina naar uw eigen harde schijf te kopiëren. Vervolgens kunt u deze afbeelding opnemen in uw Web-pagina. Hij heeft een doorzichte achtergrond en past er daarom als het goed is, mooi in.

Op de eerdergenoemde pagina van Yahoo! zijn ook verschillende off-line systemen beschikbaar; handig voor wanneer u vaker doorzichtige afbeeldingen wilt maken en geen zin hebt om elke keer on-line te gaan.

Aanklikbare afbeeldingen

Afbeeldingen kunt u ook aanklikbaar maken. Het gemakkelijkst is het om een afbeelding als geheel aanklikbaar te maken. Dit werkt niet anders dan het aanklikbaar maken van een deel van de tekst. U selecteert eerst de afbeelding door er eenmaal op te klikken. Vervolgens klikt u op de knop waarop een schakel staat. Er verschijnt dan een bekend venster.

Hier kunt u weer een absolute of een relatieve koppeling maken met een andere element op het Web, bijvoorbeeld een Web-pagina of een afbeelding. Op sites waar plaatjes gedistribueerd worden, wordt soms een kleine versie van een afbeelding aanklikbaar gemaakt. Wanneer de gebruiker erop klikt krijgt hij een grotere versie van dezelfde afbeelding te zien.

U kunt ook koppeling maken van een afbeelding samen met een paar woorden tekst. Daarvoor hoeft u alleen de tekst samen met de afbeelding te selecteren voordat u op de knop met de schakel klikt. Vervolgens verwijzen tekst en afbeelding naar dezelfde Web-pagina.

Een nog geavanceerder mogelijkheid is om afbeeldingen gedeeltelijk aanklikbaar te maken. U maakt dan een zogenaamde aanklikbare kaart (clickable map). In het bovenstaand voorbeeld zouden we bijvoorbeeld kunnen bepalen dat de gebruiker een andere pagina te zien moet krijgen als hij of zij op de neus in het portretje klikt dan wanneer hij of zij op de ogen klikt.

Om een aanklikbare kaart te maken zijn speciale programma’s nodig. Het bekendste programma voor Windows heet MapEdit en is te krijgen op het adres http://www.boutell.com/mapedit/. Wanneer u het programma heeft binnengehaald en vervolgens gestart, ziet u het volgende kleine venstertje.

In het bovenste venster kunt u de naam opgeven van het bestand waarin u een klikbare kaart wilt opnemen. Het is overigens van belang dat er op dit moment geen andere programma’s open zijn waarin dat bestand bewerkt kan worden (zoals het bewerkingsgedeelte van Netscape Gold). Met behulp van de knop Browse kunt u ook door de mapstructuur van de harde schijf navigeren. Wanneer u een bestandsnaam hebt ingevuld, verschijnt er een nieuw venstertje, met een lijst van de afbeeldingen die op deze pagina te vinden zijn. Hierin selecteert u de afbeelding waarvan u een klikbare kaart wilt maken.

U komt nu terug in het eerste venstertje. Hier klikt u op OK. Er verschijnt nu een venster met de afbeelding die u tot klikbare kaart wilt maken:

Met de drie knoppen linksboven kunt u respectievelijk vierkanten, cirkels en veelhoeken aanwijzen als aanklikbare gebieden op de kaart. Wanneer u voor de eerste keer op een van de knoppen klikt, krijgt u overigens in het kort een Engelstalige uitleg over de werking van de knop.

In dit voorbeeld maken we een cirkel rond het linkeroog aanklikbaar. U klikt op de middelste knop met de cirkel, vervolgens klikt u eenmaal op het punt dat het middelpunt van de cirkel moet worden en nog eenmaal op een pant op de rand van de cirkel. Er verschijnt dan alweer een nieuw venstertje.

Bovenin dit venster kunt u de URL, het Internet-adres invullen, waarnaar deze regio moet verwijzen. Wanneer u vervolgens op OK klikt komt u terug in het venster met de afbeelding. U kunt nu eventueel nog meer gebiedjes aanwijzen als aanklikbaar en voor elk van die gebiedjes een eigen URL invoeren. U kunt nu ook eerst op Save klikken en vervolgens op Exit. Hierna kunt u Netscape weer openen. De afbeelding is tot een aanklikbare kaart gemaakt. U kunt op het oog klikken om een nieuwe pagina te zien.

Aanklikbare kaarten op oudere bladerprogramma’s

Een waarschuwing is op zijn plaats. De klikbare kaarten die in deze paragraaf gemaakt zijn, kunnen alleen gebruikt worden door mensen met Netscape 2.0 of hoger of Internet Explorer 3.0 of hoger. Wilt u dat uw kaarten ook aanklikbaar zijn voor mensen met oudere of andere bladerprogramma’s, dan zal er een programma geschreven moeten worden dat enige berekeningen voor u kunt uitvoeren op de server. Hoe een en ander gaat werken, hangt sterk af van de programmatuur die aan de server-kant gebruikt wordt. Neem hierover kontakt op met degene die de server beheert.

Eenvoudige animaties maken

Met GIF-plaatjes kunt u ook eenvoudige animaties maken: kleine afbeeldingen die bewegen. Al te veel beweging kunt u er niet in aanbrengen en ook voor het overige mogen de afbeeldingen niet al te gecompliceerd worden. Geanimeerde GIFs, zoals dit soort afbeeldingen bekend staan, worden vooral gebruikt voor bewegende logootjes en opmaakelementen. Het is niet moeilijk om geanimeerde GIFs te maken, maar ze hebben vaak een groot effect. Een smaakvol bewegend plaatje kan uw pagina in een klap een zeer overtuigend aanzien geven.

Voor geanimeerde GIFs geldt wat voor de meeste grafische hulpmiddelen van de Web-ontwerper geldt: er zijn meerdere goede programma’s om ze te maken en de beste plaats om te beginnen is bij Yahoo!: http://www.yahoo.com/Computers_and_Internet/Graphics/Computer_Animation/Animated_GIFs/. Een goed programma om geanimeerde GIFs te maken is de GIF Construction Set van het curieuze bedrijfje Alchemy Mindworks. Dat het een merkwaardig bedrijfje is, blijkt al uit het feit dat het zijn programma’s aanbiedt als bookware: de gebruiker wordt geacht een roman te kopen van de directeur van het bedrijf als hij of zij de software-produkten met plezier gebruikt. Hoe dit ook zij, het programma is per FTP te verkrijgen vanaf (onder andere) een Nederlandse server: ftp://ftp.infobro.com/anon-FTP/pub/Graphics/alchemy/gifcon.exe.

Om een animatie te maken, dient u eerst een aantal afbeeldingen te maken die samen te animatie kunnen vormen. U kunt deze afbeeldingen bijvoorbeeld maken in Paint of Paintbrush en ze met Lview omzetten naar GIF-afbeeldingen. In dit geval kunt u het beste kiezen voor formaat GIF89a, het modernste formaat. U dient er daarbij voor te zorgen dat alle afbeeldingen precies even groot zijn. Wanneer u hiermee klaar bent, opent u het programma GIF Construction Set:

U klikt nu op Insert (voeg in) en in het menuutje dat vervolgens verschijnt op Image. U kunt dan het eerste plaatje van de animatie invoegen. Waarschijnlijk krijgt u op dat moment het volgende venster te zien.

Bij het eerste plaatje kunt u hier het beste kiezen voor de mogelijkheid Use this image as the local palette. Als kleurenschema voor de animatie worden dan de kleuren gebruikt die in dit eerste plaatje zitten. Bij volgende plaatjes kunt u echter beter kiezen voor Dither this image to the local palette. De kleuren van deze plaatjes worden dan aangepast aan het kleurenschema.

Met behulp van Insert voegt u op deze manier alle plaatjes die u gemaakt hebt in de afbeelding in.

De animatie is nu in ruwe vorm klaar. Door op de knop View (Bekijk) linksboven te klikken, krijgt u hem te zien. Waarschijnlijk gaat de animatie heel erg snel. Bovendien draait hij maar een keer af; daarna stopt hij bij het laatste plaatje.

We kunnen nu nog wat extra elementen toevoegen om de animatie wat levendiger te maken. Allereerst voegen we voor elk Image-deel van de animatie een zogenaamd Control-deel toe. U selecteert daarvoor het element voor het Image-deel en klikt vervolgens op Insert. In het menuutje dat nu verschijnt kiest u Control.

De Control-elementen geven u -- de naam zegt het al -- wat meer macht over de precieze manier waarop de animatie verloopt. Ze zijn bovendien verplicht vóór elk Image-element in een animatie die zonder problemen moet lopen in alle versies van het Netscape-bladerprogramma.

Door een Control-element te selecteren, en vervolgens op Edit te klikken, krijgt u het volgende venstertje te zien.

Het cruciale gedeelte is het witte veld achter het woord Delay (Uitstel). Hier kunt u aangeven hoeveel honderdsten van een seconde er moeten zitten tussen het vertonen van het ene plaatje en het vertonen van het tweede. Met behulp van deze Control-elementen kunt u dus uiterst nauwkeurig aangeven hoe snel of hoe langzaam de animatie moet verlopen.

Tenslotte kunt u aan het begin van de rij afbeeldingen nog een instructie Loop (Lus) toevoegen. Hierdoor blijft de animatie ‘ronddraaien’: zodra het laatste plaatje bereikt is, wordt teruggesprongen naar het eerste plaatje.

Uw animatie is nu klaar. U kunt hem bewaren (met de keuzemogelijkheid Save in het menu File) en het programma GIF Construction Set verlaten. Vervolgens kunt u het nieuwe bestand opnemen in uw Web-pagina, net alsof het een gewone afbeelding betreft. Wanneer u de pagina vervolgens met een modern bladerprogramma bekijkt, komt de animatie tot leven.

Tot slot van deze paragraaf wellicht ten overvloede nog een waarschuwing. Zoals gezegd kunt u met enkele smaakvol gemaakte GIF-animaties op uw Web-pagina groot respect afdwingen. Daar heeft dan wel tot gevolg dat sommige Web-pagina’s veranderd zijn in elektronische kermis-attrakties, waar zover het oog reikt alles staat te draaien en te slingeren. Dat bezorgt de ontwerper van die pagina misschien ook veel respect en wie weet zelfs een hoog salaris, maar tegelijkertijd leidt het de lezer enorm af van de inhoud van de pagina -- en het maakt bovendien de laadtijd van de pagina onacceptabel laag. Dat kan nooit de bedoeling zijn. Probeert u een evenwicht te blijven bewaren tussen wat mooi is en wat functioneel is. Een goed Web-ontwerper heeft niet alleen een virtuoze techniek -- hij of zij heeft ook smaak.

Multimedia-elementen

Het principe dat aan het Web ten grondslag ligt, wordt wel eens hypertekst genoemd, maar hypermedia zou in veel opzichten een betere naam zijn. Web-pagina's zijn allang niet meer alleen opgebouwd uit tekst, en zelfs niet alleen uit tekst met al dan niet bewegende plaatjes. Op het Web kan gedanst en gesprongen worden dat het een lieve lust heeft.

Een koppeling op een Web-pagina kan in theorie naar elk soort bestand verwijzen. Of u nu een koppeling maakt naar een tekst-bestand, naar een afbeelding of naar een complete interactieve animatie, dat maakt geen enkel verschil. Toch is het zinnig om verschil te maken tussen twee soorten multimedia-bestand: die soorten die door de meeste bladerprogramma's makkelijk gelezen kunnen worden en die soorten die door de meeste programma's juist niet of nauwelijks gelezen kunnen worden. Hieronder ga ik in op de populairste formaten voor video en voor audio. Voor elk van de twee formaten bespreek ik hun wijdverbreidheid en de manier waarop u ze in een pagina kunt opnemen.

Formaten voor audio

Er zijn waarschijnlijk enkele tientallen soorten van geluidsbestandsformaten op onze wereld. In principe kunt u elk van deze soorten bestanden over het Internet versturen. Alles wat via het Internet verstuurd kan worden, kan ook in een Web-pagina opgenomen te worden. Om een WAV-geluidsbestand te koppelen aan een bepaald element in een Web-pagina, maakt u een gewone koppeling van dat element. Alleen vult u in het koppelingsvenster achter Link to a page location niet de naam in van een bestand dat eindigt op HTML, maar één dat eindigt op WAV.

Het is wel nuttig om enige basiskennis te hebben over de belangrijkste soorten geluidsbestanden. Hieronder volgt daarom een lijstje:

AU is het oudste soort geluidsbestand dat als standaard wordt aanvaard op het Internet. Dat heeft als voordeel dat u er vrijwel zeker van kunt zijn dat iedereen die überhaupt een geluid kan horen met zijn bladerprogramma in ieder geval een geluid in een AU-bestand kan horen. Zowel Netscape Navigator als Internet Explorer hebben de mogelijkheid om dit soort geluiden te beluisteren standaard ingebouwd. Een ander voordeel is dat AU-bestanden relatief klein zijn. Een nadeel is dat hun kwaliteit gering is. Een mooi stuk muziek hoeft u niet via dit formaat te willen verzenden.

AIFF stamt oorspronkelijk uit de wereld van de Apple Macintosh, maar is nu ook vrij algemeen aanvaard. Voor- en nadelen van dit formaat lijken op die van het AU-formaat. De bestanden zijn klein en kunnen door vrijwel iedereen beluisterd worden, maar hun kwaliteit is niet in alle opzichten geweldig.

WAV is een geluidsformaat dat behoort tot de Windows-standaard. Dat betekent dat gebruikers met andere soorten systemen wel eens problemen zouden kunnen ondervinden met het beluisteren van dit soort geluiden. Bovendien zijn WAV-bestanden meestal behoorlijk groot. Toch komen we deze bestanden redelijk vaak tegen, waarschijnlijk omdat zoveel mensen gebruik maken van Windows en daarom beschikken over veel standaard-software om WAV-bestanden te bewerken.

MIDI-bestanden vormen een heel bijzonder soort bestand. MIDI is een geluidsformaat dat ook wordt gebruikt voor synthesizers en andere elektronische instrumenten. De bestanden zijn meestal zeer klein; dat komt doordat ze alleen informatie bevatten over hoe de muziek moet worden opgebouwd. Dit heeft weer tot gevolg dat de kwaliteit van het geluid sterk afhankelijk is van de apparatuur die de gebruiker heeft. Heeft hij of zij een uitgebreid elektronisch instrumentarium staan, dan kunnen de mooiste klanken geproduceerd worden. Is hij of zij minder rijk, dan zijn de klanken ook meteen minder fraai.

De laatste versies van zowel Netscape Navigator als van Microsoft Internet Explorer bieden ook de mogelijkheid om een achtergrondmuziekje of herkenningsmelodie toe te voegen aan een pagina. Helaas doen ze dat allebei op een andere manier. Een achtergrondmuziekje dat u toevoegt aan een pagina voor Netscape is niet onmiddellijk te horen door gebruikers van het programma van Microsoft en omgekeerd. In Netscape Gold zijn de achtergrondgeluidjes voor geen van beide soorten bladerprogramma makkelijk in te voegen. Met een achtergrondmuziekje kunnen we pas in hoofdstuk 5 onze pagina’s opsieren.

Een achtergrondmuziekje zal meestal een MIDI-bestand zijn. Alleen dat soort bestanden zijn immers klein genoeg om het inladen van een pagina niet nodeloos op te houden. Toch komen ook AU- AIFF- en zelfs WAV-achtergrondgeluiden wel voor.

Een laatste soort geluidsbestand dat hier nog genoemd moet worden, is RealAudio. RealAudio kan in Netscape en in de Internet Explorer gedraaid worden met behulp van een zogenaamde Plug-In. Het probleem bij de andere audioformaten is dat geluidsfragmenten altijd als één geheel zijn verpakt. De bestanden moeten daarom in hun geheel over het Internet verstuurd worden, voordat de gebruiker het kan afluisteren. Aan deze opzet zijn bepaalde beperkingen verbonden. Het is bijvoorbeeld leuk om een Web-surfer op een Web-site te verwelkomen met een fragmentje muziek of iets dergelijks. Als die gebruiker eerst vijf minuten moet wachten tot de tune binnen is, gaat een groot deel van het effect verloren. Ook live-uitzendingen via het Web zijn met de oude audio-formaten per definitie onmogelijk.

Het RealAudio-formaat kent deze beperkingen niet. In dit formaat wordt het geluid in zeer korte fragmentjes verdeeld, die achter elkaar over het Internet worden verstuurd. De gebruiker heeft een speciaal programmaatje nodig. RealAudio Player, dat gratis via het Internet verspreid wordt. Dit programma vangt de fragmenten op en begint ze vrijwel direct af te spelen, terwijl het nog bezig is de volgende fragmentjes op te vangen. Deze technologie wordt ook wel streaming genoemd. Op deze manier komt het geluid al binnen enkele seconden uit de luidspreker van de gebruiker. Bovendien kan de stroom fragmentjes in theorie oneindig lang zijn. Het wordt daardoor ook mogelijk om radio-uitzendingen live te versturen. Op de site van RealAudio is een lijst te vinden van enkele tientallen -- vooral Amerikaanse radiostations die hun hele programmering, of een gedeelte ervan, via het Internet verspreiden.

Het grootste probleem met het RealAudio-formaat is de geluidskwaliteit. Met de versies 2.0 en 3.0, speciaal voor verbindingen met snelle 28k8 modems, heeft de firma wel een stap vooruit gezet in deze richting, maar nog steeds houdt de kwaliteit niet over. Zoals gezegd gaat de verzending in kleine fragmentjes. Wanneer de speler achterop dreigt te raken, gooit hij wat tussenliggende fragmentjes weg. Vooral als het druk is op het Web, is met RealAudio verstuurde muziek soms niet om aan te horen, zo vervormd als hij is. Het systeem lijkt daarmee vooralsnog het meest geschikt voor gesproken woord.

Web-ontwikkelaars, die AU- of WAV-geluidsbestanden in RealAudio-formaat willen omzetten, kunnen (voorlopig) eveneens een gratis programma (RealAudio Encoder) ophalen van de site van Progressive Networks (http://www.realaudio.com). Voor de software om radio-uitzendingen op het Net te zetten of RealAudio-bestanden te kunnen versturen moet een (bescheiden) bedrag worden betaald.

Formaten voor video

Er zijn op dit moment eigenlijk op het Internet maar twee standaards waar het gaat om Video. Die twee formaten zijn MPEG en QuickTime. De eerste kan op vrijwel alle systemen worden afgedraaid die de mogelijkheid hebben om video-fragmenten af te draaien. De tweede is een uitvinding van Apple en daarom in eerste instantie geschikt voor het Macintosh-platform. Er is echter ook een zeer goed programma beschikbaar om QuickTime-filmpjes te bekijken op een Windows-machine. Omdat dit programma bij een groot aantal produkten gedistribueerd wordt (zoals bij de meeste populaire bladerprogramma’s).

Een enkele keer komen we naast deze twee formaten nog zogenaamde AVI-filmpjes tegen. Dit formaat komt van het Windows-platform en wordt daarom sterk naar voren geschoven door Microsoft. Het probleem is echter dat deze filmpjes op andere soorten computers niet goed te bekijken zijn. Om deze reden zijn AVI-filmpjes tot op heden niet erg populair.

Voor AVI-, QuickTime en MPEG hebben hetzelfde probleem dat ik hierboven heb aangestipt voor de traditionele geluidsbestanden in de bespreking van RealAudio. Ook op het gebied van video is ondertussen een oplossing voor dit probleem bedacht. Deze oplossing heet Video Online (http://www.vdo.net). Video Online heeft dezelfde charmes als RealAudio -- in theorie maakt het live televisieuitzendingen over het Internet mogelijk -- maar het heeft dezelfde problemen. De problemen zijn zelfs nog iets groter, omdat video nu eenmaal nog krachtiger computers en snellere verbindingen vereist dan audio.

Een andere ontwikkeling die in dit verband genoemd moet worden, is Shockwave van Macromedia. Met Shockwave is het mogelijk om interactieve animaties die met Macromedia Director (het populairste programma om animaties te maken dat er op dit moment is) gemaakt zij, op te nemen in een Web-pagina. De gecreëerde Director-animaties kunnen met een speciaal programma sterk gecomprimeerd worden en geschikt gemaakt voor verzending over het Internet. Daarbij wordt -- net als in het geval van RealAudio en Video Online -- de streaming-techniek toegepast.

Om Shockwave-filmpjes moeten dus gemaakt worden met het --dure en vrij lastig te leren-- pakket Macromedia Director. Daar staat tegenover dat gebruikers uw produkten gratis kunnen bekijken. Zowel gebruikers van Netscape Navigator als van Internet Explorer kunnen een plug-in-programma ophalen waarmee alle Shockwave-filpjes te draaien zijn. Het adres daarvoor is http://www.macromedia.com/shockwave/. Op die site is overigens ook een indrukwekkende lijst te vinden van Web-sites die gebruik maken van deze technologie.