Kjapp og trygg hosting for Wordpress

Reponsive VS adaptive webdesign

For mobilvennlige nettsider, hvilken løsning foretrekker du?

  • Reponsive

    Stemmer: 17 85,0%
  • Adaptive

    Stemmer: 3 15,0%

  • Totalt antall stemmer
    20

kongen

kongemedlem
Responsivt webdesign er dødt pga mobilene har fått like bra oppløsning på skjermene som vanlige datamaskiner. Man må generere sider etter skjermens størrelse i tommer.
 

kongen

kongemedlem
Siste iPhone har skjermoppløsning på 750 x 1334 (4,7") / 1080 x 1920 (5,5")

Siste Samsung (s5) har skjermoppløsning på 1080 x 1920 (5,1")

Dette er veien de største produsentene går, skjermer med god oppløsning. De andre produsentene kommer også etter med sine fremtidige lanseringer. Og mobiler byttes raskt ut slik at om et par år har alle god skjermoppløsning på mobilen sin.

Vil ikke desktop-versjonen av websiden bli vist på en slik mobilskjerm hvis man bruker media queries, da oppløsningen på skjermen er så stor? Må ikke brukeren zoome for å kunne lese den lille skriften på den lille skjermen?

Er det ikke bedre å detektere først om enheten er en mobil, nettbrett eller pc, så generere nettstedet basert på den fysiske skjermstørrelsen?
 

zapotek

Medlem
Jepp, og et poenget er jo at skjermene har blitt så store og har så høy oppløsning at det egentlig er null problem å lese vanlige desktopversjoner av nettsider på disse.

Fra et brukerperspektiv har jeg ingen problemer med å besøke nettsider som kun er optimalisert for desktop (på noen siden foretrekker jeg det faktisk da enkelte mobilsider er fantastisk klønete laget, enkelte norske aviser er f.eks. umulig å lese i mobilmodus på min noen år gamle smarttelefon). Fylle ut felter og betaling med kort er ikke superoptimalt på desktopversjon, men siden jeg aldri kjøper noe via mobilen likevel er ikke det et problem for meg personlig.

Nå som Google i lengre tid har begynt å teste ut disse "mobile friendly"-merkelappene i serps (er vel ikke lenge før dette rulles ut i Norge heller), blir dog valget sett fra et webmasterperspektiv enkelt... Det er ikke så enkelt å spå nøyaktig hva Google tenker, men at det også kommer til å påvirke ranking er ikke usannsynlig (de har også gitt signaler om dette).
 

Ole Avranden

utvandret
Det er ikke så enkelt å spå nøyaktig hva Google tenker, men at det også kommer til å påvirke ranking er ikke usannsynlig (de har også gitt signaler om dette).

Siste nytt fra "SEO og Hør" er at algoritmene for mobilvennlige nettsteder testes ut nå og rulles ut ganske snart. 50% +/- av trafikken står med andre ord i fare for de nettstedene som er mobiluvennlige.
Irriterende for et marked som det norske, hvor det er som @zapotek sier: majoriteten av brukerne har mobiltelefoner hvor det ikke spiller så stor rolle om designet er laget responsivt eller ikke.

Men siden resten av verden ikke er like oppdaterte på mobilfronten, er det likegyldig hva 5 millioner nordmenn driver med.
 

TorsteinO

Art Director & grunder
Vil ikke desktop-versjonen av websiden bli vist på en slik mobilskjerm hvis man bruker media queries, da oppløsningen på skjermen er så stor?
Det har vært en løsning på dette lenge, mener apple introduserte det med iPhone4(?) - se f.ex. http://stackoverflow.com/questions/8785643/what-exactly-is-device-pixel-ratio ;)

In the world of web development, the device pixel ratio (also called CSS Pixel Ratio) is what determines how a device's screen resolution is interpreted by the CSS.

CSS interprets a device's resolution by the formula: device_resolution/css_pixel_ratio. For example:

Samsung Galaxy S III

  • Actual resolution: 720 x 1280
  • CSS Pixel Ratio: 2
  • Interpreted resolution: (720/2) x (1280/2) = 360 x 640
When viewing a web page, the CSS will think the device has a 360x640 resolution screen and Media Queries will respond as if the screen is 360x640. But the rendered elements on the screen will be twice as sharp as an actual 360x640 screen.

Some other examples:

Samsung Galaxy S4

  • Actual Resolution: 1080 x 1920
  • CSS Pixel Ratio: 3
  • Interpreted Resolution: (1080/3) x (1920/3) = 360 x 640
iPhone 5s

  • Actual Resolution: 640 x 1136
  • CSS Pixel Ratio: 2
  • Interpreted Resolution: (640/2) x (1136/2) = 320 x 568
The reason that CSS pixel ratio was created is because as phones screens get higher resolutions, if every device still had a CSS pixel ratio of 1 then webpages would render too small to see. A typical full screen desktop monitor is a 24" monitor at 1920x1080. Imagine if that monitor was shrunk down to < 5" but had the same resolution. Viewing things on the screen would be impossible because they would be so small.

Here is a tool that also tells you your current device's pixel density:

http://bjango.com/articles/min-device-pixel-ratio/
....

I praksis trenger man ikke å tenke så veldig på det, bare bruk "standard" bredder, se f.ex. http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
 

zapotek

Medlem
Kan noen forklare forskjellen på responsive og adaptive sånn enkelt og greit?

På en responsive side tilpasser elementene på siden seg etter skjermstørrelsen.
På en apaptive side (også kalt "server side-løsning"), sjekker serveren skjermstørrelsen/hvilken enhet brukeren har, og server deretter en annen versjon av siden tilpasset enheten.

Altså en responsive side viser samme design (skalerbart sådann) uansett skjermstørrelse, mens en adaptive side har flere ulike design som brukes alt etter skjermstørrelse (minst to versjoner, en for mobil og en for desktop).
 

hansson

Langveisfarende
Har prøvd med både responsivt og adaptive, og det ble bare tull med det adaptive. Det ble som å styre med egne mobilversjoner, selv om innholdet i praksis var det samme (bare at det skulle presenteres på ulike steder alt ettersom...). Responsivt fungerer helt fint på alle typer nyere utstyr, enn så lenge.
 
Topp