En intressant visuell närvaro ovanför rullningen är det första intrycket som en användare får av en webbplats. Huruvida den användaren fortsätter att klicka kan bero på ett antal saker, inklusive bilder, läsbarhet och övergripande intresse för innehållet.

Den här månaden tittar vi på tre trender som gör en distinkt förstrycks-mörk färg överlagringar på bilder, brutalism och ihåliga bokstäver. Här är vad som trender i design denna månad:

1) Mörk överlagring på bilder

Det spelar ingen roll om hjältebilden fortfarande är eller rör sig, en mörk färgöverlagring kan hjälpa till med ens färger på ett sätt som gör det lättare att lägga till text och andra element i ett lager ovanpå bilden. Även om det här kanske låter som en genväg i början, finns det mycket värde i denna teknik.

Den främsta orsaken att välja färgöverlägg är att förbättra läsbarheten. De flesta bilder innehåller ljusa och mörka färgvariationer, vilket gör det till en utmaning att lägga till bokstäver som är läsbar på varje enhet. Även om det finns en perfekt placering för bredbildsskärmar på skrivbordet, kan samma bild- och textkombination göra odecipherable på en mobil skärm.

Det är där en färgöverlägg hjälper. Den halvtransparenta tvätten av färg över en bild eller video ska förstärka kontrasten. Sedan har vit eller ljusfärgad bokstäver en plats och kommer att förbli läsbar.

Mörka färgöverlagringar är visuellt intressanta av andra skäl. Fasta inte fast i fällan som mörkret betyder svart eller grått. Ett mörkt överlag kan vara vilken som helst färg, som den gröna som används av Internetum, nedan. Ett roligt eller ovanligt färgval kan hjälpa till att dra användare in i designen.

Ett mörkt överlag kan göra en sak: det kan hjälpa till att kamouflera en bild eller video som du inte vill vara i framkant av designen. Detta kan bero på att bilden är lite gammal, lite mjuk när det gäller komposition eller bara en som faller lite platt. En färgöverlägg kan ändra stämningen i bilden, göra den lite mindre framträdande och hjälpa designfokusera mer på annat innehåll, till exempel text, samtal till handlingsknappar eller andra grafiska element.

Överlägg kan vara mycket mörka, till exempel Digital Werk eller kan ge en subtil mörkare på sätt som Lytton Living. Du vet att du har rätt balans när du fortfarande kan se bilden och alla lagrade element är lätta att läsa.

internetum
digitalwerk
Lytton

2. Brutalism

Ful. Hård. Skarp. Upptagen.

Dessa är bara några av de ord som vissa har använt för att beskriva brutalismens webbdesign. Men bara för att en designer experimenterar med brutalism betyder inte att designen är en heta röra. Det är ganska motsatt.
Denna stil sysslar med en annan stil och känslighet som innehåller saker du ser och saker du inte kan. Ben McNicholl beskrev det här sättet i ett inlägg för Envato : "Brutalism" kommer från franska ordet "raw", så kom ihåg när du skriver din kod.
"En webbplats behöver inte vara en fasanshow av oorderade bilder och kollapsande teckensnitt. hur koden har skrivits är också symbolisk för stilen. Inbäddad CSS, otabbar kod, HTML-tabeller, listan fortsätter. "
Det finns tillräckligt med exempel på brutalism att det finns en helhet webbplats galleri ägnas åt dessa mönster. I introduktionen hänvisar webbplatsen till brutalism på så sätt: "I sin robusthet och brist på oro för att se bekvämt eller enkelt, kan brutalism ses som en reaktion av en yngre generation på dagens webbdesigns ljushet, optimism och frivolitet. ”

Det som är särskilt intressant om brutalismen är att designen ser så annorlunda ut än alla de platta och minimala stilar som har varit så utbredd. Om du stöter på en av dessa mönster kan du inte låta bli att stoppa, titta och utforska. Oavsett om du tycker att det är vackert eller fult eller något däremellan, det är det ultimata målet för någon webbdesign.

college-art
aku
översikt

3. Hål bokstäver

Brev med intressanta fyllningar börjar dyka upp överallt. Det som är intressant om denna trend är att det har två tydligt olika utseende:

  • Hål bokstäver över en bild eller färgad bakgrund, till exempel C & C Coffee.
  • Brevfyllning fylld med en bild på en vanlig bakgrund, till exempel The London Loom, med en alternativ version där du nästan kan se bilden med en bakgrund med subtil insyn, till exempel Min mamma före mig.

Även om denna trend har mycket visuell påverkan och det är mycket roligt kan det vara lite svårt att genomföra.

När det gäller ihålig bokstäver över ett foto finns det inte alltid så många typsnittalternativ att välja mellan och konstruktörer kan fastna med samma få teckensnitt. Det här är inte en idealisk situation för webbprojekt alls. Det finns mer flexibilitet för icke-webbprojekt där du inte behöver oroa dig för fontintegration och rendering.

När det gäller fylld bokstäver är tricket att få det att fungera att bilderna i bokstäverna måste kunna urskiljas. Om användarna inte kan berätta vad bilden är så kommer designen inte att vara effektiv. För att hjälpa de flesta designers väljer tjocka blockbokstäver här så finns det mer utrymme för bilder att visa igenom. Bilder är ofta mer abstrakta, eller textilier eller landskap, eftersom den mänskliga hjärnan tenderar att fylla i blankorna i bilden och det fungerar fortfarande för dem. Det är mycket svårare att använda bilder med ansikten eller föremål som du behöver se på ett visst sätt eftersom de måste placeras perfekt inom tecken.

Trots att det är lite utmanande, kan båda bokstäverna vara visuellt intressanta och roliga att skapa.

kaffe
London-vävstol
mor

Slutsats

Till skillnad från några andra trender där du kan genomföra små förändringar, presenterar dessa tre alternativ mer av en övergripande stilskift. Kan du se dig själv med hjälp av någon av dem i framtida projekt?
Vilka trender älskar du (eller hatar) just nu? Jag skulle gärna se några av de webbplatser som du är fascinerad av. Släpp mig en länk på Twitter; Jag skulle gärna höra från dig.