Jag äger i alla fall domänen, den var inköpt under mina domän glada dagar men hade inte direkt någon plan för vad jag skulle göra med den. För att den inte ska stå helt tomt har jag nu lagt upp en simpel sida med den något så officiella beskrivning på vad shobre betyder enligt Språkrådet (2004). Men jag ville samtidigt göra något mer av den, när jag lekte runt på facebooks plugin-lista fick jag tanken att se vad shobre betyder för andra. Sagt och gjort jag slängde upp en facebook comment plugin. Vilket är väldigt simpelt, man konfigurerar bara vilken adress man vill kommentera kring och bredden på sidan och får sedan en färdig snippet att inkludera på sidan. Kolla in Shobre.se för att se hur det blev.
Nya systembolaget.se med fokus på användarvänlighet är inte användarvänlig
Jag upptäckte nyligen att systembolaget.se har fått en ny design, det är en riktigt uppfräschad design och där fokus enligt dem själva ligger på ”hjälpa användare hitta och välja oavsett kunskap”. Den information som jag oftast vill hitta när jag besöker systembolaget.se är deras öppettider, det kan vara som idag när jag är lite osäker på när närmaste systembolaget stänger och framförallt runt högtider kan hela systembolaget.se ligga nere för att alla vill hitta aktuella öppettider. Detta tycker man ju att de borde förstå och ta till sig när de designar en ny hemsida. InUse har tagit fram konceptet och interaktionsdesign med fokus på användarvänlighet men lyckas ändå inte, hemsidan har i mitt tycke blivit mer otydlig genom att ta bort ”Öppettider” ur huvudmenyn, dessa ligger nu under ”Butiker & ombud” vilket tidigare kallades ”Butiker & Öppettider” vilket var mycket tydligare indikation och jag kunde snabbt söka igenom menyvalen för att hitta rätt länk. Istället har de lagt en ruta med ”Våra generella öppettider” längst ner till höger på sidan, men även med min 24″ skärm med 1920×1200 pixlar så måste jag scrolla innan jag ser öppettiderna, dvs det är information som majoriteten av besökarna kommer att missa.
Men tillbaka till huvudsyftet med deras nya hemsida, sökningen och den nya ”smarta” sökrutan, jag väljer givetvis den största sökrutan att det finns två likadana sökrutor utan något markering vad det är för skillnad är inget jag tänker, eller ens märker till en början. Jag fyller därför i ”Backaplan” som är mitt närmaste systembolag för att hitta deras öppettider. Till min stora förvåning för jag inga träffar, istället måste jag gå till sidan ”Butiker och ombud” eller använda den andra sökrutan som ser i princip likadan. Där lyckas jag mycket riktigt hitta butiken och ser med en gång öppettiderna. Men varför måste det vara två liknande sökrutor? Kan inte hemsidan förstå att om jag anger ett butiksnamn visa med butikerna, eller får jag inga träffar på drycker sök igenom butikerna också, eller visa mig i alla fall en tabb i sökresultaten med matchande butiker. Det borde vara en teknisklösning, och jag pratar inte om någon avancerad algoritm, som hemsidan borde lösa istället för att användaren måste tänka på det.
Så för att göra en användarvänlig hemsida, sätt användarnas primära behov i fokus, man ska inte behöva tänka efter när man besöker hemsida. Det finns många tekniska lösningar som vi, som utvecklare kan implementera för att hjälpa besökaren. Jag tänkte avsluta med just ett sådant tips, om jag fick möjlighet att påverka nya systembolaget.se skulle jag satt större fokus på öppettider, jag skulle använda geo-lokalisering för att ta reda på vart användaren befinner sig, ifall besökaren använder en mobiltelefon (vilket blir allt vanligare) blir det ännu enklare att visa relevant information baserat på deras position. Då kan man direkt på startsidan ge användaren den information de oftast behöver.
Jag har därför lagt rutan om öppettider bredvid sökrutan, direkt i blickfånget där den hör hemma. Den försöker själv hitta närmaste butik och visar istället dagens och morgondagens öppettider, med ett enkelt knapptryck tar mig direkt till butikens sida för mer information och öppettider eller visar andra butiker i mitt närområde.
Android vs. Apple ur ett användarperspektiv (aka HTC Desire vs iPad)
Jag har varit riktigt dålig på att underhålla min blogg på senare tid och jag ber om ursäkt för det, tiden har bara sprungit iväg men många intressanta saker har hänt. Jag fick årets julklapp, en iPad i julklapp av tomten (somliga säger att jag köpte den till mig själv, men jag vet att det var tomten). Vissa hävdar att man sålt sin själ till djävulen, eller att man nu kommer bli en mac evangelist och älska allt med ett litet äpple på. Jag skulle inte klassa mig själv i någon av kategorierna, jag har haft en Macbook pro i flera år och tycker den är riktigt skönt att programmera med, men har även som erfarna läsare av den här bloggen känner till en HTC Desire som telefon och kör även Windows på några stationära datorer.
Jag tror på rätt pryl för rätt tillfälle men tänkte ta tillfälle i akt att gå igenom mina synpunkter mellan dessa två operativsystem, det har gått lite över två månader och jag har haft möjlighet att både använda dem rikligt samt programmerat egna appar för båda. Under denna mini-artikelserie (vi får se hur många det blir, men minst en till) om Android vs iOS tänkte jag i kommande inlägg gå in mer i detalj hur det är att programmera för Android respektive iPad. Men vi börjar med det grundläggande, användarupplevelsen… let the fight begin.
Android vs. iOS ur ett användarperspektiv
Jag måste börja med en liten disclaimer, jag utgår ifrån HTC Desire, som använder sin egen anpassade lösning av Android med HTC Sense, men mycket av tankegångarna är samma oavsett vilken Android version man har. Man ska även tänka på att jag kommer ifrån att haft en Android telefon i ett halvår innan jag skaffade en iPad, så vissa vanemönster från Androiden kanske inte är det samma ifall man går från andra hållet, dvs iPad till Android.
Grafikupplevelsen
Det är visserligen väldigt svårt att jämföra eftersom förutsättningarna är så olika mellan iPadens med sina 9,7 tums skärm och android telefonen. Men jag måste erkänna att det ibland känns som iPaden flyter på snyggare i animationerna och känns skönare. Men när det gäller hur man använder den och gränssnittet finns det några punkter där Android har lyckats mycket bättre än iPad.
- Ingen bakåtknapp – på Android kan man alltid komma tillbaka genom att klicka på bakåtknappen, antingen inom applikationen eller tillbaka till sin tidigare applikation. Detta är något jag saknar på iPad, här måste man helt förlita sig på applikationens egna knappar, det finns inget krav på var dessa måste vara placerade ibland finns det en ”Done” knapp som stänger/går tillbaka, ibland swipar man med fingrarna. Och det är inte möjligt att gå tillbaka mellan applikationer då måste man istället förlita sig på applikations menyn för att hoppa tillbaka.
- Ingen menyknapp– samma här, det finns inget enkelt sett att komma till en meny, och detta blir extra tydligt och irriterande när man vill ändra några inställningar. På iPaden finns det ibland någon ikon i applikationen för att ändra inställningar, ibland ligger de under system settings osv. På Android som har en fast knapp för menyn hittar man nästan alltid inställningarna som ett alternativ här.
- Long click – på android blir long click nästan uteslutande ett ”högerklick” ur vanlig bemärkelse, det gör att man får upp fler alternativ om man använder long click, på iPaden fungerar det så ibland… men ofta blir det ett vanligt klick istället, vet inte hur många gånger jag bytt låt i Spotify appen genom att försökt long clicka för att lägga låten i kö 🙂
Android Market vs. Appstore
Apple har lyckats bra med sin store, det är enkelt och tydligt att handla, till och med enklare än i Android. De har en striktare och lokalt anpassad prissättning, istället för applikationer som kostar 17,43 kr eller 6,34 så finns det en tydlig prissättning, 7 kr eller 15 kr. Men det känns samtidigt inte helt rätt att man hos Apple måste registrera sitt konto med ett giltigt kreditkort även om man bara vill ladda ner gratisapplikationer.
Öppen vs. stängd mjukvara
Här är det två helt skilda värdar som möts, Android förespråkar öppenhet med öppen mjukvara i grunden och det är enkelt att påverkar det mesta, applikationer kan installeras även utanför App Market och en applikation får mycket större möjlighet att påverka operativsystemet. Gillar man inte en funktion kan man enkelt byta ut den. Apple är tvärt om, i iPad får man snällt följa deras regler. Vanligtvis är det inga problem, det finns ett bra utbud med applikationer i app store och det mest fungerar bra redan från grunden. Men den dagen man vill göra något mer avancerat sätter de stopp. Se på flashfilmer är ett sådant exempel där apple har bestämt att det är dåligt för användarupplevelsen på en iPad. Men detta kan också vara ett smart drag från Apple, det gör att en iPad känns mycket mer stabil, man får inte problem eller program som kan hacka telefonen. Men android lägger de mycket mer ansvar på användaren, man måste vara uppmärksam när man installerar en applikation eftersom de kan göra i princip vad som helst med telefonen när den väl är installerad.
Jag gillar öppenheten, jag gillar friheten att välja vad jag vill installera och hur jag använder det. Men det är svårt att kora en vinnare ännu, fram för allt när en iPad och en Desire har två helt olika användningsområden. Men fortsättning följer i kommande artiklar, och då ska jag försöka summera allt och se om det finns någon klar vinnare.
jQuery Mobile är här, framtiden för mobilt internet; genomgång på HTC Desire
Det var inte länge sedan utvecklingen började men nu är framtiden av mobilt internet här, i alla fall om man får tro gänget bakom jQuery. jQuery Mobile är tänkt att fungera som en plattform mellan webbtjänsten och den mobila enheten, ett gränssnittslager som förbättrar användarupplevelsen. Fördelen med jQuery Mobile är att det finns HTML-kod i botten att falla tillbaka på ifall javascript stöd saknas. Men stödet och intresset för jQuery Mobile från telefontillverkarna har varit mycket stort och flera har redan från börja bidragit till projektet, bland annat Palm, Blackberry, Nokia för att nämna några.
jQuery Mobile består för tillfället av:
Där formulärstödet är extra intressant och erbjuder många förbättringar utöver HTML standarden, så som sliders och bättre styling anpassat för mobila enheter.
Fördelarna med jQuery Mobile
- Crossplattform; använder HTML5 + CSS3, med javascript transformation, fungerar på alla större smartphones som Android, iPhone, BlackBerry etc. Vanlig HTML som fallback för de som saknar stöd
- jQuery är kända för att vara lightweight och snabba och jQuery Mobile är inget undantag.
- Snabb utveckling och enkelt att göra befintliga webbtjänster mobilvänliga
- Inbyggd kontroll för themes gör det enkelt att styla applikationen som man vill.
Stödet för jQuery Mobile är redan från början väldigt stort, det enda problemet för tillfället är bara Windows Mobile 7, där stödet för HTML5 och CSS3 i allmänhet är väldigt dåligt. Klicka på kartan för att se en total översikt hur stödet för webbläsarna är.
Men hur fungerar det då, jag passade på att testa deras exempel som är släppta tillsammans med Alpha releasen, och än så länge fungerar det mycket bra. Mest imponerande är transition-effekterna som gör att man enkelt kan få applikationskänslan av en vanlig html-sida, där man förflyttar sig i sidled mellan sidorna. Dessvärre fungerade forms-elementen inte riktigt lika bra på standardwebbläsaren i Desire. Den hade problem med att fokusera textfälten och scrollade ofta iväg utanför skärmen så man inte kunde se vad man skrev. Men för att vara en Alpha release känns det spännande att se vart det är på väg.
Så vad händer nu?
Jag hade ännu inte börjat använda jQuery Mobile i ett skarpt läge, det behövs fortfarande en del förbättringar, men det är också förväntat då det som sagt bara är en Alpha release. Men jag kommer definitivt sätta mig in strukturen och experimentera med deras kodexempel. För det känns som ett mycket bra sett att snabbt få upp en webbtjänst med applikationskänsla som direkt funkar i de flesta moderna smartphones.
- Läs mer på jquerymobile.com
- Se alla exempel och demon
DN är inte bara sökmotorvänliga utan användarvänliga!
Jag har länge hävdat att sökmotoroptimering och användarvänlighet går hand i hand. Google är precis som en blind besökare, de kan inte se innehållet, de måste bilda säg en uppfattning utifrån metadata. Optimerar man därför sin hemsida mot användaren och följer riktlinjerna från WAI samt de riktlinjer för webbutveckling som Verva, nu mera eutveckling tog fram, så kommer man få se lika stor fördel hos sökmotorerna.
DN har sedan ett tag tillbaka blivit riktigt duktiga på att länka viktiga nyckelord i sina artiklar mot andra artikel- eller temasidor med djupare information om ämnet. Detta är grymt användbart för besökaren och jag använder det nästan varje gång jag läser en intressant artikel för att få djupare kunskap.
Tidigare har det varit vanligt att avsluta artikeln med relaterade länkar och artiklar men på det här sättet får man informationen direkt när man behöver den. Jag kan till och med enbart genom att föra musen över länken och se vilken adress den pelare på kunnat få ut mer information för händelser som jag direkt inte kände till, då DN självklart också använder sökmotorvänliga länkar. Är det tillräckligt intressant öppnar jag det i en ny tabb bakom för senare läsning. Att detta får positiva effekter för sökmotorer är nog alla överens om. Så gör som DN:
- Använd alltid läsvänliga adresser (sökmotorvänliga adresser)
- Länka relevanta ord i din text till dina andra sidor på samma domän (men enbart till relevanta sidor, det är stor skillnad på SEO SPAM och relevanta länkar)
Börja därför alltid all optimering med att fråga dig själv: hur gör jag min hemsida mer användarvänlig. Så kommer du garanterar få sökmotoroptimeringen på köpet. Och då spelar det ingen roll ifall Google ändrar sin algoritm, anpassa aldrig dig efter sökmotorerna utan anpassa dig efter besökarna så kommer sökmotorerna att anpassa sig efter dig.
Lite klassisk nördhumor för att förbereda sig på kommande projekt
Alla som varit inblandade i ett större projekt vet att koden efter ett tag lätt blir självdestruktiv. Den blir stor och tungjobb hur mycket tid man än lägger ner på planering och strukturering. Så för att lätta upp stämningen lite kommer här en klockren make-over på Stromae – Alors on Danse. And So You Code är mer ur ett programmeringsperspektiv 🙂
[youtube=http://www.youtube.com/watch?v=Eq3CuMDXaPs&feature=player_embedded]
Se också originalposten And So You Code…
En anpassningsbar ”senaste inlägg” widget för wordpress
Stör du dig som mig på att man inte kan göra några inställningar alls (okej man kan ändra titel och antalet inlägg att visa, men det är allt) i standardpluginen för senaste inlägg i wordpress. Pluginen i sig är väldigt smidig och jag använder den ofta, men ibland vill jag ändra på utseendet något och nu sist ville jag även visa datumet för inläggen. Istället för att gå in och modifiera senaste poster widgeten manuellt eller skriva en egen wp_query bestämde jag mig för att extenda wordpress inbyggda widget men lägga till de inställningar jag saknar.
När jag letade runt i wordpress pluginkatalog hittade jag några widgets som skulle ge fler inställningar till senaste inlägg. Men de var alla på tok för avancerade och gjorde egentligen inte det jag ville. Jag vill ha möjligheten att individuellt för varje widget bestämma hur den skall presentera innehållet. Jag gjorde det genom att introducera en simple template-motor där man helt enkelt själv väljer hur varje inlägg ska se ut.
- [link] [/link]
- [title]
- [excerpt]
- [date] här kan du även välja hur datumet ska formateras [date=”Y-m-d”] t.ex. för 2010-08-04
- [category]
- [tags]
Ifall det finns några fler taggar ni skulle vilja ha med säg gärna till så implementerar jag detta. Nu kan man alltså enkelt bygga upp sitt eget utseende. t.ex.
[link][title][/link] - [date]<p>[excerpt]</p>I kategorin: [category]
Än så länge har finns den tillgänglig för nerladdning, och givetvis under open soruce. Ifall intresse finns och jag får tid kommer jag även lägga upp den i wordpress plugin directory.
- Ladda ner extended senaste inlägg widget för wordpress (länk uppdaterad 2013-06-30)
Använda VIM-kommandon i Visual Studio 2010
På nya jobbet utvecklar vi dagligen i c# .net, en miljö som jag tidigare känt på en del genom ASP.NET för webbsidor. Men jag har inte varit så förtjust i Visual Studio som IDE tidigare, då jag vanligtvis utvecklas på min Macbook pro har jag länge använt Textmate och det har funkat bra för de uppgifter jag gjort då, men jag har alltid sneglat mot vim och emacs för möjligheterna att sköta nästan allt genom kortkommandon via tangentbordet.
Så jag började nyligen använda VIM genom MacVim, och börjar precis lära mig kortkommandona och jag gillar dem och enkelheten att göra avancerade operationer. Men när man utvecklar i .net kan man verkligen inte vara utan auto complete och intellisense. Där har Microsoft lyckats bra och man kan enkelt koda i c# .net utan att ha exakt kunskap om funktionsnamn osv. Jag ville därför undersöka möjligheten att integrera vim-kommandona direkt i VS 2010 som vi använder på jobbet.
Det visade sig finnas två olika tillägg, ett fungerar som extension till Visual studio, VsVim utvecklat av en Microsoft anställd själv och släppt gratis men verkade ha en del brister då inte alla grundläggande vim-kommandon var implementerade. Jag valde därför att testa ViEmu som en en kommersiell vim emulator för Visual studio som fungerar till en del olika Microsoft produkter, Word, Outlook, Ms SQL och så klart Visual Studio 2010. En licens kostar $99 men något som jag hoppades kunna köpa in genom företaget om det visade sig vara smidigt. Jag installerade därför en 30 dagars trail för att testa.
Första intrycket verkade riktigt bra, den lyckas simulera de olika input-lägena, och alla standard kommandon finns med, det enda jag upptäckte som saknades var ctrl+a, ctrl+x för öka/minska nummer. Men den hade lite små problem och verkade inte alltid komma ihåg vilket läge den var i, speciellt när man gick mellan debug-läge i VS, vilket kunde vara irriterande ibland.
Det närmar sig nu slutet av min 30 dagars trail och dags att bestämma mig för hur jag ska göra, även då jag gillar upplägget och kortkommandona, kommer det nog leda till att jag istället avinstallerar ViEmu och kör med standard VS kortkommandon, av två anledningar:
- Kollegor som kommer för att visa eller testa något blir helt förvirrade när inte standardkommandon som ctrl+c, ctrl+v fungerar. Och på jobbet har vi en öppen miljö och par-programmerar ofta vilket då ställer till problem.
- Visual Studio tillsammans med ReSharper, som vi är riktigt grymt verktyg, har en ganska bra uppsättning kortkommandon och dessa krockade med vims kortkommandon.
Jag har inte helt gett upp att köra med vim-kommandon, men för tillfället nöjer jag mig med de inbyggda kortkommandona och satsar istället på att lära mig dessa för att. Så nu ligger en utskrift av kortkommandona för visual studio och ReSharper bredvid mig på skrivbordet när jag utvecklar. Någon som testat andra kortkommandon för visual studio som du kan rekommendera?
- Utskriftsversion för kortkommandon i Visual Studio
- Utskriftsversion av ReSharpers kortkommandon
Varje webbutvecklare med självaktning ska ha en egen server, eller ”mitt största misstag”
Läste nyligen en intressant artikel om en entreprenörs största misstag, och även om jag inte förlorar riktigt så mycket pengar har jag ett gammal projekt som ligger och gnager på mig och som nu i efterhand kan ses som mitt största misstag.
Det var i slutet av 2006 och jag drev min verksamhet hemifrån och det gick bra och jag började få ganska mycket pengar på kontot. Så jag bestämde mig då att mitt företag behöver sin egen server. Inte för att jag växt ur webbhotellet, jag hade knappt några färdiga tjänster alls som krävde en server. Men då kändes det som varje webbutvecklare med självaktning skulle ha sin egen server. Så sagt och gjort jag beställde en splitter ny Dell PowerEdge 1850, 2 stycken 3.0GHz Intel Xeon processorer (var precis innan dual core blev populärt), 2 GB RAM, 15000 rpm SCSI-diskar, redundant nät och strömförsörjning osv. Vilket då gick på ungefär 20kkr exkl. moms.
Jag ställde servern i Stockholm hos Binero (på den tiden Aleborg) då de hade väldigt bra priser. Även om trippen från Göteborg till Stockholm blev lång fanns det och finns det fortfarande knappt några bra alternativ i Göteborg. Servern stod nu på plats, den hade några väldigt simpla statiska sidor samt hostade min e-post. Det var allt, och tiden gick och jag fick fler kunder och mina egna projekt fick vänta allt längre. Så har det sett ut tills nu, 4 år senare har servern stått nästan helt orörd, rullat på helt utan belastning och jag betalar varje månad för prestanda som jag inte kommer i närheten av att använda .
Jag har till och från under dessa 4 år haft planer på att försöka sälja servern och istället skaffa VPS och expandera efter behov. Men jag insåg snart att jag aldrig skulle få några stora summor pengar för servern, och mitt avtal med Binero var så pass bra att jag nästan skulle få betala mer ifall jag ville ha flera VPSer.
Vad händer nu?
I stället för att ge upp bestämde jag mig nu för att ta tag i servern, jag har fortfarande flera projekt i pipelinen och behöver en gemensam plats där jag enkelt kan lägga upp mina nya projekt. Så för att göra detta möjligt kommer jag att göra en totalöversyn av servern. Installera mer minne, DRAC kort (vilket den saknat under hela tiden vilket försvårat administration), och fler hårdiskar. Jag ska sedan virtualisera upp servern, ge mig in i molnet och på så sätt få ut det mesta från prestandan servern ändå har. Min plan är att skapa 3 virtualiseringar, men styrkan är ju att när väl virtualiseringen är på plats är det enkelt att utvidga efter behov. Jag kommer att använda VMware vSphere Hypervisor (ESXi) och planerar att dela upp servern så här
- En virtualisering på 2GB kommer köra Windows 2008 Server med ISS7, för att hosta projekt i ASP.NET MVC samt gamla traditionella ASP sidor.
- En Debian på 3 GB kommer hosta Apache för php, wordpress samt gemensam MySQL
- Den tredje och på debian får resterande 1GB och kommer i dagsläget hosta django+python på lighttpd (min nya favorit för snabb webbutveckling)
Beställningen är redan gjord, ett DRAC 4 kort, fyra stycken 1GB RAM och två stycken 160GB IDE-diskar. Majoriteten av delarna köps från ebay i USA då priserna är oslagbara. Nästa etapp blir under vecka 34 då jag planerar att åka till Stockholm och göra själva installationen. Server står i dagsläget i BGC hos Phonera efter att Binero la ner sin colocation-verksamhet.
Vad har jag lärt mig av detta?
- Börja smått och väx, inte tvärt om.
- Webbhotell funkar perfekt tills det att du är för stor och då blir inte steget till en VPS lika långt
- Gör det enkelt för dig, installera en smidig kontrollpanel och det blir mycket enklare från idé till att komma igång. Att behöva logga in på servern via remote är både tidskrävande och jobbigt.
Jag kommer försöka posta mer allt eftersom projektet fortsätter, och om något där ute har några synpunkter eller tips tar jag gärna emot dem. Jag har redan nu spanat in massor av olika kontrollpaneler och planerar att göra en genomgång för att se vilka av Open Source (ja de finns för Windows också :)) alternativen som lever upp till förväntningarna, och om intresse finns dela med mig av det här på bloggen.
Sprid gärna vidare om du tycker det är intressant…
Så här visar du veckonummer i Android kalendern på HTC Desire
För oss svenskar är det ganska vanligt att använda veckonummer för att beskriva när i tiden något händer, t.ex. jag går på semester vecka 30, jag är borta helgen vecka 28. Det verkar dock inte riktigt lika vanligt i t.ex. USA och Googles kalender har inte ens stöd för att visa veckonummer. Men jag upptäckte nyligen att veckonummer faktiskt finns med i kalendern i Android, lite gömd men den finns där. När kalendern är igång växla till veckoläge (Tryck på meny sedan Vecka) och du ser då veckonumret uppe i vänstra hörnet. Varför den inte syns i månadsläget kan man alltid undra, men nu finns det ett enkelt sett att få fram aktuell vecka i din Android telefon.
Men lite udda är det att den visar ”w 27” som i ”week 27” när allt i övrigt är på svenska :).
PS. Du kan även få veckonummer i din google kalender genom att lägga till kalendern Weeknumbers.