Designe Nettsteder For Barn: Trender Og Beste Praksis

• 12 min lese
• Inspirasjon, Showcases, Webdesign, Barn
• Del På Twitter, LinkedIn

Nettsteder designet for barn har i stor grad blitt oversett I Webdesign artikler og roundups, men det er mange vakre og interessante designelementer og oppsett presentert på barnas nettsteder som er verdig diskusjon og analyse. Det finnes også en rekke beste praksis som er eksklusive For Webdesign for barns nettsteder-praksis som vanligvis ikke bør forsøkes på et typisk nettsted.

det kan være lurt å ta en titt på relaterte artikler:

• Beste Praksis For Webdesign For Barn
• Designe For Barn Er Ikke En Lek
• Designe Webgrensesnitt For Barn
• En Fars Bønn Til Utviklere av iPad Apps For Barn

denne artikkelen vil presentere en rekke populære kommersielle nettsteder rettet mot barn med en analyse av trender, elementer Og teknikker som brukes til å holde barn interessert og stimulert.

Design Som Stimulerer Sansene

Mennesker er mentalt stimulert av en rekke faktorer, og dette gjelder spesielt hos barn. Vellykkede barns nettsteder implementerer en rekke elementer og designprinsipper som skaper et miljø som passer for barnets personlighet og interesser.

Lyse, Levende Farger

Lyse farger vil enkelt fange og holde et barns oppmerksomhet i lange perioder. Selv om fargevalg er en primær faktor i å designe alle typer nettsted, gjelder dette spesielt når du utformer et nettsted for barn siden farger gjør et stort inntrykk på barnas unge sinn. Fargevalg og kombinasjoner som sannsynligvis vil bli avvist eller lo av når du designer et typisk nettsted, kan bli ønsket velkommen på et nettsted for barn.

hvor mange av fargekombinasjonene som brukes i skjermbildene nedenfor, vil lykkes på et nettsted rettet mot et voksent publikum? Ikke mange. Så, når du designer et nettsted rettet mot barn, bruk lyse, levende farger som visuelt stimulerer på en uforglemmelig måte.

Pbs KIDS

Hermans Hjemmeside

Funbrain Playground

ET GODT HUMØR

BARN VIL HUSKE og gå tilbake til et nettsted hvis deres erfaring er en lykkelig. Elementer kan innlemmes i designet for å sikre at et muntert, positivt humør presenteres.

Mikke Mus Klubbhus skaper en lykkelig stemning ved å gjøre Mickey selv et visuelt fokuspunkt på siden. Hans glade ansikt og kroppsspråk bidrar til å forbedre denne glade følelsen, og skaper en velkommen atmosfære.

Play-Doh-nettstedet skaper en lykkelig stemning ved å bruke et strålende barn som fokuspunkt.

Fifi og Flowertots-nettstedet har et stort smilende Flowertot-tegn i visuelt fokus, noe som skaper et godt humør.

Elementer Fra Naturen

Barn stimuleres av gjenkjennelige elementer som de kan forholde seg til. Fordi barns opplevelser i livet er begrenset, noen av de tingene de er mest kjent med finnes i naturen. Naturlige elementer som trær, vann, snø og dyr brukes på nettstedene som er vist nedenfor. I mange tilfeller er disse elementene overemphasized gjennom størrelse eller enkelhet av design.

Disney-nettstedet endrer temaet avhengig av hvilket produkt som markedsføres. I dette skjermbildet bruker De Et Grand Canyon-lignende landskap for å skape en minneverdig visuell opplevelse.

Discovery Kids bruker et undervanns tema.

Club Penguin presenterer et arktisk tema.

CBC Kids bruker en sesong tema basert på forenklede, iøynefallende grafikk.

PopCap Games bruker et gresskledd landskap foran store solstråler.

Større Design Enn Livet

Store designelementer har vist seg å være effektive i Alle Typer Webdesign, demonstrert av det faktum at stor typografi, store knapper og store handlingsområder har blitt vanlig i moderne design. Fordi barn er naturlig trukket til enkle, åpenbare og gjenkjennelige objekter, vil nettsteder designet for barn øke effektiviteten ved bruk av store designelementer.

Animerte Figurer

Store, animerte, talende figurer er en fascinerende og fengslende måte å fange og holde et barns oppmerksomhet på. Mange nettsteder designet for barn bruker dette elementet effektivt.

Barbie

Mr. Rogers’ Nabolag

Disney Princess

Thomas Tank Engine

Barney & Venner

Dybde I Design

Barn Liker Å La Fantasien Løpe Løpsk I En Verden Som Ser Ut Og Føles Ekte. Denne typen atmosfære kan opprettes gjennom dybde i designelementer. Dette kan omfatte ekstruderte former, skygger, landskap, skrå effekter, blanke graderinger eller flytende objekter. Ofte er mange av disse elementene til stede i tegneserielignende skjermer, som vist nedenfor.

Webkinz «Adoption Center» bruker skygger, en livaktig karakter og andre 3-dimensjonale elementer for å skape et design som har dybde.

Poisson Rouge skaper en dyp, realistisk atmosfære ved hjelp av et vindu som ser ute på solen, sammen med en rekke andre 3-dimensjonale elementer.

Rainbow Magic skaper dybde i sin design gjennom En Flash-animert landskap scene som beveger seg som brukeren svever over ulike elementer.

Navigasjon Og Handlingsfremmende Områder Som Skiller Seg Ut

i alle webdesign, navigasjon og handlingsfremmende områder bør være fokuspunkter. Barnas nettsted designere kan oversimplify disse områdene slik at barn kan navigere lett. Tekstbasert navigering på barnas nettsteder ville ikke være like effektiv som store knapper og grafikk, fordi de ville mangle visuelt fokus på en side.

Peppa Pig har en horisontal navigeringslinje som inneholder store ikoner og lettleste beskrivelser for hvert element.

Winnie The Pooh-nettstedet inkorporerer navigasjonslinjen i deres» skog » – tema, ved hjelp av store tre grafiske elementer som ikke vil bli oversett av brukeren.

Sesame Street har en lett-å-finne horisontal navigasjon bar, sammen med store call-to-action områder.

My Little Pony bruker tekstbasert navigasjon, noe Som skaper en mindre grafisk opplevelse, som tillater fokus på innholdselementene. Dette kan være ideelt i noen situasjoner, men på et barns nettsted er en grafisk basert navigasjonslinje mer sannsynlig å være effektiv.

Brukerinteraksjon

Sannsynligvis er en av de viktigste måtene for et barns nettsted å lykkes, å inkludere elementer som gjør at et barn kan samhandle med nettstedet på en eller annen måte. Barn ønsker ikke å gjøre intens lesing eller forskning; de ønsker å leke og bli underholdt.

på et typisk nettsted blir visse designelementer sett på som distraherende, ubrukelige og besværlige. På et barns nettsted blir de samme elementene sett på som et effektivt middel til å tiltrekke brukere.

Interaksjon Gjennom Animasjon Og Lyd

Effekter og opplevelser opprettet Med Adobe Flash er motet i typisk moderne Webdesign, men på barnas nettsteder er det nesten ikke noe annet alternativ. Det er sant At JavaScript-animasjon og effekter har kommet langt på grunn av De mange JavaScript-bibliotekene som er tilgjengelige, men det enkle med hvilke komplekse animasjoner som kan opprettes Med Flash, gjør denne metoden til det første valget for mange kommersielle nettsteder designet for barn.

Pauly ‘ S Playhouse-siden, som de fleste nettstedene som er omtalt i denne artikkelen, er bygget helt I Flash.

Hot Wheels-nettstedet inneholder en animert «dagens bil» som zoomer inn på skjermen når siden lastes, og skaper visuell interaksjon.

Roary Racerbilen har en kort «flash intro» med en «hopp» – knapp. Dette er en gammeldags trend i typisk Webdesign, men er et effektivt middel til catering til et barnbasert publikum. Introen animerer gjennom en vei til tegnene vises i horisonten. Dette hjelper brukeren til å føle seg som om de personlig går inn I Roarys animerte verden.

Yahoo! Kids navigation bar er opprettet Med Flash og gjør lydeffekter og animerer når elementene er svevet over. Denne trenden er svært vanlig på mange av nettstedene omtalt i denne artikkelen.

Interaksjon Gjennom Video

Tv er kjent for å fengsle barn publikum i timevis, og det er derfor «lørdag morgen tegneserier» har i flere tiår vært en lukrativ del av sendingen tidsplaner for MANGE TV-Nettverk. På samme måte legger video på et barns nettsted til et morsomt, interaktivt og pedagogisk aspekt til innholdet på et nettsted.

Barnas CBC-Video

Yahoo! Barna Film Guider

National Geographic Kids – Videoer

Interaksjon Gjennom Spill

hvilket barn liker ikke å spille spill? En av de mest effektive måtene å underholde, utdanne eller på annen måte okkupere et barn på et nettsted er å inkludere en» spill » – seksjon. Nesten alle nettstedene som er undersøkt for denne artikkelen, inkluderer spill som utdanner, stimulerer og tillater direkte samhandling, samtidig som de inneholder mange av designelementene som allerede er diskutert. Nedenfor er noen eksempler.

CBeebies – Gordon Hagen Gnome

Toy Story – Woodys Store Flukt

Disney Pixars Verden Av Biler lar brukerne lag, dele og rase sine egne tilpassede biler.

Utskrivbare Elementer

Barn liker å ha noe håndfast å ta med seg, for å hjelpe dem å huske sine erfaringer. Utskrivbare bilder og coloring sider tillate barna å ha et minnesmerke over sine erfaringer, samtidig som eiere en mulighet til å forbedre og fremme deres merkevare utenfor dataskjermen. Nedenfor er noen eksempler på utskrivbare fargesider på barnas nettsteder.

Pingu Fargesider

Crayola Digi-Color

Fargeleggingssider For Peppa Gris

Thomas Og Venner Online Fargelegging

Teletubbies – Skriv Ut Til Farge

ukonvensjonelle metoder

Vi Har Allerede Diskutert En Rekke Elementer Som I Moderne Typisk Webdesign Nå Betraktes Som Ukonvensjonelle. Lyd, animasjon og store påtrengende grafikk er ofte mislikt i typisk Webdesign. På barnas nettsteder hjelper disse elementene brukeropplevelsen. Andre ukonvensjonelle elementer og designvalg er omtalt nedenfor.

Endre Markøren

Dette er absolutt sett på som en dårlig praksis i standard Webdesign, men kan være en morsom, effektiv måte å legge til et lekent element på et barns nettstedstema. Dette kan gjøres ved hjelp av dynamisk HTML, men gjøres oftere via Flash.

markøren På Discovery Kids nettsiden blir til en snapping bjørn felle grafikk.

markøren på Sesame Street-nettstedet etterfølges av en gul stjerne når Den svever over standard HTML-elementer, og blir til en gul stjerne omgitt av mindre animerte stjerner når markøren flyttes over klikkbare Blitselementer.

Snakkende Navigasjon

noen ganger vil en navigasjonslinje produsere lydeffekter, men i andre tilfeller vil navigasjonslenkene høres ut hva de representerer i en munter stemme.

PBS KIDS navigasjonslinje snakker med barnas stemmer, når brukeren svinger over den.

CBeebies navigasjonslinje bruker en stemme til å høres ut målet for hvert navigasjonselement.

navigasjonsfeltet Bob byggeren snakker til brukeren på mouse.

Fifi og Flowertots har en talende navigasjonsfelt.

Bryte Rutenettet

mens tradisjonelle Moderne Webdesignteknikker har omfavnet fordelene og estetikken til gridbasert design, kan barnas nettsteder bryte seg fri fra en altfor strukturert layout for å skape en unik verden som et barn vil nyte å oppleve.

Dette er ikke å antyde at bruk av et rutenett som grunnlag for designet er feil. Det kan være fordelaktig å starte med et rutenett, deretter designelementer utenfor rutenettet på en kontrollert måte. Denne fleksibiliteten i design og layout er demonstrert på en rekke områder som allerede er diskutert, men er også tydelig i navigasjonsfeltene i eksemplene nedenfor.

navigasjonslinjen På Spongebob Squarepants nettsiden er skrå, går mot konvensjonen i typisk gridbasert Webdesign.

Hannah Montana nettstedet har navigasjonslinjen grafikk som bryter rutenettet.

In The Night Garden nettstedet har en svært uvanlig navigasjonslinje design som har liten likhet med det som finnes i en konvensjonelt strukturert design.

Nedenfor er noen eksempler på nettsteder som bruker et mer stivt, gridbasert format, Og som et resultat er ikke så unikt, minneverdig eller fengslende som noen av de som allerede er vurdert i denne artikkelen.

Kids WB er stiv, og ikke så minneverdig.

Crayola-nettstedet er noe gammeldags med rutenettformat og vertikal navigasjon.

Neopets er også designet på et mer strukturert rutenett.

Gitt, i noen tilfeller ville en sterkere gridbasert design være nødvendig hvis publikum var et eldre barnpublikum, som det er tilfelle MED Si-Barn, vist nedenfor.

Ta Ansvar

hvis du forsøker å nå tankene og hjertene til unge, inntrykkelige mennesker gjennom en online opplevelse, er du betrodd et tungt ansvar. Barn er mentalt skjøre, og lett påvirket av det de ser, hører og berører. Det er visse faktorer som må tas opp på hvert barns nettsted, for å sikre at ingen skade blir brakt til barna.

Fremme Utdanning

Spill og andre interaktive elementer bør opprettes ikke bare for å fremme bedriftens merkevare og identitet, men for å bidra til å utdanne og trene unge sinn på en gunstig og positiv måte. Fremme utdanning gjennom spill og aktiviteter vil vise at din bedrift bryr seg om brukeren og hvordan deres online opplevelse kan påvirke dem i fremtiden.

Online Læringsspill fra Fisher Price inkluderer spill som varierer etter aldersgruppe.

Funbrain fremmer seg selv som «Internett #1 Utdanning Nettsted for K-8 Barn og Lærere.»

Informasjon Til Foreldre

Foreldre vil holde øye med barnas internettvaner. Mange barns nettsteder er klar over dette, så de inneholder informasjon som er rettet mot foreldre. Noen ganger er dette i form av et tips, som Det er tilfelle Med Sesame Street games-nettsiden, eller bare et navigasjonselement som peker på foreldrenes seksjon.

Sesame Street-Spill inneholder en» Parent Tip » – boks.

BEN 10 har en» Parent Stuff » – kobling i deres primære navigasjonslinje.

Thomas Tank Motoren inneholder en» foreldre » link.

Brukertesting

endelig er en av de beste måtene å bidra til å bygge en vellykket online opplevelse for barn gjennom å se barn navigere og samhandle med nettstedets spill og andre unike funksjoner. Ikke alle selskaper vil ha budsjettet for omfattende testing, men nesten alle vil ha muligheten til å gjøre minst en minimal mengde testing – selv om det er med bare ett barn. Dette vil tillate deg å se nettstedet gjennom et barns øyne og gjøre eventuelle nødvendige endringer, det samme som ville bli gjort i noen brukstester.

Selskaper Som Disney, Sesame Street og PBS har selvfølgelig studert barns oppførsel i årevis, så mange av eksemplene som vises ovenfor, kan brukes til å danne grunnlag for et vellykket barns nettsted, selv om ingen brukbarhetstesting er gjort.

Konklusjon

her er et sammendrag av både konvensjonelle og ukonvensjonelle beste praksis for å designe et nettsted for barn:

Konvensjonell Best Practices

• Lag elementer som er store og visuelt minneverdige
• Bruk lyse, levende farger som stimulerer sansene
• Innlemme elementer fra naturen
• Lag dybde i designet
• Legg til navigasjonselementer som er store og enkle å finne
• bruk video
• Inkluder Utskrivbare Elementer
• bryt rutenettet
• gjør endringer basert på brukertesting

Ukonvensjonelle anbefalte fremgangsmåter

• lag en glad, leken stemning
• bruk animert tegn
• Bruk grafiske tunge navigasjonsfelt
• bruk Flash animasjon rikelig
• Embed bevegelser og lyder som utløser på side belastning
• Ta med en «spill»-delen
• Endre markøren for å bidra til temaet
• Legg stemmer til navigasjon rollovers
• Vær ansvarlig til både barn og foreldre

en webdesigner som har jobbet På et barns nettsted, vil trolig si at det var et av de mest morsomme Og interessante Prosjektene de har hatt privilegiet å jobbe med. Hvis du noen gang har muligheten til å skape en brukeropplevelse som er rettet mot barn, må du følge noen av de påviste metodene som er vist på mange av nettstedene som diskuteres her, og nettstedet ditt vil ha en god sjanse til å bli en stor hit med barn.