DifiTsi.com

Proiectați un site web

Proiectarea unui site web excelent poate părea o sarcină dificilă, dar atâta timp cât păstrați elementele de bază în minte, veți găsi acest proces interesant și plăcut. E vorba de mai mult decât de bine. Vă vom arăta elementele de bază și câteva linii directoare generale, care vă vor ajuta să creați site-uri pe care oamenii să revină.

metodă

Metoda 1
Cele 3 principii

1
Regula nr. 1: Ascultă-ți clientul. Puteți vedea „cele mai bune pagini web din lume în istoria universului și dincolo de“ proiectarea, cu contraste bogate, fonturi sofisticate și, culori artistice strălucitoare, pe de o parte strigând „Surf pe mine!“ Din păcate, clientul a dorit o bară de meniu portocaliu cu font mai gros în roz și portocaliu. Ești concediat, și site-ul cel mai bun dintre toate - drepturile lor sunt clienții dvs. -lungert unitatea lor de rezervă în jurul valorii de undeva, și niciodată nu va fi văzut de ochii umani.
  • Implicați-vă cu identitatea corporativă a clientului dvs. Permiteți clientului să vă arate câteva site-uri pe care le place cu adevărat. Acest lucru nu numai că vă oferă indicii despre ceea ce îi place, dar și câteva idei de design pe care s-ar putea să nu le veniți.
  • În cazul în care ați crezut că facem o glumă cu site-ul portocaliu cu roz, imaginați-vă cel mai tare și mai ingenios site pentru a promova acest produs:
Imagine cu titlul Website dunkin donuts.jpg
  • 2
    Regula 2: Faceți cunoștință cu publicul și cu ceea ce vă place și pentru a proiecta în consecință. Motivul pentru care oamenii au site-uri web este că vor ca alții să le folosească. Acestea pot furniza informații, pot fi comerciale sau pot oferi divertisment personalizat pentru o anumită audiență. Treaba ta ca designer este să știi cine crezi și să-i păstrezi pe pagina pe care au aterizat.
  • S-ar putea să vă gândiți: "Dacă ar arăta bine, ea va rămâne". Dar asta nu este neapărat cazul. Aici este o pagină cu un design curat, amuzant. Există o mulțime de spațiu gol, care deschide lucruri, culori clare și un format foarte modern, cu ecran lat, cu legături clar evidențiate:
    Denumirea fotografiei Santa monica real estate 1.jpg
  • Acum, luați în considerare această încercare de a vinde proprietăți imobiliare în aceeași zonă: este încărcată și foarte aglomerată, cu culori neclare și pline de anunțuri.
    Imagine cu denumirea Santa monica trulia.jpg
  • Rata, care funcționează mai bine cu persoanele care caută o casă? Exact, cel care listează cu adevărat "case"! Când oamenii caută "case de vânzare în Dusseldorf", nu prea pasă de estetica site-ului. Vrei să știi ceva despre agentul imobiliar sau să vezi imagini frumoase ale locului. Vor să vadă case.
  • 3
    Regula 3: Ascultă-te. Știți ce îi place clientul și știți ce căutăm piața. La urma urmei, este timpul să vă ascultați, designerul!
  • Creați un șablon într-o aplicație grafică la alegere. Creați elementele care se încadrează în pagina dvs. la diferite niveluri (astfel încât să puteți schimba ulterior masa fără a distruge întregul șablon). Aceste elemente pot fi:
  • antet. Acest element este același pe fiecare pagină. Antetul conține titlul și logo-ul paginii și linkurile către celelalte sub-secțiuni ale paginii (de exemplu, Despre, Contact etc.). El ține lucrurile împreună vizual și practic. Este o practică obișnuită ca primul link din bara de meniu să fie un link înapoi la pagina de start.
  • Să aruncăm o privire la Apple, de exemplu:
    Imagine intitulată Apple home landing page.jpg
  • Ca și în cazul aproape tuturor, pagina de pornire a Apple are designul foarte curat și curat. Rețineți bara de meniu de mai sus, cu teme logice pentru fiecare buton, plus o bară de căutare - întotdeauna o mișcare bună dacă site-ul dvs. le suportă. Acum, să aruncăm o privire asupra unei pagini de destinație pentru unul dintre butoane, iPad și să examinăm câteva dintre elementele sale:
    Imagine intitulată Ipad landing page.jpg
  • Bara de meniuri se modifică atunci când butonul iPad este întunecat.
  • Tema paginii de destinație este scrisă cu majuscule negre în colțul din stânga sus.
  • Va apărea o nouă bara de submeni pentru a afla mai multe despre produs. Dacă faceți clic pe fiecare dintre subcapitolele de submeniu, veți vedea conținut nou relevant pentru subiect, dar cu aspect și design identic.
  • Adesea, fiecare poziție din bara de meniu conține diferite subtitluri pe care trebuie să le luați în considerare. În loc să creați o bară de meniu secundară, puteți utiliza meniuri pop-up, cum ar fi Friend`s Musician, în acest exemplu:
    Imaginea intitulată Mf meniu meniu.jpg
  • bara laterală. Acest lucru este același pe multe pagini ale site-ului dvs. - dar nu în mod necesar pe toate - în funcție de context. Cu toate acestea, este un element foarte important și trebuie să fie atent proiectat pentru a fi intuitiv și nu inutil de plin. Spre deosebire de bara de meniu, conținutul barei laterale poate fi foarte dinamic. Priviți aceste două bare laterale de la brokerul Trulia. Primul este pentru cumpărători:

    Imagine cu titlul Trulia buy.jpg
  • Și al doilea este pentru chiriasi. Observați focalizarea complet diferită pentru informații foarte asemănătoare și apar exact în același loc pe bara laterală:

    Imagine cu titlul Trulia rent.jpg
  • corp. Acesta este locul în care se întâmplă evenimentul și aceasta este cea mai variabilă parte a designului dvs. De exemplu, dacă proiectați o pagină de comerț electronic, puteți avea o revizuire a produsului în organism pe o singură pagină, în timp ce următoarea oferă 20 de articole de vânzare. Treaba voastră este de a conecta cele două astfel încât acestea să nu pară detașate unele de altele. Utilizați culori similare, fonturi și surfels pentru a conecta totul.
  • subsol. Acesta este ceva care nu are fiecare pagină sau nevoi. Adesea este folosit pentru lucruri care au supraaglomerat un design altfel curat, sau oferă acces la lucrurile de pe pagină care nu sunt în centrul atenției. Iată un exemplu de la Groupon:
    Imaginea intitulată Groupon footer.jpg


    • Metoda 2
    Orientări

    1
    Exersați un design bun pentru interfața cu utilizatorul. Poziționați diferitele elemente ale paginii web, cum ar fi titlul, barele laterale, logo-urile, grafica și textul, pe aceeași pagină a fiecărei pagini, pentru a face pagina dvs. navigabilă și intuitivă.
    • Păstrați același antet deasupra fiecărei pagini. Indiferent dacă conținutul paginii conține multe elemente repetitive sau nu, este întotdeauna important ca partea de sus a fiecărei pagini să fie aceeași.
    • Faceți-vă designul logic. Elementele de pe o singură pagină trebuie ordonate logic după importanță sau subiectul, precum și pe diferitele pagini ale paginii web.
  • 2
    Creați un stil consistent. Aspectul conferă paginii o structură consistentă, stilul ar trebui să le dea armonie tematică.
  • Rămâneți cu două sau trei culori principale și asigurați-vă că armonizează bine.
  • Evitați utilizarea prea multor fonturi sau dimensiuni. Dacă doriți să utilizați câteva dintre acestea alternativ, ar trebui să le utilizați în același mod pe fiecare pagină.
  • Utilizați foi de stil cascadă (CSS) pentru a păstra un stil coerent și pentru a facilita modificarea elementelor pe întreg site-ul, fără a fi necesară accesarea fiecărei pagini individuale.
  • 3
    Maximizați lizibilitatea. Spargeți textul în secțiuni mai mici pentru a face mai ușor de citit
  • Subpozițiile și spațiile adecvate sunt potrivite pentru separarea secțiunilor.
  • Utilizați fonturi aldine sau de dimensiuni diferite pentru a ilustra ierarhia și importanța subiectelor.
  • Acordați atenție reprezentării textului. Faceți fontul nu prea mic și extindeți distanța dintre linii, astfel încât blocurile de text să fie mai ușor de citit. Blocurile mari de text sunt mai greu de citit, în loc să le împărțiți în secțiuni mai mici.
  • 4
    Asigurați-vă că site-ul dvs. este universal lizibil. Utilizați cod HTML standard și evitați etichetele, funcțiile și pluginurile disponibile numai pentru o marcă sau o versiune a unui browser.
  • Deși majoritatea browserelor și computerelor moderne pot gestiona imagini complexe, totul poate fi mai rapid dacă păstrați imaginile mici și optimizate pentru web. Echilibrează dorința de calitate împotriva nevoii de viteză.
  • 5
    Testați-vă site-ul. Verificați dacă fiecare legătură funcționează așa cum vă așteptați și imaginile sunt afișate corect.
  • Puteți efectua câteva teste de utilizare, în cazul în care oamenii din publicul dvs. țintă testează claritatea și utilitatea designului dvs. și vă oferă feedback despre site-ul dvs. Web.
  • 6
    Publicați-vă site-ul web. Dacă nu ați făcut deja acest lucru, cumpărați un nume de domeniu. Verificați periodic link-urile pentru a vă asigura că aceștia încă lucrează și ascultați e-mailuri cu sugestii de la vizitatorii site-ului dvs. Web.

    • Sfaturi

    • Nu bombardați vizitatorii cu grafică comică. animație Flash, culori vii, imagini de fundal cu model, iar muzica care va fi jucat de la sine de fiecare dată când o pagină se încarcă, au fost experimente amuzante în anii `90, dar site-urile de azi sperie utilizatorii din. Rămâneți cu fundaluri simple care contrastează cu textul și îl faceți cât mai ușor de citit.
    • Dacă puteți crea un design bazat pe viziunea personală sau lucrurile pe care le doriți pe alte site-uri, este mai ușor să cumpărați un șablon gata făcut.
    • Pentru a primi vizitatori surzi și cu deficiențe de vedere, puteți să înregistrați un videoclip, să transcrieți audio și să atașați o notă despre accesibilitate. Dacă tabelele pot fi, de asemenea, o modalitate eficientă de a organiza informații, vizitatorii cu deficiențe de vedere care utilizează un cititor de ecran nu pot auzi materialul în ordinea coloanelor.
    • Pentru a salva cerneala vizitatorului, utilizați o foaie de stil separată pentru a formata pagina dvs. pentru imprimare.
    • Dezactivați imaginile de fundal atunci când setați parametrii de imprimare.
    • Utilizați textul negru pe fundal alb
    • Scoateți bara de meniu și toate imaginile inutile.
    • Puteți folosi întotdeauna CSS pentru a face distanțe adecvate între secțiuni.

    avertismente

    • Evitați plagiatul și respectați toate legile privind drepturile de autor. Nu lipiți imaginile de pe Internet în mod intenționat sau chiar elemente structurale, fără a obține permisiuni de la dvs. Orice publicați pe site-ul dvs. trebuie să fie legal și etic.
    Distribuiți pe rețelele sociale:

    înrudit