10/06-15   -   Blog

iOS9 split view's indflydelse på responsive design

iOS9 nye split view skaber flere udfordringer i forbindelse med udviklingen af hjemmesider, som skal være responsive. Det er nu ikke længere nok at have faste breakpoints, hvor hjemmesiden ser pæn ud, og så være ligeglad med de mellemliggende skærm bredder.

I går startede Apples WWDC 2015, og traditionen tro bød keynoten på en demo af næste version af iOS (styresystemet på iPad og iPhones), som forventes at blive lanceret i september måned.

En af de nye features i iOS9 var introduktionen af multitasking til iPhone og iPad. Med iOS9 bliver det muligt at afvikle 2 applikationer samtidig i samme skærmbillede, i et såkaldt "split view". Det vil sige, at du eksempelvis kan have Safari browseren i venstre side af skærmen og Mail applikationen i højre side af skærmen. De 2 vinduer kan justeres i bredden, og du kan på den måde ændre browserens bredde, ligesom du kan på en desktop computer.

Det skaber flere nye udfordringer i forbindelse med udviklingen af hjemmesider, som skal være responsive. Det er nu ikke længere nok at have faste breakpoints, hvor hjemmesiden ser pæn ud, og så være ligeglad med de mellemliggende skærm bredder.

Når vi udvikler en responsiv hjemmeside gør vi brug af skærmens bredde kombineret med skærmens orientering (om iPad/iPhone er portræt eller landskab) til at afgøre, hvordan hjemmesiden skal layoutes.

Med split view er det muligt at gøre browserens bredde smallere end browserens højde selv om den er i landscape mode (med andre ord vil browseren vises i portræt selvom iPad'en er i landskabsvisning). Det betyder, at du fremadrettet skal være mere forsigtig med at bruge skærmens orientering til at afgøre, hvilket layout der skal vises.
Adapt.dk på iPad i split view

I Adapt har vi altid forsøgt at gøre vores responsive layout procentuelt. Det betyder, at elementerne på siden skaleres procentuelt når vinduets bredde ændres. Det er ikke alle hjemmesider, der lavet til at vise mobil layout, hvis de skaleres ned til mobil bredde. Derfor vil der i nogle tilfælde være behov for at få testet din hjemmeside inden iOS9 bliver lanceret.

Irma.dk på iPhone og iPad i split view

iOS9 kan, på grund af split view, skabe problemer, hvis browserens useragent eller orientation benyttes, da de ikke længere er udtryk for browser vinduets størrelse eller størrelsesforhold. Useragent er informationer, som browseren sender til webserveren om, hvilket OS og hardware hjemmesiden bliver afviklet på.

Et eksempel på en hjemmeside, som ikke er optimeret til split view i iOS9 er irma.dk. Selvom hjemmesiden er optimeret til mobil visning, bliver hjemmesiden vist i desktop versionen på iPad i split view, selvom vinduets størrelse svarer til størrelsen på en mobil. Det er ikke optimalt, da hjemmesiden hermed ikke bliver vist som tiltænkt.

Hvilken betydning har iOS9 for dig

iOS9 kommer til at have stor betydning for responsive layout, og gør det i endnu højere grad vigtigere at tænke i skalerbart design når der udvikles nye hjemmesider. Derfor skal skalerbarhed tænkes ind i fra opstarten af et projekt.

Hvis du har spørgsmål til iOS9, responsove design eller lignende, så tøv ikke med at kontakte os. Vi står gerne til rådighed med råd og vejledning.

Relevant information

Direkte link til blogindlæg
https://www.adapt.dk/aktuelt/blog/ios9-split-views-indflydelse-paa-responsive-design

Apple WWDC 2015
http://www.apple.com/live/2015-june-event/