Articles

21 prisvindende Websiteebstedsdesign & hvad de gjorde rigtigt

internettet er fuld af nogle fantastiske og inspirerende websebsteder.

disse specielle snefnug er dem, der finder innovative måder at udnytte enhver mulig design og teknologisk grænse til deres fordel for at skabe oplevelser, som mange organisationer ønsker, at de havde.

at finde disse diamanter i det uslebne kan være en utrolig udfordring, især hvis du planlægger et redebstedsredesign og er usikker på, hvor du skal starte.,heldigvis er sitesebsteder som CSS a .ards, a.. ,ards, .ebby a .ards osv. der er for at hjælpe med at fremhæve de sitesebsteder, vi skal skubbe vores egne til at reflektere.

for At hjælpe dig med at vise nogle af disse, der tildeler vindende steder, jeg dykkede ned i hver af disse award-til ære for websteder og trukket dem, der ikke kun er smukke eksempler på moderne design, men også motion, UX, UI, information architecture, conversion rate optimization, video markedsføring, taktik til deres fulde potentiale.

når man ser på hvert siteebsted, er det vigtigt at forstå, at disse ikke skal ses som skabeloner, du skal forsøge at kopiere., I stedet analysere dem og finde de dele af dem, der udnytter design/marketing/indhold strategier, der kunne repurposed og revideret til noget, der passer til dit publikum.

med det sagt, nyd disse 17 killer eksempler på prisbelønnede websiteebsite designs gjort rigtigt.

snarere se? Her er 5 af mine favoritter!,

ESPN Sports Programmering

Featured på Awwwards

ESPN tager sin sport indhold og programmering til det næste niveau med denne dynamiske og iøjnefaldende websted, fyldt med store, high-resolution billeder og video. Theebstedet bruger baggrundsvideo til at holde trit med sportsnetværkets energi og sektioner med subtile hover-og overgangseffekter og for at holde brugeroplevelsen glat., Skyderen’ featured sports ‘ er grundigt fortryllende og gør et fremragende stykke arbejde med at fremvise hver af sportsgrene sammen med interessante statistikker og informative detaljer om tilgængelige programmer.

Montage

Featured på Awwwards

Montage tager viser-fra sit produkt til det næste niveau med denne nemme at manøvrere hjemmeside, der klart beskriver, hvad produktet er, hvordan det ser ud, produkt kvalitet, og udtalelser., Siteebstedet er et glimrende eksempel på en tilgang, du kan bruge til at fremhæve dit produkt og de vigtigste punkter, som dine brugere ville være bekymrede for at finde svar på. Sticky sub-navigation giver brugerne mulighed for nemt at navigere rundt på siden for at finde præcis, hvad de leder efter.

Zillow

Featured på Webby Awards

Finde det perfekte hjem handler om at være i stand til bekvemt forskning præcis, hvad du leder efter, skal du gemme og gemme, hvad du kan lide, og gør det let at finde det hele på et senere tidspunkt., Zillo.rammer neglen på hovedet for alle tre af disse punkter med sin intuitive fast ejendom site. Søgeområdet inden for hero-området gør det nemt for nye brugere hurtigt at vælge og søge lister uden at skulle kigge efter en skjult søgeside.

Revols

Featured på CSS Design Awards

Revols tager en dristig tilgang på sin hjemmeside, ved at udvide sin lille, sofistikeret hovedtelefon ved hjælp af makro fotografering og video., Fotografering og video gør theebstedet utroligt produktfokuseret, så dets brugere langsomt bliver mere og mere nedsænket i den oplevelse, disse hovedtelefoner kan give dig. Den store fontbehandling på dette .ebsted er også en dejlig touch og tilføjer til øreproppefotografering med større end livet.

Fiftythree Blyant

Featured på SiteInspire

Fiftythree fanger alle de funktioner og fordele for sin Blyant, Pen, hele denne standalone produkt side., Disse funktioner og fordele ledsages af billeder for at illustrere produktet i aktion, så brugeren lettere kan visualisere dem, og hvordan de kan anvende produktet. Layoutet og den visuelle behandling af produktets anatomisektion er også meget unik og fungerer som en dynamisk måde at få brugerne til at læse mere om produktet, i modsætning til statiske sektioner den ene efter den anden.,

Morgan Stanley

Featured på Webby Awards

i Modsætning til traditionelle produkt-fokuserede websteder, Morgan Stanley overskrifter sin hjemmeside med en artikel, de håber at drive en betydelig mængde trafik til (især da det forbinder med ferie familiesammenkomster vi forventes at deltage). Resten af layoutet ud over hjemmesiden hero spiller med et gitterfokuseret layout for at organisere sortimentet af de seneste artikler, de har sendt.

7., Styrket

Featured på Awwwards

sat Skub i tog, hvad der kunne have været set som et gennemsnit skateboard til det næste niveau ved at indføre utroligt detaljerede billeder af sit produkt, ledsaget af detaljerede beskrivelser på sin hjemmeside. Siteebstedets grå toner og hvide baggrunde hjælper med at holde fokus på de orange call-to-action knapper og det farvestrålende skateboard, de bruger som et eksempel på produktet., Jeg elsker også det faktum, at de har en blog, der ser ud til at fremhæve problemer, de har/adresserer med produktet, hvilket tilføjer et vidunderligt niveau af gennemsigtighed til virksomheden.

8. Wozber

Featured på SiteInspire

Wozber gjorde en killer job at nedbryde trin-for-trin proces, det tager at sørge for, at dit cv er perfekt til at drømme job, du søger. Dens hjemmeside skitserer tydeligt trinene foran, som derefter forklares yderligere i de enkelte afsnit nedenfor.,bstedet har endda eksempler på nogle af de CV ‘ er, de har lavet, hvilket gør det nemt for dig at se nøjagtigt, hvordan det færdige produkt kan se ud, før du beslutter dig for at tilmelde dig.

Opus Vokser

Featured på CSS Vinder

Opus-drev hjem den økologiske, naturlige og sundhedsmæssige fordele af sin jord ved at tilføje overflod mængder af grønne områder i hele ejendommen. Med så mange forskellige muligheder for pottejord derude, det kan være svært at beslutte, hvilken der er den sundeste for dine planter eller have., Opus beviser, at produktet er bedst ved at adressere ingredienserne og de fysiske egenskaber, som jordbunden tilbyder det segment det fra dit traditionelle mærke. Jeg var også meget glad for at se, at de bloggede og lejlighedsvis blandede sig i mere dejlige indlæg for at hjælpe med at nå bredere publikum som denne.

Nul Finansielle

Featured på Awwwards

alt for ofte softwarevirksomheder, der har meget smukke hjemmesider, der helt mangler nogen billeder af deres produkter., Hvis du i øjeblikket er i denne position og leder efter inspiration, er Zeroero et fantastisk sted til inspiration. Brugen af billeder ledsaget af beskrivende tekst, der forklarer hver, gør produktet meget mere reelt og relatabelt for interesserede.

Cap HPI

Featured på Awwwards

Cap HPI hjælper med at give en bred vifte af biler data til en bred vifte af forskellige personas. Med det i tankerne, Cap HPI har bygget sin hjemmeside, så disse personas har en nem tid at finde den type løsning, de leder efter., For at lette dette har de optimeret navigationen, så du hurtigt kan forstå, om CAP HPI kan hjælpe dig eller ej. udover alt dette giver siteebstedets design, subtile animationer og unikke farvepalet en dejlig og forfriskende visuel oplevelse på et marked, der ellers kunne have et meget intetsigende corporate layout.

Pilekogger

Featured på Awwwards

Selv om stedet er mindre end andre, Pilekogger stadig formår at skinne blandt resten.,
Jeg elsker det faktum, at de udnytter følelser straks, når du ankommer på hjemmesiden med baggrunden og kopien. De formåede endda at få en tilmeldingsformular derinde, snarere end kun at inkorporere en knap, der sender besøgende til en separat tilmeldingsside.
Pilekogger ‘ s produkter og funktioner sider gør et smukt stykke arbejde for at vise den udseende af software-ledsaget af små interaktive elementer til at hjælpe med at vise, hvordan produktet fungerer.,

Worordstack

fremhævet på CSS-vinderen

Worordstack gjorde et fremragende stykke arbejde med at holde sit websiteebsted lille, kondenseret og organiseret, mens det stadig leverer al den værdi, produktet tilbyder. Den store, fuld bredde billedsprog og konsekvent brug farvepalet og styling hele siderne gøre for en utrolig ensartet design, der par meget godt med farveganen af Soft .aren.,

Campos Og

Featured på CSS Design Awards

Visse kunder elsker hengive sig til produkter, som de ved, er lavet og skabt af virksomheder, der ønsker at levere kvalitet til deres kunder. Og virksomheder som Campos Coffee ved nøjagtigt, hvordan de skal imødekomme disse købere.

Campos bruger sit websiteebsted som en måde at fremhæve den tid og indsats, deres team lægger i deres kaffe, hvordan det gavner samfundet, og hvorfor du har det godt med at købe det., Alle disse punkter bliver pakket ind i en vidunderlig historie, som de viser på hjemmesiden og på alle andre siteebstedssider.

Kin

Featured på SiteInspire

i Stedet for kun at fremhæve træk, Pårørende tager det til det næste trin og udnytter sin hjemmeside at fremvise fordelene af sine produkter, så folk ved præcis, hvad produktet kan bruges til, før venturing ud til andre områder på webstedet.,

Med hensyn til design hjælper Kins brug af den større serif-skrifttype på hele siteebstedet ledsaget af ægte kontorfotografering med at tilføje en enorm mængde troværdighed til sit brand. Det lader også kunden vide, at der er reelle, nacn mennesker bag det fantastiske produkt, snarere end at overlade det til Gæt.

SeaStreak

Featured på Webby Awards

ønsker du at rejse med færge, men ikke sikker på hvor de skal gå? SeaStreak har dig i gode hænder. Siteebstedets brugergrænseflade er organiseret, så du hurtigt kan opbygge en færgeplan, der fungerer for dig., Jeg finder også navigationen ekstremt interessant. Menuen ruter og tidsplaner falder ned for at vise dig alle de tilgængelige indstillinger, og menuen dagsture og flugt er allerede segmenteret for brugere, der er på theebstedet på udkig efter nøjagtigt det. Disse elementer hjælper med at skabe bekvemmelighed for brugeren og hastigheden, så de ikke efterlades i et mørkt hul på siteebstedet og prøver at finde ud af, hvordan man søger efter det, de ønsker.,

S Flaske

Featured på CSS Vinder

S Flaske er slanke produkt er givet særlig behandling i hele design af website for at fremhæve dens innovative skønhed og fordele. Brug af flasken i forskellige animationer har gjort siteebstedet mere engagerende og tilføjer interesse for at lære mere om produktet.

Ocean Sundhed Indeks

Featured på W3 Awards

Ocean Sundhed Indeks hjælper med at bringe den skønhed af havet til web med sin fantastiske layout, billeder og kølig tone, farve-paletten., Den store brug af skrifttype på tværs af hjemmesiden hjælper også med at holde det let at læse og professionelt.

19. WealthSimple

Featured på Awwwards

brug af plads på Wealthsimple gør det utroligt nemt at segmentere hver sektion af dens sider. De smukke GIF ‘ er på hele siden giver også en spændende oplevelse, især da de ikke relaterer sig direkte til investering.
Theebstedet får investering til at virke så meget sjovere., Snarere end fremvisning af regneark, stakke af kontanter, og tarvelige sprog, de sørg for, at de differentiere WealthSimple brand, så det ikke ser ud som alle andre investeringer, software eller service

Toggl

Featured på CSSDesignAwards

De finurlige animation på Toggl ‘ s hjemmeside side henleder brugerens opmærksomhed straks ved ankomsten. Denne billedstil bæres gennem de resterende sektioner med enkle grupper af indholdsbokse direkte ved siden af hver.Toggl lægger også stor vægt på, hvordan tingene animerer ind på sidebelastningen., For eksempel falder Toggls prisside i helten og derefter hvert prisområde fra venstre mod højre. Opmærksomhed på disse detaljer gør fornemmelsen af siteebstedet så meget mere poleret.

Shademaster

Featured på CSSDesignAwards

Kigger på tagdækning lyder måske ikke sjovt for den gennemsnitlige boligejer, men Shademaster gør sikker på, at det kan være.

de segmenterede strategisk den type arbejde, de gjorde i tagdesign i nav, som sender brugeren ud til individuelle sider, hvor de kan planlægge og designe deres ideelle tag og modtage et tilbud., Denne tilgang gør tagkøbsprocessen så meget mere autonom for brugerne; der er ikke behov for nogen at besøge dit hus bare for at få noget i gang.

Leder du efter din egen hjemmeside redesign?

dit websiteebsted er beregnet til at være ansigtet på din online tilstedeværelse og en måde at repræsentere dit brand praktisk talt på. Hvis din hjemmeside ikke opretholde et design, der matcher den måde, du ønsker at blive opfattet, så vil det i sidste ende undlader at udføre optimalt., IMPACT elsker at arbejde med andre virksomheder i et samarbejde for at forstå, hvordan du vil have dit websiteebsted virkelig til at se ud, så vi kan hjælpe dig gennem strategien for at gøre det til en realitet.

tror det er tid for dit websiteebsted at få den ansigtsløftning, det fortjener, til bedre at repræsentere dit brand og i sidste ende øge dets ydeevne? Tal med os og fortæl om dit websiteebsteds mål og ambitioner.