Sfaturi pentru web design

Pentru realizarea unui design Web bun, vom oferi o serie de sugestii:

• Autorii de pagini Web trebuie sa aiba in vedere furnizarea unui mecanism de navigare facila, structurata, prin utilizarea unor legaturi de explorare si/sau bidirectionale si oferirea de meniuri, arbori de parcurgere a legaturilor sau optiuni de deplasare secventiala;
• Evitarea scrierii unor documente de dimensiuni mari, in care utilizatorul, pentru a parcurge intregul continut, trebuie sa foloseasca intensiv barele de derulare (scroll). Este indicat ca aceste pagini sa fie divizate in documente mai mici, fiecare continand in jur de 500 de cuvinte/pagina. Aceasta impartire are si avantajul actualizarii mai eficiente a continutului si a parcurgerii totale a documentului de catre cei interesati;
• Internationalizarea reprezinta un alt factor important. Autorii pot realiza documente separate pentru fiecare limba dorita (de exemplu, in cazul nostru, romana si engleza) si pot incerca sa detecteze, dupa adresa clientului Web, care ar putea fi localizarea sa (in interiorul sau in afara tarii). De asemenea, trebuie acordata deosebita atentie corectitudinii gramaticale a textului. Se recomanda ca fiecare document sa fie parcurs, inainte de a fi disponibil pe Web, de un filolog;
• Trebuie evitata utilizarea a mai mult de trei tipuri de corpuri de litera. Fonturile specifice unor platforme particulare nu vor fi corect sau nu vor putea fi afisate pe alte calculatoare;
• Este mult mai usor de parcurs un document al carui continut a fost structurat pe capitol, subcapitole, sectiuni si paragrafe, corect aliniate si indentate, eventual folosind linii orizontale. Folosirea listelor neordonate sau/si ordonate creste gradul de lizibilitate a unei pagini Web. Liniile lungi de text nu sunt recomandabile, optim fiind un numar de 65-70 de caractere pe o singura linie (nu mai mult de 15-20 de cuvinte pe linie). De asemenea, alinierea la dreapta sau centrata, scrierea cu majuscule ori modificari frecvente de culoare ale unui text de dimensiuni mari implica dificultati de parcurgere;
• Utilizarea unor imagini de fundal “incarcate”, (texturi complicate, fotografii), animate sau contrastand violent cu culoarea textului conduce la evitarea parcurgerii continutului acelei pagini. Nu se recomanda animatiile (texte derulante, fisiere GIF animate sau applet-uri Java), imaginile de dimensiuni mari, contrastele, fundalurile sonore deranjante.

Pentru paginile continand un volum mare de informatie textuala, cea mai buna solutie este fundalul alb pentru text negru. Unele cercetari au relevat faptul ca exista o ordine descrescatoare de intensitate a contrastelor cromatice pentru text din punct de vedere al lizibilitatii de la distanta si al preferintei in procesul de invatare:

• Negru pe fond galben;
• Verde pe fond alb;
• Rosu pe fond alb;
• Albastru pe fond alb;
• Alb pe fond albastru;
• Negru pe fond alb;
• Galben p fond negru;
• Alb pe fond rosu;
• Alb pe fond verde;
• Alb pe fond negru;
• Rosu pe fond negru;
• Verde pe fond rosu.

In elaborarea materialelor de prezentare pe Web, este indicat ca pentru vizualizarea informatiilor esentiale sa se utilizeze contraste mai puternice, iar pentru informatiile de continut, contraste cromatice mai reduse.

In ceea ce priveste ilustratiile (grafice, histograme, scheme, harti), acestea se vor putea pune in evidenta prin urmatoarele combinatii cromatice:

• Albastru pe fond alb;
• Negru pe fond galbem;
• Verde pe fond alb;
• Negru pe fond alb;

Informatiile vor trebui reactualizate in mod regulat, verificandu-se integritatea tuturor legaturilor (se evita astfel existenta asa-numitelor “legaturi moarte”). Procesul de reactualizarea continutului trebuie realizat, in medie, trimestrial.

Pentru incarcarea mai rapida a documentelor HTML, fiecare element care implica pozitionarea va avea atasate atributele care sa indice navigatorului Web locul in cadrul ferestrei (pentru imagini si applet-uri se vor specifica inaltimea si latimea, pentru tabele se va furniza latimea celulelor, se vor utiliza proprietati CSS de pozitionare absoluta sau relative etc.). Tabelele de dimensiuni considerabile nu sunt recomandabile, la fisierele (multimedia sau arhive) avand lungimi mari, numarul mare de applet-uri, controale ActiveX, cadre sau rutine JavaScript.

De preferat ar fi ca intregul site sa fie testat pe mai multe navigatoare, versiuni si platforme. Codul HTML trebuie scris asa fel incat sa nu foloseasca extensii particulare, nestandardizate sau elemente considerate demodate, dar nici cele de ultima ora. Trebuie considerata si situatia in care documentele pot fi parcurse si de navigatoare text, nu grafice (e.g. : pentru fiecare imagine se va furniza, ca alternativa, o explicatie textuala, folosind atributul alt). Fiecare ancora poate avea asociata, cu ajutorul atributului accesskey, o tasta (scurtatura) care o activeaza.

De asemenea, tabelele pot avea asociate explicatii, date prin intermediul atributului summary, iar elementelor HTML putem sa le atasam titluri explicative folosind atributul title.

Pentru reutilizarea stilurilor sau scripturilor si a modificarii facile a acestora, este bine ca ele sa fie specificate ca fisiere externe, separandu-le de continutul efectiv al documentului. Pentru a asigura independent de navigator, rutinele JavaScript trebuie sa fie atent concepute si testate.

In cadrul paginilor este indicat a se folosi linii de comentarii pentru explicarea modului de marcare si furnizarea altor detalii utile. De asemenea, fiecare document HTML trebuie sa aiba precizat un titlu adecvat (prin intermediul elementului „title”). Folosind marcatorul „meta” pot fi specificate diverse informatii referitoare la autorul, cuvintele-cheie, respectiv generatorul automat al documentului etc.

Se va evita pe cat posibil folosirea cadrelor; conform afirmatiilor lui Jacob Nielsen, o pagina divizata in cadre devine confuza, tiparirea continutului fiind dificila;

Trebuie avuta in vedere si credibilitatea site-ului Web, printre criteriile de evaluare a acesteia numarandu-se:

• Scopul – site-ul trebuie sa exprime limpede scopul pentru care a fost construit, aspectele tratate, existenta temelor conexe, nivelul de atentie solicitata audientei, actualitatea informatiilor etc;
• Continutul – site-ul trebuie sa ofere raspunsuri pertinente la diferite intrebari provenite din partea vizitatorilor: “Care este rata de reactualizare a continutului?”, “Cat de bine este formulat acest continut?”, “Care este nivelul de cunostinte pe care trebuie sa-l aiba cititorul pentru a intelege informatiile puse la dispozitie?”, “Informatiile includ referinte, iar daca da cat de exacte sunt?”;
• Forma si accesibilitatea – site-ul trebuie sa formeze o anumita relatie cu vizitatorul, sa aiba un continut grafic/multimedia concludent si, in concordanta cu scopul, sa organizeze eficient informatiile, oferind posibilitati de cautare, sa ofere versiuni alternative pentru persoanele cu diferite handicapuri sau provenind din alte tari;
• Costul – site-ul trebuie sa indice daca anumite documente sunt accesibile doar cu plata, daca accesul la ele se realizeaza prin abonament sau pe baza unei taxe de vizitare; de asemenea, trebuie stipulate restrictiile legate de copyright, asigurarea confidentialitatii si protectia tranzactiilor.

Conform unui studio intreprins in anul 2001 la Universitatea Stanford, au fost puse in evidenta o serie de atribute care maresc credibilitatea, dintre care se pot enumera usurinta in parcurgere, profesionalismul autorului, increderea pe care o induce site-ul, grija fata de vizitator. Exista si atribute care pot diminua credibilitatea unui site Web, cele mai importante fiind implicarea comerciala si amatorismul.

Nu suntem adeptii mesajelor “Aceasta pagina poate fi vizualizata doar cu navigatorul X, avand suport pentru Y”, “Sunteti vizitatorul cu numarul N” sau “Votati acest site in top T”. Site-urile Web ar trebui sa fie vizualizate in bune conditii indiferent de navigator.

Timpul de incarcare este important sau chiar vital pentru anumite site-uri, de aceea va trebui sa optimizam incarcarea paginilor, mai ales ale elementelor grafice sau multimedia. Serviciul Dr. HTML, printre altele, calculeaza in cate secunde va fi incarcata o pagina Web, pentru mai multe latimi de banda.

Verificarea integritatii si corectitudinii codului-sursa

Dupa proiectarea si crearea efectiva a site-ului, un prim pas este acela de a verifica integritatea legaturilor si corectitudinea codului-sursa al documentelor HTML si CSS. Pentru aceasta putem apela la diverse utilitare. Astfel, pentru o privire de ansamblu asupra site-ului dezvoltat si, in plus, pentru verificarea fiecarei legaturi se pot folosi Adobe GoLive, Macromedia Dreamweaver, NetObjects Fusion sau AceHTML – disponibile sub Windows – sau SCREEM – ruland sub Linux. De asemenea, se pot folosi diferite sisteme de management al continutului site-ului, precum WebGUI si WebMake.

Corectitudinea codului HTML se poate realiza apeland la HTML Tidy sau la serviciul online. De asemenea, putem realiza diferite optimizari ale codului HTML, eliminand spatiile inutile, comentariile, diverse constructii proprietare etc. Unele programe – precum Absolute HTML Compressor – merg si mai departe, stergand ghilimelele care delimiteaza valorile atributelor sau tag-urile de sfarsit ale unor elemente. Nu recomandam utilizarea lor, mai ales daca avem in vedere trecerea de la HTML la standardul XHTML.

In vederea vizualizarii site-ului in bune conditii, indiferent de platforma, recomandam evitarea oricaror extensii particulare si a formatelor grafice proprietare (ca, de exemplu, BMP). Un alt aspect de care trebuie sa tinem cont este modul de scriere a numelor de fisiere. Astfel, sistemul de operare Windows nu face deosebirea intre minuscule si majuscule si paginile se vor vizualiza fara probleme, insa o data transferate pe un server Unix (Linux) trebuie sa verificam daca numele resurselor au fost specificate corect, platformele Unix facand deosebirea intre literele mici si cele mai (case-sensitive).