Hvorfor ser alle websteder ens?

Internettet lider af en mangel på fantasi, så jeg bad mine studerende om at redesigne det

Foto af Pankaj Patel på Unsplash

Dagens internet er intetsigende. Alt ser ens ud: generiske skrifttyper, ingen layout til at tale om, udskiftelige sider og fravær af ekspressivt visuelt sprog. Selv mikrotypografi er et rod.

Webdesign i dag ser ud til at være drevet af tekniske og ideologiske begrænsninger snarere end kreativitet og ideer. Hver side består af containere i containere i containere; undertiden tekst, andre gange billeder. Intet er virkelig designet, det antages ganske enkelt.

Ironisk nok har dagens webteknologier enorme designfunktioner. Vi har evnen til at implementere næsten enhver tænkelig idé og layout. Vi kan oprette radikale, overraskende og stemningsfulde websteder. Vi kan kombinere eksperimentel typografi med generative billeder og interaktive oplevelser.

Og alligevel er selv websteder for designere baseret på containere i containere i containere. De mest populære portaler for annoncer på nettet - Dribbble og Behance - er så grundlæggende kedelige, at de stort set er udskiftelige. (Se blybillede.)

Dribe versus Behance. Kan du se forskellen? Tak til David Rehman for at have påpeget dette for mig. Alle skærmbilleder: Boris Müller

Hvordan skete dette?

Der er et par grunde. Teknologiske rammer som Content Management Systems (CMS) og blogplatforme som WordPress er baseret på skabeloner. Websider på disse rammer er ikke individuelt udformet, men genereres undervejs ved at sammenstyre forskellige medietyper som billeder, overskrifter, kropstekst og videoer. Skabeloner er ikke design. Det er snarere regler for at kombinere relaterede datatyper. Ud over skabelonen tilbyder disse platforme brugerne typisk ingen måde at påvirke en sides visuelle udseende. Hvad du ser er, hvad du hældte ind i skabelonen.

Med andre ord, skabeloner er indholds-agnostiske. Og det er problemet.

Et af de grundlæggende principper for design er en dyb og meningsfuld forbindelse mellem form og indhold; form skal både reflektere og forme indhold. At adskille dem bryder dette princip og skaber beholdere med generisk indhold. I designmæssig forstand er skabeloner meningsløse; formen tilføjer intet til indholdet.

Et af de grundlæggende principper for design er en dyb og meningsfuld forbindelse mellem form og indhold.

Der er mange andre grunde til webdesigns manglende kreativitet. De fleste af dem er økonomiske og pragmatiske. For eksempel er det tidskrævende at designe individuelle sider. I betragtning af hastigheden af ​​online nyheder og hyppigheden af ​​nye artikler har store websteder simpelthen ikke ressourcerne til at designe en side fra bunden af. Desuden er webdesign stadig et spørgsmål om teknisk ekspertise: HTML, JavaScript og CSS forbliver udfordrende værktøjer for designere. Der er ingen webdesign svarende til de direkte og forpligtende arbejdsgange til desktop-publiceringsapplikationer.

Jeg formoder, at designernes kreative og intellektuelle dovenskab også er skylden. I en alder af mobil-første, generisk, rammedrevet udvikling ser det ikke ud til, at der er noget der bryder sig med den visuelle og kontekstuelle integritet på en webside.

Hvordan kan vi tackle denne udfordring? Hvordan kan ekspressive og avantgarde-websteder se ud i dag?

Nogle gange, hvis du ønsker at designe fremtiden, er du nødt til at genopdage fortiden.

Retro webdesign

Jeg designede mit første websted for omkring 23 år siden på forsknings- og udviklingsgruppen på University of the Arts i Bremen, Tyskland. At oprette websider var varmt på det tidspunkt. Internettet var ung. Sider udløste min fantasi.

I midten af ​​halvfemserne kæmpede vi med HTML-begrænsningerne. Vi kunne kun bruge websikre skrifttyper som Arial, Times eller Verdana. Vi var nødt til at bruge tabellayouts, monospacet skrifttyper eller GIF'er, hvis vi ville gøre noget spændende. HTML var oprindeligt rent indholdsdrevet, og vi var nødt til at arbejde mod teknologien for at designe en side.

På samme tid eksploderede eksperimentel typografi. Fra Jan Tschicholds Die Neue Typographie i tyverne til de computerdrevne layout af April Greiman i firserne udfordrede designere status quo og forsøgte at finde et visuelt sprog, der repræsenterede ideerne og revolutionerne i deres epoker. I midten af ​​1990'erne muliggjorde en usædvanlig kombination af teknologiske og kulturelle fremskridt en meget radikal race af grafisk design. Du kunne se det i arbejdet med Irma Boom, David Carson, Paula Scher, Neville Brody og mange andre.

Sammenlignet med den visuelle eksplosion af den grafiske designverden var de tidlige websider dog stadig temmelig lamme. (Webdesignmuseet dokumenterer dette meget godt.)

Vi ønskede at lave grafisk design i browseren, men ingen vidste hvordan - eller hvilke fejl der kunne begås. Der var ingen forventninger til, hvordan en webside skulle se ud. Der var ingen standarder. Intet CMS (næsten), ingen CSS, ingen JS, ingen video, ingen animation.

Nu er et så godt tidspunkt som enhver at udfordre internetets visuelle overensstemmelse.

Spol frem til 2018, og vi kan gøre alt i en browser. Fra layouts i massiv skala til mikrotypografi, animation og video. Og hvad gør vi med disse utrolige muligheder? Beholdere i containere i containere. Gigabyte af visuelt intetsigende mobile-førstesider forurenet med JavaScript. Generiske skabeloner, der følger de samme visuelle regler. Hvis mit yngre selv kunne have set tilstanden i webdesign 23 år senere, ville han have været meget skuffet.

Webdesigns problem er ikke teknologiens grænser, men grænser for vores fantasi. Vi er blevet alt for lydige mod visuel overensstemmelse, økonomisk levedygtighed og antagede forventninger.

Imidlertid skaber enhver krise en mulighed. Nu er et så godt tidspunkt som enhver at udfordre internetets visuelle overensstemmelse. Desværre, jeg er for gammel og for borgerlig til at komme med en radikal, eksperimentel og avanceret tilgang til webdesign. Men jeg kan bede mine studerende om at gøre det.

I 2017 gav jeg en webdesignklasse på Interface Design-programmet i Potsdam, Tyskland. Hvert hold blev bedt om at komme med en redesign til et eksisterende websted. Opgaven var meget klar: Behandl browseren som et tomt lærred og skab udtryksfulde, fantasifulde visuelle oplevelser. Brug det teknologiske potentiale i aktuelle webteknologier som en kanal for din kreativitet. Bliv ikke begrænset af spørgsmål om brugervenlighed, læsbarhed og fleksibilitet. Har en holdning. Se bort fra Erwartungskonformität.

Jeg var meget tilfreds med resultatet af klassen. (Du kan se alle resultaterne på denne oversigtsside.) Her er fire projekter, der repræsenterer forskellige tilgange til udfordringen.

1. ZKM af Frederic Haase og Jonas Köpfer

ZKM's redesign

Frederic og Jonas valgte webstedet Zentrum für Kunst und Medien (ZKM) som udgangspunkt for deres eksperimenter og udforskninger. Et meget passende valg, da ZKM er et af de mest fremtrædende udstillingsrum for mediekunst i Tyskland, men ZKMs websted er temmelig konventionel. Det er funktionelt, men det mangler den avantgarde-påstand, der formidles af kunstværker i udstillingerne.

Frederic og Jonas mål var at designe et koncept, et visuelt sprog og en teknisk opsætning af ZKM-webstedet, der repræsenterer museets progressive tilgang. Kernen i deres koncept er en generativ designmotor: Hver gang en side indlæses, oprettes et nyt layout.

Se redesignet af ZKM.

2. Streem af Daria Thies, Bela Kurek og Lucas Vogel

Streems redesign

Streem er et kunst- og gademagasin. Det er både en scene for kommende kunstnere og en platform for sociale problemer. Streem inkluderer arbejde fra illustration, maleri, fotografering, design, skrivning og journalistik. Daria, Bela og Lucas kombinerede disse forskellige påvirkninger og baserede deres design på en konceptuel bystruktur. Til deres prototype oprettede de fire forskellige kvarterer, der hver repræsenterer en del af magasinet. Deres tilgang kombinerer stærke illustrative stilarter med rumlig typografi for at skabe en læselig by.

Se redesignet af Streem.

3. Medium af Amelie Kirchmeyer og Fabian Schultz

Medium's redesign

Amelie og Fabian indtog en meget strukturel tilgang. I stedet for at finde en passende form til en bestemt historie, var deres mål at opløse en webside og opdele den til semantiske, syntaktiske og statistiske egenskaber. Deres idé var at demonstrere HTML's fluiditet og iboende formbarhed. De dekonstruerede Medium-indlæg og skabte et miljø, der giver læserne mulighed for at bryde lange blokke tekst til eksperimentelt typografisk rum.

Se redesignet til Medium.

4. Hacker News af Fabian Dinklage og Florian Zia

Hacker News redesign

Fabian og Florian gjorde Hacker News til en interaktiv visualisering. Webstedet med sociale medier er en nyhedsaggregator, der fokuserer på datalogi og informationsteknologi. Dens design er bare knogler, men det har kompleks funktionalitet til afstemning og diskussioner. Fabian og Florian har taget den eksisterende struktur og forvandlet den til et typografisk rum med tidslinjer og netværk. Den visuelle præsentation er baseret på rækkefølgen og forbindelserne mellem nyheder og kommentarer. De tilsluttede også deres design til API'en til Hacker News, så du faktisk kan bruge det til at læse webstedet. Se redesignet af Hacker News.

David Carson sagde engang, "ikke forveksle kommunikation med læsbarhed." Vi bør anvende dette råd til den aktuelle tilstand af webdesign. Læsbarhed, brugervenlighed, lydhørhed og især tilgængelighed er essentielle kvaliteter på den moderne web. Men de bør ikke definere og begrænse det visuelle repertoire. Hvis du sidestiller stereotyper med brugervenlighed, har du hverken forstået visuelt design eller menneskeligt centreret design.

For det første vil jeg gerne se mere radikalt, generativt, stemningsfuldt, tankevækkende, passende, indholdsspecifikt og intelligent webdesign. Jeg vil gerne genopdage internettet som et rum til designeksperimenter. Jeg vil gerne blive overrasket oftere. Jeg ved ikke, hvad Internettet vil se ud i yderligere 23 år, men jeg håber bestemt, at det ikke ser ud på Internettet i dag.

Opdatering: dette essay har modtaget en masse opmærksomhed og indledt en meget livlig debat! Tak for al din feedback - Jeg skrev et kort svar på de hyppigste punkter i debatten: "Balance kreativitet og brugervenlighed":