Udfordring: Billedstørrelser på banner billede
I går blev jeg kontaktet af en hjemmeside ejer, som havde problemer med at få sin header på hjemmesiden til at se godt ud. Hun havde et tema med et banner i fuld bredde (som fylder hele skærmens bredde) og hun brugte et foto som var i almindeligt format og i en bredde på omkring 1000 pixels. Og et billede til fuld bredde banner skal være meget bredere, og hendes tema var indstillet til at gentage sådan et billede. Med et kedeligt resultat.
En af de store udfordringer på hjemmesider er billedstørrelser – altså størrelsen på de billeder, som er på hjemmesiden. Jeg er ofte ude for, at folk har problemer med lige at få billederne redigeret inden de ryger over i WordPress mediebiblioteket. Med det resultat, at hjemmesiden efterhånden (ret hurtigt) bliver tung at indlæse.
Billed upload direkte fra kamera eller telefon er et NO GO!
Du kan vinde rigtig meget SEO goodwill og få glade brugere ved at redigere dine billeder, før du uploader dem til dit websted.
Gratis online billedredigering
Du kan f.eks. bruge en gratis online service som www.canva.com eller www.pixlr.com.
Bredden på en hjemmeside er maks. 1200 pixels, og de fleste indholdsområder (sider, widgets osv) er mindre, sider er ofte cirka 750 pixels og widgets omkring 320 pixels i bredden, så du kan nedskalere dine billeder, så de passer til hjemmesiden. Tjek dit tema eller spørg din webdesigner hvis du er i tvivl om billedstørrelser til dit tema.
Fuld bredde header eller banner
Hvis du har et tema med et banner i fuld bredde skal du gøre dem 1920 pixel brede og mellem 400 og 650 pixel høje afhængigt af dit tema / design.
Du skal muligvis beskære dine header billeder, så de passer, da billeder lige ud af kameraet har et andet forhold, som 4: 3.
Det betaler sig virkelig at gøre det til en vane at ændre størrelsen på dine billeder, især hvis du har en blog. Bedre SEO, bedre brugeroplevelse, bedre læsningstid, forhindring af en tung hjemmeside ……
Enden på historien om billedstørrelser på banner
Hvad der skete med hjemmeside ejeren med banner udfordringer? Jeg tryllede lidt med hendes billede, så det kom til at passe – og det tog under 10 minutter 😉
Om billedstørrelser på wordpress
Dit indlæg på bloggen er jo efter hånden ret gammel, men temaet er jo stadigvæk temmelig relevant. Jeg skal tilstå at jeg forstår ikke helt problematikken med pixel og størrelse.
Jeg har købt en wordpress template/webside som indeholder nogle demo sider som kan anvendes med egne tilrettelser. Der er også omkring 50 billeder, uden indhold som angiver billedstørrelser på de enkelte demosider og det er her at kæden hopper af. fx er der angivet en billedstørrelse for en forsideslide på 3840×2000, i en anden demoside står der 1180x 410, eller 1580×1060 osv. Mange forskellige billedformater.
Hvad er det for format der bliver angivet, er det pixel, eller beskæring? Når man går ind i et billeprogram står der ofte image size eller canvas size, og indtaster jeg nogle af ovenstående mål så bliver billederne formindsket, men bruger jeg fx 3840×2000 så bliver billedet helt forvrænget.
Jeg har prøvet at indsætte billeder fra kameraet på 5184×3456 og resultatet er faktisk bedre end når jeg forsøge at ramme de mål der er opgivet i demoen.
Er der noget jeg har totalt misforstået, du skriver at en fuld bredde på et tema er 1920 pixel, det hænger ikke sammen med demobilleder til forsiden der er 3840 pixel.
Ole
Siden jeg henviser til ligger på en subdomæne og er kun en sider jeg er i gang med at opbygge.
Hej Ole
Ja, indlægget er af ældre dato, men stadig relevant. Og velkommen til WordPress design verdenen, det er et STORT felt med mange biveje. De billedstørrelser, du nævner, er i pixels. Jeg er enig i, at de er temmelig store, og demobilleder på 3840 pixels er helt unødvendigt. WordPress temaer er meget, meget forskellige, og det kan være svært lige at afgøre årsagen til, at de har valgt denne størrelse. Jeg vil ikke råde dig til at uploade billeder direkte fra kameraet, det giver en alt for stor download tid for dem, som besøger din side. Det med fuld bredde på 1920/1980 pixels gælder stadig. Jeg kan desværre ikke blive mere konkret ift hvad du så kan gøre, da det vil kræve et nærmere kendskab til lige netop det tema, du arbejder i. God fornøjelse med det.
Hilsen Joyann