Share
Velkommen til den åttende leksjonen i vår Web Design for Kids-serie, "design grunnleggende"!
Gjennom hele denne serien har vi fokusert på å bringe et design til liv, men vi har ennå ikke snakket om de beslutningene som gikk inn i designen til å begynne med. I denne opplæringen vil vi gå gjennom noen av de grunnleggende design konsepter som er en del av å lage en god nettside.
Ikke glem å stille spørsmål i kommentarfeltet nederst på denne siden!
Noe annet vi har snakket mye om så langt, er bruker (eller besøkende). Hver beslutning vi gjør i webdesign og hvert designkonsept vi snakker om i denne opplæringen, har alle det samme målet: å gjøre nettsiden så enkel å bruke og forstå som mulig.
Er denne brukeren glad?Design handler om å løse problemer. Hvis brukerne finner det vanskelig å bruke nettstedet vårt, vil de bare forlate. Det er vår jobb å kvitte seg med vanskeligheter for dem, gjør det enkelt å lese og gi dem en overordnet, underholdende opplevelse. Våre beslutninger omfatter ting som innhold, organisasjon, layout, tomt rom, grafikk, farge og typografi.
Innhold er den viktigste delen av webdesign. Det spiller ingen rolle hvor pen vårt nettsted ser ut hvis vi ikke har innhold som brukerne vil lese. En ting vi kan stille oss selv når vi ønsker å bygge et nettsted, er "Trenger folk dette?" Og hvis ja, "Hvilken informasjon er viktig?”.
Det kan være fristende å inkludere så mye innhold som mulig på et nettsted. Rengjøring og innsnevring av innholdet vil faktisk hjelpe brukeren til å få mer informasjon til slutt, fordi det som er viktig vil ikke gå seg vill på siden.
Når vi har innholdet klart, må vi organisere det i kategorier eller relevante grupper, slik at brukeren kan finne alt uten problemer.
Den beste nettsiden vil flyte veldig naturlig og sørge for at brukeren ikke trenger å tenke for hardt om hvor noe kan være.
Tuts + Town-nettstedet har ikke mye innhold, så vi var i stand til å sentrere alt og fremheve våre flotte bilder. Hvis vi skulle ha mer tekst på nettstedet, kan dette bestemte layoutet imidlertid ikke fungere så godt.
For å sikre at nettstedet vårt er enkelt å navigere og hyggelig for brukeren, må vi tenke på det se og føl. Dette er hvor bilder, hierarki (gjør det klart hvor viktig alt er, sammenlignet med alt annet), typografi og farge kommer inn.
På dette punktet vet vi alt om å bruke bilder på et nettsted. Vi inkluderte fire bilder på vår Tuts + Town-side og gikk gjennom ulike typer bilder som skal brukes på nettet i en tidligere opplæring.
Når og hvor å bruke disse bildene og grafikk er også viktig å tenke på. Alle bildene som ble tatt med på vår Tuts + Town-side, var fornuftige ved siden av innholdet de ble plassert med. For eksempel er nettstedet vårt om Tuts + Town, så vi har et pent bilde på toppen av en viktig bygning i byen vår. De tre bildene som følger denne er relatert til gruppene av virksomheter ved siden av dem: hoteller, restauranter og generell shopping.
Vi brukte disse bildene for å gi brukeren en bedre følelse av føle av byen, så vel som hva shopping vil bli som i våre vakre bygninger. Det er viktig at vi ikke tar tak i brukerens oppmerksomhet med et bilde som ikke har noe å gjøre med det faktiske innholdet det er med.
Ikoner er små grafikk som er vant til representere noe.
Et godt ikon er godt forstått og kan gjøre å finne viktige biter av informasjon på en nettside mye raskere.
Her er noen eksempler på spesielt nyttige ikoner:
Vet du hva disse ikonene sannsynligvis betyr?Det er så mye vi kan kommunisere uten å bruke tekst i det hele tatt, og ved å bruke ikoner i stedet for tekst i riktig situasjon, vil vi gi oss en renere, enklere å bruke nettstedet.
Visuell hierarki handler om å velge hva som skiller seg ut og viser forholdet mellom informasjon. Hierarkiet til delene av et nettsted kan vises ved hjelp av en rekke forskjellige stylingsvalg, for eksempel: farge, størrelse, bruk av tomt plass og posisjonering. Alle disse valgene vil bidra til å fortelle brukeren hva som er super viktig, hva er ikke så viktig, og hvilken informasjon er relatert.
Hierarki vises ikke bare av størrelsen på teksten og bildene våre, men også av deres avstand fra hverandre. Lignende innhold bør grupperes tett sammen og avstand fra ikke-relatert innhold.
Dette bildet av Tuts + Town-himmelen er utformet for å sikre at ballongen tar tak i betrakteren først, etterfulgt av skyene. Alt annet i bildene har blitt gjort mindre klart for å sikre at ballongen og skyene skiller seg ut mer.
Bildet ovenfor viser en endring i det vi fokuserer på først. Finner du at du ser skyene først denne gangen, så ballongen?
Det skjer mye i dette bildet, og vi er ikke helt sikre på hvor du skal se først. Det er ingen fargeendring, ingen organisasjon og ingen mellomrom for å fortelle oss hva som er viktig, noe som gjør det litt vanskelig å følge.
Whitespace er det tomme rommet på et nettsted; det gjør det ikke ha å være hvit skjønt! Det er de stedene der det ikke er tekst og ingen bilder. Hvor vi velger å ha denne tomme plassen er veldig viktig fordi den bestemmer hvilke deler av et nettsted som skiller seg ut og hvor godt vi kan lese innholdet.
Bildet over er et eksempel på et nettsted som ikke bruker hvitt plass godt. Det er mye innhold og bilder og ikke nok plass mellom dem alle for å vise oss hva som er viktigst.
Så, la oss se om vi kan rydde opp dette!
Mye bedre. Vi kastet bort noe ikke-essensielt innhold og opprettet en hierarki med mye mer whitespace og bedre organisering, noe som gjør det enklere å lese.
Det hvite rommet vi brukte på vår Tuts + Town-område er faktisk lysegult.
Vi har store flekker med tomt rom til høyre og venstre på siden, samt mellom bildene. Denne plassen hjelper med å markere innholdet vårt mens du sørger for at ingenting er for rotete.
Huske! Det er like viktig å tenke på hva som er ikke På stedet som det er, og det er der hvite rom kommer inn i spill.
Typografi og farge er så viktige for webdesign at de vil ha egne opplæringsprogrammer for å følge denne, så vi vil bare røre på dem her raskt.
Typografi er kunsten å velge og ordne type på en måte som gjør det så tiltalende og lesbart som mulig. Selv om vårt Tuts + Town-område ikke har mye tekst, var det faktisk en stor tanke som gikk inn i skriftvalg og arrangement av det.
Å velge farger er også en veldig kraftig del av design. Farger har betydning og kan bidra til å gi brukerne visse følelser om en merkevare eller et nettsted. Tuts + Byfarger bidrar til å skape en morsom og innbydende følelse for byen vår.
Men igjen, vi snakker om disse mye mer snart!
I denne opplæringen berørte vi noen virkelig viktige designkonsepter. Når vi har innholdsklar, må vi presentere dette innholdet til brukeren vår på den enkleste og mest ordnede måten.
Design handler om å gjøre ting enkelt og morsomt for folk. Vi oppnådde dette med vår hjemmeside Tuts + Town gjennom layout, bilder, farge og hvite plass.
Neste skal vi diskutere typografi, kunsten å velge og arrangere type; en av de mest interessante og morsomme delene av design.
Se deg rundt i byen!
Accentsconagua