Vienas lapas vietnes dizains: 10 padomi + idejas
Dzīvojiet vienas lapas vietnes dizainā! Nelielās vietnēs, kas iederas vienā lapā, ir kaut kas gandrīz maģisks. Tie var būt graciozi, viegli orientēties un nodrošināt optimālu lietotāja pieredzi slēgtā telpā.
Kaut arī bija laiks, kad mēs atteicāmies no vienas lapas vietnēm, lietotāji tos atkal apskāva (paldies, mobilais!), Un arī jums vajadzētu.
Mēs izskatām desmit padomus, idejas, piemērus un ieteikumus, kas palīdzēs iedvesmoties jūsu nākamajam tīmekļa dizaina darbam. Varbūt ir īstais laiks, lai to visu padarītu vienkāršu un pieņemtu vienas lapas stratēģiju!
Izpētiet dizaina resursus
1. Padomājiet par “Lapas”
Kad runa ir par vienotas, ritinošas vietnes dizaina izstrādi, domājiet par “lapām”.
Katram ritinājumam ir jāsniedz lapai līdzīga pieredze, kas koncentrējas uz vienu elementu. Tas tīmekļa vietnes dizainam rada skaidru organizācijas un plūsmas sajūtu.
Cote to dara skaisti ar “lappusēm”, kurām ir mainīgas gaismas un tumšās (vai pilnīgas foto) atdalīšanas. Lietotājs vizuāli zina, ritinot, kur beidzas viens satura fragments un sākas nākamais.
2. Laika navigācija garākām lapām
Runājot par vienas lapas vietnēm, tās ne vienmēr atspoguļo saturu. Daži no labākajiem vienas lappuses dizainiem ir garākas ritināšanas, garāka formāta vietnes.
Šajos projektos apsveriet navigāciju pa laika skalām, lai lietotāji vienmēr zinātu, kur viņi atrodas satura plūsmā. Tas ļauj viegli izsekot, kur atrodaties, un kā atgriezties, ja ir saturs, ko atkārtoti pārbaudīt.
UV varonis to paveic jauki, izmantojot ļoti vizuālu laika joslu, kas parāda katru krāsu redzamās gaismas spektrā, ciktāl tā attiecas uz dizaina saturu. Un labākā daļa? Jūs varat noklikšķināt uz jebkuras krāsas un pāriet tieši pie šī satura.
3. Navigācija lapā
Atsevišķu lapu vietnēm nav jātrūkst kopīgu lietotāja saskarnes elementu, piemēram, izvēlnes, lai gan daudziem šķiet.
Jūs joprojām varat iekļaut tradicionāla izskata izvēlni (tā var palīdzēt gan lietotāju plūsmai, gan meklēšanai). Atšķirība ir tāda, ka izvēlņu saites pāriet uz īpašām vienas lapas dizaina sadaļām. Lietotājiem, kuriem patīk pārvietoties šādā veidā, viņi pat neuzzinās, ka esat izveidojis šo modes triku.
Happy Tools izskatās kā vairāku lapu vietne, bet tas viss ir ietverts vienā lapā. Izvēlne darbojas ārkārtīgi labi un sniedz lietotājiem izvēles iespējas.
4. Padariet to ļoti interaktīvu
Ja vēlaties, lai lietotāji turpina ritināt, interaktīvie elementi var būt triks, kas pamudina šo darbību.
Sākot no video līdz paralaksa efektiem līdz animācijas vai gamification pieskārieniem, interaktivitāte var veicināt lielāku pārvietošanos un laiku uz vietas. Tas jo īpaši attiecas uz vienas lappuses dizainu.
Lobodiem piemīt dumjš stils ar daudz interaktivitātes. Ir hover animācijas, bīdāmie un uznirstošie elementi un ritināms teksts. Tas viss sanāk tādā veidā, kas lietotājiem palīdz viegli pārvietoties pa saturu. (Vēl viens šī dizaina bonuss? Tajā ir daudz vietas, lai smalkās kustības un mijiedarbību būtu vieglāk pamanāmas.)
5. Visi uz viena ekrāna
Ja jums nav daudz satura, vienas lapas dizains, kas viss ir uz viena ekrāna, var sniegt jauku lietotāja pieredzi.
Izturieties pret šo tīmekļa vietnes dizainu kā lielu navigācijas elementu ar nelielu informāciju un pēc tam ārpus vietnes vai sazinieties ar saitēm. Tas var labi darboties drīzu dizainu vai vienkāršu portfeļa galveno lapu izstrādē.
Sylvain Hessens to dara sava portfeļa noformējuma dēļ. (Tam faktiski ir divas lapas: Jauka “ekrānsaudzētāja stila” animācija, kas ar peles kustību pārvēršas galvenajā noformējumā.) Lapa ir vienkārša, informatīva un iespaidīga. Viena ekrāna dizains sniedz jums visu, kas jums jāzina, bez papildu traucējumiem.
6. Drīzumā dizains
Runājot par drīzumā gaidāmajām vietnēm, tas ir ideāli piemērots vienas lapas noformējumam.
Vairumā gadījumu drīzumā lappusēm nav daudz satura - varbūt tikai logotips un ievada informācija vai kontaktinformācija. Vairumā gadījumu tas labi iederas vienā lapā un ir efektīvs lietotāja laika izmantojums, līdz galvenā vietne tiek aktivizēta.
Zaļais hameleons rīkojas tieši tā. Vienas lapas dizains ir īpaši jauks, pateicoties foršajai animācijai un interesantajam teksta izmantojumam. Tas rada gaidīšanas sajūtu un izsauc zinātkāri - tieši to, uz ko jūs varētu cerēt nākamajā lapā.
7. Esi mazliet bailīgs
Vietnes ar vienu lapu var būt lielisks spēles laukums, ja vēlaties izmēģināt kaut ko mazliet savādāku vai bailīgāku. Neparasts displejs labi darbojas ar mazākiem dizainparaugiem, jo jūs negatavojaties pārāk darīt “triku”.
Rou Hun Fan izmanto īpašu burtveidolu un fona režģi, lai izceltu savu informāciju, portfeli un darbu. Ar radošu displeju un minimālu stilu pietiek, lai pamudinātu uz īsu brīdi ritināt un būtu ideāli piemērots portfelim.
8. Dodiet lietotājiem kaut ko darīt
Lai saglabātu iesaisti un saglabātu lietotāju interesi par dizainu, dodiet viņiem daudz ko darīt vienas lapas vietnē.
Viena no neveiksmēm, kāda ir daudziem no šiem dizainparaugiem, ir tā, ka tie ir tikai ilgi informācijas ritinājumi. Sadaliet to ar klikšķināmiem elementiem, aicinājumiem uz darbību un darāmajām lietām. Šie elementi ne tikai palīdzēs jums izdomāt, ko lietotāji vēlas no dizaina (un ja viņi sasniedz jūsu iecerētos mērķus), bet arī palīdzēs uzturēt mijiedarbību ilgāku laika periodu.
Pārpilnība izjauc garu ritināšanas lapu ar daudzām kartes stila pogām, lai rezervētu ceļojuma paketes. Katru no šīm klikšķu mijiedarbībām atzīmē ar bultiņu, lai izveidotu pastāvīgu lietotāja pieredzi.
9. Uzturiet to sakārtotu
Tā kā viss vietnes saturs ir atrodams vienā lapā, dizains ir viegli noņemams. Bet tas var arī izveidot organizētu audekls saturam.
Runājot par darbu ar vienu lapu, stingrs režģis un vienveidīga struktūra var būt jūsu labākie rīki. Izmantojiet tos, lai saturs būtu sakārtots un sagrupēts tādā veidā, lai lietotājiem būtu ērti orientēties un saprast.
Podcast apraide Repo to labi izdara, izmantojot nevainojamu Podcast aprakstu režģi, no kura izvēlēties. Vietne ir pietiekami elastīga, izmantojot šo režģi un stilu, un tā kļūst par tik daudz satura vienumiem, cik tai nepieciešams, nepārkāpjot.
10. Pārdomāti izmantojiet vietu
Viens no vissvarīgākajiem dizaina apsvērumiem garākas ritināšanas vai vienas lappuses dizainam ir vietas izmantošana. Saturam jābūt tādam, lai satura izmaiņas būtu skaidri noteiktas, darbības būtu identificējamas un viss būtu viegli lasāms. (Atcerieties, ka pārāk liela ritināšana var izraisīt zināmu acu sasitumu.)
Vernera krāsu nomenklatūra ir vienas lapas vietne ar daudz satura. Vietne faktiski ir grāmatas no 1821. gada kopija. Kosmoss padara šo dizainu darbu.
Kategorijas un apakšsadaļas ar skaidru režģi un lielu balto laukumu uzlabo lasāmību un skenēšanu. Šeit ir daudz, bet tas šķiet diezgan sasniedzams, pateicoties telpas izmantošanai visā.
Secinājums
Vienas lapas vietnes dizains var būt tikai lieta, kas jums nepieciešama, lai izjauktu dažus no smagākajiem projektiem, pie kuriem strādājat. Šis stils var darboties jebkas, sākot ar drīzumā esošām vietnēm un beidzot ar portfeļiem. Tas ir piemērots jebkurai vietnei bez apjomīga satura.
Vai jums ir kāds lielisks vienas lapas vietņu dizains, ko parādīt? Redzēsim viņus. Kopīgojiet tos ar mums Twitter. Atzīmējiet @designshack un @carriecousins ar saiti uz šo ziņu, un mēs retvīsim savus favorītus.
