13 exemple unice de design pentru subsolul site-ului
Modelele unice de subsol încurajează oamenii să se implice și să interacționeze în continuare cu un site web. Consultați aceste 13 exemple de subsol de site pentru inspirație.
În calitate de designer, este ușor să fii implicat în componentele majore ale unui design web. La urma urmei, trebuie să vii cu aspectul, să introduci navigarea și să te asiguri că totul funcționează împreună. Când vine vorba de subsol, s-ar putea să-l arunci în aer.
Dar un subsol de site acționează ca un pasaj către implicarea ulterioară. Transportă oamenii către pagini diferite. Îi îndeamnă să ia măsuri. Îi păstrează pe un site web. Înainte de a privi exemplele de subsoluri unice, să discutăm de ce sunt importante subsolurile.
De ce contează designul subsolului
Un subsol de site. După timpul și efortul necesar pentru proiectarea unui site web, este tentant să vrei să neglijezi această piesă finală. Subsol paginilor web nu înseamnă sfârșitul experienței unui utilizator. În schimb, subsolul poate funcționa ca o poartă către alt conținut. Poate afișa pictograme sociale atrăgătoare. Poate aduna adrese de e-mail și poate comunica în continuare informații pe care oamenii ar trebui să le cunoască.
Subsolurile înseamnă o navigare mai bună
Să presupunem că cineva s-a uitat prin tot conținutul paginii de destinație și ajunge în partea de jos a paginii. Ei pot avea alte întrebări sau alte domenii pe care doresc să le exploreze. Cele mai bune subsoluri ale site-ului web încapsulează cele mai importante părți ale acestuia. Acestea oferă acces direct pe site prin intermediul link-urilor puse ca și opțiuni de navigare.
Subsolurile site-ului comunică informații relevante
Fie că este vorba despre un slogan sau o altă rezumare a mărci, subsolul ofera o ultimă impresie. Acest lucru poate face diferența dacă vor urma îndemnurile la acțiune sau vor merge mai departe în restul site-ului. Acest ultim fragment de conținut poate ocupa un spațiu mic, dar poate avea un impact mare asupra modului în care cineva se va implica cu restul unui design.
Subsolurile oferă, de asemenea, un loc pentru a introduce toate informațiile de contact necesare. Acestea pot fi: adresa fizică, numărul de telefon, înregistrarea prin e-mail sau alte detalii utile vizitatorilor. Ele pot conține, de asemenea, informații legale și un simbol de drept de autor. Subsolurile sunt o parte simplă a unui design care prezintă informații practice.
Subsolurile dau un apel final la acțiune
Dacă doriți ca cineva să se înscrie pentru un buletin informativ, să înceapă un abonament la un produs sau serviciu sau să colecteze adrese de e-mail într-un alt mod, subsolul site-ului poate fi ultima șansă de a aduna aceste informații importante despre clienți. Tot conținutul care duce la acest lucru poate face pe cineva gata să introducă adresa de e-mail și să se apropie mult de a deveni un client fidel.
Subsolurile pot stimula optimizarea motoarelor de căutare
Când crawlerele web Google scanează un site web, unul dintre factorii pe care îi analizează este numărul de linkuri relevante. Prezentarea unui sitemap sau a altor link-uri în linie le oferă o structură mai bună pentru a determina despre ce este vorba despre designul dumneavoastră web. Prezentarea link-urilor de navigare într-un design de subsol al site-ului web poate oferi site-ului dumneavoastră un impuls SEO. În același timp, îl poate ajuta să câștige acțiune în rezultatele organice ale motoarelor de căutare.
13 modele unice pentru subsolul site-ului
Consultați aceste 13 idei de design pentru un subsol de site realizat corect.
Avo
Datele și analiza pot ajuta de departe o companie să își atingă scopul superior. Avo oferă companiilor o platformă puternică pentru gestionarea și discutarea tuturor datelor lor importante.
Da, există câteva informații tehnice grele aici, dar acest design al paginii web evită să cadă în golul plictisitor în care se încadrează atât de multe companii de tehnologie. Ilustrații elegante, multă culoare și dimensionalitate sunt presărate peste tot, oferindu-i o energie distractivă care echilibrează aspectele mai serioase ale produsului Avo.
Să aruncăm o privire la subsol. Îndemnul la acțiune vă atrage atenția imediat cu „Începeți să utilizați Avo astăzi”. Direct sub acesta este un spațiu pentru a introduce o adresă de e-mail pentru a începe acest proces. Nu își împrăștie aspectul cu prea multe link-uri de subsol și păstrează lucrurile simple. Și ne place avocado care se îmbarcă într-o aventură oceanică în dreapta, ceea ce simbolizează atât de bine acest prim pas.
Pictogramele rețelelor de socializare din dreapta sunt o altă atingere plăcută, iar o privire orizontală prin spațiul ecranului vă aduce ochii direct la ele.
Minimizând cantitatea de legături și permițând suficient spațiu de respirație în jurul diferitelor elemente vizuale, Avo reușește cu un subsol de site care este curat și simplu, cu doar cantitatea potrivită de personalitate.
Clade Design
Plină de forme contrastante, microinteracțiuni captivante și o paletă de culori plină de bucurie, această pagină de pornire a firmei de design Clade Design se remarcă prin simțul său ciudat al creativității.
O formă repetată prin acest aspect este valul de fundal. Îl vedem în partea de sus în albastru și are câteva culori diferite de fundal pentru fiecare secțiune. În partea de jos a paginii este un val albastru similar, făcând din acest subsol un suport de cărți grozav în partea de sus a designului. Chiar dacă nu ați fi atent, ați avea intuitiv sentimentul că sunteți la sfârșit, din designul acestui subsol al site-ului.
Acest exemplu de design de subsol este o lecție de simplitate. Acesta constă dintr-un număr minim de link-uri, un buton de îndemn Contactați-ne în extrema stângă a ecranului și un bloc scurt de pictograme pentru rețelele sociale în partea dreaptă. Acest subsol se potrivește bine cu restul designului, cu un aspect curat și un îndemn clar la acțiune.
Designies
Oferind elementelor sale vizuale un spațiu negativ amplu și umplerea paginii web cu forme geometrice asemănătoare desenelor animate 3D, site-ul Designies este o piesă de design captivantă din punct de vedere vizual. Fiind un portal de conectare atât pentru designeri, cât și pentru clienți, Designies nu dezamăgește cu propria sa estetică cool.
Cu un aspect al site-ului plin de spațiu alb, rozul închis al subsolului s-a împins de exploziile gri închis și negre din design. Când derulați la această secțiune finală, navigarea de sus principală dispare, lăsând butonul albastru de îndemn Become a Designie singur în colțul din dreapta sus. Eliminarea meniului aduce accentul pe acest buton CTA. Link-urile în linie preiau ca navigare principală, iar dacă cineva dorește să se aventureze în diferite părți ale site-ului, este ușor să găsești un link care să-l ducă acolo. Nimeni nu rămâne niciodată atârnat fără un mijloc clar de navigație, indiferent unde s-ar afla.
Cu un spațiu imens dedicat înscrierii la newsletter și o combinație modernă de culori, subsolul Designies oferă concluzia perfectă pentru pagina lor de destinație.
Think32
Ne place mereu să vedem agenții de marketing specializate. Concentrarea este o strategie puternică pentru a ieși în evidență față de concurență.
Think32, din Australia, este o agenție de marketing pentru cabinetele stomatologice. Imaginile dentare sunt subtile, cu designul general proiectând tipul de stilizare modernă pe care l-ar îmbrățișa orice fel de agenție de înaltă performanță. Suntem siguri că 9 din 10 designeri web și stomatologi ar fi de acord.
Subsolul pune îndemnul la acțiune chiar în centru, cu un buton de abonare roz deschis lângă formularul de contact prin e-mail, punând accentul direct asupra acestuia. De asemenea, ne place foarte mult includerea „Marketing atent pentru cabinetele stomatologice” în spațiul din stânga, care rezumă filozofia agenției lor, subliniind și mai mult expertiza acestora.
Hologram
Hologram oferă companiilor ceea ce au nevoie pentru a-și conecta tehnologia la rețelele celulare. Fie că este vorba despre scutere electrice, drone sau un senzor pe un echipament industrial, Hologram și cartelele SIM pe care le produc ajută companiile să-și conecteze tehnologia.
Acesta este un domeniu specializat al tehnologiei cu destul de multe complexități, dar Hologram nu se zgârcește în a face acest design atrăgător din punct de vedere vizual. Cu animații și microinteracțiuni declanșate de derulare, designul oferă o mulțime de oportunități de a se implica și de a naviga mai departe în conținutul lor.
La fel ca ceea ce am văzut pe site-ul Designies, acest subsol efectuează și actul de dispariție a navigației de sus. Linkurile în linie din subsol furnizează apoi toate opțiunile de navigare.
Chiar în partea de sus a subsolului putem privi o casetă cu un gradient de violet și albastru și 2 butoane de îndemn. Culorile schimbătoare ale cutiei ies în evidență din pătratul solid de albastru închis de sub ea, dându-i senzația că se află pe un strat deasupra subsolului. Acest lucru funcționează atât de bine pentru ca acest bloc de îndemn să iasă în evidență față de restul subsolului.
Designul subsolului site-ului Hologram este ceea ce este cunoscut sub numele de subsol gras. Cu o listă extinsă de link-uri, funcționează ca un alt mijloc de navigare prin designul web și oferă motoarelor de căutare o idee mai precisă despre ce este site-ul web.
Savvy
Vedeți ceva familiar la acest subsol pe 2 niveluri de mai jos? (Sugestie: Uită-te la ultima intrare.) Rămâneți pe fază… asta va apărea din nou. Dar să trecem cu acest subsol de la Savvy.
Designul prezintă un bloc mare de subsol în partea de jos a paginii web, cu linii drepte și o casetă mai mică cu colțuri rotunjite deasupra, care conține un buton violet de îndemn pentru „Începe”.
Savvy creează instrumente și aplicații personalizate pentru companii cu cod redus, iar aspectul Z care precede acest subsol arată tot ceea ce fac. Această cale prin designul web conduce direct la conținutul subsolului, cu link-uri în linie care duc la cele mai importante pagini și un formular de abonare prin e-mail ca un îndemn secundar la acțiune.
Astra
Să vă piratați site-ul web poate provoca stres major. În primul rând, există posibilitatea foarte reală de a avea date sensibile compromise. Apoi mai este problema majoră pe care o ia reputația ta online. Software-ul Astra ajută companiile și alte persoane care rulează site-uri web cu o apărare puternică împotriva atacurilor cibernetice.
Acest lucru ar fi putut fi o lungă încercare prin întuneric și nenorocire pe care o fac hackerii, dar, în schimb, designul se concentrează pe optimismul de a fi eliberat de această îngrijorare. Cu o schemă de culori albastru, portocaliu și galben, este o experiență de utilizator înălțătoare.
Subsolul, cu blocul său solid de bleumarin, semnalează oprirea după formele strălucitoare și aspectul aerisit care duc până la el. Cu un set uniform de coloane, linkuri în linie către restul site-ului web și un bloc ordonat de rețele sociale, acest aspect liniar contrastează cu restul designului, făcându-l punctul final perfect.
Fiddler Labs
Să fim sinceri, pentru cei care nu sunt familiarizați cu complexitățile și știința datelor (inclusiv acest autor), site-ul Fiddler Labs poate fi puțin intimidant.
Deși conține multe informații tehnice, site-ul se mândrește și cu o cantitate egală de design creativ. O scurtă derulare dezvăluie elemente vizuale stratificate, dând aspectului un sentiment de dimensionalitate, iar capturile de ecran animate, iconografia și alte elemente vizuale mențin lucrurile interesante.
Și apoi există acest subsol, care prezintă o defalcare simplă a arhitecturii site-ului. Ne place aranjarea a doar 2 articole pe coloană la început, care se acumulează până la formularul de e-mail din dreapta. Acesta este un cârlig vizual atât de grozav și ghidează pe cineva direct către formularul de abonare.
Brass Hands
Pe măsură ce navighezi prin site-ul web al agenției de branding Brass Hands, beneficiezi de o experiență de utilizator fluidă, cu textul declanșat de derulare care se schimbă ușor în poziție, proiecte prezentate care măresc trecerea cu mouse-ul și alte elemente de design bun. Nimic nu este supărător sau deplasat, întregul aspect fiind legat de un sentiment de consistență.
Când plutești până la subsol, este o aterizare ușoară. Linia simplă „Hai să lucrăm împreună” și linkurile către rețelele lor sociale fac din acest subsol un capăt curat al paginii de destinație Brass Hands.
Vectornator
Mulți designeri țin de modalitățile încercate și adevărate de a realiza artă bazată pe vectori, și asta este în regulă. Dar este întotdeauna interesant să vezi companii de software precum Vectornator care vin cu o schimbare diferită. Site-ul web prezintă o mulțime de exemple uimitoare despre ceea ce este posibil cu instrumentul lor. Acest aspect contemporan este, de asemenea, intens, cu animații pline de editări rapide care surprind procesul creativ de utilizare a Vectornator.
Când ajungeți la subsol, veți fi deja uimit de posibilitățile creative ale Vectornator. Nu este nevoie să repetați ceea ce face acest software special sau să adăugați ceva nou în subsol.
Derularea în jos până la subsol face ca navigarea de sus să dispară, lăsând linkurile în linie pe care le conține să vă îndrepte în direcția în care doriți să mergeți. Aceasta este o lecție fantastică de reținere, care arată cum unele dintre cele mai bune subsoluri sunt cele mai simple modele.
Hi5
Hi5 este totul despre team building. Această aplicație distractivă le permite membrilor echipei să-și ofere reciproc premii, să comunice și să ofere feedback și le oferă managerilor șansa de a analiza modul în care se descurcă fiecare în îndeplinirea obiectivelor companiei. Designul reflectă acest spirit pozitiv, cu o paletă de culori jucăușă de albastru, galben și roz, precum și o mulțime de conținut care comunică modul în care aplicația Hi5 poate întări echipele.
Partea stângă a subsolului adună butoane, oferindu-vă opțiunea de a descărca aplicația de pe Google Play, WhatsApp, Apple App Store și în altă parte. Albastrul închis face ca aceste butoane să fie imposibil de ratat, făcându-le punctul focal al subsolului.
Hi5 umple partea dreaptă a subsolului cu informații despre companie, inclusiv adresele birourilor lor internaționale și un bloc de butoane pentru rețelele sociale.
Acest subsol are multe părți diferite, dar folosește suficient spațiu alb și culoare pentru ca totul să rămână în ordine.
Appasaurus
În cadrul design-ului web pentru agenția de dezvoltare a aplicațiilor Appasaurus sunt numeroși dinozauri. Designul se deschide cu o ilustrare ciudată și amuzantă a angajaților lor ca aceste animale preistorice. Această temă ciudată este păstrată în acest spațiu web încântător, cu o întreagă distribuție de dinozauri redați într-un stil casual.
Deasupra subsolului suntem întâmpinați cu un ultim dinozaur, tiranozaurul, cu cuvintele „Nu lăsați aplicația dumneavoastră să urmeze calea dinozaurilor”. Aceasta este o legătură atât de distractivă cu restul designului și se potrivește bine cu butonul alb de preț chiar sub acesta. Cu un fundal negru care arată întotdeauna bine în combinație cu alb și albastru, primim o listă mică de opțiuni de navigare, precum și linkuri către rețelele lor sociale. Cu un stil ireverent care se extinde la subsolul lor, Appasaurus arată că un pic de absurd poate face o experiență de utilizator mai plăcută.
Flowbase
Sunteți inspirat de oricare dintre aceste subsoluri pentru următorul dumneavoastră proiect? Flowbase oferă peste 10 machete diferite de subsol de site pe care le puteți clona. Ele oferă o mulțime de kituri UI și alte elemente pe care le puteți utiliza pentru design-urile dumneavoastră. Dacă nu le-ați verificat deja, acordați-vă timp pentru a vă familiariza cu ceea ce au de oferit.
Subsolul poate fi începutul călătoriei unui client
Cu un aspect bine ordonat de link-uri, blocuri de pictograme pentru rețelele sociale, înscrieri la buletine informative și alte opțiuni suplimentare, subsolurile ocupă un spațiu important. În loc să semnaleze închiderea unui site web, ar trebui să inspire pe cineva să aprofundeze, să învețe mai multe și să se conecteze mai departe cu un brand. Deși ocupă partea de jos a unui design, tu, în calitate de designer, ar trebui să faci din subsol o prioritate.
