Tip(z)

Jag läste en lite post om att infoga bilder i Google document. Jag visste inte att det fanns olika källor att hämta från. Även anrika tidningen LIFE fanns som bildkälla!

Det blev ett testdokument.

Hur många har uttryckt eller tänkt ungefär så här om de datortillämpningar man använder: “Jävla skitsystem!” Det har säkert de flesta av oss. Jonas Söderström har under lång tid sysslat med att dokumentera olika monumentala misstag när det gäller implementering av nya datorsystem. Inte bara det. Han försöker analysera och förbättra. Som en del av det arbetet har han skrivit en bok som har titeln “Jävla skitsystem“.

Läs boken och du får mängder med exempel på misslyckade system och frustrerade och förtvivlade användare. Vad sägs om en liten butik på landet som måste ha över 20 olika datasystem (som fungerar helt olika) för att fungera?

Eller att arbetsmiljöverket tvingas stoppa användningen av ett nytt system vid vårdcentraler, eftersom det blev en hälsorisk?

Eller en person som jobbar med två olika system, där ett visst kortkommando i det ena var nödvändigt för att få fram resultatet. I det andra programmet innebar samma kortkommando att man avslutade och stängde systemet – utan att spara det som skrivits in!

Exemplen radas upp i boken. Det är en fascinerande läsning i sig. Men utgångspunkten för honom är:

I mer än tio år har vi blivit lovade samma sak – gång på gång. Med det nya datasystemet ska jobbet bli enklare, snabbare, lättare. Men runt om i Sverige sitter nu människor och försöker förstå varför det just för dem hela tiden känns precis tvärt om.

Varför ökar bara stressen hela tiden? Varför tar det längre tid för mig att göra mitt jobb med det nya systemet?

Han konstaterar kort: “Det är inte användarnas fel.”

Hela boken är en genomgång av olika faktorer som lett till den här utvecklingen. Bland de åtta han listar hittar vi bland annat: för många system och för lite standard, stela system och central kontroll, högre tekniktempo och brist på utbildning.

Boken är en vidräkning vid personer som lyssnar oreflekterat till de tekniker som lovar att deras system kommer att effektivisera, och kunna ge mycket mer detaljerade underlag. Användarna har ofta inget att säga till om. Hela boken är en användarnas försvarsskrift.

Vad landar han då i? Han ger förslag på lösningar till de åtta olika problemen han ser. Mer övergripande betonar han att en av de största riskerna med många stora IT-projekt är att man fokuserar på funktioner. Man borde i stället se vilka effekter man vill uppnå. Vad är det önskade resultatet? Inte – hur många olika rapporter eller funktioner finns det.

Dessutom är det livsviktigt att få med användarna i processen.

Du kan få ett smakprov av hur Jonas tänker, eftersom han skapat en webbplats kring bokens tema, där han beskriver lite av det han gör och gärna tar emot exempel på dåliga system, som den här dialogrutan någon skickat in till honom (från Lotus notes). Begriper du den? Gör någon annan än den som skapat systemet det?

Låter det intressant? Läs boken. Den är väl värd tiden!

Läs gärna  historien om hovmästarns attityd till nya systemet på restaurangen. Underbar!

Paul Irish är välkänd för de som håller på med HTML5, CSS3 och Javascript. Han jobbar för Google, har arbetat några år med jQuery. Dessutom har han medverkat i projekt som  HTML5 Boilerplate, Modernizr, CSS3 Please och HTML5 please. Var och en av dessa resurser värd mycket mer än en bloggpost…

Vad jag däremot inte visste var att man kan få hans hemsida att se ut som på bilden ovan. När jag läster artikeln Gamification And UX på Smashingmagazine lärde jag mig nämligen ett nytt begrepp, Konami Code. Själv har jag inte alls ägnat mig åt datorspel (jag växte upp när höjden av teknik var det manuella Labyrint!!).

Konami code är en speciell sekvens av tangentkombinationer, närmare bestämt följande bild, som jag lånar från Wikipedia:

Piltangenterna betyder helt enkelt “pil upp”, “pil ner” och bokstavstangenter. Tryck ner dessa i denna följd på Paul Irish sajt och sedan Enter några gånger, och saker börjar hända på skärmen. Det kan komma att bli som på bilden ovan.

Du kan även testa den på geekandhype.com, som innehåller referenser jag antar hör till något spel.

Det kan vara lite svårt att få en översikt över vilka selektorer som finns tillgängliga i CSS3. Det har ju hänt en del på sistone.

Josh Vogt har gjort en mycket bra sammanställning.

Här kan man dels se alla selektorerna om man vill det. Det går att filtrera på “Basic and Attribute Selectors“, som han har delat i följande undergrupper: universal, type, attribute, class, id.

Pseudoklasser har han delat in så här: structural, dynamic, target, :lang(), UI element states och negation.

Pseudoelement och kombinatorer har också var sin sida.

Han har i stort följt strukturen i W3Cs rekommendationer i sitt upplägg.

Upplägget är gjort så att man mycket tydligt ser syntaxen för de olika selektorerna, med en kort förklaring. Klickar man på rubriken får man fram html- och css-kod. Det finns även en länk så man kan öppna koden på jsfiddle.net och själv ändra i den efter behag.

En mycket bra pedagogisk resurs!

När jag följde en länk om typografitips kom jag till en sida från 2006. (Det är länge sen!) Där fick jag se bilden ovan.

Först trodde jag inte mina ögon. Times New Roman – på det sättet! Det kändes faktiskt som ett helt annat typsnitt. Men med lite test på en h1 med följande kod

• font-variant:small-caps;
• font-weight:300;
• font-size:2.3em;
• letter-spacing:-1px;

kunde jag konstatera att man med enkla medel kan förvandla något vardagligt till… nästan en Askungesaga.

Tipsen var för övrigt följande:

• Begränsa dig inte i val av storlek
• Lek med letter-spacing
• Även line-heght och word-spacing
• Prova en gammal favorit i ny tappning (det var bilden ovan)

Tidningen FOTO kommer till vår skola. Jag är inte speciellt intresserad av teknik, så mycket går snabbt att bläddra förbi. Däremot brukar det ofta dyka upp en hel del intressanta bildskapare.

I senaste numret jag bläddrade fanns en presentation av en fotograf jag aldrig hört talas om tidigare, William Ropp.

Jag blev fascinerad av hans tämligen tunna färgbilder. Han har mejslat fram en mycket speciell stil. Ett exempel ser ni på bilden här. Vill ni se fler gå till hans sida, där det finns fler porträtt.

(Plus en fruktansvärt irriterande flashnavigering. Sådana borde vara skottpengar på anser jag!)

Typografi är en gammal “vetenskap”. Man kan närma sig den på många sätt.

Jag hittade en webbplats som strukturerat upp teckensnitt i ett periodiskt system.

En rolig idé som du kan kika på hos squidspot.com.

Vi sköljs över av data. Mängder av data. Ännu mer data.

Hur gör man för att synas? För att andra ska lägga märke till och, framför allt, komma ihåg det man visar?

Här kommer det engelska begreppet infographics in. Jag vet inte vad korrekt svensk terminologi är, men jag fascineras över kreativa lösningar på  informationsutmaningar.

The Value of Data Visualization är en utmärkt kort liten film, som illustrerar vad det handlar om.

Ytterligare ett par tips om sajter som visar inphografics:

• submitinfographics.com
• coolinfographics.com

Vilket typsnitt är det som faktiskt används på min sida?

När man kikar i CSS listas ju ofta en radda med typsnitt, men vilken används?

Fount vill lösa just det problemet. Man har skapat en s.k. bookmarklet. Dra en liten knapp till bokmärkesraden. När du sen är inne på sidan klickar du på bokmärket, och det dyker upp en liten ruta där man i klartext får besked om vilket typsnitt och vilken storlek det är man klickat på.

På Founts egen sidan kan man få se följande:

Smidigt!

Detta är faktiskt en nyskapande introduktion till HTML och CSS! Jag kunde inte slita mig, utan bläddrade rakt igenom boken direkt när jag fick den.

Man har valt ett helt nytt upplägg. Fokuserat mycket mer på att göra en attraktiv och pedagogisk layout än någon bok jag varit i närheten av. Det känns helt enkelt nytt.

Vill du få en känsla av hur boken ser ut på insidan – och det vill du! – bege dig till bokens hemsida. Du kan även bläddra igenom ett provkapitel.

Innehållet då? Jo, man har med både HTML5- och CSS3-material. Men framför allt presenterar man ämnena på ett fräscht sätt. Det är nästan omöjligt att missa uppbyggnaden av en html-tagg. Man drar nämligen på med ett helt uppslag för en enda tagg, med svart bakgrundstext och tydliga förklaringar. Det funkar väldigt bra!

Boken har även resonemang om olika layoutmodeller. Fast och flytande layout diskuteras. (Tyvärr finns inte responsive design med. Den här kom ut förra året, och med produktionstiden för en bok, kan jag förstå om det kändes lite nytt.)

Det finns ett avsnitt om “grid” (kolumner) där man introducerar 960.gs, man talar även om att använda flera stilmallar. En genomgång av nya html5-elementen för layout diskuteras också.

Mot slutet ges snabbkurser i hur man “tänker användare och målgrupp”, gör enkla persona, sajtkarta, wireframe och lite om design och designelement. Man har även med några sidor om sökmotoroptimering.

Det här är en bok jag väldigt gärna skulle vilja sätta i händerna på mina egna nybörjare. Tyvärr blir språktröskeln lite för hög för de flesta.

Sammanfattningsvis: Detta är helt enkelt bästa grundboken  om du vill ha en introduktion i HTML och CSS. Den är både tydlig, pedagogisk, inspirerande och omfattande. Med detta innehåll i bagaget har du skaffat dig många verktyg för att kunna jobba med webben!

Har du ca 200:- är det en väl värd investering!