Med TV-serier som “The Sopranos” og “Lost” har serier gått fra å være enkle og overfladiske til å ha en større utvikling over tid. Man blir kjent med mennesker og problemene de står ovenfor. Siden det i nyere tid har kommet mange gode serier, ser man ofte flere samtidig så de blir vanskelige å holde styr på. Seriene tar også lange pauser mellom hver sesong, og det kan være vanskelig å komme inn i en serie igjen da oppsummeringen på starten ofte ikke er nok. I tillegg har det blitt vanlig å diskutere og komme med teorier rundt serier, noe som er eksemplifisert ved “Lostpedia”, en wiki kun om Lost. Her har hver episode, hver karakter etc. en egen side.

Selv om det finnes mye informasjon på nettet, er informasjonen ofte spredt, og det er knotete å surfe gjennom treff på Google, besøke diverse diskusjonsfora og andre generelle sider. Om man i tillegg vil ha informasjonen tilgjengelig mens man ser en episode blir det fort vanskelig å holde styr på alt og finne det man er ute etter.

Samtidig som de gode TV-seriene har gjort sitt inntog, har også laptopen og andre mobile enheter fått fast plass i sofaen. Omtrent halvparten av alle amerikanere ser på TV med en eller annen form for enhet på fanget. Rettet innhold til disse enhetene basert på hva brukeren ser på er et voksende marked og kalles for “the second hand experience”. Ved å gi seeren en nettside, “Serieguiden”, hvor all informasjon er samlet vil det komplimentere TV-tittingen fremfor å stjele fokus fra den.

Jeg har brukt noen timer til å tilpasse bloggen forskjellige skjermstørrelser, og det begynner å bli ganske bra. Du kan teste det ut nå ved å enten besøke bloggen med en mobil eller gjøre nettleservinduet ditt mindre og se hvordan innholdet automatisk tilpasser seg.

Magien bak dette kalles media queries og er en ny funksjon i CSS3. For de som måtte bry seg, støttes det ikke av Internett Explorer 8 og eldre nettlesere, men det gjør lite da det vil fungere på de mest populære enhetene som iPhone og Android.

» Tilpassing av siden

Media queries støtter en rekke forskjellige variabler, som høyde og bredde på nettleservinduet, høyde og bredde på selve enheten, om enheten er i landskapsmodus og enhetens oppløsning. Dette gjør det enkelt å tilpasse siden til forskjellige enheter basert på disse variablene. Man kan f.eks. lage en versjon tilpasset små enheter, en til tablets og netbooks, og en for laptoper og stasjonære.

All kode som legges inn i denne kodesnutten vil da kun gjelde nettleservinduer som er 480px bred eller mindre og enheter som har en skjermstørrelse på 480px i bredden eller mindre. Her kan man som nevnt velge ut i fra mange forskjellige variabler, og man kan også ha flere slike etterhverandre, slik at siden dynamisk endrer seg etter forskjellige skjermstørrelser eller vindustørrelser.

Etter man har bestemt seg for de størrelsene man ønsker, er det bare å begynne å designe for de nye formatene. Det som er kjekt er at den gamle css-en fortsatt gjelder, og man bare overstyrer de elementene man ønsker. For mobile enheter er det f.eks smart å sette bredden på innholdet til auto, slik at innholdet tilpasser seg forskjellige enheter.

» Testing av siden

For å se endringene du har gjort, finnes det flere muligheter. Den første er simpleten å endre størrelsen på nettleservinduet. En annen mulighet er å bruke ProtoFluid. Her kan man se hvordan siden vil se ut på iPhone, iPad osv. Merk at den bare tilpasser høyden og bredden på vinduet, så den kan se annereldes ut på den faktiske enheten.

For en dypere innføring i dette emnet anbefaler jeg artiklene til A List Apart og Smashing Magazine. Webdesignerwall har også en god artikkel om emnet, og javascript-hacks for å få det til å fungere i Internett Explorer 8 og eldre nettlesere. Jeg svarer også gledelig på spørsmål i kommentarfeltet.

Med TV-serier som “The Sopranos” og “Lost” har serier gått fra å være enkle og overfladiske til å ha en større utvikling over tid. Man blir kjent med mennesker og problemene de står ovenfor. Siden det i nyere tid har kommet mange gode serier, ser man ofte flere samtidig så de blir vanskelige å holde styr på. Seriene tar også lange pauser mellom hver sesong, og det kan være vanskelig å komme inn i en serie igjen da oppsummeringen på starten ofte ikke er nok. I tillegg har det blitt vanlig å diskutere og komme med teorier rundt serier, noe som er eksemplifisert ved “Lostpedia”, en wiki kun om Lost. Her har hver episode, hver karakter etc. en egen side.

Selv om det finnes mye informasjon på nettet, er informasjonen ofte spredt, og det er knotete å surfe gjennom treff på Google, besøke diverse diskusjonsfora og andre generelle sider. Om man i tillegg vil ha informasjonen tilgjengelig mens man ser en episode blir det fort vanskelig å holde styr på alt og finne det man er ute etter.

Samtidig som de gode TV-seriene har gjort sitt inntog, har også laptopen og andre mobile enheter fått fast plass i sofaen. Omtrent halvparten av alle amerikanere ser på TV med en eller annen form for enhet på fanget. Rettet innhold til disse enhetene basert på hva brukeren ser på er et voksende marked og kalles for “the second hand experience”. Ved å gi seeren en nettside, “Serieguiden”, hvor all informasjon er samlet vil det komplimentere TV-tittingen fremfor å stjele fokus fra den.