Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Responsive design med mobile detect - ett grönt och ekonomiskt alternativ? | jimiwikman.se

    Responsive design med mobile detect - ett grönt och ekonomiskt alternativ?

    Posted , 110 views, 0 comments

    Responsive design är glödhett just nu och inom e-handel så bubblar det av aktivitet, men responsive design har en stor nackdel när det gäller hur innehåll ska hanteras mellan fullskärm och mobil eftersom det ofta kräver att delar måste döljas, vilket kostar oerhörda summor och påverkar miljön negativt. Lösningen kan vara Mobile detect.

     

    Responsive design är ett intressant uppsving på designmarknaden och det är som sagt glödhett just nu. Alla och hans moster ska ha en responsive design och av någon anledning så har en del fått för sig att om vi bara kan göra en design responsiv så är problemet med olika medier lösta. Tyvärr så fuskar många med responsiv design och döljer information för mobilanvändarna eftersom fullskärmsdesignen annars skulle se väldigt tom ut.

     

    Några är mer kreativa och trycker ihop och stoppar undan informationen i olika system med tabbar och accordions, men för det mesta så skjuter man helt enkelt det överflödiga ut från designen så det inte stör mobilanvändaren.

     

    Problemet med att jobba på det viset är att mobilanvändaren på så sätt laddar ner mer information än vad som är nödvändigt, något som kostar stora summor och som påverkar miljön. Utan att gå in för mycket på matten bakom kan man säga att om bara 1% av den trafik vi laddar ner på en mobil är onödigt så pratar vi ett antal extra kärnreaktorer och många, många miljarder, helt i onödan.

     

    Om vi ska använda responsiv design så är det därför viktigt att göra det på rätt sätt. Lösningen kan inte vara att bunta ihop och dölja saker som användarna ändå laddar ner eller använda fullstor grafik som sedan skalas procentuellt eller omvandlas dynamiskt. Det är lika dumt som att pappersindustrin skulle använda ett A2 ark för att trycka en A4 produkt. Ingen skulle säga att den typen av pappersspill skulle vara acceptabel, varken ekonomiskt eller miljömässigt.

     

    Ett alternativ om man inte vill jobba med separata produkter för mobilt och fullskärm är att utnyttja mobil detect direkt i källkoden och på så sätt både få den dynamiska effekten från responsiv CSS och separat content för olika medier. Genom mobile detect kan vi alltså anpassa vad som visas, hur det visas och för vilken typ av enhet det ska visas.

     

    Mobile detect fungerar som så att den känner av vilken typ av enhet som besöker sidan och utifrån det så kan vi påverka vad som visas genom att i källkoden lägga villkor på samma sätt som media query gör för CSS. Teoretiskt kan vi även använda javascript för att se vilken storlek besökarens webbläsare har och utifrån det optimera ytterligare, även om det kanske är lite överkurs och media queries bör räcka.

     

    Med mobile detect kan vi alltså styra vilket innehåll som ska presenteras till vilken enhet och vi kan skapa unikt innehåll som är speciellt anpassat för specifika enheter. Därmed slipper användaren ladda ner innehåll som är onödigt och vi kan skapa betydligt bättre, och mer fokuserade, upplevelser på samtliga enheter än vad vi kan med bara responsive design.

    User Feedback

    Recommended Comments

    There are no comments to display.



    Guest
    Add a comment...

    ×   Pasted as rich text.   Paste as plain text instead

      Only 75 emoji are allowed.

    ×   Your link has been automatically embedded.   Display as a link instead

    ×   Your previous content has been restored.   Clear editor

    ×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...