ertare.com

Cum de a crea o pagină web

Proiectarea unui site excelent poate părea o mare provocare, dar atâta timp cât aveți în vedere principiile de bază, veți găsi un proces interesant și plăcut. Există mult mai mult decât aspectul! Vă vom arăta elementele de bază și câteva reguli generale care vă vor ajuta să designați site-urile pe care oamenii doresc să se întoarcă.

pași

Metoda 1
Cele 3 reguli de bază

1
Regula nr. 1: Ascultă-ți clientul. Puteți proiecta "cel mai bun site din istoria universului și chiar mai mult „cu un design bogat, fonturi sofisticate, îndrăznețe și artistice pe un site care tipa culori“ explórame ya! „Dar, din păcate, clientul a dorit un meniu portocaliu cu versuri gros în roz și portocaliu. Am tras, și cel mai bun loc din istoria -pe care clientul are drepturile se află undeva pe Proprietății din hard disk, astfel încât să nu-l nici un muritor vezi.
  • Studiați identitatea corporativă a clientului. Întrebați-vă clientul să vă arate site-uri care vă place foarte mult. Acest lucru nu numai că vă va da o idee despre ceea ce vă dezlănțuie imaginația, dar vă va oferi câteva idei de design pe care nu le-ați avut în vedere.
  • Dacă ați crezut că am glumit cu site-ul în roz și portocaliu, trebuie doar să ne imaginăm că Kindest și sofisticat istoria site-ului trebuie să promoveze acest produs:
Site-ul% E2% 80% 94dunkin-donuts.jpg" class ="imagine lightbox">
Imagine cu denumirea Website-dunkin donuts.jpg
  • 2
    Regula 2: Faceți cunoștință cu publicul și ceea ce căutați și faceți un design adecvat. Motivul pentru care oamenii au site-uri web este pentru că vor ca alții să le vadă. Acesta poate fi informativ sau comercial, sau în scopuri de divertisment axat pe un anumit grup demografic. Treaba voastră, ca designer, este să știți pentru cine proiectați și păstrați-le pe pagină imediat ce ajung acolo.
  • S-ar putea să vă gândiți: "Dacă ar părea bine, ei vor rămâne." Dar acest lucru nu este neapărat cazul. De exemplu, gândiți-vă la domeniul imobiliar. Există un site care prezintă un design curat și distractiv. Ea are o mulțime de spațiu gol, care deschide lucrurile, culori puternice, și un format de ecran orizontal foarte modern, cu link-uri evidențiate:
    Santa-Monica-real estate-1.jpg" class ="imagine lightbox">
    Imagine cu denumirea Santa Monica real estate 1.jpg
  • Acum, gândiți-vă la această metodă de vânzări imobiliare în aceeași regiune: este dezordonată și are multe lucruri, culori strălucitoare și este plină de anunțuri.
    Santa-Monica-trulia.jpg" class ="imagine lightbox">
    Imagine cu denumirea Santa monica trulia.jpg
  • Ghiciți care dintre cele două site-uri este cel mai bun pentru cei care caută case. Corect, cel care "arată case"! Când oamenii caută "case de vânzare în Santa Monica", ei nu sunt interesați de estetica site-ului. Ei nu vor să știe despre agentul imobiliar sau să vadă fotografii frumoase ale orașului. Vor să vadă casele.
  • 3
    Regula nr. 3: Ascultă-te. Înțelegi ce dorește clientul și știi ce caută piața. În cele din urmă, a fost timpul să vă acordați atenție proiectantului!
  • Pregătiți un șablon în programul de design grafic ales de dvs. În straturi diferite (pentru a putea schimba lucrurile mai târziu, fără a fi nevoie să distrugeți întregul șablon) creați elementele care vor apărea pe pagină. Acestea pot fi:
  • cap. Antetul (antetul, în limba engleză) va fi un element comun pentru toate paginile site-ului. Antetul conține titlul și sigla site-ului și linkurile către celelalte sub-secțiuni ale site-ului (cum ar fi Despre, Contact etc.). Vizuale și practice, este ceea ce unește toate lucrurile. O bună practică este de a face primul buton al unui meniu să aibă un link către pagina de pornire.
  • Să urmărim măr, de exemplu:
    Apple a-home-aterizare-page.jpg" class ="imagine lightbox">
    Imagine intitulată Apple home landing page.jpg
  • Ca aproape totul despre Apple, pagina sa de acasă are un design foarte curat și dezbrăcat. Observați bara de meniu de-a lungul partea de sus, cu teme logice pe fiecare buton și un -Întotdeauna câmp de căutare este o atingere frumos dacă site-ul dvs. acceptă. Acum, să găsim o pagină de destinație pentru unul dintre iPad, butoane și observați unele dintre elementele sale:
    Ipad-aterizare-page.jpg" class ="imagine lightbox">
    Imagine intitulată Ipad landing page.jpg
  • Bara de navigare modifică numai obscurarea butonului iPad.
  • Tema paginii de sosire este în litere mari și negre în partea stângă sus.
  • Un submeniu pare să poată afla mai multe despre produs. Dacă faceți clic pe acele titluri de submeni, veți vedea că fiecare pagină oferă conținut nou relevant pentru subiect, dar cu exact același design.
  • De multe ori, fiecare titlu principal al barei de meniu va avea mai multe subtitrări pentru care trebuie să răspundeți. În loc să creați o bară secundară, puteți utiliza meniuri pop-up cum ar fi acest exemplu Prietenul muzicianului:
    Mf-menu-menu.jpg" class ="imagine lightbox">
    Imaginea intitulată Mf meniu meniu.jpg
  • bara laterală. Acesta va fi, de asemenea, un element comun în multe pagini ale site-ului dvs., dar nu neapărat în toate: regele este conținutul. Dar este un element foarte important și trebuie să îl proiectați cu atenție astfel încât să fie intuitiv și să nu aibă elemente inutile care să îl împiedice. Spre deosebire de bara de meniu, conținutul barei laterale poate fi foarte dinamic. Uită-te la aceste două bare laterale ale unui comerciant imobiliar: Trulia Primul este pentru cei care doresc să cumpere:

    Trulia-buy.jpg" class ="imagine lightbox">Imaginea intitulată Trulia buy.jpg
  • Și al doilea este pentru cei care vor să închirieze. Observați abordarea complet diferită care se face pentru informații foarte asemănătoare - și apare exact în același loc în bara laterală:



    Trulia-rent.jpg" class ="imagine lightbox">Imagine cu titlul Trulia rent.jpg
  • corp. Aici se întâmplă totul și este partea cea mai variabilă a designului. Dacă faceți un site de e-commerce, de exemplu, o pagină poate avea o descriere a produsului în organism, iar următoarea poate avea 20 de articole de vânzare. Treaba voastră este de a uni cele două astfel încât să nu pară nevăzute vizual. Utilizați culori similare, litere și elemente de interfață astfel încât totul să aibă coeziune.
  • picior. Piciorul este ceva ce nu au sau nu toate site-urile. Acesta este, de obicei, folosit pentru lucruri care pot împiedica un design sau pentru a da acces la părți ale site-ului care nu sunt în centrul atenției. Iată un exemplu de Groupon:
    Groupon-footer.jpg" class ="imagine lightbox">
    Imaginea intitulată Groupon footer.jpg

    • Metoda 2
    norme

    1
    Exersați designul interfeței pentru o bună utilizare. Localizarea diferitelor elemente ale site-ului, cum ar fi titlul, barele laterale, logo-urile, grafica și textul în aceleași locuri din fiecare pagină, va face site-ul dvs. navigabil și intuitiv.
    • Păstrați antetul în partea de sus a tuturor paginilor. Nu contează dacă conținutul site-ului dvs. se dorește să repete mai multe elemente - asigurați-vă că partea de sus a fiecărei pagini este identică este esențială.
    • Utilizați logica în design. Elementele unei singure pagini trebuie ordonate într-un mod logic, de importanță sau de subiect - toate paginile site-ului trebuie să facă același lucru.
  • 2
    Creați un stil consistent Deși locația elementelor ar trebui să ofere consistență structurală site-ului, stilul ar trebui să-i dea o armonie tematică.
  • Rămâneți cu două sau trei culori principale și asigurați-vă că armonizează bine.
  • Evitați utilizarea prea multor stiluri sau dimensiuni de fonturi - dacă intenționați să alternați între câteva, asigurați-vă că le folosiți în același mod pe toate paginile.
  • Utilizați CSS (Cascading Style Sheet) pentru a gestiona uniformitatea stilului și pentru a face mai ușor schimbarea elementelor pe întregul site fără a fi nevoie să mergeți la fiecare pagină individual.
  • 3
    Maximizați lizibilitatea Pentru a face textul mai ușor de citit, descompune-l în secțiuni mai mici.
  • Utilizați subtitrări și distanțe adecvate pentru a separa fiecare secțiune.
  • Utilizați fonturi aldine sau diferite dimensiuni pentru a arăta ierarhia și importanța temelor.
  • Acordați atenție manipulării textului. Nu faceți fontul prea mic sau paragrafele prea mari, astfel încât acestea să fie mai ușor de citit. Fragmentele de text de mari dimensiuni vor fi mai greu de citit - le vom rupe în paragrafe mici.
  • 4
    Asigurați-vă că site-ul dvs. poate fi citit universal. Utilizați cod HTML standard și evitați etichetele, funcțiile și pluginurile care sunt disponibile numai pentru o marcă sau pentru o versiune de browser.
  • Deși browserele și cele mai moderne computere se pot ocupa de imagini complexe, totul va fi mai ușor dacă păstrați imagini de dimensiuni reduse optimizate pentru web. Faceți un echilibru între dorința de calitate și nevoia de viteză.
  • 5
    Testați-vă site-ul Asigurați-vă că toate link-urile funcționează după cum doriți, și că imaginile arată corect.
  • Ar trebui să faci unele teste de uzabilitate, cere membrilor publicului țintă pentru a evalua claritatea și gradul de utilizare a design-ul, și vă va oferi opiniile lor pe site-ul web.
  • 6
    Publicați-vă site-ul web Dacă nu ați făcut deja acest lucru, cumpărați un domeniu. Verificați periodic link-urile pentru a vă asigura că acestea există în continuare și pentru a asculta sugestiile pe care vizitatorii le fac pentru dvs.

    • sfaturi

    • Deși aveți libertatea de a proiecta pe baza viziunii personale sau a lucrurilor pe care le admirați de la alte site-uri, ar fi mai ușor să începeți să cumpărați un șablon gata făcut.
    • Pentru a evita risipa cerneală a vizitatorilor, utilizați un CSS separat pentru a formata site-ul pentru imprimare.
    • Dezactivează imaginile de fundal când setați parametrii de imprimare.
    • Utilizați textul negru pe un fundal alb.
    • Eliminați bara de meniu și imaginile inutile.
  • Nu bombardați vizitatorii cu grafice sau grafice. animatii Flash, culori luminoase, fundaluri și muzică model jucat automat de fiecare dată când o pagină se încarcă au fost ceva amuzant în anii `90, dar astăzi înstrăina utilizatori. Stai cu fundaluri simple, care contrastează cu culoarea textului pentru lizibilitate maximă.
  • Pentru a ajusta vizitatorii cu deficiențe de vedere vizual sau vizual, puteți subtitrarea videoclipului, să transcrieți conținutul audio și să includeți o notă privind accesibilitatea. Deși tabelele reprezintă o modalitate eficientă de organizare a informațiilor, vizitatorii cu probleme vizuale care folosesc un program de citire a ecranului pot să nu audă materialele comandate de coloane.
  • Puteți folosi întotdeauna CSS pentru a stabili distanțe adecvate între paragrafe.

    • avertismente

    • Evitați plagiatul și respectați toate legile privind drepturile de autor. Nu adăugați imagini aleatorii de pe internet sau utilizați elemente structurale fără permisiune. Orice ați pune pe site, trebuie să fie legal și etic.
    Distribuiți pe rețelele sociale:

    înrudit
    Cum se creează o pagină web de bună calitateCum se creează o pagină web de bună calitate
    Cum se descarcă The Sims 3Cum se descarcă The Sims 3
    Cum de a proiecta un site care să arate profesional gratuitCum de a proiecta un site care să arate profesional gratuit
    Cum se scrie un e-mail pentru serviciul cliențiCum se scrie un e-mail pentru serviciul clienți
    Cum să explicați SEO cliențilorCum să explicați SEO clienților
    Cum să filtrați produsele în calendarul rezervărilor WebReservCum să filtrați produsele în calendarul rezervărilor WebReserv
    Cum se face un site folosind WordPressCum se face un site folosind WordPress
    Cum să hack o pagină web cu HTMLCum să hack o pagină web cu HTML
    Cum se instalează ElvUICum se instalează ElvUI
    Cum să joci Age of Empires onlineCum să joci Age of Empires online
    » » Cum de a crea o pagină web

    © 2011—2020 ertare.com