TIPS EN TRUCS KNOPPEN MAKEN GEBRUIKERS HANDLEIDING 2008-2010 2Com2 internet & communicatie 2Com2 heeft deze informatie met zorg samengesteld om u als gebruiker zo goed mogelijk te ondersteunen. 2Com2 accepteert geen aansprakelijkheid met betrekking tot fouten in deze informatie, het niet correct functioneren van mailsoftware of storingen ten gevolge van foutief handelen.
Inleiding Iedereen weet waarvoor een knop bedoeld is, namelijk: om er op te drukken. Een drukknop op uw website kan uw bezoeker extra prikkelen actie te ondernemen. Zo n drukknop kan diverse teksten bevatten, gebruik hiervoor een actief (werk)woord. Bijvoorbeeld door het benoemen van de handeling, het prikkelen van de behoefte en het gebruik van klassieke klikwoorden. Probeer in de tekst de handeling te benoemen en gebruik woorden als: bestellen, aanvragen, inschrijven, inloggen, stemmen en verzenden. Probeer de behoefte van uw bezoeker te prikkelen door gebruik van woorden als: gemak, tijdsbesparing, prijsvoordeel, plezier, slimheid, controle en er als eerste bijzijn. Probeer klassieke klikwoorden te gebruiken door gebruik van woorden zoals: nu, direct, gratis, korting, bespaar, voordeel, eenvoudig, geheim, succes en tips. In deze handleiding geven we een uitleg hoe u zelf knoppen kunt maken. Deze handleiding is bedoeld als extra service. Stappen plan en hulpprogramma s Het maken van een knop gaat in 4 stappen: - Stap 1: Bepalen vorm en/of zoeken gewenste afbeelding knop - Stap 2: Toevoegen van tekst aan knop - Stap 3: Knop op juiste grootte en Opslaan - Stap 4: Knop in webxpress toevoegen Voor het maken van knoppen kunt u het beste een grafisch programma als Adobe Photoshop gebruik. Maar het kan ook met meer alledaagse programma s als Word of PowerPoint. Een handig hulpprogramma is het gratis programma IrfanView. In deze handleiding gaan we aan de slag met het programma PowerPoint. Dit werkt eenvoudig en biedt een uitgebreid aantal grafische mogelijkheden. Stap 1: Bepalen vorm en/of zoeken gewenste afbeelding knop Als basis voor de knop kan een afbeelding gebruikt worden. Deze kan op internet gevonden worden. Let wel op dat de afbeelding rechten vrij is, er staan forse boetes op het gebruik van afbeeldingen zonder toestemming. U kunt ook afbeeldingen van knoppen via stockphoto-websites, zoals www.istockphoto.com. Voorbeeld van resultaten Google zoekopdracht naar knoppen (website buttons): 2Com2 internet en communicatie Pagina: 2
U kunt ook zelf een knop creëren met PowerPoint. U moet nadenken over de basisvorm de kleuren, en eventuele effecten. Hieronder enkele voorbeelden: Zelf een knop maken (PowerPoint): - Klik op Invoegen - Klik op Basisvormen - Kies op de gewenste vorm - Geef de rand en inhoud dezelfde kleur - Stel indien gewenst een dikkere rand in - Stel indien gewenst een kleurverloop van de inhoud in Stap 2: Toevoegen van tekst Vervolgens kunt u aan via internet geselecteerde of gekochte afbeelding of aan de zelf gemaakte knop een tekst toevoegen, een symbool mag natuurlijk ook. Zelf een tekst toevoegen (PowerPoint): - Klik op Invoegen - Klik op Tekstvak - Geef het Tekstvak een tekst - Maak de tekst op (bijvoorbeeld Vet, Italic of met schaduw) - Plaats het Tekstvak over de knop - Stem het formaat van de tekst af op het formaat van de knop (of andersom) Stap 3: Knop op juiste grootte en Opslaan De laatste stap is om de knop op de juiste grootte te krijgen en deze op te slaan voor gebruik in de webxpress website. De volgende stappen zien er misschien ingewikkeld uit, maar dat valt best mee. De knop fotograferen (PowerPoint): - Start de PowerPoint - Maak een screenshot, dit doe je door op de PrintScreen toets te drukken De knop uitsnijden (Irfanview): - Start IrfanView 2Com2 internet en communicatie Pagina: 3
- Plak het screenshot - Selecteer de knop (maak selectie), je kunt een randje om de knop laten Voorbeeld van uitsnijden knop (sterk vergroot) Vervolg: - Knip en plak de knop De knop op de juiste grootte maken (IrfanView): - Klik op Afbeelding - Klik op Grootte wijzigen - Stel de nieuwe grootte in Tips: - Vink de instelling Aspect ratio behouden aan/uit afhankelijk van uw wens - Vink de instelling Verscherpen na Resample aan/uit afhankelijk van uw wens De knop Opslaan (IrfanView): - Klik op Bestand - Klik op Opslaan als - Selecteer de gewenste map - Selecteer JPG bestandsformaat - Klik op Opslaan Eventueel kunt u er nog voor kiezen om de afbeelding gedeeltelijk transparant te maken. Bijvoorbeeld het wit om de knop zodat de knop beter op de website past. Als de rand om de knop wit is en er ook wit in de knop voorkomt (zoals voorbeeld) geef dan de rand om de knop een bijzondere kleur (die niet in de knop voorkomt). Deze kleur gaan we transparant maken waardoor de achtergrond van de website zichtbaar wordt. 2Com2 internet en communicatie Pagina: 4
voorbeeld knop met afwijkende kleur rand (sterk uitvergroot) Knop opslaan met transparante kleur (IrfanView): De knop Opslaan (IrfanView): - Klik op Bestand - Klik op Opslaan als - Selecteer de gewenste map - Selecteer GIF bestandsformaat - Vink bij JPEG/GIF opties: Transparante kleur opslaan - Vink bij JPEG/GIF opties: Kies transparante kleur bij opslaan - Klik op Opslaan - Kies transparante kleur (rose in voorbeeld) Stap 4: Knop in webxpress toevoegen Een knop is eigenlijk een afbeelding die tevens een hyperlink is. Als er op de afbeelding geklikt wordt, wordt de hyperlink gestart. Toevoegen knop (in webxpress): - Open de webpagina waar de knop moet worden toegevoegd - Klik op gele berg icoon afbeelding invoegen uit gallerij - Selecteer de afbeelding (zojuist bij stap 3 opgeslagen) - Klik op Opslaan en toevoegen, de afbeelding wordt nu geladen en toegevoegd - Sla eventueel de pagina op Hyperlink aan afbeelding toevoegen (in webxpress): - Selecteer afbeelding - Klik op Ketting/wereldbol icoon creëer hyperlink - Geef de bestemmings URL op (als er geklikt wordt) - Klik op Ok - Sla de pagina op 2Com2 internet en communicatie Pagina: 5