080904 – En liten uppdatering
Kollar på sidan igen och nu såg den helt okej ut, fortfarande inte nöjd med vissa kurvigheter i designen men nedtoningen av färgerna på framsidan gjorde mycket för sajtens helhet. Jag låter dock nedanstående text stå kvar i sin helhet här.
Hi-Fi klubben har en ny webbplats. Dom är rätt så nöjda med den.
Jag tycker dock att den sajten ser något amatörmässig ut på vissa punkter.
Häng med…
1. “Credits”-länken i footern
![]()
Ok, det här var något nytt för undertecknad.
I footern som traditionellt innehåller copyright, kontaktuppgifter samt sidkarta så hittar man en “Credits” länk.
Sidan är på svenska men länken är döpt till “Credits”. Sidan är en kommersiell webbshop och framsida för ett rätt så etablerat och välkänt företag, varför döper man då en länk på en sådan viktig sida till “Credits”?
Länken har ingen “title”-tag så man ser ingen beskrivande text komma upp när man hovrar med muspekaren på länken. Dock kan man se i bläddrarens statusbar att länken leder till sidan: “info_om_hemsidan”. Det kanske låter som om jag klagar onödigt mycket men jag stör mig enormt på att sidan är döpt till just “info_om_hemsidan” och inte “information_om_hemsidan” eller ännu hellre “information-om-hemsidan”, samt att sidnamnet inte har något att göra med namnet på länken. Det här är inte bra usability, det här är trams.
Att ersätta RSS-ikonen med en vanlig textlänk där det står RSS hade varit ett mer sobert val. Nu är det ytterligare en färg och en form som besökaren måste bearbeta.
2. “Credits” sidan
Nåja, vi följer Credits länken och hamnar på en informat.i.. förlåt, en “info”-sida om företagets föregående och nuvarande webbplats och här hittar jag fler saker att irritera mig på. För det första finns en kort notis om sajtens CMS-system samt en länk till CMS-systemets sajt. Därefter finns en än större tabubelagd sak inom professionell webbutveckling, en länk till skaparna av hemsidan (inklusive logotyp för detta företag).
Detta beteende att likt en hund markera sitt revir i parken är väldigt 1998.
Naturligtvis kan det finnas andra motiv bakom detta. Kanske är företaget bakom sajten och CMS-systemet besläktade med detta Hi-Fi klubben, kanske fick de sajten billigare mot denna ”reklam” och dessa inlänkar som faktiskt kan vara rätt så värdefulla om de görs rätt (vilket de inte görs här om vi pratar SEO).
3. Framsidan
Vi går vidare till framsidan samt designmallen för sajten.
De flesta av sajtens sidor går i grått, vitt och blått men av någon konstig anledning så har framsidan krönts med en explosion i färger, fonter samt länkar och Flash. Knappar, textlänkar och bildlänkar. Bilder och animationer samt tabbar i en härlig rörighet.
Man skulle kunna kalla det en röd-grön röra, men jag vill hellre kalla det en röd-grön-vinröd-blå-fade-beige-brun-svart-litemerfaderochskuggningar-soppa blandat i en miljon länkar överallt –inklusive opassande rundade hörn där länkarna är placerade på blå bakgrund samt ytterligare skuggningar och gradienter.
Blicken dras mot det blåa. Det blåa i sidans design är det som gör sidan. Inte logotypen, inte Flashen med de minimala fonterna i tabbarna, inte produkterna, möjligtvis den röda tjocka linjen i mitten av sidan som skriker ut ”Upp till 36 månader räntefritt”. Den rundade kanten på de blåa partierna går inte igen på logotypen, trots det får den formen mer tonvikt än logotypen. Förvisso kan man förstå tankegångarna här, det blåa partiet i toppen håller drop-down menyer för produkter, att man som besökare ska dras hit och börja bläddra.
Web 2.0 är runda hörn och luftighet, vitt och sparsamhet, minimalism med ide och tanke bakom. Här har man bara kommit halvvägs.
4. Designmallen
Inom webbdesign så är grått, svart, vitt och blått de säkra korten. Vet du inte vad en kund vill ha går det alltid att ordna en mall i Photoshop med dessa färger samt lite gradienter och skuggningar för att sedan få fram något som ser ”säljande” ut för kund.

Vidare stör jag mig enormt på mallen när man går in på en underkategori för produkter. Plötsligt möts man av en undermeny under det blåa topp partiet som vidare lägger till ytterligare en till svängd kurva till höger om logotypen, denna dubbla form verkar inte gå igen i designen utan hittas bara på detta parti. Denna rundning matchas inte av boxarnas runda kanter vilket är ett stort irritationsmoment och skapar en väldigt stressig och krystad design utan ide eller tanke bakom.

Det sluttande blocket som minskar åt vänster över produkterna är ett annat irritationsmoment i sidans design som känns omotiverad och onödig samt skapar en nervös stämning.
Ibland när jag designar en mall ställer jag mig själv frågan vad en viss komponent i designen bidrar med för något. Oftast kommer jag fram till att den inte bidrar med någonting utan den gör bara designen grötigare och fulare, fast det var tänkt att den skulle göra designen häftigare och mer ”cutting edge” –att ta bort den luftar upp sidan rejält och gör designen mer tajt och sober, ett steg mot web 2.0.
Jag misstänker dock att denna sluttande rektangel är en produkt gjord eftersom en rak rektangel skulle krocka allt för mycket med logotypen samt det avrundade blåa partiet som är den plats på sidan blicken dras mot direkt.
Om denna rektangel vore rak skulle överdelen av sidan bli allt för grötig och plottrig, tänk dig en webshop i Arial, sans-serif 12px omkring år 2001 med tajta boxar.
Jag tror även att sidan skulle vinna på att antingen bakgrunden eller innehålls-kontainerns bakgrund inte båda var vita. Nu är bakgrunden i #F6F6E7 så den är något mörkare än sidans bakgrund, det känns inte tillräckligt trots det.
5. Småsakerna
Jag låter en bild beskriva denna punkt. Klassiskt fel när man jobbar med gradienter i grafiken. Det är exakt sådana här problem man inte vill ska finnas på en sajt som går live. Ser ni var gradienten hackas av och försvinner?
Vad kan man då lära sig av ovanstående?
Det är inte lätt att designa en bra mall för ett CMS-system med fördefinierade områden. Jag vet, jag har själv försökt och gjort det. Det är därför val som Drupal eller Joomla är bättre, där man själv kan anpassa kod och inte behöver stansa ut webbplatser och tvingas till vissa designmönster bara för att systemet är så.


0 Responses
Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.