Cum să proiectezi un site web (cu imagini)

Cuprins:

Cum să proiectezi un site web (cu imagini)
Cum să proiectezi un site web (cu imagini)

Video: Cum să proiectezi un site web (cu imagini)

Video: Cum să proiectezi un site web (cu imagini)
Video: Instalare PS5 pas cu pas ! Activare PS+ în România ! 2024, Mai
Anonim

Acest wikiHow vă învață cum să proiectați un site web care să pară profesional și să aibă performanțe bune. Deși cea mai mare parte a designului site-ului dvs. web depinde în cele din urmă de dvs., există câteva lucruri esențiale de făcut și de evitat atunci când creați un site web.

Pași

Partea 1 din 2: Cum să vă proiectați site-ul web

Proiectați un site web Pasul 1
Proiectați un site web Pasul 1

Pasul 1. Stabiliți dacă doriți să utilizați un creator de site-uri web

Site-urile create de la zero necesită o înțelegere destul de detaliată a codificării HTML, dar puteți crea cu ușurință un site web utilizând un serviciu gratuit de găzduire precum Weebly, Wix, WordPress sau Google Sites. Creatorii de site-uri web tind să fie mult mai ușor de utilizat pentru designerii pentru prima dată decât HTML.

  • Dacă decideți să vă codificați propriul site web, va trebui să învățați atât codarea HTML, cât și codarea CSS.
  • Dacă investiția de timp și energie pentru a vă crea site-ul nu sună atrăgătoare, puteți angaja și un designer de site-uri web pentru a vă crea site-ul. Designerii independenți pot costa oriunde între 30 USD pe oră și mult peste 100 USD pe oră.
Proiectați un site web Pasul 2
Proiectați un site web Pasul 2

Pasul 2. Hartați-vă site-ul

Înainte de a deschide chiar un creator de site-uri web, ar trebui să știți aproximativ câte pagini doriți să aibă site-ul dvs. web, care ar trebui să fie conținutul fiecăreia dintre aceste pagini și aspectul general al paginilor importante, cum ar fi pagina de pornire și „Despre” pagină.

Paginile site-ului dvs. web pot fi mai ușor de vizualizat dacă desenați imagini brute ale fiecăreia dintre ele, mai degrabă decât să determinați ce conținut ar trebui să apară

Proiectați un site web Pasul 3
Proiectați un site web Pasul 3

Pasul 3. Folosiți un design intuitiv

Deși există ceva de spus pentru idei noi, designul de bază al site-ului dvs. web ar trebui să respecte îndrumări stabilite, cum ar fi următoarele:

  • Opțiunile de navigare (de exemplu, filele pentru diferite pagini) ar trebui să meargă în partea de sus a paginii.
  • Dacă utilizați o pictogramă de meniu (☰), aceasta ar trebui să fie în colțul din stânga sus al paginii.
  • Dacă utilizați o bară de căutare, aceasta ar trebui să fie aproape de partea din dreapta sus a paginii.
  • Link-urile utile (de exemplu, linkurile către pagina „Despre” sau „Contactați-ne”) ar trebui să ajungă în partea de jos a fiecărei pagini.
Proiectați un site web Pasul 4
Proiectați un site web Pasul 4

Pasul 4. Fii consecvent

Indiferent de fontul textului, paleta de culori, tema imaginii și opțiunile de design pe care le alegeți, asigurați-vă că utilizați aceeași decizie pe tot site-ul dvs. web. Poate fi extrem de deranjant să vezi un font sau o schemă de culori folosită pentru pagina „Despre” atunci când a fost utilizată una complet diferită pentru pagina de pornire.

  • De exemplu, dacă utilizați exclusiv culori tonuri reci pentru pagina de pornire a site-ului dvs., nu implementați culori strălucitoare și puternice pe pagina următoare.
  • Rețineți că utilizarea de culori puternice sau ciocnitoare, mai ales atunci când culorile sunt afișate într-un mod dinamic (de exemplu, în mișcare), poate provoca epilepsie la un număr mic de utilizatori web. Dacă decideți să utilizați astfel de culori pe site-ul dvs., asigurați-vă că adăugați un avertisment de epilepsie înainte de orice pagini relevante.
Proiectați un site web Pasul 5
Proiectați un site web Pasul 5

Pasul 5. Adăugați opțiuni de navigare

Plasarea de linkuri directe către pagini importante de pe site-ul dvs. web în partea de sus a paginii de pornire va ajuta vizitatorii pentru prima dată către conținutul care contează. Majoritatea creatorilor de site-uri adaugă aceste linkuri în mod implicit.

Este important să vă asigurați că fiecare pagină de pe site-ul dvs. web este accesibilă făcând clic pe opțiunile de pe site-ul dvs. web, decât să fie accesibilă numai prin adresa paginii

Proiectați un site web Pasul 6
Proiectați un site web Pasul 6

Pasul 6. Folosiți culori care se completează reciproc

Ca orice alt tip de design, designul site-urilor web se bazează pe combinații de culori plăcute vizual; din acest motiv, alegerea culorilor temei care merg împreună este crucială.

Negrul, albul și griul sunt o combinație bună dacă nu știi de unde să începi

Proiectați un site web Pasul 7
Proiectați un site web Pasul 7

Pasul 7. Luați în considerare utilizarea unui design minimalist

Minimalismul încurajează culorile tonului rece, grafica simplă, paginile de text alb-negru și cât mai puțină înfrumusețare. Deoarece minimalismul necesită puține elemente fanteziste, este o modalitate ușoară de a face site-ul dvs. să pară profesional și atractiv, fără a necesita multă muncă.

  • Mulți creatori de site-uri web vor avea o temă „minimalistă” pe care o puteți selecta atunci când vă configurați site-ul web.
  • O alternativă la minimalism este „brutalismul”, care folosește linii mai dure, culori strălucitoare, text îndrăzneț și imagini minime. Brutalismul are mai puține urmări decât minimalismul, dar în funcție de conținutul site-ului dvs. web, acesta se poate potrivi mai bine nevoilor dvs. de design.
Proiectați un site web Pasul 8
Proiectați un site web Pasul 8

Pasul 8. Faceți alegeri unice

Liniile drepte și elementele web blocate în rețea sunt pariuri sigure, dar luarea unor decizii stilistice unice va conferi personalitate site-ului dvs. și va ajuta site-ul dvs. să iasă în evidență.

  • Nu vă fie frică să refuzați tendințele plasând elementele site-ului asimetric sau folosind elemente suprapuse pentru a crea un aspect stratificat.
  • În timp ce colțurile elegante și ascuțite și elementele pătrate (cunoscute și ca prezentare „bazată pe card”) sunt mai puțin favorabile decât elementele rotunjite și moi.

Partea 2 din 2: Cum să maximizați performanța site-ului web

Proiectați un site web Pasul 9
Proiectați un site web Pasul 9

Pasul 1. Profitați de opțiunile de optimizare mobilă

Browserele mobile reprezintă mai mult trafic web decât browserele desktop, ceea ce înseamnă că atenția acordată versiunii mobile a site-ului dvs. web trebuie să fie cel puțin egală cu dezvoltarea site-ului web desktop. Majoritatea serviciilor pentru creatorii de site-uri web creează automat o versiune mobilă a site-ului dvs., dar veți dori să țineți cont de următoarele informații pentru site-ul dvs. mobil:

  • Asigurați-vă că butoanele (de exemplu, linkurile către site) sunt mari și ușor de atins.
  • Evitați implementarea funcțiilor care nu pot fi vizualizate pe mobil (de exemplu, Flash, Java etc.).
  • Luați în considerare crearea unei aplicații mobile pentru site-ul dvs. web.
Proiectați un site web Pasul 10
Proiectați un site web Pasul 10

Pasul 2. Evitați să utilizați prea multe fotografii pe pagină

Atât browserele desktop, cât și cele mobile pot lupta pentru încărcarea paginilor care afișează un număr mare de fotografii sau videoclipuri. În timp ce imaginile sunt importante în proiectarea web, utilizarea mai multor câteva pe pagină poate provoca timpi de încărcare inutil, lungi, ceea ce va împiedica oamenii să viziteze pagina (paginile) în cauză.

În general vorbind, doriți ca paginile site-ului dvs. web să se încarce în mai puțin de patru secunde

Proiectați un site web Pasul 11
Proiectați un site web Pasul 11

Pasul 3. Adăugați o pagină „Contact”

Veți observa că practic toate site-urile web stabilite au o pagină „Contactați-ne” care conține informații de contact (de exemplu, un număr de telefon și o adresă de e-mail); unele site-uri au chiar o formă de întrebare încorporată pe această pagină. Adăugarea unei pagini „Contact” le va oferi spectatorilor de site-uri web o linie de comunicare directă către dvs., adăugând astfel o soluție la eventualele frustrări.

Proiectați un site web Pasul 12
Proiectați un site web Pasul 12

Pasul 4. Creați o pagină personalizată 404

Când cineva vizitează o anumită pagină de pe site-ul dvs., care fie nu a fost configurată, fie nu există, va apărea o pagină web „Eroare 404”. Majoritatea browserelor au o pagină implicită 404, dar este posibil să puteți personaliza dvs. din setările creatorului site-ului dvs. web; dacă da, asigurați-vă că includeți următoarele detalii:

  • Un mesaj ușor de eroare (de exemplu, „Felicitări - ați găsit pagina noastră de eroare!”)
  • Un link către pagina principală a site-ului
  • O listă de linkuri vizualizate frecvent
  • O imagine sau o siglă pentru site-ul dvs. web
Proiectați un site web Pasul 13
Proiectați un site web Pasul 13

Pasul 5. Folosiți o bară de căutare, dacă este posibil

Dacă metoda de creare a site-ului dvs. web acceptă adăugarea unei bare de căutare pe site-ul dvs. web, vă recomandăm să faceți acest lucru. Acest lucru vă va asigura că utilizatorii pot naviga rapid la o anumită pagină sau articol, fără a fi nevoie să faceți clic pe opțiunile de navigare.

Barele de căutare sunt utile, de asemenea, atunci când publicul dvs. dorește să caute un termen general fără a utiliza încercări și erori

Proiectați un site web Pasul 14
Proiectați un site web Pasul 14

Pasul 6. Investiți cât mai mult timp în pagina dvs. de pornire

Când cineva ajunge pe pagina principală a site-ului dvs. web, ar trebui să obțină esența temei site-ului dvs. web imediat; în plus, toate elementele paginii de pornire ar trebui să se încarce rapid, inclusiv opțiunile de navigare și orice imagine. Pagina dvs. de pornire ar trebui să aibă următoarele aspecte:

  • Un îndemn (de exemplu, un buton pentru a face clic sau un formular pentru a completa)
  • O bara de instrumente de navigare sau un meniu
  • O grafică primitoare (de exemplu, o fotografie solidă, un videoclip sau un grup mic de fotografii cu text însoțitor)
  • Cuvinte cheie referitoare la serviciul, subiectul sau accentul site-ului dvs. web
Proiectați un site web Pasul 15
Proiectați un site web Pasul 15

Pasul 7. Testați-vă site-ul web în mai multe browsere pe mai multe platforme

Acest lucru este extrem de important, deoarece diferite browsere pot gestiona diferit aspectele site-ului dvs. web. Înainte de a începe să vă promovați site-ul, încercați să îl vizitați și să îl utilizați în următoarele browsere de pe platformele Windows, Mac, iPhone și Android:

  • Google Chrome
  • Firefox
  • Safari (numai pentru iPhone și Mac)
  • Microsoft Edge și Internet Explorer (numai Windows)
  • Browserul încorporat pe mai multe telefoane Android diferite (de exemplu, Samsung Galaxy, Google Nexus etc.)
Proiectați un site web Pasul 16
Proiectați un site web Pasul 16

Pasul 8. Continuați să vă actualizați site-ul web pe măsură ce îmbătrânește

Tendințele de proiectare, linkurile, fotografiile, conceptele și cuvintele cheie se schimbă odată cu trecerea timpului, așa că va trebui să continuați să faceți modificări site-ului dvs. web pentru a fi la curent. Acest lucru vă va cere să verificați performanța site-ului dvs. web alături de alte site-uri web similare cel puțin o dată la trei luni (de preferință mai des).

Ajutor HTML de bază

Image
Image

Exemplu de pagină web cu HTML

Sprijină wikiHow și deblocați toate mostrele.

Image
Image

Foaie de cheat HTML

Sprijină wikiHow și deblocați toate mostrele.

Image
Image

Exemplu de pagină web simplă

Sprijină wikiHow și deblocați toate mostrele.

sfaturi

  • Accesibilitatea site-ului web este un alt aspect important al dezvoltării site-ului web. Aceasta include lucruri precum subtitrări pentru audiența cu deficiențe de auz, descrieri audio pentru vizitatorii nevăzători și avertismente de fotosensibilitate, dacă site-ul dvs. web utilizează efecte potențial inducătoare de convulsii.
  • Majoritatea creatorilor de site-uri web au un set de șabloane pe care le puteți utiliza pentru a cimenta aspectul și designul site-ului dvs. înainte de a adăuga elementele preferate.

Avertizări

  • Majoritatea creatorilor de site-uri sunt gratuite; cu toate acestea, dacă doriți să utilizați propriul domeniu (de exemplu, „www.numelevostru.ro” în loc de „www.numelevostru.wordpress.com”), va trebui să plătiți o taxă lunară sau anuală.
  • Evitați plagiatul și respectați toate legile drepturilor de autor: nu adăugați imagini aleatorii de pe web sau chiar elemente structurale, fără permisiune.

Recomandat: