Tekst en plaatjes zelf gereed maken voor je website

Okay, je hebt een nieuwe website, mooi! Maar hoe vul je die nu met je teksten en plaatjes?

Hoe bereid je je teksten en plaatjes voor om ze op je website te kunnen zetten? (zelfs al zou je een halve digibeet zijn!)

Deze handleiding is bedoeld voor mensen die weten hoe ze bijvoorbeeld simpel in Word kunnen werken en iets moeten opzoeken op Google, maar die geen computerspecialisten zijn.

Gebruik je geen grafische software zoals Photoshop, Fireworks of Gimp (of vind je dat te ingewikkeld), maar wil je wel in staat zijn om je foto’s en teksten op je website te zetten? Dan kan deze handige handleiding erg, eh, handig zijn 🙂

Deel 1: hoe maak je plaatjes geschikt voor je website?

Als je heel zware plaatjes op je website zet, duurt het erg lang voor een bezoeker je webpagina kan laden. Als dat te lang duurt, is je bezoeker weer weg, want internetters staan niet bekend om hun geduld.
Het is dus belangrijk dat je plaatjes niet te groot zijn.
Met groot en klein bedoel ik niet alleen groot en klein om te zien, maar vooral groot en klein in hoeveelheid Kb of Mb. Dat zou je ook het gewicht van een plaatje kunnen noemen.

Dat gewicht willen we klein houden, zodat pagina’s met een plaatje snel laden.
Een plaatje wat zo uit je digitale camera komt, kan wel 4 Mb groot (zwaar) zijn.
4000 Kb dus!
Voor internet wil je veel kleinere (lichtere) plaatjes.
Denk dan eerder aan 60 Kb, of misschien een keer 120 Kb als dit het enige plaatje op de pagina is, en je verwacht dat bezoekers er uitgebreid naar willen kijken.

Plaatjes kunnen op drie manieren te zwaar zijn:

  1. Een grotere resolutie dan nodig.
    Plaatjes worden opgebouwd uit puntjes. Hoe meer puntjes per centimeter (oftewel dpi, dots per inch), hoe zwaarder het plaatje wordt.
    Denk maar aan het verschil tussen lood en veren. Een kuub lood is veel zwaarder dan een kuub veren, omdat er veel meer lucht tussen veren zit.
    Zo is een plaatje van 300 dpi ook zwaarder dan een even groot plaatje van 72 dpi.
    De goede resolutie voor internet is 72 dpi.
    .
  2. Een plaatje kan heel groot zijn in afmetingen.
    Een klein plaatje is natuurlijk minder zwaar. Maar te klein, dan zie je het niet meer.
    Te groot daarentegen zorgt niet alleen voor een traag ladende website, maar als je plaatje zo groot is dat het eigenlijk niet in je website past, kan je er zelfs je lay-out mee breken.
    Je meet de afmetingen van je plaatje niet in centimeters, maar in pixels.
    Hoe groot je plaatje mag zijn om in je website te passen, hangt van de lay-out van je website af. Vraag dat aan je webdesigner.
    Als het gaat om een plaatje wat je in je tekst wilt zetten is 300 tot 500 pixels breed vaak een prima keuze.
    .
  3. Plaatjes kun je comprimeren.
    Een ongecomprimeerd plaatje is veel groter dan een gecomprimeerd plaatje. Als je een plaatje te ver comprimeert, gaat het er echter slecht uitzien. Een kwestie van balans dus.
    Een bitmap (.bmp) bestand is ongecomprimeerd, en veel te groot voor internet. Een .raw bestand (van je digitale camera) is al helemaal verschrikkelijk.
    Voor internet gebruik je .jpg bestanden, .gif of .png bestanden. Als je niet zoveel kennis hebt van computers, zijn .jpg bestanden vaak het makkelijkste te maken.
    Als je een plaatje omzet naar een .jpg bestand kun je kiezen hoever je het wil comprimeren. 100% is bijna niet gecomprimeerd, dus goede kwaliteit maar een zwaar plaatje, terwijl 10% een plaatje geeft dat erg klein (licht) is, maar ook niet om aan te zien. 80% is bijna altijd de beste keuze.

 

Hoe zie je wat voor een soort bestand je plaatje is?

Heb je een plaatje wat je op je website wilt zetten, maar kun je niet zien of het een plaatje.bmp, plaatje.jpg of plaatje.gif bestand is, omdat er gewoon “plaatje” staat?
Ik ga er even van uit dat je Windows 7 gebruikt.

  1. Klik op Start > alle programma’s > bureau accessoires > windows verkenner
  2. Zoek je plaatje op
  3. Klik linksboven op organiseren > map- en zoekopties > tabblad weergave > haal het vinkje weg bij “Extensies voor bekende bestandstypen verbergen”

 

Hoe zorg je nu zonder professionele grafische programma’s dat je plaatjes passen op je website?

Veel mensen gaan aan de slag met programma’s als Paint of zelfs Word. Doe dat niet, deze programma’s zijn gewoonweg niet bedoeld voor dit werk.

Wil je ook van goede, maar ingewikkelder software zoals Photoshop, Fireworks of Gimp wegblijven? Ga dan hier eens kijken: www.fixpicture.org

Je kunt simpelweg je plaatje uploaden. Kies dan voor JPEG (dat is hetzelfde als .jpg) en voor Jpeg Quality: better.
(Good bij fixpicture is eigenlijk in het echt: reteslecht. En Best zorgt voor een te groot plaatje)
Vervolgens kun je Options uitvouwen door er op te klikken, en daar de afmetingen bijstellen, bijvoorbeeld door Resize > Custom (aanvinken) > 500 in te vullen. Dan krijg je dus een plaatje van 500 pixels breed.
Als het converteren klaar is, verschijnt er onder een link naar je bijgewerkte plaatje in beeld. Klik daar op, klik vervolgens rechts op je plaatje en kies “afbeelding opslaan als…”

Een vergelijkbare tool met iets meer mogelijkheden is www.picresize.com.

De resolutie wordt bij allebei de tools automatisch aangepast aan 72 dpi, dat is dus alvast goed. Je kunt plaatjes verkleinen in afmetingen, bijvoorbeeld naar 500 pixels, en ze comprimeren naar jpg op ongeveer 70 a 80% (kies voor better)

 

Nu zijn je plaatjes klaar om ze op je website te gaan zetten!

 

Tip: wil je zelf je logo ontwerpen?

Leuk, maar doe dat alsjeblieft NIET in Word, Paint, Publisher of om het even welk Microsoft programma.
Denk er sowieso even goed over na of je zelf de geschikte persoon bent om een logo te ontwerpen. Het is misschien belachelijk dat sommige bedrijven en overheden een miljoen neerleggen voor een goed logo, maar dat vertelt je toch ook dat het ontwerpen van goede logo’s geen sinecure is.
Een normale prijs om je logo professioneel te laten ontwerpen is ongeveer 300 euro, ook als ik dat voor je doe.

Toch zelf aan de slag? Gebruik dan in elk geval een professioneel grafisch programma zoals Adobe Illustrator of Inkscape. Dat is vector software waardoor je je logo onbeperkt kunt vergroten of verkleinen zonder kwaliteitsverlies.
En blijf alsjeblieft niet alleen weg van weg van Microsoft, maar ook van de vele gratis of goedkope online “logo” software. Daarbij heb je namelijk enorm veel kans dat je straks exact hetzelfde logo hebt als een ander. Tot zover je unieke uitstraling! Dan is helemaal geen logo misschien toch een betere keuze…

Waarmee ik niet wil zeggen dat ik niet soms echt fantastische logo’s tegenkom die mensen gewoon zelf gemaakt hebben (met de goede software). Maar ik wil wel zeggen dat dit uitzonderingen zijn, en ik veel vaker zelfgemaakte logo’s tegenkom die klanten kosten in plaats van opleveren.

Een foto op je webpagina plakken is echter iets wat iedereen kan, en jij weet nu hoe je een plaatje daar geschikt voor moet maken!

 

Lees verder in deel 2:

Hoe maak je tekstbestanden voor je nieuwe website, of kopieer je teksten van je oude website om ze op je nieuwe website te kunnen zetten?

 

Geef een reactie