500 webdesignere/webudviklere var samlet i Boston til 2 dages konference med fokus på design, kode og indhold.

Udover 1508’s 2 webudviklere, var en håndfuld hollændere, et par svenskere og tyskere, de eneste europæere blandt amerikanske ligesindede.

2 hovedbudskaber:
Fleksibelt webdesign
CSS3 - brug det, nu!

Fleksibelt webdesign
I mange år har vi designet og udviklet til kendte platforme/klienter. Så længe vi holdt os inden for 1024×768, og var sikre på at det vigtigste indhold var over ’folden’, kunne vi nogenlunde sikre den gode brugeroplevelse. Men med det mobile webs eksplosive fremgang og tilgang af nye devices som iPad, notebooks og lignende er vi nu nødt til at tænke anderledes. Vi skal nu komme brugeren i møde ligegyldigt hvilken platform, der vælges at browse websitet på.

I en lang periode har den mobile brugeroplevelse været nedprioriteret. Tit tilbyder man bare brugeren en nedskaleret udgave at websitet, hvor brugeren tvinges til at zoome og scrolle sig frem til sit mål. Men hvis man virkelig ønsker at ramme en bred målgruppe, skal mobilløsningen tænkes ind fra starten. En god øvelse er derfor at starte med det mobile design. Her tvinges man til at minimere sin struktur og informationsarkitektur, og stille skarpt på hvad der er allervigtigst for kunden/brugeren?

Udover at være en udfordring ift. informationsarkitektur stiller den device-tilpassede webløsning store krav til designet og HTML-koden, for at skulle kunne rumme alle skærmformater fra 480×320 (iPod) og opefter. Er det muligt at lave et design/kode, der kan tilføje/fjerne website-elementer alt efter bruger/device uden at det ødelægger helhedsindtrykket? Spændende udfordringer!

CSS3 – brug det, nu!
CSS3 har, for mange udviklere, længe været skatten for enden at regnbuen. Men så længe majoriteten af brugerne har siddet på forældede browsere, har argumentet for at benytte den nye standard ikke været der. Oftest har man tilgodeset de brugere, der sad på de svageste klienter (Internet Explorer) for at sikre den samme oplevelse for alle brugere. Det bliver der lavet om på nu, hvor web-browsing bliver flyttet over på den mobile klient og dermed fra Internet Explorer på PC til Safari og Opera på smartphone. Både Safari og Opera er moderne browsere, der understøtter mange af de nye features.

CSS3 bliver aldrig en færdig implementeret standard på alle browserklienter. De forskellige browsere tilføjer og fravælger de funktioner fra CSS3 de finder bedst. Derfor blev der fra talernes side kraftigt opfordret til at tage den nye standard i brug og gøre op med den gamle tvangstanke om at alle brugere, ligegyldig hvilken browser, skal have den samme oplevelse. Dette er med til at fastfryse udviklingen. I stedet skal man sikre at alle bliver tilgodeset og får en god oplevelse, men de der sidder på nyt, opdateret software bliver præmieret med ekstra lækkerhed.

En taler på konferencen kom med et glimrende eksempel, der kommer fra TV-branchen. Da man gik fra sort/hvid til farve-programmer, sad mange seere stadig med forældede sort/hvid-skærme. Men oplevelsen for dem var den samme som altid, da signalet stadig kunne fortolkes. Først når de så samme program hos naboen, kunne de se forskellen. Det samme vil ske nu for webbranchen. Do websites need to look exactly the same in every browser?

Stor oplevelse
Alt i alt har det været to utrolig inspirerende dage med fantastiske taler fra web-verdenens sande konger og bannerførere. Og en skøn oplevelse at være i selskab med 500 ligestillede, der alle taler samme sprog (HTML/CSS).

Sjovt var det også da 1508’s design til Syddansk Universitet pludselig tonede frem på Jared Spools oplæg  “Anatomy of a Design Decision” . Jared Spool havde lavet et eksempel på det han kaldte Genius Design (hvor man designer noget, der har været designet før). Analysen omhandlede universiteter og deres look-and-feel. Stort set alle benyttede sig af det han kaldte ”Girls under trees” – tema. Herunder 1508.

/Jonas Damsgaard Olsen, senior webudvikler

Gennem webevolutionen har der været en tendens til et skifte frem og tilbage mellem backend og frontend. Afhængigt af hvilken, der i perioderne var sværest at duplikere, har vigtigheden af enten algoritmer eller data haft et forretningsmæssigt fokus frem for den anden forårsaget af udbud og efterspørgsel.

Webhistorien

Under Web 1.0 dominerede beskyttede programmer og organisationerne med de bedste softwarefunktioner (backend, algoritmer osv.) var styrende, mens selve dataen generelt ikke var i særligt fokus. Dette skyldes sandsynligvis en tankegang dannet i en tid med lidt lagerplads, processerkraft og derved muligheder – samt inden massebrugerens aktivitet på internettet.

Med Web 2.0 skiftede tendenserne og ændrede organisationernes fokus til den anden side af ligningen: data. Open source resulterede i et paradigmeskift væk fra de traditionelle software- og forretningsmodeller, og lukket ”ejerskab” betragtes herefter næsten som et fejltrin i en webproduktion. I denne frontend-periode var fokus på erhvervelsen af data og hvordan disse informationer kunne udnyttes til en kommerciel fordel. Som et resultat opstod mange services, der forsøgte at bevare sin fordel gennem brugertilknytninger og sociale relationer.

For Web 3.0 tegner sig nu endnu et fokusskift, denne gang tilbage til backend og software igen. Modsat i Web 1.0 opfordrer det teknologiske potentiale i det semantiske web til at gøre data både frit tilgængelig og struktureret, hvorved der skabes nye muligheder for anvendelsen. Dette er et paradigmeskift væk fra tankegangene om beskyttelse og ejerskab – karakteristisk for både Web 1.0 og Web 2.0. Med udgangspunkt i Web 2.0s frontend tilbyder den semantisk backend markante forbedringer af eksisterende produkter og services – og medfører således alternative indtjeningsmuligheder i Web 3.0.

Som et pendul svinger tendenserne efter Web 3.0 således frem mod Web 4.0 og peger på frontend igen. Der eksisterer endnu en masse teorier og bud på et kommende Web 4.0, hvilket gør emnet til et helt kapitel for sig. Det vil derfor blive behandlet i et separat blogindlæg, der tegner tendenser og fremtidsforudsigelser for næste årti i webudviklingen.

Nye brugstendenser medfører nye markedsvilkår

Med de sociale egenskaber introduceret i Web 2.0 ændrede peer-produktionen på eksisterende markedsvilkår og forretningsmodeller for Web 1.0. Blogs, chat-rum, wikis, søgemaskiner, auktioner, reklamer, P2P download og personlig transmittering repræsenterede nye måder at underholde, kommunikere og interagere på internettet. I hvert tilfælde bliver den traditionelle passive køber af redaktionelt stof og reklamevarer til en aktiv, deltagende rolle i værdiskabelsen. Som en uundgåelig følge, trues de traditionelle måder at drive forretning online.

For de virksomheder, der tilpassede sig de skiftende tendenser (udnyttelse af Web 2.0’s masse-samarbejde), medførte det nye enorme forretningspotentialer. For individer og små producenter opstod der ligeledes en ny forretningsæra ikke tidligere set. Brugerne blev selv en del af økonomien – et enormt globalt netværk af specialiserede producenter af viden, der deler og udveksler services for underholdning, livsnødvendigheder og læring. Dette beskriver den magt almindelige mennesker som forbruger, medarbejder, online-communitymedlem etc. i dag besidder for at skabe innovation og ny værdi på det globale marked.

Et nyt økonomisk demokrati opstår med Web 2.0, hvor vi alle har en ledende rolle. Det tager udgangspunkt i at være åben overfor omverden, skabe innovation i sammenspil (særligt med kunderne) og dele tidligere beskyttet ressourcer (som f.eks. data, viden og ekspertise). Således opstod nye forretningsmodeller i overgange fra Web 1.0 til Web 2.0, hvorved mange af reglerne for konkurrence krævede en omskrivning. For Web 3.0 stiller de nye tekniske muligheder og vilkår for værdiskabelse at krav til revurdering eller tilpasning af traditionelle forretningsmodeller for webindustrien.

Traditionel reklameindtjening udfases

Indtægtskilden for mange kommercielle sites i Web 1.0 og Web 2.0 har gennemgående bygget på en generel webforretningsmodel: Ved at forøge trafikken på et website, forøges tilsvarende indtægten fra reklame. Den blandede indholdsgenerering i Web 2.0 har dog haft negative indflydelse på værdien: ”Most rely on display advertising - a.k.a. banners - to make money. But marketers have cooled to display ads on the web, and they’re especially skeptical of such advertising on social-networking sites.” [fra artiklen Web 2.0 is so over. Welcome to Web 3.0].

Web 2.0’s brugergenerede indhold skaber så mange websider med varierende sidevisninger, at der ikke længere kan forlanges samme pris som f.eks. på portaler. Eksempelvis kan Yahoo!s nyhedssite taksere ca. 30 gange mere for en bannerreklame end Facebook, sandsynligvis pga. at målgruppen er mere specificeret og visningen af den enkelte reklame højere. Hvis en bannerreklame eksisterer på 1.000 websider, vil i gennemsnit mellem to og fem klikke på banneret for at lære mere. Dertil kommer, at disse to-fem ikke partout resulterer i salg.

Med mindre eksisterende produkter og forretningsmodeller tilpasser sig egenskaberne til de kommende webtendenser, risikerer de at låse sig fast og lide samme skæbne som under dot-com krisen i Web 1.0. Reklamebannerne er et eksempel på, at eksisterende forretningsmodeller risikerer at miste sin værdi, når teknologien og brugerne ændre på virksomhedernes omverden.

To primære tendenser for Web 3.0 peger mod: dels at udnytte den fulde styrke af digital globaliseringen og dels servicering af kunderne én til én gennem personalisering. Læs meget mere om disse tendenser i kommende blogindlæg - så hold dig tæt.

Siden introduktionen af et World Wide Web tilbage i 1989 har mængden af tilgængelig information på internettet steget hastigt. Denne tendens skyldes primært udviklingen af de brugercentrerede webservices, der opstod under fællesbetegnelsen Web 2.0. Funktionaliteter for upload af tekst, billeder, video og lyd gjorde alle brugere med adgang til en internetopkobling samt webbrowser i stand til at agere redaktør og deltage i genereringen af indhold.

I dag tegnes efterhånden en kurve for informationsmængden, der sætter de eksisterende søgeværktøjer ude af stand til tilfredsstillende at sortere i denne voksende mængde af tilbud. Dette skyldes især, at browseren ikke kender dig og dine behov, men blot præsenterer et resultat på baggrund af søgning efter nøgleord. Effektiviteten af søgning efter informationer på nettet og produktiviteten for brugerne, spås fremover en nedgang pga. det stigende sorteringsarbejde frem til den relevante information. Lad os tage et eksempel:

Forestil dig at du skal på en klassisk date med biograftur og efterfølgende middag. Du er i humør til en komedie og italiensk mad. Du åbner en webbrowser og benytter Google til at søge efter oplysninger om film og restauranter. Du vil gerne vide, hvilke film der spiller i biografer i nærheden af dig, så du bruge lidt tid på at besøge forskellige biografhjemmesider og læse korte beskrivelser af de enkelte film, inden du foretager dit valg. Desuden ønsker du at se, hvilke italienske restauranter, der ligger tæt på hver af disse biografer, samt læse nogle kundeanmeldelser for restauranterne. I alt skal du sortere i en lang liste af søgeresultater og besøger en stribe websteder, før du er klar til at gå ud af døren.

Information vs. produktivitet

I dag er vi således ved at nå til et informationsmæssigt mætningspunkt, der skaber behov for en ny strukturering og repræsentation af information. Opgaver som søgningen efter film og restauranter skal gøres meget hurtigere, nemmere og mere målrettet for den enkelte bruger. Dette begrunder et generationsskift i webudviklingen og overgangen til nyt stadie – Web 3.0.

Web 1.0 havde fokus på at få folk og virksomheder online. Web 2.0s ”Social Web” fokuserede på at skabe forbindelser og relationer mellem mennesker online. Web 3.0 vil fokusere på det ”Semantiske Web”, der medfører nye og mere intelligente måder at præsentere og koble viden online. I eksemplet ovenfor vil du, i stedet for adskillige søgninger og hjemmesidebesøg, blot kunne skrive din forespørgsel i browseren, hvorefter World Wide Web gøre resten. Inden en date skriver man blot: ”Jeg ønsker at se en sjov film og derefter spise på en god italiensk restaurant tæt på min bolig. Hvad er mine muligheder?” Browseren vil analysere din forespørgsel, søge på internettet efter alle relevante svarmuligheder og derefter organisere resultaterne for dig ud fra relevans – udelukkende med udgangspunkt i dig og din profil.

Kontekstbaseret søgning

En browser i Web 3.0 vil således fungere som en personlig digital agent. Når du søger på internettet lærer browseren, hvad du er interesseret i og indsamler informationer om f.eks. din økonomiske og sociale situation fra forskellige kilder. Jo mere du bruger internettet, jo mere vil din personlige agent lære om dig og jo mindre specifik behøver du være i din søgning. I sidste ende vil agenten selv kunne registrere i din kalender at du skal på date, hvorefter den finder og opstiller relevante tilbud baseret på dine præferencer.

De præsenterede tilbud baseres på baggrund af en samlet brugerprofil af dig, der konstant opdateres, krydsrefereres og er optegnet ved hjælp af de ”digitale fodspor” brugeren sætter. Hver gang man foretager et køb med dankort, browser hjemmesider, lokaliseres via GPS, sender en mail, registreres til en konference og besøger lægen etc., opsamles data og sammensættes til en brugerprofil, der så korrekt som muligt danner et billede af dine konkrete præferencer.

Spørgsmål om overvågning, misbrug og sikkerhed dukker naturligt op som relevante diskussionsemner og problemområder, men som man så det for både Web 1.0 og Web 2.0 vil det altid være muligt at finde løsninger på udfordringerne, så længe fordelene eller behovene er store nok. For 10 år siden havde de færreste af os vel drømt om at ordne vores banksager via internettet og tjekke vores saldo på mobilen. Der arbejdes derfor ihærdigt på at finde løsninger gennem bl.a. udviklingen af nye standarder og metoder – der leder til nye muligheder for forretningsområder og –modeller.

I fremtidens Web 3.0 vil vi opleve et Semantisk Web, som kan vurdere kvaliteten af vores søgninger og svare direkte på de spørgsmål vi stiller. Computerne kommer således til at være aktive og vurderende medspillere. En seriøs samtalepartner så ingen længere behøver trykke på knappen “Jeg prøver lykken” i Google. Med potentialet for Web 3.0 vil du kunne læne dig tilbage og lade den semantiske teknologi gøre arbejdet for dig. En semantisk søgemaskine har forbedret muligheder for at anvende og reagere på de informationer mennesket og computeren udveksler online. Derfor kan søgningen benytte private informationer såsom: antallet i familien, afstanden fra hjem til arbejde, privatøkonomi etc. Webagenten indsamler, analysere og præsentere data for dig på en måde, der gør en sammenligning af mulighederne overskuelig, hurtig og relevant – kun for dig!

Gå-hjem-møde om Web 3.0

I går afholdte vi et gå-hjem-møde hos 1508 om emnet. Gå-hjem-mødet blev streamet live via Bambuser, og du har mulighed for at se optagelserne her. Du kan også se billeder fra arrangementet på Flickr, eller vende tilbage her på 15all, hvor jeg i kommende blogindlæg vil jeg gå mere i dybden med de teknologier og mindsets der skal til, for at Web 3.0 kan blive en realitet. Det er bl.a. et fokus på nye digitale repræsentationer af viden, den tekniske udvikling og webstandarder, samt bud på nye krav til de eksisterende forretningsmodeller.

Forestil dig, at du i din digitale kalender skriver hvornår og hvor du holder ferie. Herpå finder computeren skræddersyede tilbud om flyrejse, ferieforsikring, forslag til seværdigheder, restaurantbesøg osv. Altsammen tilpasset den profil, som du via dine fodspor på nettet har skabt af dig selv.

Web 3.0. handler om intelligente søgemaskiner, der kan analysere dine behov ved at krydse oplysninger fra Facebook, Twitter, netbank m.m. - og knytte de relevante forbindelser. Med web 3.0. ændres internettet fra at være et sted, hvor viden er manuelt tilgængelig til at være et sted, hvor den er fortolket, udvekslet og behandlet. Fordi det er lettere at finde en nål i en høstak, hvis høstakken er sorteret efter antallet af nåle.

1508 holder et gå-hjem-møde om emnet den 9. juni 2009 kl. 15-17. På mødet fokuseres på det fundamentale paradigmeskift fra informations- til viden-centrerede tendenser, der leder til nye muligheder for effektivisering, brugeroplevelse samt forretningspotentiale online.

Hvis du har lyst til at deltage, kan du tilmelde dig på 1508.dk.

God underholdning hvis du vil føle dig som kongen af St. Germain

http://www.najle.com/idaft/

Tak til Robin

Normalt kan du få mig til at tale i flere timer om hvorfor wiki’er er noget af det bedste der er sket for videndeling. Og normalt jeg er ovenud glad for at vi har en wiki som intranet her i 1508.

Men jeg bliver lidt støt når jeg får følgende besked når jeg logger ind i vores wiki.

Bad username or password?

Jeg synes da både mit brugernavn og mit password er godt. Det kan godt være jeg skrev det forkert, men derfor er det jo stadig et godt brugernavn. Der er vi i hvert fald uenige.

Der er stor forskel på om der menes forkert (altså ‘wrong’), ikke gyldigt (altså ‘invalid’) eller dårligt som de skriver her.

Man skal som designer af website og anden form for brugerinteraktion altid huske på at udforme sin feedback til brugerne på en måde så de giver mening, og er fuldstændig entydige.

Hvis det wiki’en forsøgte at fortælle mig, var at det brugernavn og/eller password jeg indtastede var forkert, kunne det jo bare sige det. Den behøver ikke at fornærmer mig ved at agere smagsdommer.

Når LinkedIn er mit professionelle CV og Facebook mit sociale CV - hvad er det så lige, at Twitter kan og skal? 

Twitter ligger sig i strømmen af web 2.0 værktøjer, der gør det nemmere for mig, at følge med i….ja, følge med i hvad? For et interessant spørgsmål er, om Twitter primært er et socialt værktøj, hvor man kan følge tweets fra sine venner og andre interessante personer (en slags Facebook på speed) - eller om det er et fagligt værktøj, man kan bruge i sit arbejde fx opsnuse interessante trends om kommunikation og medier og følge nyheder mens de sker mm.

Tesen om selviscenesættelse som den primære motovation for at deltage i sociale medier gælder begge veje og svaret afhænger af, hvem man spørger - og selvfølgelig hvem man regner med befinder sig i den anden ende af tweetet. Derfor laver vi en lille uformel rundspørge her på bloggen:

Hvordan bruger du primært Twitter? Socialt eller fagligt?

twitter.com/Huusom

Egentlig er idéen rigtig god. At skabe en fælles offentlig model for portaler, så man på en nem og smidig måde kan dele data og viden.

Og det er lige netop sådan én, Den Digitale Taskforce står i spidsen for. Modellen hedder ”Den Fællesoffentlige Integrationsmodel for Borgerportalen og Virksomhedsportalen” eller OIM. Med OIM skal det være muligt ”at støtte udviklingen af de portaler ved at fastlægge principper og retningslinjer for integration af myndighedernes portalservices i de to portaler ” - og hvem vil ikke gerne det?

I forbindelse med arbejdet er der oprettet en styregruppe, der skal varetage front-end kodningerne af disse fællesoffentlige projekter. Gruppen går under navnet OIMCSS-styregruppen og består af en række repræsentanter fra borger.dk, Den Digitale Taskforce, SKAT og virk.dk, og de har sat sig sammen for at udarbejde nogle regler og retningslinjer omkring strukturering og navngivning af klasser.

Illustration fra OIM CSS-Klassemodel

Ud af det er der kommet et tolv sider langt dokument, ”OIM CSS-klassemodel”, og det interessante ved dokumentet er, at det går videre end blot at opstille regler for navngivning af klasser – det beskriver også portalens designmæssige struktur. Dokumentet starter med at opdele skærmens bredde i hele, halve, kvarte og tolvtedele. Og det er ikke blot skræmen, der deles i kolonner af disse størrelser – alle elementer beskrives ligeledes ud fra dette.

Igen en nobel idé, hvis det altså ikke lige var, fordi vi arbejder med designere og informationsarkitekter, som mener, at verden, eller i hvert fald websider, ikke bare kan deles op i hele, halve, kvarte og tolvtedele. I 1508 har vi altid arbejdet med design og struktur som en integreret del at websitet som ikke bare kan lægges hen over et teknisk skelet, som jo mere eller mindre er tanken bag OIM.

Kan det lade sig gøre at lave et sådant site? Rent teknisk - sagtens. Kan det lade sig gøre at lave sådan et site med de samme høje design- og IA-standarder, som vi er vant til i 1508? Svært at sige. Det er i hvert fald en udfordring, for implementeringen af klassemodellen vil ikke kun have en indflydelse på hvordan vi koder vores sites, men også på det visuelle udtryk og placeringen af de enkelte indholdselementer i forhold til hinanden. Endvidere skal man tage højde for at portal delen af siden skal kunne fungere uden vores specifikke styles, baggrunde, fonte etc.
Hvis det ikke kan lade sig gøre, så må designerne og informationsarkitekterne på banen med gode argumenter og forslag til, hvordan man så standardiserer tingene, så vi ikke bare melder os ud af processen – men sørger for at sætte vores præg og lave portalservices, der kan integreres på tværs af sites, og som stadig har samme høje design- og strukturmæssige kvaliteter, som vi er vant til i 1508.

Læs mere om OIM på http://modernisering.dk/da/projekter/faellesoff_integrationsmodel/
og download dokumentet på http://oim.modernisering.dk/filer/OIM-CSS-klasser-v1.pdf

Nu ved du hvad OIM er og hvis du ikke hvad OMG er, som overskriften indledes med, så betyder det bare ”Oh My God”, for måske er en invokation af de højre magter hvad der skal til for at få det hele til at gå op i en højre smukkere enhed der holder kant.

Når man bare har lyst til at tegne, er det rart at have nogle at dele det med :)

Twiddla.com er et virtuelt whiteboard, hvor du kan mødes med samarbejdspartnere, kunder eller venner uanset hvor i verden de befinder sig.
Kommentér websites ved at tegne og skrive direkte på dem - eller brug et af værktøjerne til at konstruere en side fra bunden i fællesskab. Det er også muligt at embedde og afvikle widgets/html direkte på siden.

Det er ikke en ubetinget god brugeroplevelse, men det er super simpelt, og man kan komme i gang uden at oprette sig eller downloade noget (prøv en åben session i “The Sandbox“). Det virker dog til at der nogle bugs med widgets - jeg forsøgte fx at embedde en youtube video, der fyldte det meste af siden.  Mest af alt blev jeg forelsket i deres super kække feature list.

Enjoy!

- Nu hvor vi er i gang med gratis online tools, der ikke kræver download, så tjek også lige:
Pixlr.com: Et online billedredigeringsprogram ala Photoshop
Lovely charts: Lav flowcharts, wireframes, diagrammer, sitemaps osv. 
Keeping it simple!

Tøv ikke med at dele et link med os andre :)

Aaahhh…. man kan undre sig over, hvordan man nogensinde har

kunnet undvære den: Online pejsen (se den i fuldskærm og husk lyd)

Tak til Sebastian :)