Dacă doriți să dezvoltați și să creați un site, atunci totul va merge mult mai ușor dacă petreceți ceva timp la planificarea sa. Etapa de planificare permite dezvoltatorului și clientului să colaboreze până când găsesc formatul și aspectul care corespunde nevoilor lor. Procesul de planificare afectează alegerea stilului site-ului și, eventual, este cel mai important aspect al designului web, în special pentru afaceri.

Pași

Partea 1 din 4:

Crearea unei structuri de bază

unu. Determinați funcționalitatea site-ului. Dacă creați un site web pentru dvs., probabil știți deja răspunsul la acest articol. Dacă creați un site pentru o altă persoană, o companie sau o organizație, este necesar să aflați ce se așteaptă de la site și la funcționalitatea acestuia. Tot ce decideți aici va avea un impact asupra site-ului final.

Aveți nevoie de un magazin electronic? Aveți nevoie de comentarii de utilizator? În cazul utilizării utilizatorilor? Aveți nevoie de un site orientat spre site-ul? O orientată spre imagine? Toate acestea și multe alte întrebări vor ajuta la umplerea designului și structurii site-ului.
Poate fi un proces lung, în special pentru companiile mari, cu un număr mare de persoane implicate în proiect.

Imagine intitulată Planul unui site web 2

2. Creați o schemă de hartă a site-ului web. Harta Schema - ca o diagramă bloc, aceasta arată modul în care utilizatorii se deplasează de la o pagină la alta. Nici măcar nu aveți nevoie de pagini în acest moment, numai fluxul total al ideilor. Puteți utiliza un program de calculator pentru a crea o diagramă sau o conturează pe o foaie de hârtie. Utilizați schema hărții site-ului pentru a arăta modul în care vă imaginați o ierarhie a paginilor web și a comunicării (conexiuni).

Imagine intitulată Planul unui site Web Pasul 3

3. Încercați cărțile de sortare. Metoda populară pentru grup este utilizarea de stive de card pentru a afla abordarea perfectă a fiecăruia. Luați stiva de cărți pentru note și trimiteți prin e-mail conținutul principal al unei pagini pe fiecare dintre ele. Permiteți echipei dvs. să organizeze cărți, astfel încât acestea să fie considerate cele mai utile. Cel mai bine este pentru situații când cooperează cu alții pentru a crea un site web.

Imagine intitulată Planul unui site Web Pasul 4

4. Utilizați hârtie și buletine de bord sau bord. Aceasta este metoda inițială de planificare a bugetului scăzut, vă permite să ștergeți rapid sau să mutați conținutul și să îl redirecționați. Desenați designul pe hârtie și conectați-le într-o secvență sau trageți un circuit pe placă. Mare pentru brainstorming.

Imagine intitulată Planul unui site web Pasul 5

cinci. Faceți un conținut de inventar. Este mult mai ușor să-l refaceți decât noi site-uri. Introduceți fiecare parte a conținutului sau a paginilor existente în foaia de calcul. Înregistrați numirea fiecăruia dintre ele, apoi utilizați această listă pentru a determina ce se întâmplă și ce rămâne. Acest lucru va ajuta la reducerea celei mai bune părți și simplificați procesul de reproiectare.

Partea 2 din 4:

Crearea unui cadru HTML

unu. Creați un cadru (scheme de structură de pagină) pentru a ajuta la asigurarea ierarhiei. HTML-cadru este un site viitor de la BoneCloth care utilizează doar cele mai de bază etichete și blocuri pentru prezentarea conținutului. El răspunde la întrebarea: "Ce este pe ecran și unde?". Formatarea și stilul sunt complet ignorate în cadrul cadrului.

Cadrul vă permite să vedeți structura conținutului și să curgeți până la selectarea stilului.
Ramele HTML nu sunt statice ca fișiere PDF sau imagini, vă permit să mutați rapid blocurile de conținut pentru a crea o nouă structură.
Rama este interactivă, care este benefică atât pentru dezvoltator, cât și pentru client. Deoarece cadrul este scris într-o simplă HTML, atunci puteți să vă deplasați în continuare și să vă simțiți cum rulează între pagini. Aceasta este ceea ce nu poate fi exprimat prin conceptul de PDF.

Imagine intitulată Planul unui site Site 7

2. Încercați metoda casetei gri (câmp gri). Plasați conținutul paginii dvs. în câmpuri gri cu cel mai important conținut de la început. Blocurile sunt situate într-o singură coloană, cu cea mai importantă parte a conținutului de pe pagină din partea de sus. De exemplu, dacă pagina este o pagină despre companie (despre), detaliile despre companie ar putea merge la blocul superior urmat de lista de personal, apoi să contactați informații și așa mai departe.

Nu include partea superioară și subsol. Câmpurile gri sunt doar o reprezentare vizuală a conținutului care va fi găsit pe pagină.

Imagine intitulată Planul unui site Web Pasul 8

3. Încercați să utilizați programul WireFraming. Există mai multe programe care vă pot ajuta în procesul de creare a unui prototip interactiv de design (wireframing). Cantitatea de cunoaștere a codului sursă variază de la program la program. Iată câteva dintre cele mai populare programe:

Model de laborator.Acest site se specializează în "Designul atomic", În cazul în care fiecare parte a conținutului pare să "moleculă", care reprezintă o pagină mare.

Jumpcharts. Acesta este site-ul de planificare a serviciului de planificare a site-ului pentru un prototip interactiv de proiectare.Este nevoie de un abonament plătit, dar vă permite să construiți rapid diagrame bloc de pagini, fără a vă îngrijora prea mult de lucrul cu codul.

Wirefy. Wirefy un alt sistem"Proiectul atomic". Toate instrumentele sunt disponibile gratuit pentru dezvoltatori.

Imagine intitulată Planul unui site Web Pasul 9

4. Utilizați o marcare simplă HTML. Un cadru bun poate fi ușor convertit la locul real mai târziu. Nu vă faceți griji în general despre stilul în procesul de creare a unui design interactiv de prototip. În schimb, utilizați marcajul care poate fi ușor de înțeles și se schimbă cu un efort mic.

"Mai puțin" înseamnă "mai mult" cu un cadru. Scopul este de a construi pur și simplu o structură. Aspectul poate fi ajustat mai târziu cu CSS și marcaj extins.

Imagine intitulată Planul unui site Web Pasul 10

cinci. Faceți un cadru pentru fiecare pagină de pe site-ul dvs. Poate fi tentant să faceți un cadru simplu și să spuneți: "Cool, o pot aplica la fiecare pagină, mă convoacă". De fapt, acest lucru va duce la crearea unui site obișnuit și plictisitor. Petreceți timp pentru a crea un prototip interactiv de proiectare a fiecărei pagini și veți găsi în curând că fiecare pagină are propriul său organizațional "are nevoie".

Partea 3 din 4:

Crearea conținutului

unu. Pregătiți un anumit conținut înainte de a începe crearea unui site web. Va fi mult mai ușor să vedeți cum arată stilul site-ului, dacă aveți conținut real în loc de câmpuri goale. Nu aveți nevoie de prea multe informații, dar totul va arăta mult mai bine în aspecte dacă aveți un material pentru articole și imagini originale.

Nu aveți nevoie de partea în vrac a articolului, dar trebuie să aveți cel puțin titluri reale.

Imagine intitulată Planul unui site web 12

2. Amintiți-vă că conținutul bun este mai mult decât text. Internet - este mult mai mult decât site-uri simple de text. Pentru a ieși în nișă, veți avea nevoie de multe tipuri diferite de conținut pentru a atrage și deține vizitatori. Unele conținuturi posibile pentru memorare:

Fotografii.

Audio

Video

Fire sau flux (Twitter)

Facebook Integration

RSS (din engleză. Foarte simplu Syndication - Sistem de conținut standardizat)

Știri de conținut al canalului

Imagine intitulată Planul unui site web 13

3. Alegeți un fotograf profesionist. Dacă adăugați fotografii pe site-ul dvs., atunci cu fotografii profesionale, primele impresii ale acesteia vor fi mult mai bune. O fotografie bună este mai mult de 20 de răi.

Lucrarea de fotografi novici va fi mult mai ieftină decât lucrările profesioniștilor cu experiență.

Imagine intitulată Planul unui site web 14

4. Scrieți articole de calitate. Conținutul scris pe pagina dvs. va determina o cantitate imensă de trafic web. Deși nu trebuie să vă faceți griji prea mult despre crearea conținutului în acest stadiu al procesului de proiectare, nu veți răni și nu vă gândiți la aceasta, deoarece conținutul va trebui să creeze în mod regulat când "Viața de inspirație" în site.

După ce articolele vor fi scrise multe lucruri pe care le veți folosi cel mai probabil în procesul de creare a unui site web. Aceasta poate include informații de contact, nume ale companiilor sau altceva care vor fi utilizate în mai multe locuri de pe site.

Partea 4 din 4:

Întoarcerea ideilor pe site

unu. Să dezvolte elemente comune. Acestea sunt acele lucruri vizibile pe fiecare pheette, cum ar fi: Meniul de navigare superior și de navigație. Creați un stil foarte simplu, astfel încât să puteți vedea cum vor arăta toate paginile dvs. la fața locului. Va fi foarte util atunci când treceți la procesul de creare a unui aspect.

Nu vă faceți griji prea mult despre detalii, dar încercați să le faceți aproape la fel ca totul Ultimate ar trebui să arate.

Imagine intitulată Planul unui site Web Pasul 16

2. Creați un plan de bază (cazare). Începeți să mutați cadrul de ghidare dintr-o coloană în locurile lor general acceptate de pe pagină. De exemplu, ați putea muta blocul de navigare în partea stângă a paginii și lista de anteturi - dreapta.

Continuați să experimentați cu plasarea pentru mai multe pagini înainte de a vă deplasa. Permiteți altora să le verifice pentru a vedea cum sunt onorganizate.

Imagine intitulată Planul unui site web 17

3. Creați un aspect. Utilizați programul (cum ar fi Photoshop) pentru a crea un aspect al mai multor pagini pagini. Utilizați aspectul pe care l-ați ales ca ghid. Puteți lucra mult mai repede în program pentru a edita imagini și pentru a obține totul în acest formular, după cum aveți nevoie. Acest lucru vă va permite să utilizați aceste imagini ca referințe când va veni codul real.

Adăugați acest conținut la aspect pentru a vă asigura că totul arată bine împreună.

Imagine intitulată Planul unui site web 18

4. Înlocuiți conținutul blocurilor. Începeți să adăugați sistemul și elementele pe pagină. Nu vă faceți griji încă despre stil, puneți totul în locul potrivit. Acest lucru vă va ajuta să aflați dacă schimbările dvs. de stil vor funcționa.

Imagine intitulată Planul unui site Pasul 19

cinci. Creați un ghid de stil. Este foarte important să se mențină un stil de liant, în special pentru site-urile mari. Dacă site-ul este pentru o afacere care are deja branding vizual, acesta trebuie inclus în designul site-ului. Lucrurile de luat în considerare în manual vor posta:

Navigare

Antete (

,

, Etc.)

Paragrafe

Italici (italice)

Bolding (îndrăzneț)

Referințe (active, inactive, plutitoare)

Folosind o imagine

Icoane

Butoane

Listele

Imagine intitulată Planul unui site web 20

6. Aplicați stilul dvs. De îndată ce stilul și designul pentru site, a venit timp pentru a implementa. CSS este una dintre cele mai ușoare modalități de a vinde stilul pentru întreaga pagină sau întregul site. Citiți acest ghid pentru mai multe detalii despre utilizarea CSS.