|
|
 |
Inhoud van deze pagina: Werken met afbeeldingen | Bestandsgrootte | Bestandstype | Formaat | Afbeeldingen optimaliseren voor het web | Afbeeldingen toevoegen in QwikZite | Afbeeldingen vervangen | Standaard afbeeldingen | Extra afbeeldingen | Achtergrondafbeeldingen | Favicon
Werken met afbeeldingen
Bestandsgrootte
Afbeeldingen bepalen in grote mate de grootte van de pagina in kB en dus ook de tijd dat het duurt om een volledige pagina op het scherm te zien. Derhalve moet op het web voorzichtig worden omgesprongen met het gebruik van veel en vooral grote afbeeldingen.
De 'downloadtijd' van een pagina is afhankelijk van o.a. de kwaliteit van de internetverbinding, en de snelheid van het modem en van de PC van de bezoeker. Bezoekers via een reguliere telefoonlijn of via een zwakkere kabelverbinding beschikken vaak over een downloadsnelheid van niet meer dan zo'n 6 kB per seconde. Hoe lang het duurt om een pagina met een afbeelding van 120 kB te bekijken, laat zich raden.
Er bestaan gelukkig veel 'image editors', programma's waarmee je de bestandsgrootte van afbeeldingen kunt beperken en optimaliseren voor het web. Tenzij je ze publiceert voor speciale doeleinden, volstaan dergelijke foto's van 'webkwaliteit'.
Bestandstype
In het algemeen is het bestandstype JPG (Joint Photographic Experts Group Image File, ook wel aangeduid met JPEG) het beste type voor foto's en GIF (Graphics Interchange Format Image File) het beste type voor andere afbeeldingen zoals logo's.
Andere bestandstypen zoals PNG (Portable Network Graphic Image File) zijn af te raden, omdat ze alleen in de allernieuwste edities van browsers zijn te bekijken.
Gebruik nooit en te nimmer afbeeldingen in het bestandstype BMP (BitMap Picture): deze bestanden zijn qua bestandsgrootte vaak een factor 300 groter dan de bovenstaande typen en maken de website vrijwel ontoegankelijk!
Formaat
Het formaat van de afbeelding is eveneens in grote mate bepalend voor de grootte van het bestand en de downloadtijd.
Ter illustratie:
Een rechtstreeks uit een digitale camera komende JPG-afbeelding met een breedte van 1600 en een hoogte van 1200 pixels heeft een bestandsgrootte van zo'n 425 kB.
Teruggebracht tot een breedte van 200 pixels, niet meer dan noodzakelijk voor standaard afbeeldingen in QwikZite, bedraagt de bestandsgrootte van dezelfde afbeelding nog maar 4 kB.
Afbeeldingen optimaliseren voor het web
Bij het optimaliseren van afbeeldingen draait alles om het optimaliseren van de bestandsgrootte.
Enorm veel winst kan geboekt worden door het aanpassen van de kwaliteit van de afbeelding, het gebruik van het meest efficiente bestandstype, en het verkleinen van de afbeelding tot een niet meer dan noodzakelijk formaat.
Voor dit doel zijn veel 'image editors' voorhanden:
- Het meest handig zijn uiteraard professionele programma's als Adobe Photoshop en Macromedia Fireworks, echte alleskunners, maar enorm duur in aanschaf.
- Een stuk goedkoper, en inmiddels misschien wel even goed, is het steeds populairder wordend programma Paint Shop Pro.
- Een andere professionele image editor met vele mogelijkheden, gratis, maar niet bepaald gebruiksvriendelijk, is The Gimp.
- Wil je een relatief simpel programma om mee te beginnen, dan zijn er diverse gratis programma's voorhanden, zoals Irfan View dat alle bovengenoemde optimaliseringsmogelijkheden in huis heeft.
Voor andere gratis programma's zie Handige software - Afbeeldingen.
Afbeeldingen toevoegen in QwikZite
- De menu's 'page', 'news' en 'link' hebben de optie om één standaard afbeelding toe te voegen.
- Aan bovengenoemde elementen kunnen ook extra afbeeldingen worden toegevoegd.
- In het menu 'sitestyle' zijn standaard opties aanwezig om logo's en achtergrondafbeeldingen toe te voegen.
- Voorts bestaat de mogelijkheid om een favicon aan de site toe te voegen.
De invoerschermen voor deze verschillende typen afbeeldingen zijn identiek:
Je bladert naar het in te voeren bestand op je computer, waarna de locatie van het bestand in het invoerveld wordt vermeld.
Na het aanklikken van de button 'wijzigingen verwerken' boven of onderin het invoerscherm, wordt de afbeelding getoond, met details zoals bestandstype, bestandsgrootte en bestandsnaam.
Om praktische redenen wordt de afbeelding hier niet op ware grootte vertoond, maar in het formaat van 200x200 pixels. De verhouding van hoogte en breedte kan dus vertekend zijn, maar daar hoef je je geen zorgen over te maken. Een optie is aanwezig om de afbeelding op ware grootte te bekijken.
Afbeeldingen vervangen
Het is niet noodzakelijk om een reeds ingevoerde afbeelding te verwijderen alvorens deze door een andere te vervangen. Alleen als je géén afbeelding wilt tonen, dien je de optie 'verwijder deze afbeelding' aan te vinken.
Na het doorvoeren van de wijziging blijft soms de oude afbeelding nog op de achterkant zichtbaar, zelfs na herhaaldelijk refreshen/vernieuwen van het beeldscherm. Dit is slechts een kwestie van cache (de geheugeninstelling van je browser). Op de voorkant kun je na het refreshen van je beeldscherm de afbeelding wel zien.
Denk er om dat, zodra je een afbeelding vervangt of verwijdert, het 'origineel' niet meer in de database aanwezig is en je op geen enkele manier de 'oude' afbeelding weer tevoorschijn kan toveren.
Bij het testen van sitestyles kan dit onaangename verassingen opleveren. Vooral als je op een andere werkplek werkt, is het zaak de afbeelding eerst op te slaan, voordat je deze vervangt of verwijdert.
Standaard afbeeldingen
Standaard ingevoerde afbeeldingen worden op de volgende wijze op de voorkant van de website getoond:
- Page:
De afbeelding wordt rechtsboven in de text area getoond, automatisch proportioneel verkleind naar een breedte van 200 pixels. De tekst loopt automatisch om de afbeelding heen.
Invoer van afbeeldingen met een breedte van minder dan 200 pixels wordt afgeraden.
- News:
Bij opening van het nieuwsbericht wordt de afbeelding linksboven in de content area getoond, automatisch proportioneel verkleind naar een breedte van 200 pixels. De tekst loopt automatisch om de afbeelding heen.
Invoer van afbeeldingen met een breedte van minder dan 200 pixels wordt afgeraden.
- Link:
De afbeelding wordt in de 'link area' links van de link getoond, automatisch proportioneel verkleind naar een breedte van 100 pixels.
Invoer van afbeeldingen met een breedte van minder dan 100 pixels wordt afgeraden.
- Sitestyle:
De afbeeldingen in de 'logo left area', 'logo right area' en 'title area' worden op ware grootte getoond (QwikZite versie 1.10) of automatisch geresized naar de breedte en hoogte van deze gebieden (QwikZite versie 1.09).
Extra afbeeldingen
Op alle plaatsen in QwikZite waar tekst ingevoerd kan worden, kunnen ook extra afbeeldingen worden ingevoerd. - De afbeeldingen worden voor dit doel eerst als 'losse' afbeeldingen toegevoegd aan de tabel 'foto' middels de gangbare invoerwijze. Ze worden in deze tabel opgeslagen met een uniek ID-nummer.
- Ze worden zichtbaar gemaakt op de website door HTML-codering met verwijzing naar dit ID-nummer in de betreffende tekst op te nemen.
Middels de HTML-codering kunnen, anders dan bij standaard afbeeldingen, de volgende eigenschappen van de afbeelding zelf worden gedefinieerd: plaats op de pagina, formaat, rand, afstand tot de tekst, etc. Tevens kunnen van afbeeldingen 'hyperlinks' worden gemaakt.
Meer informatie: zie Menu 'foto'.
Achtergrondafbeeldingen
Achtergrondafbeeldingen voor de hele pagina of per afzonderlijk deelgebied kunnen worden ingevoerd in het menu 'sitestyle'. Zoals de naam al aangeeft, worden deze afbeeldingen als achtergrond van de tekst en normale afbeeldingen getoond.
Het 'gedrag' van achtergrondafbeeldingen is verschillend van normale afbeeldingen: ze worden altijd op ware grootte en herhaald getoond. Omdat dat speciale eisen aan de afbeelding stelt, is hieraan in deze handleiding een afzonderlijk hoofdstuk gewijd.
Zie: Werken met achtergronden.
Favicon
Een 'favicon'(of 'shortcut icon') is een icoon dat in de adresbalk van de browser wordt getoond bij het openen van een site. Het kan worden toegevoegd aan de site om die een meer professioneel tintje te geven.
Het gebruik van favicons is voor het eerst geintroduceerd in Internet Explorer 5.0, waar de favicon werd getoond nadat je de betreffende site toegevoegd had aan de lijst van 'Favorieten'.
In de laatste versie, Internet Explorer 6.0, is dat nog steeds het geval. In de nieuwere versies van veel andere browsers (Firefox, Netscape, Opera, Mozilla) is de favicon altijd automatisch zichtbaar.
Aan een favicon worden zeer specifieke eisen gesteld:
- Formaat: 16x16 pixels.
- Bestandstype: ICO.
Voor het maken van een favicon of omzetten van een gangbaar afbeeldingsbestand naar een ICO-bestand heb je een 'icoon editor' nodig.
Gratis icoon editors zijn op het web rijkelijk aanwezig, zoals het programma Icon Art.
Voor het toevoegen van een eigen favicon aan je site, is foto 1 in de tabel 'foto' gereserveerd.
Standaard is daar de boven afgebeelde QwikZite favicon reeds aanwezig. Naar believen kun je deze vervangen door een eigen favicon.
Ga naar top | Bestandsgrootte | Bestandstype | Formaat | Afbeeldingen optimaliseren voor het web | Afbeeldingen toevoegen in QwikZite | Afbeeldingen vervangen | Standaard afbeeldingen | Extra afbeeldingen | Achtergrondafbeeldingen | Favicon
|
|
|
|
|
|
Laatste wijzigingen op deze pagina |
|
|
|
|