Curs Web Design Theory

Designul web a devenit un domeniu foarte dezvoltat în primul rând datorită internetului care a redefinit graniţele lumii moderne, astfel încât astăzi fiecare companie mică sau mare, chiar şi o afacere de familie are o prezentare web oficială. Noţiunea de design web presupune un set de diferite competenţe, standarde şi discipline folosite în realizarea paginilor web. 

Pur şi simplu, noţiunea de design web se foloseşte cel mai des pentru definirea procesului de design care se referă la partea vizibilă a paginii, aşa-numitul front end, dar şi la proiectarea site-ului care presupune şi scrierea codului. De asemenea, este important de evidenţiat că această parte de design web face parte din codare, mai exact din domeniul care acoperă dezvoltarea web. 

Rolul designului web este de a satisface condiţiile necesare ale aspectului şi funcţionalităţile unui site web. Cu alte cuvinte, pentru a deveni un designer web bun trebuie să vă descurcaţi foarte bine cu scrierea codurilor, dar şi să cunoaşteţi dezvoltarea web. Aceasta înseamnă că aveţi obligaţia de a fi constant la curent cu actualizările şi noile tehnologii care fac din lumea designului web unul dintre cele mai dezvoltate domenii în IT. 

Pe parcursul cursului veţi asimila diferite abilităţi utile şi vă veţi familiariza cu standardele mediului de utilizator, ale arhitecturii informaţiei, ale structurii paginii, ale navigării, ale culorilor, ale fonturilor, ale imaginilor şi ale aspectului complet al paginii web. 

După dezvoltarea noilor cunoştinţe, veţi combina toate elementele menţionate şi, respectând bazele unui design bun, veţi fi pregătiţi să creaţi independent pagina web care îndeplineşte cele mai ridicate criterii. 

Descrierea și scopul cursului Web Design Theory

Cursul se ocupă cu istoria dezvoltării internetului, cu posibile direcții de dezvoltare în viitor. Se explică funcționarea web-ului, software-ul, hardware-ul și tehnologiile necesare pentru navigare. Apoi, cursanții se familiarizează cu istoria designului web, explicăm ce înseamnă și ce face un designer web. Descriem tipurile de pagini web, diferite abordări ale designului, precum și tehnologiile web folosite. 

Apoi, explicăm procedeul de planificare a lucrului pe un site web, toate etapele preferate pentru ca un site să fie de calitate, modul în care abordăm crearea conținutului, colectarea materialelor, selectarea fotografiilor, crearea graficii. Urmează prezentarea procedeului de creare a site-ului, apoi explicarea HTML și CSS, cu afișarea și explicarea exemplelor simple de utilizare, apoi explicăm principalele elemente care formează un site web. 

Scopul cursului este familiarizarea cursanților cu istoria și posibile viitoare direcții de dezvoltare a internetului, precum și modul de funcționare a internetului, ce se întâmplă când navigăm, cum funcționează un browser web și de unde vin conținuturile pe care le afișează, cum ajung aceste conținuturi la noi. Într-o zi, va trebui să alegem un domeniu și locul în care ne vom pune site-ul web pe internet, vom explica ce domenii există, cum se alege un domeniu bun și un furnizor de găzduire a paginilor web pe internet – companie de hosting. 

Mai târziu, se prezintă ideea de design web, explicăm ce face un designer web, dar și mai important, ce direcții web putem întâlni la crearea paginilor web și când trebuie să colaborăm cu alți profesioniști. Vom explica ce tipuri de pagini web există și cum le facem, ce tehnologii web folosim și în ce mod, cum creăm un site web, cum colectăm materiale și tot ce se face înainte de elaborare. Apoi, scopul este familiarizarea cursanților și cu procedeul de creare a unui site web, cu elementele pe care, de obicei, le au site-urile web. În cele din urmă, cursanții se vor familiariza mai bine cu elementele comunicării cu clientul, obținând o prezentare a acestor relații.

Curs Web Design Theory

Profesoara noastră, Alexandra Bardan, vă prezintă pe scurt importanța cursului de Web Design Theory.

Cursul Web Design Theory vă va răspunde la următoarele întrebări:

1. Internetul este la fel cu WWW?

Internetul și WWW sunt adesea confundate, ceea ce nu este corect. Internetul este o mare rețea globală de calculatoare alcătuită din rețele de calculatoare mai mici, iar World Wide Web este unul dintre cele mai mari servicii de internet prin care accesăm site-urile web și documentele aflate pe internet. World Wide Web (prescurtat WWW), sau doar Web, este sistemul documentelor legate reciproc care se accesează cu ajutorul lui HTTP (Hypertext Transfer Protocol), protocol creat în acest scop. Aceste documente sunt pagini web. Noțiunea de internet înseamnă rețea în rețea sau o conexiune de internet între mai multe calculatoare. În mod structural, există rețele mici care sunt conectate între ele formând astfel această structură. Internetul este numit tot mai mult rețea globală de informații. 

2. Când creez un site, cum să „prindă viață pe internet”?

Pentru ca un anumit site format din HTML și alte limbaje să poată să „prindă viață pe internet”, trebuie să fie setat pe un anumit server web configurat corect. Se obișnuiește să se folosească așa-numiții provideri de hosting, care oferă opțiuni de împrumutare a părților din server și îngrijirea acestuia. Pentru majoritatea site-urilor (mai mici), este lipsit de practică, prea scump și inutil să creezi și să configurezi un server web complet. Odată ce obținem acces la server (în oricare dintre modalitățile disponibile), cu conexiunea FTP, putem transmite, copia site-ul pe acel server web și să-l publicăm. 

3. HTML este programare?

De fapt, nu este. HTML nu este un limbaj de programare și nu putem spune că este vorba despre programare. Aceasta este una dintre confuziile frecvente care se întâlnește când vorbim despre limbajul HTML. HTML este un limbaj (în engleză, markup) descriptiv, folosit pentru structurarea datelor și a diferitelor elemente ale site-urilor noastre. Cu alte cuvinte, putem spune că limbajul HTML, împreună cu tagurile sale, formează principala structură a fiecărui site modern. 

Nu se poate considera programare, deoarece îi lipsesc unele elemente și reguli de bază care sunt obligatorii în limbajele de programare, precum PHP, JavaScript, C# etc. Desigur, asta nu înseamnă că HTML este rău, nici neterminat, sau orice altceva similar. HTML are un scop și trebuie considerat ca atare. 

4. De ce trebuie să învăț HTML și CSS?

Pentru designeri și programatori web, această întrebare este de prisos, dar deși poate nu vă veți ocupa de designul web, de programarea web sau de domenii similare, cunoașterea CSS, în special a limbajului HTML, este foarte utilă în lumea modernă, unde avem în jurul nostru dispozitive IT și unde internetul face parte din viața noastră. 

În prezent, s-a ajuns la modificarea paradigmei de educație și de definiție a alfabetizării. În secolul trecut, alfabetizarea a însemnat ceva cu totul diferit, iar în prezent se reflectă deseori în cunoașterea elementară a domeniului tehnologiei informației și în folosirea adecvată, rațională a internetului, a webului și a altor aspecte ale acestei tehnologii a informației. 

Este posibil ca HTML și CSS să nu fie cunoștințe de bază, precum lucrul în programul textual, instrumentul MS Word, sau precum lucrul în browserul web cu care accesăm site-urile web sau citim e-mailurile, dar sunt cunoștințe foarte utile pentru înțelegerea așa-numitelor „imagini mai largi”. Structura HTML apare în multe locuri și are multe utilizări, nu doar pe site-urile web, în mediul său primar. De aceea, este util ca, indiferent de ocupație, să aveți și cunoștințe de bază din limbajele HTML și CSS.

5. Ce este moodboard și care sunt elementele sale?

Moodboard nu se aplică exclusiv pe designul web, ci și pe designul grafic, designul de interior, designul de modă, designul textil etc. Moodboard se referă la un colaj format din diferite elemente și funcția sa este de a transmite viziunea designerului sau a clientului prin fotografie, culoare, fonturi, elemente tipografice, texturi și alte elemente. La crearea unui moodboard, designerul trebuie să țină cont ca să introducă în el elemente cooperative ale brandului pentru care se face, și anume culoarea, logotipul sau alte elemente recunoscute ale companiei. Vom menționa mai jos lista de elemente care trebuie să se găsească pe un moodboard, poate varia în funcție de proiect și de dorințele clienților, iar printre altele, acestea sunt următoarele:

• fonturi,
• logotipul companiei,
• culori, paleta de culori, eșantioane de culori,
• exemplu de text cu numere și semne de interpuncție,
• texturi,
• ilustrații,
• fotografii,
• screenshots pentru diferite site-uri,
• clipuri video,
• texturile diferitelor tipuri de hârtii,
• textura țesăturii,
• tăieturi din ziare, 
• ilustrații, desene, imagini etc.

6. Ce este responsive design?

Responsive design este designul cu diferite elemente, respectiv cu elementele care se adaptează în funcție de dispozitivul de la care vă uitați. Designul unui site care este adaptat dispozitivului desktop poate avea un aspect total diferit pe dispozitivul mobil, cu care stricați semnificativ experiența de utilizator și respingeți utilizatorii de la site-ul vostru. Având în vedere că de la an la an numărul de utilizatori de dispozitive mobile crește semnificativ față de utilizatorii de dispozitive desktop, trebuie să adaptați designul site-ului la toate dispozitivele, pentru ca experiența de utilizator să fie aceeași, indiferent de dispozitivul folosit de utilizator. 

Pentru ca designul să fie responsive, trebuie să faceți un layout flexibil al paginii, să aveți imagini și media flexibile (flexible images and media), iar pe lângă asta, aveți nevoie și de Media queries, model pentru specificația CSS3. De asemenea, regula nescrisă este că un design este mai ușor de început de la cel mai mic dispozitiv și continuat către cel mai mare. 

7. Cum poate determina navigarea tonul întregului site și experiența utilizatorului pe acesta?

Un număr semnificativ de cercetări a arătat că aproape 50% din vânzare se pierde din cauza imposibilității utilizatorului de a găsi informații dorite pe site, acesta fiind rezultatul navigării slabe și proaste a site-ului organizat. Navigarea pe site reprezintă, de fapt, unele tipuri de hărți și îi explică utilizatorului ce poate găsi pe el la prima vedere. Cu cât această hartă este mai simplu și mai clar prezentată, cu atât este șansa mai mare ca utilizatorul să aibă conversația dorită.  

Dacă navigarea pentru el nu are sens, utilizatorul va ști cu exactitate cum să ajungă prin câteva clicuri la informația dorită. Pe site-uri deosebim două tipuri principale de navigare, și anume navbar (navigare orizontală) și sider (navigare verticală), de obicei, de partea stângă. 

Planul şi programa cursului:

1. Crearea și funcționarea web-ului 

• Internetul și web-ul de-a lungul timpului
• Cum funcționează web-ul?
• Cum ne putem descurca în această lume?

2. Designul web 

• Designul web
• Tipuri de pagini web

3. Cum se face pregătirea pentru crearea paginii web 

• Gândirea la site-ul web
• Să ținem cont de aceste reguli înainte de a începe
• Organizarea resurselor pentru web

4. Crearea unei pagini web

• Etapele elaborării unui site web
• HTML și CSS
• Cele mai frecvente elemente ale unei pagini web 

5. Relație față de client

• Relație față de client