Share
Det er sannsynligvis den minst glamourøse delen av webdesign, men informasjonsdesign er ikke minst viktigst. Å finne og konsumere informasjon er den kvintessige nettoppgaven, langt overgående å kjøpe, spille og kommunisere, som alle inneholder en god del av informasjonstypen selv. Hvordan brukerne finner og benytter seg av all den informasjonen blir påvirket av hvordan den er strukturert og presentert. Dermed skal hver webdesigner være utstyrt for å ta kvalifiserte og informerte beslutninger om hvordan du gjør dette.
Informasjonsdesign er et problem som blir mer og mer komplekst jo større nettsiden. Men selv en liten nettside vil ha nytte av en metodisk, trinnvis prosess for å finne ut hvordan du bestiller og organiserer nettstedets innhold. Her er noen enkle trinn du måtte ønske å ta:
Så for et enkelt restauranteksempel kan du finne ut at du har tekst på side 1 til 20, du vet at brukerne vil forsøke å fullføre noen oppgaver, for eksempel å gjøre en reservasjon. Du kan også se at en brukers mål på nettstedet er å finne ut hva restauranten serverer, hvor den ligger, og om det er bord, og forhåpentligvis foreta en reservasjon. Endelig kan kundens mål være å betjene brukeren, men også å presse dem mot et sett av tilbud de kjører.
Selv med et enkelt eksempel som vår restaurantside, er det mange måter å sette opp informasjonen på. For eksempel kan du skyve spesialtilbud med en gang på hjemmesiden, eller du kan knytte dem til reservasjonsprosessen, eller du kan kanskje arbeide dem i menyene. På samme måte kan du finne at gitt klientens mål, du vil ha en annen prioritet på sidens innhold. Kanskje kunden forteller deg at ingen noen gang er i stand til å finne denne restauranten, så du må lage en How To Get Here-side og gi den høy prioritet.
Utvikle et sitemap eller en plan for hvordan informasjonen vil plassere på en heirarkisk måte. Selv kartene er vanligvis bare et sett med bokser som viser sider, kan du arbeide i alle slags ekstra informasjon som forklarer hvordan området kommer til å bli satt opp, inkludert ting som hurtigkoblinger fra hjemmesiden, hvordan ulike deler kan knytte sammen, og Stier en bruker kan ta gjennom et nettstedkart.
Nettsteder med en rimelig mengde kompleksitet kan omarrangeres og omorganiseres mange forskjellige måter. Et nettsted som jeg har jobbet med å organisere og omorganisere utallige ganger, er FlashDen. Jeg har mistet tellingen av antall ganger jeg har sett på den menyen og omorganisert den. I noen tilfeller flytter vi bare sider inn i forskjellige sett og grupper slik at de virker mer logiske, og i andre har vi introdusert mer out-of-the-box-tenkning.
For eksempel noen måneder siden menyen var blitt altfor komplisert, så vi fjernet en hel haug av de mer "myke" menyelementer, og opprettet en blogg som nå huser konkurranser, nyhetsbrev, Subsite lenker og andre sider som ble fylle opp menyen.
Nylig har vi funnet at vi har mange av det jeg kaller "stragglers" - det er sider uten et hjem i menyen. Fra et informasjonsdesignsynspunkt er stragglers forferdelige - selv om jeg ikke kan huske hvordan jeg skal komme til noen av dem! Løsningen denne gangen er å bygge et wiki-system, innhold på rørnivå i menyen bak kulissene, og bruk wiki for å huse dypere nivåer av informasjon med eget søk, merking og kategorisering.
Poenget med mine erfaringer med FlashDen er at organisering av informasjon ikke nødvendigvis nødvendigvis handler om å sette den inn i menyer og undermenyer. Det kan hende du oppdager at noen opplysninger ikke skal være på et nettsted, eller at det krever et undernettsted, eller at du trenger å gjøre noe helt annet. Med FlashDen har jeg fordelen at det har vært nesten 3 år nå at jeg har sett på innholdet og frem til i dag finner jeg nye ordninger og løsninger.
Å være en effektiv informasjonsdesigner og for å finne de mest optimale løsningene, krever ofte å tenke ut av boksen. Selvfølgelig å si "tenk utenfor boksen" er mye lettere å si enn å gjøre! Noen ganger er vi begrenset i en boks vi ikke engang kan se. For en tid siden hørte jeg om et eksperiment hvor en haug med hoppende insekter ble plassert i en glassboks og over tid lært å hoppe bare så høyt. Når glasslokket ble fjernet fortsatte feilene å hoppe på samme, begrenset høyde, ikke engang innse at de kunne hvis de ønsket å komme seg ut.
Så hvordan overvinne du en boks du ikke kan se? Enkel! Med hjelp av andre som ikke er begrenset av de samme problemene du har. For komplekse informasjonsteknikker vil jeg ofte spørre andre om organisatoriske ideer som gir dem bare det røde problemet og ikke mine egne permutasjoner. Å få si en programmerings ideer eller en brukers synspunkter vil ofte overraske deg, da deres perspektiver er helt forskjellige fra din egen og uhindret av de samme settene du tenker på.
Når du organiserer store sett med informasjon, er et åpenbart spørsmål som alltid oppstår, hvor dypt eller hvor bredt bør navigasjonen din være. Dybde refererer til hvor mange lag av kategorier og underkategorier det er, mens bredden handler om hvor mange av hvert nivå det er. Trikset er å finne balansen. Hvis det er for mange elementer på et enkelt nivå - spesielt toppnivået - risikerer du å forvirre brukeren. På den annen side, hvis en bruker må klikke på mange nivåer i, risikerer du å miste dem.
En god tommelfingerregel er å holde antall opsjoner på et gitt nivå 4 - 8. Hvis du har 8 øverste nivå elementer, hver med 8 underkategorier, og hver med 8 underkategorier, vil du ha nok plass til en 512 side side. Selvfølgelig balanserer selvsagt sjelden ting så godt ut automatisk. Så igjen må du være forsiktig med at du ikke har en tung side og en lys side. For eksempel på et nettsted med et par hundre sider, hvis du setter ta kontakt med oppe på toppnivå et sted, sjansene er at det ikke kommer til å ha 8 underkategorier med 8 sub-underkategorier. Det er mer sannsynlig at ta kontakt med kommer til å være en ganske enkel del - selv for et komplekst område.
På baksiden hvis du ikke setter noe på ta kontakt med På øverste nivå kan du få en mer balansert informasjonskilde, men du risikerer ikke å ha en viktig brukeroppgave fullført, fordi det vil være vanskelig å finne ut hvordan du finner kontaktinformasjonen. En enkel løsning på dette bestemte problemet kan være å legge til "hurtige koblinger" der du gir brukeren noen få muligheter på hjemmesiden for å hoppe dypere inn i strukturen uten å navigere på vanlig måte.
Jeg vet ikke om deg, men det er veldig sjelden at jeg noen gang vil lese en nettside fullt ut. Enten det er å lese instruksjoner, vilkår og betingelser, eller bare vanlig kopi, mesteparten av tiden skinner jeg, skanner og hopper. Forutsatt at jeg ikke er den eneste som gjør dette, er det fornuftig å designe sider for å lette denne måten å konsumere informasjon på.
Ikke vikle nøkkelinformasjon i tekstbunter - marker den. Ikke gi brukerne avsnitt på slutten - bryte dem opp med overskrifter, underposisjoner, punktposter, diagrammer, hva som helst! Tenk på hvordan en bruker vil bruke nettstedet ditt og designe det for å lette bruken av dem.
Et godt eksempel på design for brukerkonsum er på søstersiden NETTUTS, et nettsted som, for de fleste av dere, publiserer opplæringsprogrammer om webutviklingsemner. Nå på NETTUTS vi merke tidlig at folk flest, på første visning av en tutorial hoppe rett til slutten, der de prøver å finne en link til en demo og / eller kildekoden, slik at de kan avgjøre om opplæringen er verdt å lese i første plass. Når vi skjønte dette, var det enkelt å legge til spesielle demo og kilde knapper og plassere dem konsekvent øverst på opplæringen. Denne enkle justeringen for å matche vår design opp til brukerforbruket har fått oss a mye av gledelig tilbakemelding.
Jeg er ikke sikker på om jeg bare blir eldre, eller hvis jeg tilbringer hele tiden foran en skjerm, gjør meg bare kresen, men i det siste bøyer det meg egentlig når jeg presenteres med tekst som ikke tvinger meg til å lese det. Målet med et nettsteddesign er vanligvis å formidle informasjon og det meste av det er skrevet tekst, så fokus på å vise det godt bør være en prioritet.
Ved å bruke for små skriftstørrelser, lav kontrast mellom tekst og bakgrunnsfarge, eller dårlig bruk av lys tekst på en mørk bakgrunn, er alle designsynder som vi alle har vært skyldige i (meg på mange ved en anledning!) Men utover disse, Det finnes andre måter som ditt design kan få den besøkende til å lese. Målet er å designe slik at utformingen fokuserer besøkende på kopien og fører dem inn med titler, underposisjoner, avgrensninger, pullquotes og andre teknikker for å trekke øyet.
Tidligere nevnte jeg brukerbaner - det er måter som brukere vil ha en tendens til å krysse på et nettsted. Mange av disse vil skje bare ved hvordan folk oppfører seg, men med planlegging kan du velge hvordan en bruker blir veiledet både gjennom en enkelt side og på flere sider. Når du kjenner bestemte veier, kan du jobbe i visuelle guider og lenker for å hjelpe dem med å bevege seg langs den banen.
For eksempel på FlashDen, når en ny bruker kommer, er det vårt mål å få dem til å registrere, finne filer, sette inn penger og deretter kjøpe disse filene. Så vi gir dem først en oppsummering av fire trinns prosess på hjemmesiden, så ved hvert stopp er det pekere for å lede brukeren til neste trinn. I vårt neste redesign håper jeg å gjøre denne banen enda mer åpenbar, da det er viktig at nettstedet fungerer som det skal. Merk at banen jeg beskriver ikke er 4 sider, men 4 oppgaver. For eksempel å finne filer kan innebære at brukeren ser på dusinvis av sider, men det er en diskret oppgave. Brukerbaner trenger ikke å være gjennom innstilt sider, de kan like enkelt omfatte angitte oppgaver!
Det skal uten å si at det enkle er bedre for brukerne enn komplisert. Ikke desto mindre er det altfor lett å overkomplisere design. Jeg vet at jeg ofte får ting til å virke mer komplisert, slik at jeg har flere visuelle elementer på en side for å jobbe med. (Dårlig Collis, dårlig Collis!) En annen overkompliserende synd bruker unødvendige ord på knapper og kall til handling. Steven Krug i sin utmerkede bok, ikke få meg til å tenke
gir eksemplet på et hypotetisk arbeidssted med en knapp som lyder:
En av disse er klare, en er rimelig åpenbar, og en er - vel hvem vet.
Som designere, vet vi mer enn de fleste, verdien av et godt visuelt. Og det er mange muligheter til å kartlegge eller visualisere noen data, konsepter eller informasjon. Denne artikkelen som du vil huske, begynner med et veldig grunnleggende diagram over hvordan grensesnittdesign, informasjonsdesign og estetisk design er relatert. Disse bildene bryter ikke bare opp tekst, men de er også mer minneverdige og gir deg muligheten til å bringe en side til livs.
DoshDosh har en interessant artikkel om informasjonsvisualisering, diagrammer og hva forfatteren kaller infographics som er verdt å sjekke ut selv om det bare er å se de strålende grafiske eksemplene.
Informasjonsdesign er en av de tingene som er vanskelig å få rett ved første forsøk. Så når du har bygget et nettsted, bør du analysere det for å se hvordan folk bruker og fordøyer informasjonen, hvordan de oppfører seg og hvor du kan forbedre designen din.
Et pent verktøy i denne forbindelse er Google Analytics. For eksempel, hvor jeg nevnte brukerbaner tidligere, lar Analytics deg spore baner gjennom sider ved hjelp av funksjonen Mål. Du setter opp en sekvens av sider, og Analytics vil rapportere% av besøkende som gjør det gjennom (og ved siden av å klikke bort) på hvert punkt.
En annen Analytics-funksjon du kan bruke, er søkeordsporing som lar deg se hvilke brukere som søker etter på ditt eget nettsteds søkefelt. Å vite hva folk leter etter, forteller deg hvilken informasjon som må være lettere tilgjengelig!
Dette innlegget er dag 3 i vår webdesignsession. Creative Sessions "Session Day 2Session Day 4"
Accentsconagua