[Løst] Nettside vidhet

[maxvons]

Hei, jeg holder på å designe en nettside for faren min. Vidheten til siden akkurat nå er 1280px. Er dette for vidt? Burde jeg heller bruke 960px eller 1024px? Jeg vet det finnes responsive layouts osv, men jeg vet ikke hvordan man bruker sånt enda, dersom dette er min første nettside. Hvis jeg skulle hatt en fast vidhet, burde jeg da ta 1280px, 960px/980px eller 1024px?

[MikkelRev]

Jo lavere, jo tryggere. Lavere enn 960px er ikke nødvendig da 99% har en oppløsning på 1024*768 eller høyere. Kilde: http://www.w3schools.com/browsers/browsers_display.asp

 

Selv om skjermen er 1024px bør nettsiden være litt mindre så du har noe å gå på til scrollbars og evt. andre ting. 960px er ganske vanlig, tror rammeverk som Blueprint, 960gs og flere andre er basert på 960px. Uansett om du skulle velge 960px eller noe annet nå, så er det en enkel sak å endre bredden senere.

[maxvons]

Tror jeg går med 1280px, siden jeg vil ha noe som ikke ser helt blåst ut på iMac 27'' skjermen min, men samtidig funker greit for de med lavere oppløsning Satser på at de fleste har minst 1366 x 768, da blir siden mer eller mindre fullskjerm for de Faren min vil ikke ha flere kunder uansett, så om jeg mister trafikk eller noe pga. det, så bryr ikke han seg.

Endret 25. mai 2013 av maxvons

[etse]

Litt sidespørsmål, som kan være relevant: Men er dynamisk bredde på sider litt dødd ut? Personlig er jeg ikke noe glad i at det er store tomrom på sidene av websiden - noe det ofte er hvis jeg surfer med 27". I tillegg har jeg problemer med enkelte sider som rett og slett er for vide og ikke klarer å justere ned bredden sin når jeg surfer på skjermen som står på høykant. Dette er ting som lett kunne vært løst med å ha litt dynamisk layout.

 

Så er dette noe som egentlig har dødd ut?

[xRun]

Det er antagelig en del som bruker dynamisk bredde angitt i max width, slik at de f.eks. blir max 1024px bred når browseren er bred nok, og blir smalere hvis man gjør browseren smalere. En fordel er at hele sidens bredde vises også på smalere skjermer. En ulempe er at når bredden endrer seg blir teksten vanligvis forskjøvet. Dermed blir poster eller artikler høyere når de går over flere linjer. Dette kan igjen skape ubalanse mellom høyden på innholdet i hovedfeltet og høyden på innhold i sidebars for de som evt. er opptatt av det. I tillegg har du det at siden vil vises forskjellig hos forskjellige brukere.

Jeg tenker jeg ville anbefalt en fast bredde på enten 960 eller 1024px.

Endret 25. mai 2013 av xRun

[Wattengård]

Og vips så var man inne på responsivt design. Hvis man skal kjøre med max-width så må man også lage resten av siden slik at den funker på smalere skjermer. Den enkleste måten å gjøre dette på er å bruke et par-tre bruddpunkt vha mediaqueries.

http://webdesignerwall.com/tutorials/css3-media-queries

[Bolson]

Tror jeg går med 1280px, siden jeg vil ha noe som ikke ser helt blåst ut på iMac 27'' skjermen min, men samtidig funker greit for de med lavere oppløsning Satser på at de fleste har minst 1366 x 768, da blir siden mer eller mindre fullskjerm for de Faren min vil ikke ha flere kunder uansett, så om jeg mister trafikk eller noe pga. det, så bryr ikke han seg.

 

Nå bruker jeg 27'' skjerm med 2560 x 1440 oppløsning til vanlig. Design med 960px ser aldri blåst ut - fordi man fint kan justere vindusstørrelse på nettlesere - det gjelder uansett skjerm. Men det er klart at lar man alt være i fullskjerm - som noen gjør - ja da ser ting blåst ut. Men da er det i realiteten man selv som er problemet.

 

Noe som er viktig når man lager nettsider - like viktig som sidebredde - er linjelengde. Denne artikkelen - "Readability: The Optimal Line Length" forklarer dette mer inngående. Akkurat dette kan bety at man ved gitte design faktisk velge mindre sidebredde enn 960px. Nå viser forskning at ved lesing på skjerm kan den mest effektive lengden ligge noen høyere - trolig opp mot 95 tegn og ikke 75 som regelen er for papir. Men prinsippet gjelder uansett.

 

1280px er uansett for bredt etter min mening - ved responsive design går man kanskje opp til max-width på 1100px. Poenget er at i dag skal man også ta hensyn til iPad (1024 x 768 piksler), Android nettbrett (1200 x 800) og at folk kan ha skjermen i portrettmodus.

 

 

Litt sidespørsmål, som kan være relevant: Men er dynamisk bredde på sider litt dødd ut? Personlig er jeg ikke noe glad i at det er store tomrom på sidene av websiden - noe det ofte er hvis jeg surfer med 27". I tillegg har jeg problemer med enkelte sider som rett og slett er for vide og ikke klarer å justere ned bredden sin når jeg surfer på skjermen som står på høykant. Dette er ting som lett kunne vært løst med å ha litt dynamisk layout.

 

Så er dette noe som egentlig har dødd ut?

 

Svaret på spørsmålet ditt er egentlig ja - og grunnene er flere.

• Når man skal lage nettsider der det visuelle uttrykket ble en viktig del - altså mer avansert design ble faktisk dynamisk sidebredde umulig å håndtere. Såkalt "pixel perfect" nettsider ble det man skulle ha - og da var fast sidebredde helt nødvendig.
  
• Lesbarhet - sider med dynamisk bredde fikk altfor lange linjer - særlig nå 16:9 skjermer kom på markedet. Se ellers hva jeg har skrevet litt lengre opp og artikkelen jeg linker til
  
• Økt bruk av bilder og mer gjennomført plassering medførte også et problem - bildene kom fort ut av proporsjon når man hadde dynamisk sidebredde.
  
• Egenskapene til nettleserene var heller ikke egnet til å håndtere slike design på en veldig god måte. Dog har det endret seg med CSS3 og media-queries.
  

Personlig har jeg ikke brukt dynamisk bredde på 15 år - og jeg har kodet noen sider i de årene.

 

Og når du har store tomrom på en 27'' skjerm - ja da bør du også stille deg spørsmålet om du bruker skjermen på den beste måten for effektivt arbeid - arbeidsflyt.

 

Personlig er jeg glad for at man i liten grad bruker dynamisk design - nettleseren min er standard skalert på skjermen til å være ca 1150px bred - det gjelder uansett om jeg sitter på 2560 x 1440, 1920 x 1200 eller mindre skjerm.

 

Responsivt design, som ChristianW nevner, er egentlig ikke dynamisk bredde. Det er egentlig en måte å lage nettsider på som tilfredstiller ulike skjermoppløsninger, men allikevel klarer å håndtere kravene til linjelengde og opprettholder grunnreglene i designet. Som oftes er responsivt design rettet mot 3 ulike typer innretninger (oppløsninger). Vanlige skjermer og nettbrett i liggende posisjon (landskap). Rammene her bruker å være fra 820 - 1100px sidebredde (max-width: 1100px). Nettbrett i portrettmodus, 560 - 810px og mobiltelefoner, under 560px. Når det gjelder nettlesere i mobiltelefoner så bruker de jevnt over skalering (scale) - slik at de selv om skjermen er 1920 x 1080 så respondere de som om siden f.eks bare er 540px.

 

Responsiv design er egentlig et omfattende evne - ikke minst fordi det er så mange enheter å ta hensyn til.

[oyoygard]

"Vidhet" - kødder du??

Hvis faren din ikke ønsker kunder så må jo sider designet for en 27" iMac være midt i blinken..

Hvordan ser denne siden ut på frukttelefonen din??

[maxvons]

"Vidhet" - kødder du??

Hvis faren din ikke ønsker kunder så må jo sider designet for en 27" iMac være midt i blinken..

Hvordan ser denne siden ut på frukttelefonen din??

 

Ro deg ned. Vet ikke hva du mener med den første linjen, men ja. Skal designe siden 1024px bred istedenfor. Med "frukttelefon" tenker jeg du mener iPhone? Dette er første gang jeg designer en nettside, skal selvfølgelig endre på den i fremtiden når jeg har lært mer. Men nå i starten blir det 1024px fast bredde.

[oyoygard]

Jeg mente vel at hvis du klarer å lage en side som ser bra ut både på en 27" skjerm OG en mobil enhet, gjerne iPhone, med liten skjerm og oppløsning så har du en bra side!

Skjekk hvordan siden din ser ut fra litt forskjellig utstyr (nettleser og oppløsning på skjerm, til en viss grad OS) og ikke design ut hva akkurat det du sitter på selv.

 

"Bredde" var et mye bedre ord enn "vidhet"

[maxvons]

Prøver å designe sånn at den ser grei ut på både min egen iMac og den bærbare pcen min, som har en oppløsning på 1440x900. Kan hende jeg lager en mobilside eller noe lignende i femtiden, men det er ikke så viktig for meg eller faren min akkurat nå. Han vil bare ha en helt vanlig nettside. Han er fullbooket og ønsker ikke flere kunder, så det er ikke viktig om jeg mister kunder eller noe fordi noen sitter på en urgammel PC el. som ikke har høyere oppløsning enn 1024px. Tror du 1024px er en bra bredde isåfall?

Endret 26. mai 2013 av maxvons

[Froydiso]

.

Endret 31. januar 2016 av Froydiso

[maxvons]

Så de fleste har over 1024px? Tror jeg setter 1024px som bredde da. Utviklingen i bredde vil jo bare gå oppover, så 1024px virker rimelig for nå. Takk for hjelpen

[MikkelRev]

Så de fleste har over 1024px? Tror jeg setter 1024px som bredde da. Utviklingen i bredde vil jo bare gå oppover, så 1024px virker rimelig for nå. Takk for hjelpen

Så du leste med andre ord ikke trådens første svar?

Bruker du 1024px bredde, så kommer ganske mange til å få horisontal scrolling.

[maxvons]

Får vel bruke 980ox da? Eller skal jeg heller kjøre 960px?

[Wattengård]

Hvorfor ikke bare ta utgangspunkt i et gridsystem og ta det derifra?

Selv har jeg mange gode erfaringer med gridsystemet i Twitter Bootstrap.

 

Evt kan du jo bare gjøre det enkelt.

[MikkelRev]

Får vel bruke 980ox da? Eller skal jeg heller kjøre 960px?

Var ikke det jeg mente. Les hele posten, og ikke bare tallet 960

[Egron91]

-slettet-

Endret 30. mai 2013 av Egron91

[maxvons]

Var ikke det jeg mente. Les hele posten, og ikke bare tallet 960

 

Skjønner, men tror jeg går med 980px, virker som mange andre kjente nettsider bruker noe lignende.

[MikkelRev]

Vil du ha en helt enkelt side, som fungerer på store og små skjermer med forskjellig oppløsning, kan du bruke "table" funksjonen ved å bruke % isteden for px. Dette er ikke noe å anbefale, men det er en god start. Når du har lest deg litt opp på bruk av "div" funksjoner, kan du jo gå over til det senere.

 

f.eks:

html: <table width="95%">

eller ved bruk av CSS: table { width: 95%; }

Ikke les dette innlegget!.