Webbdesign som inte bör kodas

Jag är en frekvent besökare av communityn deviantArt. Där är jag en ”watcher” av många webbdesigners från hela världen. Likt RSS får jag uppdateringar om när de lägger upp nya layouts. Ofta ser jag layouts som vore en ren katastrof att koda och jag kan inte hjälpa att undra om de här layoutsen säljer….

Min kritik grundar sig på att dessa sidor ser ut att vara designade efter standard höger- och vänsterkolumn, vilket ofta appliceras på HTML sidor. Men kritik ges även till de sidor som ser ut att vara till Flash.

För mycket bilder gör det begränsat

Om ni observerar följande designs så ser ni att de kräver väldigt mycket bildgrafik. På många av de blir det svårt att utnyttja CSS på rätt sätt. För mycket bilder på bakgrunder med komplexa gradienter gör att designen blir fast och livlös, trots att den må vara snygg på bild.

http://area50one.deviantart.com/art/0121-Design-Studio-69895618

Vi börjar med denna färglada designen. Det första jag undrar är – ”Vad händer med den färglada formen bakom loggan om man skulle ha större upplösning?” Något som designern förmodligen inte tänkt på. Lägg även märke till menyknapparna och deras reflektion. En relativt onödig bildsekvens som kräver bortkastad precision och tar upp onödig plats.

Om denna sidan skapats i Flash så kan jag acceptera menyn. Dock kvarstår problemet med formen bakom loggan. I Flash man kan styra bakgrunden efter användarens upplösning, men det hjälper knappast här. Ska formen då sträcka sig och bli rak när upplösningen blir 1280×1024? Skulle inte tro det…

http://osec.deviantart.com/art/creino-83102350

Här har vi en layout som du lär få vänta i mer än 7 sekunder innan den laddat färdigt. Om du gör en sån här layout får du räkna med att klippa och klistra extra mycket. Det finns ingen möjlighet till att repetera bakgrundsbilder då alla knappar, rubriker och text har någon form av gradient med rundade hörn som inte ens CSS3 kommer att kunna lösa.

Till alla som försvarar denna layouten med flashteknologi vill jag fråga, vad hade en sån här layout vägt i Flash? För det finns ingen chans att bygga denna i HTML. Lägg märke till den tänkta hover-effekten på menyn. Är det något du hade velat skapa en klass för?

Snygg, men platt och livlöst

http://raisedsighty.deviantart.com/art/Digitalfriend-81868318

Här har vi en design som mycket väl kan göras i Flash. Absolut inget omöjligt…Men snygga former och häftiga effekter räcker inte för att den design ska fungera. För många glömmer detta och går loss på att göra överflödiga highlights och konstiga skuggningar.

Det negativa med denna trots allt väldigt snygga layouten är att för mycket effekter gör att den ser platt ut. Visst, det går att skapa animationer i Flash, men med en sån här komplex design blir det svårt att inte göra besökaren yr av alla de visuella intryck som dessutom rör sig. Sånt här slutar med att besökaren blir imponerad av det snygga, men missar totalt vad som står på sidan.

http://bravedesign.deviantart.com/art/Private-Planes-90575293

En väldigt kodbar snygg hemsida med snygga element för att lägga till det där lilla extra i layouten. Nånting talar dock emot för att koda denna sidan. Det ska vara en flygbokningssajt, men hur många flygbokningar kommer det att göras med denna layouten? Trots det snygga flygplanet hade jag inte bokat något flyg här, det säger mig inte mycket att se 3D-modellerade flygplan när jag faktiskt vill åka nånstans.

Nej, en snygg design som inte bör kodas för att bilderna är för tunga. Den fasta precisionen som krävs för att denna layouten ska fungera gör att sidan ser platt och livlös ut. Det ser helt enkelt ut som en bild, en annons och inte en hemsida.

Skärmupplösning, någon?

http://osec.deviantart.com/art/simple-portfolio-88060365

Denna designen är döpt till ”Simple Portfolio”. Vad som gör den simpel har jag svårt att förstå. Den stora bakgrundsbilden täcker inte ens en skärmupplösning på 1440×900 och de transparenta blocken gör att vi återigen får se en layout som kräver fast precision, vilket resulterar i livlöshet.

Observera de matta och transparenta loggorna längst ner. Vad ska hända när man för musen över de egentligen? Inget genomtänkt alls, men denna layouten lämpar sig varken för Flash eller HTML.

http://raisedsighty.deviantart.com/art/Photographer-85751742

Jag hade mer än gärna velat se denna sidan live. Kanske någon gång i framtiden, när webben har blivit en filmduk och de små papegojorna längst till vänster flyger och äter upp den lilla nyckelpigan samtidigt som loggan sakta fade:as fram och menyn dyker upp från trädet.

En trevlig idé, dock inte så tillämpbar tyvärr…

Fler inlägg om Design

• Min arbetsprocess
• 5 tips till användarvänligt innehåll
• Bloggdesign
• Anlita rätt webbdesigner
• Olika stilar i webbdesign
• Läsbarhet – en viktig faktor i design