Hoe groot moet de achtergrond van een website zijn?

Het liefst in mm of cm.

Toegevoegd na 7 minuten:
Ik maak de achtergrond in Photoshop.

Weet jij het antwoord?

/2500

Het best is om een plaatje te nemen van een zo hoog mogelijke resolutie. In mijn beleving is de meest gebruikte resolutie 1024x768. Maar ik heb geen idee hoeveel CM dat is.

De meeste gebruikte algemene achtergrond is een textuur van pakweg 50 pixels op 50 pixels (of pakweg 5 cm op 5 cm) die dan herhaaldelijk word weergegeven. De afbeeldingen die je vaak ziet op de achtergrond worden in een bovenliggende laag gestopt zodat de schermgrootte van de bezoeker geen impact heeft op de compositie van de website. Hiermee doe je dus wat je wil. Je maakt je website 'kunstwerk' zoals jij het wil. Je zorgt er dus voor dat eender welke schermgrootte dat je website bezoekt ook steeds het zelfde beeld krijgt. Wanneer je effectief met een achtergrond afbeelding wilt werken omdat dit binnen je design past dan moet de afbeelding groot genoeg zijn zodat alle schermgrootte deze kunnen bekijken zonder verlies van kwaliteit. als je dan resolutie 1024px op 768px neemt dan ga je niet veel problemen hebben. (ik had je graag cm of mm gegeven maar op het web word het meeste in pixels gewerkt en ik moet eerlijk bekennen geen idee hoe groot dit is :-). druk anders een kader af van deze dimensies als je effectief je creatieve zelf wil laten gaan op papier)

Zo smal als mogelijk, zo breed als nodig. Image size is het aantal pixels hoogte bij het aantal pixels lengte. Alleen, hoe groot dat dan is is niet zo simpel aan te geven. Stel jij hebt een scherm van (om makkelijk te rekenen) 10 bij 10 cm en een resolutie van 100 bij 100 pixels. Elke cm bestaat dan uit 10 pixels bij 10 pixels. Een image van 50 *50 is dan 5 cm bij 5 cm. Bij hetzelfde scherm en een resolutie van 200 * 200 pixels wordt diezelfde image weergegeven als 2,5 bij 2,5 cm. Dus resolutie is niet van invloed op het aantal pixels (nog steeds 50 bij 50) maar wel op hoe groot dat getoond wordt op je scherm. Ook de grote van het scherm is van belang. Als je een scherm hebt van 20 bij 20 cm en een resolutie van 200 bij 200 is diezelfde image weer 5 bij 5 cm. En vervolgens heb je nog de grote van een image als je hem uitprint. Hiervoor wordt de dpi (dots per inch) gebruikt, oftewel het aantal pixels dat in een vierkant inch past. Hierbij staat dus de werkelijke grote vast, maar is het aantal puntjes dat erin past variabel. Wanneer die image van 50 pixels bij 50 pixels wordt geprint bij 300dpi zal hij een stuk kleiner (in cm) zijn dan wanneer hij wordt geprint op 72 dpi. Oftewel als ik je een antwoord geef in mm of cm heb je hier helemaal niets aan. De meest gebruikte resolutie is inderdaad 1024 pixels breed. Wat inhoud dat ongeveer 15% van je bezoekers (gemiddeld) een breder scherm heeft. De vraag is hoe breed moet de achtegrond zijn voor het ontwerp van je site. Goeievraag gebruikt bijvoorbeeld losse stukjes achtergond ipv 1 grote image. Dus deze vraag kun jij alleen goed beantwoorden. Zo smal als mogelijk, zo breed als nodig. Voel je hierbij ook niet beperkt door de 50 bij 50 pixels die de vorige user aangeeft, 5*5 en 500*500 werkt net zo goed. Je kunt vervolgens in de css aangeven hoe je achtergrond herhaalt wordt. Onbeperkt, alleen horizontaal, alleen verticaal, of helemaal niet.

Bronnen:
http://www.goeievraag.nl/images/headerMainBg.jpg

Op school leren ze ons aan 950x600 px te gebruiken. Dit is omdat er nog veel mensen zijn die hun beeldscherm ingesteld hebben op 1024x768 en je moet er vanuit gaan dat deze mensen niet weten hoe ze hun beeldschermresolutie moeten aanpassen. Op een website melden dat een gebruiker eerst zijn resolutie moet aanpassen om een website optimaal te kunnen bekijken is absoluut NOT DONE! (hetzelfde geldt trouwens voor het opleggen van browsers)

Het probleem is, de door mensen gebruikte beeldschermen en resoluties zijn zo divers dat je eigenlijk met allemaal rekening moet houden. 1024x768 wordt tegenwoordig als een minimale resolutie gezien. Dus de website moet voor deze resolutie gewoon goed werken / optimaal zijn. Echter er zijn ook mensen met een 1600x1200 scherm of zelfs nog groter. En je wilt niet dat jouw website er raar uitziet op schermen die groter zijn dan 1024x768, toch? Het slimste is dus een achtergrond te maken die: a> gewoon een egale kleur heeft b> zichzelf kan herhalen / repeaten in hoogte / breedte of zelfs beiden (de vierkantjes zoals hierboven aangegeven) c> een achtergrond die overloopt naar een egale kleur zodat je de achtergrond kunt centreren en grote en kleine schermen de afbeelding goed zien.... alleen grote schermen zien dan links en rechts een opvullende kleur Goede vraag! Succes met het design! Toegevoegd na 2 minuten: Oeps vergeten, op het scherm werk je met Pixels en dit zit ook in Photoshop gewoon. Je kunt dan wel het beste de resolutie op 72 pixels/inch zetten. Afbeelding vervolgens ook opslaan via "Save for web".

Je kan voor een achtergrond beter geen vast formaat afbeelding gebruiken. Er zijn erg veel verschillende resoluties die gebruikt worden. Het beste kan je de tot een patern maken. De afmetingen hiervan zijn niet van invloed (kleiner scheelt in laad tijd) of laat de achtergrond aan de zij kanten overlopen in een kleur en geef de site die kleur als achtergrond mee.

Stel zelf een vraag

Ben je op zoek naar het antwoord op die ene vraag die je misschien al tijden achtervolgt?

/100