Mobile First är en intressant trend inom webbens utveckling. Snabbt förklarat innebär det att man utgår från att webbplatsen användas på en mobil.

Jag tror att det är en bra tanke att ha med i bakhuvudet, när du funderar på vad som är viktigt för din webbplats, under de kommande året.

Under de senaste veckorna har jag läst Luke Wroblewskis bok Mobile First på ämnet. En intressant bok, med bra reflektioner och guider kring ämnet. Om du gillar mina snabba reflektioner i detta inlägget, rekommenderar jag att du köper boken. Bonus: Video: Mobile First – Luke Wroblewski

Varför Mobile First?

Luke Wroblewski:

Here´s the elevator pitch. designing for mobile first not only prepares you for the explosive growth, and new opportunitites on the mobile internet, it forces you to focus and enables you to innovate in ways you previously couldn’t.

Den sista biten av hans “hiss-pitch” tycker jag är riktigt intressant. Mobile First handlar för mig om fokus.

Fokusera på det som är viktigt

En mindre skärmyta, som man dessutom måste trycka med sina fingrar på. Detta leder direkt till att man måste prioritera vad som ska synas. Det går inte att få in hur mycket som helst på en liten skärm, utan att det blir plottrigt. Det leder till ett fokus. Ett fokus, där design blir allt mer viktigt, för att framhäva innehållet.

Webbplatser handlar om innehåll. Om design är hur saker fungerar, så är det som vi vill ta del av på en webbplats, innehåll. Antingen vill vi skapa innehåll, eller så vill vi ta del av det.

Om det är texter, ljud eller video har betydelse för hur designen ska se ut. Om du har en stor skärm eller en liten skärm, har betydelse. Om du har en snabb uppkoppling eller inte, har betydelse.

Om du vill att dina kunder ska ringa dig, se till att numret syns tydligt. Om du vill att folk läsa dina texter, se till att det är bekvämt att läsa. Om du vill att folk ska lyssna på din musik, se till att de kan lyssna överallt.

När innehåll är viktigt, blir webbplatser bättre. Fokusera på det som är viktigt.

Några tänkvärda ord

Brian Fling:

Create a product, don’t reimagine one for small screens. Great mobile products are created, never ported. – Brian Fling

Att använda en produkt med mus, touchpad eller pekfingret är totalt skilda upplevelser. Skapa upplevelser som bygger på de förutsättningar som finns, och använd dessa till din fördel. Då blir webben roligare och bättre.

Responsive Web Design + Mobile First

Mobile First används med fördel tillsammans med Responsive Web Design. Jag skrev för ett tag sen om Responsive Web Design + Mobile First. Men kort sagt: Bygg en webbplats för små skärmar, skala sedan upp den till större skärmar.

Och du, glöm inte.

När innehåll är viktigt, blir webbplatser bättre. Fokusera på det som är viktigt.

Ibland behöver man rätta till ett problem på en webbplats. Då är det bra med verktyg som underlättar. Enkelt, innovativt och snyggt.

Att SVT väljer att jobba med Responsive Web Design mer och mer, får mig att älska Public Service. Att de dessutom har ett tydligt koncept med vad de vill uppnå med sina webbplatser, känns väldigt lovande. (via Marco)

Dan Cederholm:

Collect, test, and experiment with interface pattern pairings of CSS & HTML. Pears is an open source WordPress theme, enabling people like you to get your own pattern library up and running quickly.

Brilliant.

Mina möjligheter att åka på häftiga webbkonferenser, där mina superhjältar pratar är minimala just nu. Jag har inte råd, så enkelt är det.

Istället ser jag det som en morot, att en dag få åka. Tills dess kan jag ta del av allting genom att läsa källkod på deras webbplatser, anteckningar och blogginlägg. Allt oftare, släpps dessutom föreläsningarna som videoklipp, senaste klippen jag såg var från Build Conference.

Luke Wroblewski bloggar sina anteckningar från An Event Apart, Atlanta.

Ethan Marcotte: Rolling Up Our Responsive Sleeves

On a daily basis Web designers are asked to deal with an increasing number of diverse devices. Mobile & tablet don’t even begin to describe the situation. People are using multiple devices throughout the day. These devices are interconnected and used together.

Jeffery Zeldman: Content First

Designers are advocates for the user. We’re customer service representatives for our organizations. Everyone impacts user experience, which means everyone is responsible to customers.

Cindy Li: Inclusive Design

Touch devices need large targets for fingers. Test your designs in context on actual devices

Dan Cederholm: Handcrafted Patterns

There’s a common progression to learning anything creative: imitation, repetition, and finally innovation. Imitation: by doing what others have done. Repetition: learning and repeating patterns. At a certain point, muscle memory kicks in and you can use patterns without thinking. Innovation: apply your own creativity to the things you’ve learned. This adds your own style to things. Web design is no different. Ee learn by imitating, repeating, and then finding our own style.

Eric Meyer: The Future of CSS

Border-radius and Web-fonts can also be used now.

Om du vill läsa ännu mer från An Event Apart, har Luke Wroblewski ett arkiv under taggen #aneventapart på sin blogg.

<a> taggen är förmodligen en av de viktigaste delarna av HTML. Utan denna tagg, skulle vi inte kunna länka ihop sidor, vi skulle sitta här med massa enskilda sidor kors och tvärs. <a> taggen är spindeln, i och på nätet.

(more…)

David Paulsson har skrivit ihop ett gäng riktigt bra inlägg med länkar till spännande resurser för dig som gillar att jobba med webben.

Webbens bästa del 1, del 2, del 3 och del 4