NIWO - nl.internet.www.ontwerpFAQ

WDG Webontwerp FAQ deel 5: Andere media

  1. Hoe laat ik mensen een bestand downloaden vanaf mijn pagina?
  2. Ik probeerde te linken naar een ... bestand maar ik kreeg alleen maar een stel tekens te zien na het downloaden?
  3. Hoe dwing ik een browser om een bestand weer te geven/af te spelen?
  4. Hoe dwing ik een download af?
  5. Hoe maak ik bewegende GIFjes?
  6. Hoe maak ik een voorbeeldafbeelding ('thumbnail') die is gelinkt naar de groot-formaat-afbeelding?
  7. Ik krijg een gekleurd friemeltje links of rechts van mijn afbeelding...
  8. Hoe geef ik willekeurige afbeeldingen weer?
  9. Waarom worden mijn afbeeldingen verkeerd weergegeven, of willen ze niet laden?
  10. Hoe voorkom ik dat mensen mijn afbeeldingen opslaan?
  11. Kan ik markup in ALT-tekst stoppen?
  12. Hoe laat ik een audiobestand automatisch afspelen als iemand mijn site bezoekt?
  13. Hoe verwijder ik alle HTML uit mijn document om platte tekst te krijgen?

5.1. Hoe laat ik mensen een bestand downloaden vanaf mijn pagina?

Zodra het bestand geüploaded is naar de server, hoef je enkel nog met een ankerreferentie-tag ernaar te linken. Een voorbeeld kan zijn:

<a href="../files/foo.zip">Download Foo Nu! (100kb ZIP)</a>

Het is mogelijk dat de server anders ingesteld moet worden voor bepaalde bestandstypes. (Zie de volgende Q&A.)

[Inhoudsopgave]

5.2. Ik probeerde te linken naar een ... bestand maar ik kreeg alleen maar een stel tekens te zien na het downloaden?

Als je probeert een link te maken naar een bepaald bestandstypes en je krijgt niet de gewenste respons, dan bestaat de mogelijkheid dat de server ingesteld moet worden voor dat bestandstype. Neem contact op met de systeembeheerder om een bepaald 'content type' te laten toevoegen. Hier is een lijst van algemene bestandstypes die vaak een instelling nodig hebben:

Content Type Beschrijving
Application/msword Microsoft Word-document
application/octet-stream Ongeclassificeerde binaire data (vaak gebruikt voor gecomprimeerde of uitvoerbare bestanden)
application/pdf PDF-document
application/wordperfect6.0 WordPerfect 6.0-document
application/zip ZIP-archief
audio/x-wav WAV audio-bestandsformaat
audio/midi MIDI audio-bestandsformaat
audio/x-pn-realaudio RealAudio
image/gif GIF afbeelding-bestandsformaat
image/jpeg JPEG afbeelding-bestandsformaat
image/png PNG afbeelding-bestandsformaat
text/html HTML-document
text/plain Gewone tekst
video/mpeg MPEG video-bestandsformaat
video/quicktime QuickTime video-bestandsformaat
video/x-msvideo AVI video-bestandsformaat

Een nadere manier om zeker te stellen dat jouw bestand goed wordt verzonden naar de aanvrager, is het comprimeren naar een standaard compressie-bestandsformaat. Praktisch alle servers zijn ingesteld om om te gaan met de .zip extensie en dit wordt ook algemeen herkend door gebruikers.

Sommige servers (NCSA, Apache, en anderen) kunnen worden ingesteld om door gebruikers geconfigureerde content types te ondersteunen. De details hangen van de server af, dus vraag je serverbeheerder of lees de documentatie.

Merk op dat Internet Explorer ten onrechte door de server geleverde MIME-types negeert, zodat het soms "goed werkt" terwijl de server verkeerd staat ingesteld. Andere browsers letten terecht wel op de door de server geleverde MIME-types, zodat ze verkeerd ingestelde servers ontmaskeren.

[Inhoudsopgave]

5.3. Hoe dwing ik een browser om een bestand weer te geven/af te spelen?

Dat kan je niet, want het web werkt niet op zo'n manier.

Als de browser een document aanvraagt (hypertext, afbeelding, geluid, multimedia, enz.), vertelt de server aan de browser wat het voor een soort bestand is. De server zou moeten worden ingesteld om de bestandssoort van een document's juist weer te geven, zoals beschreven in het antwoord op de vorige vraag.

De browser beslist dan wat er mee gaat gebeuren. De verschillende browsers zijn in staat om verschillende soorten documenten zelf weer te geven, en kunnen daar ook toe worden ingesteld. Browsers zijn meestal ingesteld om andere bestandssoorten te verwerken door ze door te geven aan een hulptoepassing, of ze bieden aan om het bestand op te slaan. Een webschrijver heeft geen mogelijkheid om de manier waarop de browser is ingesteld om een bepaalde bestandssoort te behandelen, te veranderen.

[Inhoudsopgave]

5.4. Hoe dwing ik een download af?

Dat kan je niet, want het web werkt niet op zo'n manier.

Zoals uitgelegd in het antwoord op de vorige vraag, is de server verantwoordelijk voor het juist identificeren van het bestandssoort van een document, en is de browser verantwoordelijk voor de keuze hoe her document afgehandelt moet worden (gebaseerd op het bestandssoort). Een webschrijver heeft geen mogelijkheid om de manier waarop de browser is ingesteld om een bepaalde bestandssoort te behandelen, te veranderen.

De meeste browsers laten de gebruiker naar schijf downloaden als de gebruiker dat wil. Als het bestand op de harde schijf moet worden bewaard, als er echt GEEN andere manier is om hiermee om te gaan, dan moet het MIME-type "application/octet-stream" zijn.

[Inhoudsopgave]

5.5. Hoe maak ik bewegende GIFjes?

Zie de volgende informatiebronnen:

[Inhoudsopgave]

5.6. Hoe maak ik een voorbeeldafbeelding ('thumbnail') die is gelinkt naar de groot-formaat-afbeelding?

Een thumbnail is gewoon een kopie van de volledige afbeelding, die is aangepast om de bestandsgrootte te verminderen. Het is gelinkt met de volledige afbeelding met een normale link:

<A HREF="groot-formaat.jpg"><IMG SRC="thumbnail.jpg" ALT=...></A>

Er zijn diverse technieken voor het verminderen van de bestandsgrootte van de thumbnail, waaronder

  • de afbeelding resamplen/resizen om een fysiek kleinere afbeelding aan te maken;
  • de afbeelding uitsnijden, waarbij minder belangrijke delen van de afbeelding worden verwijderd;
  • de kwaliteit van de afbeelding verminderen door de compressiefactor te vergroten; en
  • het kleurenpalet verkleinen (bijv. omzetting naar grijswaarden).

Thumbnails kunnen meeerdere technieken gelijktijdig gebruiken. Jakob Nielsen bijvoorbeeld bepleit "Relevance-Enhanced Image Reduction", waarin resamplen/resizen en uitsnijden worden gecombineerd.

[Inhoudsopgave]

5.7. Ik krijg een gekleurd friemeltje links of rechts van mijn afbeelding...

Dat komt door het opnemen van "witruimte" (spaties en regeleindes) voor of na een IMG binnen een link-anker. Bijvoorbeeld:

<A HREF=...>
<IMG SRC=...>
</A>

leidt tot witruimte links en rechts van de afbeelding. Aangezien veel browsers ankers standaard weergeven met gekleurde onderstrepingen, geven ze de spaties links en rechts van de afbeelding aan met een gekleurd liggend streepje.

Oplossing: laat geen enkele witruimte achter tussen de anker-tags en de IMG- tag. Als de regel te lang wordt, breek hem dan binnen de tag af in plaats van daarbuiten, zoals hier:

<A HREF=...><IMG
SRC=...></A>

'Style checkers' zoals Weblint zullen je van dit probleem in je HTML broncode op de hoogte stellen.

[Inhoudsopgave]

5.8. Hoe geef ik willekeurige afbeeldingen weer?

Er zijn twee manieren om dit aan te pakken. De meest cache-vriendelijke manier is het gebruik van een normale IMG-tag die verwijst naar een CGI-script, dat de browser willekeurig doorverwijst naar een van de diverse afbeeldingen. Er is een voorbeeld van zo'n CGI-script op http://www.foad.org/%7Eabigail/CGI/random_images.html. Zie de 'CGI Programming FAQ' http://www.htmlhelp.com/faq/cgifaq.html voor meer informatie over CGI.

De tweede manier is om de HTML dynamisch aan te maken met een methode als Server Side Includes (SSI) of CGI. Deze manier is minder cache-vriendelijk, maar het maakt het mogelijk dat de omringende markup (bijv. HEIGHT- en WIDTH-attributen, of de URLs voor gelinkte of image-map afbeeldingen) verschillen al naar gelang de afbeelding. Als jouw server SSI ondersteund, kunnen de details in je serverdocumentatie worden gevonden.

[Inhoudsopgave]

5.9. Waarom worden mijn afbeeldingen verkeerd weergegeven, of willen ze niet laden?

Het meest waarschijnlijke is dat je een paar aanhalingstekens bent vergeten te sluiten aan het einde van een SRC-attribuut. Of je hebt misschien een ">"-teken gebruikt binnen een ALT-tekst of ergens anders binnen een tag. Dit is toegestaan, maar sommige oudere browsers zullen denken dat de tag daar ophoudt, zodat de rest wordt weergegeven als normale tekst.

Dit gebeurt vooral als je commentaar-tags gebruikt om tekst met HTML-tags "weg te commenten". (Zie het antwoord op "Hoe voeg ik commentaar in HTML in?") Alhoewel de juiste syntax <!-- --> is (zonder dat "--" ergens anders in het commentaar voorkomt), zullen sommige browsers denken dat het commentaar ophoudt bij de eerste ">" die ze zien./p>

Validators zullen je elke syntax-fout in je markup laten zien, maar checkers zoals Weblint en HTMLchek kunnen laten zien waar je bekende browserbugs uitlokt. Zie ook het antwoord op "Hoe controleer ik op fouten?"

Hier zijn enkele andere mogelijkheden:

  • De webontwerp-software gebruikt misschien bestandpaden als URL's (bijv. file:C:\pad\afbeelding.gif). Als dat zo is, dan moet je deze vervangen met relatieve URL's (bijv. afbeelding.gif) of http-URL's (bijv. http://server/pad/afbeelding.gif).
  • De afbeeldingen hebben mogelijk een bestandsformaat dat niet algemeen ondersteund wordt, zoals Microsoft's BMP-formaat of AOL's ART-formaat. Let dus op dat afbeeldingen worden opgelsagen een algemeen ondersteund formaat zoals GIF, JPEG, of PNG. (Merk op dat je de het bestandsformaat van de afbeelding moet omzetten; alleen de naam wijzigen werkt niet.)

[Inhoudsopgave]

5.10. Hoe voorkom ik dat mensen mijn afbeeldingen opslaan?

Dat kun je niet voorkomen. De browser heeft het afbeeldingsbestand nodig om het document weer te geven; je moet het versturen aan de browser. Zelfs als een bepaalde browser geen "Afbeeldingen Opslaan" mogelijkheid heeft, zijn er velen die dat wel hebben, en iemand kan altijd het bestand met de hand ophalen (met behulp van telnet) of uit de browser's cache halen.

Er zijn trucs die het voor sommige lezers moeilijker maken om je afbeeldingen op te slaan. Maar, net zoals met trucs die proberen om de HTML-broncode te verbergen, veroozaken deze trucs diverse problemen voor rechtschapen gebruikers, en voorkomen ze niet echt dat dieven jouw afbeeldingen opslaan.

[Inhoudsopgave]

5.11. Kan ik markup in ALT-tekst stoppen?

Nee. Teken-entiteiten (&copy;, &#nnn; enzo) zijn echter wel toegestaan.

Als je wilt weten hoe je goede ALT-teksten kunt schrijven zonder markup, bekijk dan eens Alan Flavell's essay met betrekking tot het kiezen van ALT-teksten op /saved/~flavell/alt/alt-text.html.

[Inhoudsopgave]

5.12. Hoe laat ik een audiobestand automatisch afspelen als iemand mijn site bezoekt?

De meeste browsers ondersteunen het EMBED-element hiervoor, vooropgesteld dat de gebruiker een geschikte plug-in heeft voor het geluidsbestand. Je kunt een iets groter publiek bereiken als je ook BGSOUND gebruikt. Plaats de BGSOUND in een NOEMBED container om problemen te vermijden met browsers die beiden ondersteunen:

<EMBED SRC="jouw_geluidsbestand" HIDDEN="true" AUTOSTART="true">
<NOEMBED><BGSOUND SRC="jouw_geluidsbestand"></NOEMBED>

Zie voor meer informatie over het EMBED-element http://developer.netscape.com/docs/manuals/htmlguid/tags14.htm#1286379. Zie http://msdn.microsoft.com/developer/sdk/inetsdk/help/dhtml/references/html/BGSOUND.htm voor meer informatie over het BGSOUND-element. Merk op dat deze elementen proprietary zijn en niet zijn opgenomen in enige HTML-standaard. (De HTML-standaard manier om dit te doen wordt niet goed ondersteund.)

Gebruik OBJECT ipv EMBED

Wees er op bedacht dat sommige gebruikers het vervelend vinden als muziek automatisch begint te spelen. Mogelijk staat de geluidssterkte niet goed op hun speakers, of zijn ze naar iets anders aan het luisteren. Je zou, uit beleefdheid naar de gebruikers, het geluidsbestand kunnen aanbieden als een link:

<A HREF="jouw_geluidsbestand">Luister naar mijn geluid! (5 kB MIDI)</A>

[Inhoudsopgave]

5.13. Hoe verwijder ik alle HTML uit een document om gewone tekst te krijgen?

De meeste browsers hebben een "save as" functie die het mogelijk maakt om het bestand als platte tekst op te slaan. Een andere manier is het selecteren van alle tekst, dit kopiëren naar het kladblok en het te plakken in een tekstverwerker.

Lynx gebruikers kunnen "lynx -dump http://..." op de commandoregel gebruiken om te printen naar een bestand en een lijst van gelinkte URL's als voetnoten toe te voegen. Als je het uitgevoerde bestand wilt zonder de voetnoten, gebruik dan het "p" commando om te "printen" naar een tekst bestand.

Sommige HTML-ontwerp hulpmiddelen hebben ook een optie om alle HTML te verwijderen. Twee interessante programma's zijn

Als je een andere manier zoekt (oftewel, je wilt het jezelf moeilijk maken), dan kun je programma's gebruiken die alle HTML markup van een document verwijderen. Probeer het met een zoekopdracht bij http://www.altavista.com/ met de tekst "HTML stripper".

[Inhoudsopgave]