Enkeltsidedesign: 10 tips + ideer
Lenge leve nettsidedesign! Det er noe nesten magisk med småskala nettsteder som passer på en enkelt side. De kan være grasiøse, enkle å navigere og gi optimale brukeropplevelser i et inneholdt rom.
Mens det var en tid da vi kastet oss bort fra nettsteder med enkeltside, omfavner brukerne dem igjen (takk, mobil!), Og det burde du også.
Vi ser på ti tips, ideer, eksempler og forslag for å hjelpe deg med å inspirere til ditt neste stykke webdesignarbeid. Det kan være akkurat det rette tidspunktet å holde det enkelt, og omfavne en en-sides strategi!
Utforsk designressurser
1. Tenk på "Sider"
Når det gjelder utforming av et enkelt, rullende nettsteddesign, tenker du på “sider”.
Hver rulle skal gi en sidelignende opplevelse som fokuserer på et enkelt element. Dette skaper en tydelig følelse av organisering og flyt for nettstedsdesign.
Cote gjør dette vakkert med "sider" som har vekslende lys og mørke (eller fullfoto) separasjoner. Brukeren vet visuelt mens han blar der en bit innhold slutter og den neste begynner.
2. Tidslinjenavigering for lengre sider
Når det gjelder nettsider på en side, er de ikke alltid lette på innhold. Noen av de beste designene på én side er nettsteder med lengre rulling med lengre format.
For disse prosjektene må du vurdere tidslinjenavigering slik at brukerne alltid vet hvor de er i innholdsflyten. Det gjør det enkelt å spore hvor du er og hvordan du kommer tilbake hvis det er innhold å undersøke på nytt.
UV Hero gjør en fin jobb med dette med en svært visuell tidslinje-nav som viser hver farge på det synlige lysspekteret når det gjelder innholdet i designen. Og den beste delen? Du kan klikke hvilken som helst farge og hoppe rett til det innholdet.
3. Navigering på siden
Enkeltsider trenger ikke å mangle vanlige brukergrensesnittelementer som en meny, selv om mange ser ut til å gjøre det.
Du kan fremdeles inneholde en tradisjonell meny (den kan hjelpe brukeren å flyte så vel som å søke). Forskjellen er at menykoblinger hopper til bestemte deler av designen på en side. For brukere som liker å navigere på denne måten, vil de ikke engang vite at du har laget dette praktfulle trikset.
Happy Tools ser ut som et nettsted med flere sider, men alt finnes på en enkelt side. Menyen fungerer usedvanlig bra og gir brukerne navigasjonsvalg.
4. Gjør det veldig interaktivt
Hvis du vil at brukere skal fortsette å rulle, kan interaktive elementer være trikset som oppmuntrer til handlingen.
Fra video til parallakseffekter til innslag av animasjon eller gamification, interaktivitet kan stimulere til større bevegelse og tid på stedet. Dette gjelder spesielt med enkeltsidedesign.
Lobods har en klønete stil med mye interaktivitet. Det er sveveanimasjoner, skyve- og pop-in-elementer og rulletekst. Det hele kommer sammen på en måte som hjelper brukere med å bevege seg gjennom innholdet med letthet. (En annen bonus med dette designet? Det inkluderer god plass slik at subtile bevegelser og interaksjoner er lettere å se.)
5. Alt på en skjerm
Hvis du ikke har mye innhold, kan et design på én side som alt på én skjerm gi en fin brukeropplevelse.
Behandle dette nettstedet design som et stort navigasjonselement med litt informasjon og deretter off-site eller kontaktkoblinger. Det kan fungere bra for snart å komme til design eller enkle landingssider for porteføljer.
Sylvain Theyssens gjør dette for sin porteføljedesign. (Den har faktisk to sider: En søt animasjon av "skjermsparer stil" som blir til hoveddesign med musebevegelse.) Siden er enkel, informativ og imponerende. Designen med en skjerm gir deg alt du trenger å vite uten at noe ekstra kommer i veien.
6. kommer snart design
Apropos snart kommer nettsteder, er dette den perfekte bruken for en enkeltsidig design.
I de fleste tilfeller har sider som kommer snart ikke mye innhold - kanskje bare en logo og intro eller kontaktinformasjon. I de fleste tilfeller kan dette passe godt på en side og er en effektiv bruk av brukertid til hovedsiden går i live.
Green Chameleon gjør akkurat dette. Den ene siden siden er spesielt fin på grunn av den kule animasjonen og interessante bruken av tekst. Det skaper en følelse av forventning og vekker nysgjerrighet - akkurat det du håper på på en kommende side.
7. Vær litt funky
Nettsider på en side kan være en utmerket lekeplass hvis du vil prøve noe litt annerledes eller funky. En uvanlig skjerm fungerer bra med mindre design fordi du ikke ender med å gjøre "trikset."
Rou Hun Fan bruker et spesialtypeskrift og bakgrunnsnett for å fremheve hans informasjon, portefølje og arbeid. Den kreative skjermen og minimal stil er nok til å oppmuntre til rulling i kort tid, perfekt for en portefølje.
8. Gi brukerne noe å gjøre
For å holde engasjementet oppe og holde brukerne interessert i designen, gi dem mye å gjøre på en webside.
En feil som mange av disse designene har, er at de bare er lange informasjonsruller. Bryt den opp med klikkbare elementer, oppfordringer til handling og ting å gjøre. Ikke bare vil disse elementene hjelpe deg med å finne ut hva brukerne vil ha av designen (og hvis de oppfyller dine tiltenkte mål), men vil også bidra til å holde dem i samspill i lengre perioder.
Plethora bryter opp en lang side med rulling med mange knapper i kortstilen for å reservere reisepakker. Hver av disse klikkinteraksjonene noteres med en pil for å skape en jevn brukeropplevelse.
9. Hold det organisert
Med alt nettstedets innhold på en enkelt side er det enkelt for designen å komme ut av hånden. Men det kan også lage et organisert lerret for innhold.
Når det gjelder å jobbe med en side, kan et tett rutenett og ensartet struktur være det beste verktøyet. Bruk dem til å holde innholdet organisert og gruppert på en måte som er lett for brukerne å navigere og forstå.
Podcasts Repo gjør dette bra med et perfekt rutenett med podcaster å velge mellom. Nettstedet er fleksibelt nok med dette rutenettet og stilen til å vokse til så mange innholdselementer som den trenger uten å bli overveldende.
10. Bruk Space klokt
Bruk av plass er et av de viktigste designhensynene for en lengre rulling eller en-sides design. Innhold må være fordelt på en slik måte at innholdsendringer er tydelig etablert, handlinger kan identifiseres og alt er lett å lese. (Husk at for mye rulling kan begynne å forårsake en viss grad av øyetrekk.)
Werners Nomenclature of Colors er en webside med en enkel side med mye innhold. Nettstedet er faktisk en kopi av en bok fra 1821. Plassen får dette designet til å fungere.
Kategorier og underavsnitt med et tydelig rutenett og rikelig med hvit plass forbedrer lesbarhet og skanning. Det er mye her, men det føles ganske tilnærmelig takket være bruken av plass gjennom hele.
Konklusjon
En enkeltsides design kan være akkurat det du trenger for å bryte opp noen av de tyngre prosjektene du har jobbet med. Denne stilen kan fungere for alt fra kommer nettsteder til porteføljer. Det er passende for ethvert nettsted uten mange innhold.
Har du noen kule webside-design som du kan vise frem? La oss se dem. Del dem med oss på Twitter. Merk @designshack og @carriecousins med en lenke til dette innlegget, og vi vil retweet på favorittene våre.