Photoshop en het web

Vanalles om te leren omgaan met het programma...
Plaats reactie
Gebruikersavatar
jangske
Site Admin
Berichten: 1011
Lid geworden op: 14 jun 2017, 07:23

Photoshop en het web

Bericht door jangske » 16 jun 2017, 15:06

De meeste afbeeldingen die je maakt voor je site, gebruik je om elementen van de interface te maken, zoals navigatieknoppen, titels, logo's en dergelijke.
Als je je afbeeldingen hebt gemaakt, moet je beslissen welke indeling je wilt gebruiken om ze op te slaan en hoe je ze mooier kunt maken.
Natuurlijk met behulp van Photoshop!



Het gereedschap Type

Vaak worden afbeeldingen met tekst gebruikt op webpagina's.
Navigatieknoppen zijn hier een goed voorbeeld van.

Het gereedschap Type van Photoshop is het ideale gereedschap om dit soort afbeelding te maken.
In het dialoogvenster Type kan je het lettertype, de tekengrootte, de kleur en andere parameters voor tekst instellen.

Afbeelding

De tekst die je maakt, wordt op een aparte laag gezet die je gemakkelijk kunt activeren via het palet Layers.
Zo kan je de tekst en de tekstparameters onmiddellijk aanpassen op elk gewenst moment en op elke gewenste manier.
Je kunt speciale effecten toepassen, zoals opliggend of slagschaduw, met een paar muisklikken.

Speciale effecten in een oogwenk

Je kunt natuurlijk kiezen voor platte, effen tekst en knoppen. Maar aangezien je met Photoshop opliggende en volume-effecten kunt maken, waarom zou je die dan niet gebruiken?

Je moet wel één ding in je achterhoofd houden als je deze effecten wilt maken: de betreffende afbeelding moet op een transparante laag worden gezet, zoals bijvoorbeeld tekst die je maakt met het gereedschap Type.

Je kunt uitgeknipte en opliggende tekst en afbeeldingen maken, al dan niet met slagschaduw of een gekleurde stralenkrans.
Vanzelfsprekend kan je al deze effecten helemaal aan je eigen wensen aanpassen.

Afbeelding

Sterker nog, je kunt deze speciale effecten bewerken of annuleren wanneer je wilt, of een volume-effect veranderen in een slagschaduw zonder de rest van de afbeelding te wijzigen.

Je werk opslaan: GIF- of JPEG-indeling

GIF en JPEG. Zoals je wel weet, zijn dit de twee indelingen die worden gebruikt voor het web.
Je hebt geen keus! Je kunt vanuit Photoshop je afbeelding rechtstreeks in deze twee indelingen opslaan met verschillende opties voor elke indeling.
  1. JPEG-indeling: wanneer je een afbeelding opslaat in JPEG-indeling, kan je het compressieniveau instellen, een hoger niveau geeft een kleiner bestand, maar ook een mindere beeldkwaliteit.

    Met Photoshop kan je ook progressieve JPEG-bestanden opslaan.
    Deze afbeeldingen worden onmiddellijk weergegeven in de browser, zelfs voordat ze helemaal zijn geladen.
    De weergegeven afbeelding is eerst wazig, maar wordt steeds duidelijker naarmate er meer wordt gedownload.

    Afbeelding
  2. GIF-indeling: GIF-afbeeldingen hebben het karakteristieke kenmerk dat ze transparante gedeelten kunnen herkennen, zodat de kleur of het patroon van een achtergrond zichtbaar wordt.
    Je kunt dit type afbeelding heel makkelijk met Photoshop maken als je de lagenfunctie gebruikt.

    Je kunt ook een interlaced GIF-bestand maken, de evenknie van een progressief JPEG-bestand.

    Afbeelding

Bestanden voor het web opslaan

Een geweldige nieuwe functie van Photoshop versie 6.0 is de indeling Save for Web.
Met deze functie kan je alle verschillende opties voor het opslaan van afbeeldingen, zoals indeling, compressie, transparantie en dergelijke, selecteren in één dialoogvenster en de oorspronkelijke afbeelding naast de voor het web geoptimaliseerde afbeelding bekijken.

Dit dialoogvenster heeft ook een andere functie: het laat de grootte van het uitvoerbestand en de geschatte downloadtijd zien, twee essentiële gegevens voor het maken van webafbeeldingen.

Afbeelding
Nog veel plezier op deze site...

Plaats reactie