Design web

Prin design web (din engleză de la web design) se înțelege în general realizarea de site-uri web, de la momentul conceperii structurii și interfeței grafice și până la finalizarea programării și introducerea propriu-zisă a datelor care alcătuiesc conținutul site-ului - imagini, text, fișiere și alte elemente.

Scurt istoric

Primul designer web a fost chiar inventatorul www-ului, Tim Berners Lee, care a publicat primul site din istorie, în anul 1991. La început, site-urile nu erau nici pe departe atât de complexe și încărcate grafic cum sunt în prezent, limbajul utilizat - HTML - nefiind prea puternic și permițând numai o serie limitată de formatări, precum și inserarea de linkuri, pentru a putea „lega” paginile între ele, designul web fiind, de fapt, mai mult „programare” web.

În prezent, preocuparea pentru aspectul grafic al siturilor, devenite puternice instrumente comerciale și publicitare, justifică în întregime denumirea de „design web”, iar tehnologiile utilizate s-au diversificat și au devenit din ce în ce mai complexe. Companiile care produc site-uri lucrează cu angajați specializați pentru fiecare etapă a dezvoltării unui site, de la stadiul de concepție grafică la programare și editare de conținut pentru SEO (Search Engine Optimization - optimizarea site-urilor pentru motoarele de căutare). Site-urile actuale sunt din ce în ce mai mult axate pe animație interactivă și dinamism, aceste deziderate fiind îndeplinite de exemplu de cunoscutul program Adobe Flash, precum și de alte programe apărute după acesta, care pot genera automat fișiere animate de diverse formate.

Caracteristici

Site-urile, în forma în care ele se afișează de browsere, sunt menite să fie înțelese de orice persoană, chiar fără cunoștinte în domeniul informaticii sau al secvențelor de cod redactate de programatori. Aceștia lucrează ori în diverse limbaje din care apoi se generează limbajul specific de script al internetului HTML (HyperText Markup Language), ori direct în HTML. Dacă nu ar exista browserele care știu să interpreteze limbajul de script și să afișeze rezultatul pe ecran, siturile ar fi doar înșiruiri de texte neformatate și, cel mai probabil, fără imagini. În principiu limbajul HTML indică locul în care să se afișeze diversele elemente vizibile, dimensiunea, culoarea, precum și alți parametri care conferă unei pagini web atât aspectul, cât și funcționalitatea dorită.

An	Evenimente ^[1]
1969	Crearea ARPANET în Octombrie - Primul prototip de internet realizat de departamentul apărării din U.S. Advanced Research Projects Agency Network
1970	Anii 70’ – Lansarea protocolului TCP/IP - Vinton Cerf si Robert Kahn au lansat protocolul utilizat și astăzi în internet TCP/IP (Transmission Control Protocol și Internet Protocol).
1971	A fost transmis primul e-mail de catre programatorul Ray Tomlinson
1983	ARPANET adopta TCP/IP - Acesta a fost si momentul când au inceput să apară “rețele de rețele” de calculatoare care de fapt a devenit Internetul modern pe care funcționăm și astăzi.
1990	Intre 1990 – 1992 apare WWW (World Wide Web) - Tim Berners-Lee (cunoscut ca și TimBL) inventează WWW (World Wide Web).
1992	A fost lansat primul website mulțumită CERN
1993	A apărut ALIWEB primul motor de căutare (Archie Like Indexing for the WEB)
1994	Primul baner web comercial creat pentru cei de la AT&T
1995	Se lanseaza JavaScript
1996	Au apărut animațiile Flash; a fost lansat CSS-ul (Cascading Style Sheets) - Acesta a prins viață în 1996 sub îndrumarea lui Håkon Wium Lie care a venit de fapt cu primele propuneri prin 1994
1998	Apare Google Beta
2000	A fost lansat PayPal
2001	Apare Wikipedia
2003	A fost lansat WordPress
2004	A fost creat Facebook
2006	Cuvantul “googling” a devenit un verb in Oxford English Dictionary
2007	Odata cu lansarea primul iPhone in Iunie 2007 apare si web design-ul pentru mobil
2010	A apărut Bootstrap; Conceptul Resposive Web Design a prins viață datorita genialitații lui Ethan Marcotte si este folosit si astăzi.

Ce este necesar pentru realizarea unui site web

Orice site web trece în mod necesar prin mai multe etape:

Analiza preliminară
Concretizarea ideilor
Schițarea elementelor vizuale și compunerea structurii site-ului
Scrierea codului ce descrie structura și designul fiecărei pagini web în HTML, CSS, Javascript etc.
Testarea site-ului
Schimbarea părților care nu corespund țintei
Publicarea site-ului pe Internet folosind sau pe un intranet
Adăugarea site-ului în motoarele de cautare Google, Bing sau altele
Modificarea ulterioară și relansarea pe Internet, după nevoile clienților sau ale timpului

Actualizările ulterioare ale site-ului pot fi făcute în două moduri:

prin intervenția web designer-ului
prin accesarea proprietarului site-ului a interfeței de administrare pusă la dispoziție de web designer.
Cea mai recomandată metodă este cea de-a doua, aceea în care site-ul dispune de CMS (content system management)în care proprietarul site-ului nu mai depinde de web designer.

După stabilirea structurii site-ului se intră în etapa conceperii unei interfețe grafice care, pe lângă scopurile sale estetice, trebuie să faciliteze și accesul vizitatorilor la toate secțiunile publice ale site-ului, să fie comprehensivă și, nu în ultimul rând, să asigure și încărcarea rapidă a paginilor, prin modul în care sunt realizate diversele elemente grafice. Este recomandat sa fie citite cele mai reprezentative rapoarte de uzabilitate.

Din punctul de vedere al designului siturile sunt în mare parte alcătuite din tabele cu linii (invizibile pe ecran) în care se inserează imagini (siglă, imagini-simbol, butoane etc.) și texte, în așa fel încât aspectul să fie unitar și să nu se sesizeze vizual organizarea tabelară. Celulele tabelelor

pot avea fundaluri colorate,
pot fi alcătuite din imagini și desene care se repetă pe orizontală sau pe verticală,
pot fi umplute cu texturi mai mult sau mai puțin neregulate (ca pietrișul, frunzișul etc.)
sau pot rămâne și albe.

Este de notat că actualmente locul tabelelor a fost luat de popularul mod de formatare CSS, care reprezintă o soluție mai "curată" din punctul de vedere al programării decât utilizarea tabelelor.

Astfel, graficianul utilizează inițial un program de grafică (de exemplu Adobe Photoshop sau Corel PhotoPaint) pentru a concepe un "instantaneu" al site-ului respectiv. El creează forma butoanelor grafice, dimensionează și poziționează sigla site-ului, stabilește locul meniurilor pe ecran, dimensiunea și aspectul textului, schema de culori a site-ului, precum și alte aspecte specifice. Datorită faptului că această imagine primară este apoi "tăiată" în imagini mai mici, care urmează să fie inserate în tabele sau definite în CSS, din punct de vedere grafic siturile se supun acelorași reguli de compoziție ca și lucrările grafice tipărite, îmbinate însă cu o serie de parametri tehnici care permit implementarea ulterioară a elementelor de programare. Astfel, un "grafician de web" va lucra altfel decât un "grafician de print", încercând să anticipeze locurile unde pot apărea probleme și să găsească soluții pentru a evita orice deformare a site-ului, indiferent dacă urmează să fie utilizate dimensiuni relative sau absolute. De exemplu, un grafician de web trebuie să știe că este preferabil să utilizeze fundaluri de tip "culoare indicată din cod" sau de tip "imagine repetată pe axa x sau y", decât fundaluri dintr-o singură imagine foarte mare, care ar reduce mult viteza de încărcare a site-ului.

După ce imaginea inițială a fost împărțită în mai multe imagini mici, acestea se introduc în tabele sau se poziționează cu ajutorul CSS, fie prin scrierea directă a codului HTML într-un program simplu de editare text, cum ar fi Notepad, fie prin utilizarea unui editor HTML, în general de tip WYSIWYG, cum ar fi Dreamweaver. Astfel se generează un prim "schelet" al site-ului, denumit "mock-up", care simulează situl și toate funcțiile lui, fără a avea însă conținutul real, ci numai texte de tip lipsum și imagini provizorii. În cazul în care este vorba de un sit simplu, cu puține pagini, tot ce mai rămâne de făcut este introducerea conținutului final. În cazul în care este vorba de un sit complex, de exemplu un catalog sau un magazin virtual, mock-up-ul intră în etapa de programare complexă, care poate utiliza limbaje mai complicate (de tip server-side ca de exemplu PHP, ASP, sau și de tip client-side) precum și baze de date.

În concluzie realizarea unui site web implica 3 aspecte majore:

achiziționarea unui nume de site (domeniu web)
găzduirea siteului pe un server (hosting)
web designul web (crearea site-ului propriu-zis)

Designul paginii de pornire

Experții în utilizare, inclusiv Jakob Nielsen și Kyle Soucy, au subliniat adesea designul paginii de pornire pentru succesul site-ului web și au afirmat că pagina de pornire este cea mai importantă pagină de pe un site web.^[2] Cu toate acestea, practicanții din anii 2000 începeau să descopere că un număr tot mai mare de trafic pe site-ul web ocoli pagina de pornire, acces direct la paginile de conținut interne prin motoarele de căutare, buletine informative electronice și fluxuri RSS.^[3] Determinând mulți practicieni să susțină că paginile de start sunt mai puțin importante decât cred majoritatea oamenilor.^[4]^[5]^[6] Jared Spool a susținut în 2007 că pagina de pornire a unui site era de fapt cea mai puțin importantă pagină de pe un site web.^[7]

Design web responsiv

Datorită faptului ca oamenii folosesc din ce în ce mai mult telefoanele mobile pentru a naviga pe internet, design-ul web trebuie să fie responsiv. Asta înseamnă că designul se adaptează la dimensiunea ecranului vizitatorului în funcție de rezolutia dispozitivului pe care este afișat site-ul. Designul web responsiv, face ca toate imaginile, textele si pictogramele să se ajusteze automat pentru a avea dimensiunea perfectă pentru ca fiecare element să fie lizibil si utilizabil.^{[necesită citare]}

Șabloane

O altă metoda de a alcătui un sit este cu ajutorul unui șablon web. Acesta prezintă vizitatorului conținutul text și media într-o manieră cât mai plăcută prin folosirea unuia sau mai multor limbaje de marcare precum HTML sau CSS.

Folosirea unui șablon web devine convenabilă prin accesibilitate.

Note

^ Istoria web design-ului, accesat în 31 Ianuarie 2022
^ Soucy, Kyle, Is Your Homepage Doing What It Should?, Usable Interface, arhivat din original la 8 iunie 2012
^ Spool, Jared (29 septembrie 2005), Is Home Page Design Relevant Anymore?, User Interface Engineering, arhivat din original la 16 septembrie 2013
^ Chapman, Cameron (15 septembrie 2010), 10 Usability Tips Based on Research Studies, Six Revisions, arhivat din original la 2 septembrie 2013
^ Myth #17: The homepage is your most important page, 2 iunie 2013
^ McGovern, Gerry (18 aprilie 2010), The decline of the homepage, arhivat din original la 24 mai 2013
^ Spool, Jared (6 august 2007), Usability Tools Podcast: Home Page Design, arhivat din original la 29 aprilie 2013

Legături externe

[1] Istoria web design-ului, accesat în 31 Ianuarie 2022

[2] Soucy, Kyle, Is Your Homepage Doing What It Should?, Usable Interface, arhivat din original la 8 iunie 2012

[3] Spool, Jared (29 septembrie 2005), Is Home Page Design Relevant Anymore?, User Interface Engineering, arhivat din original la 16 septembrie 2013

[4] Chapman, Cameron (15 septembrie 2010), 10 Usability Tips Based on Research Studies, Six Revisions, arhivat din original la 2 septembrie 2013

[5] Myth #17: The homepage is your most important page, 2 iunie 2013

[6] McGovern, Gerry (18 aprilie 2010), The decline of the homepage, arhivat din original la 24 mai 2013

[7] Spool, Jared (6 august 2007), Usability Tools Podcast: Home Page Design, arhivat din original la 29 aprilie 2013

[1]

[2]

[3]

[4]

[5]

[6]

[7]