När fler och fler människor börjar surfa på sina mobila enheter blir det viktigt för oss - webbansvariga - att se till att våra webbplatser gör det bra i mobilens webbläsare. Responsiv webbdesign är förmodligen vägen att gå, men det kräver fortfarande mycket testning för att se till att det passar bra i alla enheter och skärmstorlek. Det är nästan omöjligt att få tag på alla mobila enheter i världen, men med ett smutsigt verktyg i Google Chromes utvecklingsverktyg kan du enkelt testa din webbplats i en stor lista över mobila enheter (utan att spendera ett enda dime).

"Enhetsläge" -emuleringen i Chrome Developer Tool är ett användbart verktyg för att du ska testa din webbplats på flera mobila enheter. Som namnet antyder, emulerar det webbläsaren i olika enheter så att du kan se hur din webbplats görs i varje webbläsare.

För att komma igång, öppna Chrome och ladda webbplatsen du vill testa. Tryck på F12 ("Cmd + Opt + I" för Mac OS X) för att öppna utvecklarverktyget. Alternativt kan du högerklicka på musen och välja "Inspektera element".

I fönstret Utvecklarverktyg klickar du på mobilikonen längst upp till vänster.

Byt tillbaka till huvudkromfönstret och du bör se webbplatsen ändrad till ett rutnätsläge.

Nu behöver du bara välja den mobila enheten i rullgardinsmenyn "Enhet". Webbplatsen kommer automatiskt att ändra storlek för att matcha enhetens skärmstorlek.

Bläddra igenom enhetslistan, du kan hitta några av de populära enheterna som iPhone 3GS, 4, 5, 6, 6 Plus, Samsung Galaxy Note, etc.

Andra saker som du kan testa i enhetsläget inkluderar att ändra skärmupplösningen, ställa in pixelförhållandet, ändra webbläsarens användaragent etc.

För att avsluta "enhetsläge", gå helt enkelt tillbaka till utvecklarverktygsfönstret och klicka på ikonen för mobil igen, eller stäng bara verktyget för utvecklarverktyg.

Slutsats

Utvecklarverktyget i Google Chrome är ett mycket kraftfullt och användbart verktyg för webbansvariga och utvecklare att testa och felsöka sina webbplatser. Det finns ett liknande verktyg i Firefox också (i själva verket har de flesta webbläsare ett utvecklingsverktygsläge), men det i Chrome levereras med fler funktioner och är lättare att använda.