| |
| |
Web
achtergronden en afbeeldingen.
Achtergronden hebben een totaal
ander doel dan grafische illustraties. Je kan achtergronden
op 2 manieren samen stellen.
In het ene geval om de site gewoon wat op te leuken
en in het andere geval om binnen een site, de afzonderlijke
onderdelen extra te accentueren (de zgn framed achtergronden).
Je moet er echter wel op letten dat de mogelijkheid
bestaat dat een achtergrond herhaald gaat worden.
Vooral in de breedte kan een pagina erg afhankelijk
zijn van de resoluties van de gebruiker.
Er zijn diverse foefjes voor om dit allemaal te ondervangen
maar je dient er wel rekening mee te houden. Niets
is zo erg als dat een afbeelding ergens willekeurig
op een pagina gaat herhalen,
zodra een andere resolutie gebruikt word.
De
framed achtergronden komen steeds meer in trek daar
men hiermee resolutie onafhankelijk is. In het ene
geval zal hooguit een klein deel links en rechts van
de afbeelding weg vallen maar blijft het aktieve deel
van de website in alle gevallen gelijk.
|
| |
| |
Framed
achtergronden -1
Een
mooi voorbeeld daar van is de afbeelding hier onder.
Het lichte venster is het aktieve deel van de website.
Uiteraard kan je dat naar eigen idee en wensen aanpassen
zolang je er maar op let dat het in alle huidige browsers
passend is, daar deze onderling nogal wat verschillen
van weergave. |
| |
| |
Framed achtergronden -2
Een
ander voorbeeld is de achtergrond van Les Haricots.
Het voordeel van deze achtergrond is wel dat er geen
strak afgebakend kader voor de aktieve onderdelen van
de site aanwezig zijn. Eventueel afwijkende weergave
zal niet meteen ernstige gevolgen hebben voor de lay-out.
Dit maakt het bouwen van een site een heel stuk gemakkelijker.
|
| |
| |
GSXR-Team
De
site www.gsxr-team.com
is daar eveneens een heel duidelijk voorbeeld van.
Deze site is helemaal opgebouwd uit grafische elementen.
Het geeft een heel exclusief uiterlijk aan een site.
Echter is het een zéér tijdrovende bezigheid
om zo een website te maken. Hoeveel werk het in werkelijkheid
kost om zo een site op te bouwen, heeft bijna niemand
door! |

Ckik Image to enlarge
|
| |
| |
Bijzondere
framed achtergronden
Tot
nu toe heb ik alleen nog maar de gewone webpagina achtergronden
laten zien maar er zijn daar naast nog tal van bijzondere
toepassingen te bedenken als foto-albums, web-shops,
chat boxen, weblogs, etc.
Uiteraard komen deze hier ook nog aan bod, te beginnen
bij; |
| |
Web-album
Veel
web-albums werken met zogenaamde thumbnails (verkleinde
afbeeldingen) welke je vervolgens kan aanklikken voor
een ware grote afbeelding.
Deze achtergrond is passend gemaakt met een frame zodat
daar exact de thumbnails in vallen waar door deze pagina
een geheel eigen effect krijgt. De geopende foto`s passen
exact in het midden frame waar door de album een exclusief
uiterlijk krijgt. |

Ckik Image to enlarge
|
| |
Web-Shop
Hier zie je een combinatie van de hierboven besproken
achtergrond in combinatie met een al eerder besproken
header.
Hier is te zien dat een goede voorbereiding, erg belangrijk
is. Zeker als je met gedetailiëerdere afbeeldingen
werkt, is het zaak dat alles met elkaar in evenwicht
is qua kleur , detail en weergave sterkte. De artiekelen
vallen net als in de album in het middenscherm en de
categorieën en andere informatie in de links gecreëerde
optische kolom.
|

Ckik Image to enlarge
|
| |
Chat
Een wel heel sprekend voorbeeld van grafische
inkadering, is deze afbeelding.
De achtergrond is gemaakt nadat eerst de positiesvan
alle functie knoppen en actieve schermen bepaald zijn.
Hier gaat veel voorbereiding aan vooraf maar vervolgens
heb je wel een chatbox die past binnen het geheel van
de website. |

Ckik Image to enlarge
|
| |
Weblog
og blogg
Hier
zie je het resultaat van een achtergrond die voorbereid
is op de frames waarin de weblog uiteindelijk opgebouwd
word.
Daar naast is de rechter bruine rand als extra bestand
toegevoegd welke als herhaling geld. In het ergste geval
zal bij een abdere beeldscherm instelling als breedbeeld,
naast deze achtergrond een bredere bruine rand komen,
wat beslist geen hinderend effect zal geven.
De frames van de website zijn statisch en zullen van
rechts uitgelijnt worden waar door alles op z`n plaats
blijft staan in de achtergrond |
Ckik
Image to enlarge
|
| |
Resultaat
Hier
zie je wat voor resultaat het geheel uiteindelijk krijgt
nadat ze toegevoegd zijn aan de daadwerkelijke informatie
van de site. |

Ckik Image to enlarge
|
| |
Lay-over
achtergrond
Deze
afbeelding is een combinatie achtergrond.
Dat wil zeggen dat over de achtergrond heen, de diverse
losse afbeeldingen liggen welke bv lichter zijn..
Deze losse afbeeldingen worden pas zichtbaar wanneer
men er over heen gaat met de muis. Hier door suggereerd
men bijvoorbeeld dat een deeel van de pagina oplicht.
Of een gesloten onderdeel ineens open gaat. Een soort
van button effect maar dan in de achtergrond ingewerkt. |

Ckik Image to enlarge
|
| |
| |
Rechter
kolom achtergronden
Deze
achtergronden worden doorgaans gemaakt zodra zij als
één afbeelding onder twee kolommen door
loopt. Het voordeel hier van is dat men niet zo gebonden
is aan een formaat.
|
|
|
Vaag
Deze
achtergrond tekend vaag een rechter kolom af. Deze
achtergrond is dan ook te gebruiken als achtergrond
zónder extra rechter kolom als ook mét
een extra rechter kolom.
Het
voordeel van een witte afbeelding is wel dat je de
hoofd kleur áchter de achtergrond als wit kan
instellen zodat het lijkt alsof de achtergrond zich
aanpast aan de breedte van het scherm, wat echter
niet het geval is. |

Ckik
Image to enlarge
|
|
| |
Resoluut
Door
de duidelijke afbakening van de rechter kolomruimte,
kan dit soort achtergronden dan ook echt alleen gebruikt
worden wanneer men een rechter kolom op de website zet.
Ze zijn ook uiterst geschikt voor weblogs waar over
het algemeen aan de rechter zijde de kalender en categorieën
etc. staan
|

Ckik Image to enlarge
|
|
| |
Achtergrond met Header
Als
je een gewone platte html website maakt, is het handig
om een achtergrond te maken waar de header al in verwerkt
is. Het enige nadeel is wel dat wanneer er een hogere
resolutie gebruikt word, de afbeelding zich gaat herhalen.
Je zal dus moeten zorgen dat je de afbeelding centreerd
en de achtergrondkleur overeen stemt met de afbeelding.
|
|
Voorbeeld
Hier
naast heb ik een voorbeeld geplaatst. Je kan jezelf
voorstellen dat wanneer je een witte achtergrond als
basis neemt, de randen ongehindert opgevult worden.
Het nadeel is wel dat de header het formaat blijft houden
als hij heeft. Hier door zal er bij extreem hoge resolutiegebruik
een leeg vlak ontstaan naast de header aan de rechter
kant
Of dat hinderlijk is ???
Ik zie vaak veel hinderlijke zaken dus voor een privé
webpagina kan ik hier nog wel mee leren leven. |

Ckik Image to enlarge
|
|
| |
Achtergrond
in combinatie met layers
Hier
voor moet ik éérst uitleggen wat layers
zijn.
Layers zijn als het ware onzichtbare kadertjes, welke
voorzien kunnen worden van allerhande atributen als
teksten, buttons, plaatjes etc. Deze kadertjes kan je
in sommige web-builders programma`s alle kanten op verplaatsen.
Dat klinkt natuurlijk héél |
| |
|

Ckik Image to enlarge
|
|
| |
Word vervolgt
Deze
site word bijna dagelijks geupdate
!
|
|