Uppdrag
Filmtopp – never ending stories
Filmtopp är en av Sveriges största webbplatser för recensioner och nyheter om filmer och TV-serier. Vad som en gång startade som ett hobbyprojekt för gänget bakom Filmtopp hade för länge sedan vuxit ur sin Wordpress-kostym, när de kontaktade oss på Limetta. Filmtopp var i behov av en helt ny redaktionell plattform med ny design.
Filmtopp är inte den första webbplatsen som Limetta bygger som handlar om filmer och serier. Streamly är en tjänst som samlar innehåll från alla streamingtjänster på ett enda ställe och förmodligen var det vår erfarenhet från att bygga Streamly som gjorde att vi fick uppdraget att bygga nya Filmtopp.
Utmaningen
Bara för att man byter design och teknik så betyder det inte att man ska byta innehåll. Filmtopp är en skattkista full med betygsatta filmrecensioner som stäcker sig flera år tillbaka i tiden och det finns ett stort värde i att behålla dem. Därför var uppdraget att strukturera om, designa om och ersätta all gammal teknik, men behålla i princip allt redaktionellt innehåll.
Ett problem Filmtopp hade med sin tidigare lösning var den hårda kategoriseringen av artiklar som blir konsekvensen av en traditionell struktur i ett CMS. En artikel kan vara lika relevant under kategorin ”Recension” som under ”Skräckfilm”. Men ur ett SEO-perspektiv bör innehåll aldrig förekomma två gånger, eftersom Google straffar det de kallar duplicate content (dubblerat innehåll).
Lösningen blev att lägga alla artiklar i en platt databas, utan egen hierarki eller kategorier. Artiklarna får sedan en uppsättning egenskaper, såsom genre, typ av artikel, skådespelare, regissör, streaming-tjänst etc. En analogi var att vi släpper fiskarna lösa i en damm och sedan slänger vi i olika nät för att fånga upp rätt fiskar. Nätet i vårt fall är navigationen på webbplatsen som genom att anropa en uppsättning egenskaper till databasen får fram just de artiklarna som efterfrågas. På så sätt har vi frikopplat navigationen från strukturen och kommer runt problemet med dubbelt innehåll.
Fokus på SEO och prestanda
Att ha innehåll av hög kvalitet är bara en komponent för att få många besökare till sin webbplats. Innehållet måste också ladda snabbt, vara mobilanpassat och vara sökmotoroptimerat, så att det fångas upp indexeras och rankas högt av Google och andra sökmotorer. Därför satte vi ihop en mix av tekniker som alla syftar till att bidra till detta mål.
Azure Cognitive Search
Genom att lägga allt redaktionellt innehåll i en databas i molntjänsten Azure Cognitive Search fick vi ett dels ett blixtsnabbt sökbart index över allt innehåll, dels avancerade funktioner för att arbeta effektivt med cachning vilket är ett måste när man vill ha extrem prestanda.
Man tänker spontant att man bara använder denna typ av sökteknik för att bygga renodlade söktjänster, men användningsområdet är mycket större än så. Vi använde Azure Cognitive Search för all hantering av redaktionellt innehåll. Vi kunde till exempel segmentera och selektera innehåll på ett mycket flexibelt sätt, vilket är ett måste när man har ett så omfattande innehåll som Filmtopp. Webbplatsen innehåller många olika listsidor där man listar innehåll efter parametrar som genre (skräck, action, drama), format (recensioner, nyheter, intervjuer) eller källa (Netflix, HBO, Amazon, SVT). Men den har såklart en grym sökfunktion också.
ImgIx - servar bilder blixtsnabbt
Filmtopp innehåller mycket bilder. Mycket bilder innebär mycket data som ska laddas och mycket data brukar traditionellt innebära långa laddningstider. Det ville vi inte ha. Därför integrerade vi en CDN-lösning (Content Delivery Network) som är specialbyggd för just bilder som heter ImgIx. Förutom att deras molnbaserade lösning med ett världsomspännande nätverk av servrar kan skicka bilddata snabbt har de även funktioner för transformering, optimering och cachning av bilder. Allt detta utnyttjade vi på Filmtopp.
Ibland blev resultatet så förbluffande bra att vi tappade hakan. En stor bild som tidigare kunde ta 4 sekunder att ladda, laddades nu på 0.4 sekunder med samma storlek och bildkvalité. Men bara för att det är en existerande tjänst så innebär det inte att det bara är att tuta och köra. Vi fick testa oss fram för att se vilka kombinationer av parametrar som gav bäst resultat. För aggressiv cachning resulterar t.ex. i att innehåll som ska uppdateras inte uppdateras i rätt tid, samtidigt som för lite cachning får negativa konsekvenser för prestanda.
Strukturerad data i JSON-LD-format
Strukturerad data är en form av metadata som man lägger in i koden på webbsidorna. Den syns inte för besökarna, men en sökmotor hittar den och använder den för att skaffa sig en bättre bild av sidans innehåll och kunna presentera lite rikare information i sina söklistningar.
JSON-LD står för JSON Link Description och är ett modernt format för just sådan typ av metadata. Det innehåll som var viktigast att beskriva för sökmotorer som indexerade Filmtopp var recensioner. Dels finns det i recensionerna mycket strukturerad data att förmedla, dels är det hjärtat i Filmtopps verksamhet.
Detta är en skärmdump från Google där man ser hur de använder den strukturerade data vi förser dem med för att berika sökträffarna. Stjärnor indikerar vilket betyg filmen fick i recensionen, man ser vem som har skrivit den och en kort beskrivning. Tittar man i källkoden ser man långt mer information, t.ex. när recensionen publicerades, vilket språk den är skriven på, ansvarig utgivare och bilder kopplade till filmen. Bilderna dyker upp om man gör en bildsök med samma information på Google.
För att Google ska kunna placera den film som recenseras i sitt "semantiska universa" så talar vi också om för sökmotorn att denna film (Bait) är samma film som man hittar på https://www.imdb.com/title/tt9652782/. På så vis kan Google koppla ihop filmen med recensionen och därmed öka chanserna att recensionen dyker upp i sökresultatet för svenska användare som intresserar sig för filmen.
Annonser
Filmtopp tar inte betalt för sitt innehåll utan det finansieras helt och hållet med annonser. Utan annonsintäkter, inga recensioner. Det gör annonslösningen lite extra viktig.
Framför allt sociala medier har lärt användare att det är bekvämt scrolla sig till nytt innehåll istället för att klicka. När man närmar sig slutet på en sida laddas nytt innehåll att ta till sig. Detta sätt att serva användarna med innehåll har vi implementerat på Filmtopp - bara att scrolla på och läsa. Dock kan det ställa till problem för just annonsfinansierade webbplatser om man inte implementerar det på rätt sätt. Annonslösningar är byggda på begreppet sidladdning och om man har en enda lång ström av innehåll så är man i praktiken kvar på en och samma sida fast den är väldigt lång och hämtar sitt innehåll från flera olika artiklar.
Lösningen på detta är en kombination av olika aktiviteter som alla syftar till att tillgodose annonssystemets krav samtidigt som man kan ge användarna den behändiga scrollfunktionen. När en artikel tar slut och en ny artikel laddas byter vi URL i webbläsaren, skickar ett meddelande om detta till Google Analytics (besöksstatistik) och tittar om det finns nya annonser som ska laddas och visas. På så vis har vi både tillgodosett användare och annonsörers krav.