Share
Vei tilbake i begynnelsen av denne serien snakket vi mye om innhold og viktigheten innholdet har i ethvert designarbeid. Det er noe som åpenbart bør sees på og sorteres gjennom før du starter et prosjekt, men du får bare se de virkelige resultatene av dette arbeidet når du begynner å designe.
Når vi arbeider med innhold i begynnelsen av prosessen, bør vi prøve å spikre ned en struktur som fungerer for innholdet. Tenk også tilbake til sketching og wireframing stadier av prosessen. Her så vi på ideene vi hadde for å legge ut innholdet på en måte som fungerte bra og hadde et godt hierarki for det. Nå vil vi gjøre innholdshierarkiet synlig og visuelt gjennom våre design.
Fusjonsannonsens hjemmeside bruker innhold til å introdusere brukeren til produktet, samtidig som produktet vises i aksjon. Så hvordan gjør vi det? Først må vi bestemme hva i vårt innhold er relevant for brukerne våre og hvorfor så - vi må kunne rettferdiggjøre de avgjørelsene vi tar. Vi må også se på hva som må være fokus i innholdet vårt, litt informasjon som vi virkelig ønsker at brukerne skal ta hensyn til. Da må vi begynne å oversette dette til en mer visuell form.
Vi gjør dette ved å legge ut innholdet på en måte som relaterer til vår opprinnelige ønskede innholdsstruktur. Dette handler ikke bare om overskrifter og avsnitt, men vi må også tenke mer om hvordan innholdet leses når det er på siden, og vekten som må plasseres på alle de forskjellige elementene. Når vi har noen grunnleggende innhold på plass, kan vi begynne å bruke forskjellige verktøy og hjelpemidler for å fokusere vår oppmerksomhet på å gjøre visse biter som må vektlegges sterkere og skille seg ut mer.
På bunnen av Fusion Ads hjemmeside har de en FAQ der all informasjon er balansert og lett å lese, noe som er super viktig for slike innhold. Størrelsen kan forholde seg til både størrelsen på de enkelte biter av innhold du har i ditt design, så vel som andre elementer, for eksempel bilder, og hvordan disse spilles av mot hverandre. For eksempel, bruk størrelsen til å trekke oppmerksomheten til hovedoverskriftene. Å sørge for at de er kanskje større enn hovedinnholdet viser at de har et annet nivå av betydning, og er noe som brukeren trenger å være oppmerksom på.
Størrelsen er også god for å bryte opp innholdet på siden din i mindre biter og understreke små deler av innhold som er viktige. Du kan også bruke størrelse til å legge vekt på borte fra bestemte elementer eller biter av innhold som du vil være mindre merkbare eller ikke er like viktige som resten. Dette binder også tungt til kontrast - å skape et mer visuelt innholdshierarki som er ganske kontrasterende, legger til den visuelle virkningen i designen din.
Bruke skriftvekter og stiler smart er en flott måte å legge til mer subtil vekt på deler av innholdet ditt som kan bli spisset og stiplet rundt med resten av hovedinnholdet du har. Bruke skriftvekter som er tyngre enn resten av innholdet ditt (for eksempel en dristig versjon av et skrifttype du har i ditt design) eller i en annen skrifttype (for eksempel kursiv) kan være bra for å legge vekt på små biter av innhold du kan ønske å trekke ut og gi litt mer anerkjennelse uten å overvinne resten av designet.
Bruk også fontvekter og stiler for å legge til effekt og sterk vekt på designene dine. For eksempel, hvis designstilen tillater det, kan det være bra å legge til effekt på store overskrifter, som eksempelet du kan se nedenfor, ved å bruke en "lett" vekt på et skrifttype (som ofte er mye tynnere enn standard skrifttypevekter)..
Selv om mange av A List Apart-artiklene er ekstremt innholdsrike, klarer de fremdeles å vise det innholdet på en veldig balansert og fordøyelig måte. Deres bruk av forskjellige skriftstørrelser og stiler hjelper med dette. Variabel farge er en annen effektiv som du kan dele og vise innhold i designene dine. Dette betyr ikke at du skal stryke farge overalt, men bruk den til å subtly legge til fokus på områder av designet ditt, enten ved å blokkere områder av innhold eller bruke det i innholdet ditt for å legge vekt på tekst som kan kreve det.
Hvordan du plasserer innholdet ditt, har stor innvirkning på hvordan det oppfattes av brukerne. Å sørge for at du jobber med rutenettet og justere innholdet ditt, er super viktig. Justering skaper også orden i designen din, og hjelper deg med å fortelle historien om nettstedet ditt og veilede brukerne på en reise gjennom nettstedet ditt.
Farge, justering og grids spiller en stor rolle i The Verges nettsteddesign. Det er mye innhold å se på, men ved å bruke farge kan de gjøre det lettere å fokusere på hvilke moduler eller biter av tekst som er forskjellige for hverandre. Å se på hvor nært eller langt fra hverandre elementer i designet er avstand er viktig for å bygge et visuelt innholdshierarki som har innflytelse og fornuft. Hvis elementer som er relatert er for langt fra hverandre, vil det ødelegge strømmen til brukeren når de leser siden. Imidlertid kan det samme sies for elementer som er fordelt altfor tett sammen. Ting som er for trange, kommer til å være vanskelig å forstå når det gjelder det som har størst betydning eller bør ha størst vekt. Som bruker vil det da være vanskelig å forstå hvordan du finner veien rundt.
Gridset bruker mye mellomrom på hjemmesiden deres - sammen med ulike tekststiler og tilhørende bilder - for å markere nøkkelegenskaper og eksempler. Nå vet du om forskjellige måter du kan legge til visuell vekt eller vekt på bestemte elementer, jeg vil at du skal sette den i bruk i ditt eget design. Prøv å integrere en av hver av de teknikkene som vises ovenfor for å legge til flere av et visuelt innholdshierarki i designet.
Accentsconagua