een simpele webbanner maken

ik weet nog goed dat toen ik een super n00b was is webdesign, ik altijd op zoek was naar een goede guide om een webbanner te maken. daarom heb ik hier een kleine tut gemaakt over het maken van zo’n banner

om te beginnen moet je bij jezelf nagaan wat het doel van de banner is. zal hij als header dienen? of zal hij op andere sites worden geplaatst als reclame voor jou?

wanneer je dit bepaald hebt kan je gaan nadenken over wat je er in wilt verwerken en wat er duidelijk moet worden. je wilt dat je banner er mooi uitziet en dus gebruik je een plaatje wat er mooi uit ziet en met je onderwerp te maken heeft zodat het je doelgroep aanspreekt.

ok genoeg gepraat laten we beginnen met de banner

als voorbeeld ga ik een banner maken voor een game site en gebruik dus een screenshot van wolfenstein enemy territory:

[img]http://img.photobucket.com/albums/v71/ironhelm/E-T_screenshot.jpg[/img]

met het programma photoshop ga ik er nu een banner van maken:

open je plaatje met photoshop of een soortgelijk programma.

dan maak je een nieuw plaatje met de standaard groote van een webbanner. (468 x 60):

[img]http://img.photobucket.com/albums/v71/ironhelm/webbannersize.jpg[/img]

nu gaan we een stukje uit de screenshot selecteren. dit doe je met de select tool:

[img]http://img.photobucket.com/albums/v71/ironhelm/select.jpg[/img]

selecteer een stuk van de screenshot groot genoeg om je nu nog lege web banner te vullen en kopieer het met control+C. dan selecteer je de lege banner en druk je control+V te gelijk in. of je klikt met je rechtermuisknop op de banner en klikt op plakken

als het goed is, is nu het deel wat je hebt gecopieerd zichtbaar in je banner. nu kan je met de move tool [img]http://img.photobucket.com/albums/v71/ironhelm/move.jpg[/img] het plaatje naar wens verplaatsen:

[img]http://img.photobucket.com/albums/v71/ironhelm/1.jpg[/img]

nu is het tijd om wat tekst in je plaatje aan te brengen. dit doe je met de type tool [img]http://img.photobucket.com/albums/v71/ironhelm/type.jpg[/img]

ik ga ervan uit dat je weet hoe het toetsenbord werkt en je kan omgaan met de lettertypes en lettergroottes, deze gaan namelijk bijna hetzelfde als in WORD.

het is altijd handig in de banner de url te vermelden en eventueel een kleine slogan:

[img]http://img.photobucket.com/albums/v71/ironhelm/2.jpg[/img]

ok mooi zo’n banner kan je heel blij mee zijn maar hoe kan het dat als je er op klikt je op jouw site komt? wat is de magie daarachter? nou eigenlijk helemaal niks . door een klein stukje html code kan je jouw banner naar je site laten linken! u kunt deze code zelfs aan vrienden doorgeven zodat zij hem op hun sites kunnen zetten, zonder dat ze het plaatje hoeven te hebben!

maar hoe gaat dat nou? heel simpel:

voor mijn plaatje gebruik ik de code:

als je geen html kent zal je nu wel denken: ehhm….. jah.. en nu..?

nou ik zal de code even uitleggen:

ik hoop dat het u duidelijk is als dit niet het geval is mag je hier gerust je vragen stellen

bron: http://www.goodtuts.tk

schrijver: ironhelm

niet dat iemand dit niet kan maargoed ik verveelde me

Z@3 +2