Pagrindinis » Interneto svetainės dizainas » Prisijungimo / registracijos forma Idėjos ir gražūs pavyzdžiai

    Prisijungimo / registracijos forma Idėjos ir gražūs pavyzdžiai

    Visame šiuolaikiniame žiniatinklyje matome vis daugiau vartotojų įvedimo vietų. Tai apima pirkinių vežimėlius, interaktyvius internetinius žaidimus ir, žinoma, svetainės registracijos formas. Atrodo, kad ne tik dizaineriai turėtų sutelkti dėmesį į puslapio dizainą, bet ir vienodai svarbų vaidmenį formuoti estetiką.

    Apsvarstykite, kiek formų galite užpildyti per savo interneto istoriją. Yra daugybė tokių pavyzdžių iš forumų, pranešimų lentų, tinklaraščių ir dar daugiau. Šiame straipsnyje mes pažvelgsime į keletą puikių gudrybių, kad galėtume kurti savo puslapių formas.

    Kai kurie dalykai yra išmintingi iš objektyvios perspektyvos. Nors daugelis prisijungimo ir registracijos formų gerai veikia su vienos rūšies svetaine, nėra galutinio teismo sprendimo dėl to, kas yra “geriausia” sprendimas. Naudokite savo dizaino intuiciją, kad galėtumėte taikyti bitus ir gabalus iš formų, kurias siekiate.

    Apsvarstykite kelis įėjimus

    Norėdami pradėti viską, apsvarstykite mažą kontaktinę formą iš „Six Six Design“. Taip, tai ne prisijungimo forma, todėl ji gali nukreipti šiek tiek nuo temos. Tačiau jų puslapių dizainas yra labai įspūdingas ir parodo, ką gali pasiekti mažai kūrybiškumo.

    Kiekvienas įvesties laukas suteikia jums galimybę įvesti asmeninę kontaktinę informaciją - vardą, el. Paštą ir kt. Stiliai gerokai viršija paprastą, o vartotojo įvedimas yra rankinio rašto tipo. Šis formatavimo būdas padės naudotojams stebėtis ir pasiekti gerokai aukštesnius dizaino standartus.

    Jūs norite įgyvendinti tokius stilius kaip ir visi jūsų prisijungimo puslapiai. Aš tikrai nerekomenduočiau laikytis to paties stiliaus įvesties teksto ir pasirinkimo / pasirinkimo meniu. Bėgdami savo smegenis kūrybiškumui, apsvarstykite, kaip kiekvienas elementas turėtų būti išdėstytas: daug erdvės tarp sluoksnių, didelis lengvai įskaitomas tekstas ir net šoninės juostos nuorodos į tiesioginę el. Pašto liniją.

    jQuery prisijungimo dėžutės

    Tai buvo naudojama daugelyje svetainių praeityje ir, be abejo, bus matoma naujojo amžiaus dizainuose. Seniai praėjo tos dienos, kai standartinė praktika leis vartotojams į naują puslapį kiekvienam prisijungimo proceso etapui. Paprastai tai reikštų puslapį, kuriame būtų įvesti jūsų duomenys, ir naują puslapį, skirtą prisijungimo informacijai tvarkyti.

    „Pixel2Life“ siūlo fantastišką naują duomenų įvedimo sritį. Savo pagrindiniame puslapyje galite spustelėti prisijungimo nuorodą ir parodyti dinamišką „jQuery“ prisijungimo langelį. Šioje formoje yra „Ajax“ skambutis į išorinį PHP scenarijų, kuris tikrina prisijungimo informacijos kredencialus ir, apdorojus, suteikia arba neleidžia prieigos.

    Dar vienas žingsnis toliau, protingas, gali pastebėti registracijos nuorodą tiesiai po prisijungimo langeliu. Tai suteikia daug sklandesnę naudotojų patirtį tiems, kurie nori užsiregistruoti svetainėje, bet negali rasti registracijos nuorodos.

    Jei vartotojas neturi paskyros, bet norėtų tai padaryti, tai atneša juos į registracijos puslapį be jokių klaidingų puslapių trikdžių. Prisijungimo langas vis tiek būtų perspektyvi galimybė prisijungti prie savo sąskaitos, tačiau leisdami parinktį, galima gauti didesnę grąžą ir didesnį naujų registruotojų kiekį.

    Paprastos vieno puslapio registracijos

    Kita keičianti paradigma, kurią matome, yra tai, kad nėra išsamios naujos sąskaitos registracijos. Tai nebūtinai yra bloga statistika, darant prielaidą, kad vartotojai didėja nekantriai užpildydami duomenis. Skaičiai iš tikrųjų siūlo svetaines su trumpesniais registracijos puslapiais sunkesnis naujų vartotojų sąrašus.

    „Sikbox“ siūlo lengvą lankytojų pasirinkimą sukurti savo tinklalapio paieškos laukelį. Vienintelis reikalavimas yra jūsų pačių pasirinktas domenas, kuris suteikia paieškos rezultatus. Įvesties laukai yra dideli, tekstas yra labai paprastas skaityti ir yra visiškai jokių reklamų nukreipti vartotojus nuo savo paieškos formos kūrimo užduoties!

    Dabar tai nėra geriausia forma, kai kuriate savo forumo ar dienoraščio archyvo registracijos puslapį. Pagal standartinę apibrėžtį jie reikalauja bent jau tam tikro tipo el. Pašto adreso / vartotojo vardo kombinacijos kartu su slaptažodžiu. Kai kurios naujojo amžiaus žiniatinklio programos vartotojams sukurs dinaminius slaptažodžius, kad registracijos procesas būtų greitesnis.

    Be abejo, kompromisas čia nekontroliuoja vartotojo pabaigos, kad generuotų savo slaptažodį, į kurį daugelis žmonių yra įpratę.

    Sukurkite „Flashy Effects“

    Vienas iš didžiausių prisiregistravimo patirties, kada nors buvau, buvo mano pirmosios „Tumblr“ paskyros sukūrimas. Jų pagrindiniame puslapyje yra tiek prisijungimo, tiek prisiregistravimo forma, kuri yra tiesiogiai viena po kitos, su naujais CSS3 paryškinimo / išblukimo efektais.

    Šis sisteminis požiūris panašus į „Pixel2Life“ jQuery prisijungimo zoną. Tačiau skirtumas tarp „Tumblr“ yra tai, kad tinklas negali pasiūlyti jokio turinio tiems, kuriems nėra tinklaraščio (išskyrus kitų paskyrų naršymą). Tikroji „tumblr“ nauda yra sukurti savo tinklaraštį ir sekti kitus - todėl pagrindinis jūsų pagrindinis tikslas yra sukurti paskyrą arba prisijungti.

    Yra keletas klaidų su šia sistema. Visų pirma per IE6 / IE7, kuri nepalaiko šių naujų CSS savybių. Taip pat naudojamas pagrindiniame puslapyje yra sistema, skirta etiketės elementų įtraukimui į formų įvesties vertes - iš esmės peržengiant “numatytas” simbolių, naudojamų el.

    Šios etiketės sutrinka šiuolaikinėse naršyklėse, tokiose kaip „Chrome“ / „Firefox“. Bet ne tokios sėkmės su nuvertintomis naršyklėmis, kurios, kaip galite įsivaizduoti, yra gana erzina bandant perskaityti savo įvestį!

    20+ gražios formos dizaino pavyzdžiai

    Žemiau pateikiamas greitas kai kurių fantastinių prisijungimo formų dizainas. Jie buvo paimti iš žiniatinklio ir apima daugybę interneto programų. Jei turite pasiūlymų kitoms svetainėms, pasidalinkite jais toliau pateiktame komentarų skyriuje!

    „Snoggle News“

    Robo.to

    Virb

    Grooveshark

    Storenvy

    „Dropbox“

    „Green Globe“ idėjos

    Freshbooks

    Themeforest

    MailChimp

    BaseCamp

    TestFlight

    AwesomeJS

    Atrakinimas

    „PopScreen“

    Gowalla

    Kontain

    „MobileMe“

    Laterthis

    Launchlist

    Theidealistas