Topul greselilor de web design

Detalii

CategoriiIT
TaguriWebmasteri
Ultima actualizareMarti 5 august 2014
Vizualizari16255

Voteaza & Distribuie

Descriere

Pare simplu sa faci web design. Daca folosesti un editor ca Dreamweaver, si ai ceva experienta si talent in design grafic, practic nu ai nevoie de multe cunostinte de codare pentru a construi o pagina care sa arate prezentabil si chiar sa fie functionala pe web. Asa sa fie? Din experienta stim insa ca de obicei lucrurile simple sunt si cel mai dificil de realizat: provocarea unui grafician este crearea unui logo perfect; un copywriter iti va spune intotdeauna ca cel mai complicat este sa construiasca un slogan de cateva cuvinte. Si in web design, exista amanunte nesemnificative aparent, chiar invizibile pentru un ochi neantrenat, dar care fac diferenta intre o constructie profesionala si una de amator. Esential este ca aceasta diferenta nu mai este invizibila atunci cand evaluam performanta web site-ului. Deficientele de design au printre altele consecinte negative in: 1. in functionalitatea sitului 2. in viteza de incarcare 3. in executarea linkurilor (linkuri rupte - consecinte negative si in indexarea Google) 4. in vizibilitatea sitului 5. in numarul de vizitatori/trafic 6. in indexarea de catre motoarele de cautare 7. in afisarea estetica (cel putin) in cele mai folosite browsere 8. in securitatea/confidentialitatea anumitor date din continut 9. in lizibilitatea continutului (de catre cititorul uman si robotii motoarelor de cautare) 10. in timpul petrecut pe site de catre vizitatori Daca va ganditi sa dezvoltati un website care sa va aduca beneficii si profit, deficientele prezentate mai jos pot face diferenta dintre eficienta si inutilitate. Vremea web designerilor "de bloc" a apus. Colaborati cu un studiouri de web design profesioniste. Pagina de web nu este doar ce se vede pe monitor.

Unde gresesc cei mai multi in web design? Lipsa unui continut META si a optimizarii pentru motoarele de cautare


Continutul META, parte din strategia de optimizare web, contribuie la promovarea in motoarele de cautare, deci implicit la vizibilitatea website-ului si numarul de vizitatori. Codul meta se insereaza in sectiunea a paginii web si NU este generat automat de editoarele html. In lipsa acestuia, agentii de indexare (roboti, crawleri sau spideri) indexeaza aleatoriu portiuni din textul afisat pe pagina in sectiunea , iar aceasta indexare nu este garantata. Odata cu avansarea algoritmilor motoarelor de cautare ca Google, criteriile de indexare si acordare a rankingului (pozitie in clasament la cautare) devin tot mai complexe si continutul meta singur nu este suficient. S-a dezvoltat o metoda aparte care se numeste SEO (Search Engine Optimisation) si dispune de tehnici diverse, aplicabile pe codul paginii (SEO copywriting, keyword density, linkuri intuitive) sau in exterior (backlinking pentru link popularity) etc. Unele dintre aceste metode sunt clasificate drept agresive de catre agentii de indexare avansati, de tipul Googlebot, de aceea se recomanda dozarea optimizarii in asa fel incat sa nu produca excluderea din index sau penalizarea (produse de supraoptimizare). Oricum, web siturile din Romania se remarca deocamdata prin lipsa optimizarii, si nicidecum prin supradozarea acesteia.

Prea multe imagini


Unii web designeri fac exces de zel in impodobirea paginilor cu grafica si animatii, din convingerea ca astfel vor fi mai atragatoare. Este o eroare frecventa mai ales pentru cei care intra in contact cu web designul prin graphic design. Imagini multe, mari, neoptimizate inseamna viteza de incarcare a paginii drastic scazuta. Mai mult, nici un motor de cautare nu indexeaza inca imagini, deci un home page constituit din imagini naucitor de atragatoare, si nici o linie de text (html, nu desenat pe bitmap) va genera un numar constant de listari pe cuvinte cheie in Google: zero. In consecinta, la ce foloseste o pagina foarte frumos desenata, daca doar cativa ajung sa o vada (cei care nu s-au plictisit asteptand sa se descarce si cei cu conexiuni de inalta viteza), sau cei care cunosc adresa din alte surse (hmm, care)?

Imagini neoptimizate pentru web

Din nou, greseala frecventa la cei care au un background in design grafic. Pe web, marimea conteaza. In Romania, majoritatea utilizatorilor Internet se conecteaza prin linia telefonica (dial-up), ceea ce inseamna ca marimea paginilor web este esentiala. In 2002, viteza medie cu care se conectau utilizatorii in SUA era 56kbps ? viteza maxima de modem dial-up. In aceste conditii, trebuie sa faci economie, nu gluma: fiecare imagine ? ca si codul de altfel - trebuie optimizate la minimum de spatiu ocupat pe server, fara ca rezolutia sa fie afectata vizibil. Programe de editare de imagine ca Adobe Photoshop ofera optiuni de optimizare pentru web, dar exista si unelte mai simple si mai putin costisitoare pentru optimizarea de imagini.

Exces agasant de animatii

Multi designeri cred ca o pagina pe care se misca ceva in permanenta este mult mai atractiva. Numai ca principiul de ?eye catching? se refera la un SINGUR element care focalizeaza atentia. Si deja am descoperit greseala. In loc sa atraga atentia, elementele animate dintr-o pagina distrag atentia cititorului, functionand ca niste viziuni periferice. Acelasi rezultat il au si efectele de tip Blink: ajung sa agaseze vizitatorul, alungandu-l de pe site, la fel de nedumerit cum a a venit. Asadar, atentie la dozarea animatiilor!

Cod redundant si dezordonat

Oricine poate vedea continutul-cod al unei pagini web selectand optiunea ?View source?. Deocamdata, nu exista un procedeu de ascundere a sursei unei pagini web. Nu incurajam scripturile java de blocare a afisarii continutului, acesta fiind un motiv de penalizare in motoarele de cautare, si o m,etoda sigura de agasare a vizitatorului (care e obisnuit sa foloseasca butonul dreapta al mouse-ului sau, si nu o fac pentru a va fura sursa) insa daca aveti stiluri proprii in pagina, de pilda, este de preferat sa le introduceti intr-un document separat (.css in acest caz), catre care sa se lege fiecare pagina din site. Motivul principal este optimizarea codului: nu mai e nevoie sa introduceti stilul in fiecare pagina, reducand astfel considerabil codul. Pe de alta parte, la fel de important este de retinut ca executand modificari repetate in pagina cu ajutorul unui editor vizual de html, aveti toate sansele sa obtineti un cod incalcit, redundant, cu taguri inutile ramase din portiuni sterse etc ? de aceea este recomandabil sa executati codul ?de mana? pe cat posibil. Suficient de ?ametit?, codul va genera rapid si functionarea defectuoasa a sitului.

Testare si iar testare

Evident, cand creati o pagina web o verificati in browserul vostru sa vedeti cum arata. Dar nu e suficient, nici pe departe. O pagina care arata super in Internet Explorer 6.x, la rezolutia voastra de 1024x768 se poate transforma intr-un dezastru vizual la o rezolutie diferita, cu un font size diferit, in Netscape, Opera sau Mozilla. Tineti cont si de utilizatorii care au browserul setat sa nu afiseze imagini, de cei care folosesc alt sistem de operare decat Windows. Creati-va tabelele, imaginile, textele (daca nu folositi CSS) astfel incat sa fie compatibile cu vizualizarea in majoritatea situatiilor (ideal in toate).

Formularele - cel mai aproape de vizitator. Atentie cum il primesti!

Formularele sunt o parte interactiva a unui site. Intr-o pagina cu formular, te apropii de vizitator mai mult decat in celelalte. E stabilirea unei relatii, si inceputul unui schimb. E poate partea cea mai personala a unui site, acolo unde userul iti da informatii despre el, iti impartaseste opiniile sale, tu ii oferi un serviciu sau o oportunitate etc. De aceea modul in care executi formularele este foarte important pentru succesul sitului tau. O relatie se bazeaza pe respect si incredere: da-i vizitatorului ceea ce i-ai promis; afiseaza-i o pagina de confirmare/multumire dupa completarea formularului; afiseaza-i o pagina de eroare in cazul in care a completat gresit campurile sau a omis un camp obligatoriu. Feeback, feedback, feedback. Si bineinteles, verifica-ti scripturile, ca sa te asiguri ca formularul functioneaza.

Prea mult text

Avem obisnuinte ramase de la pagina de hartie, si de multe ori se vede pe web. O pagina de web nu e citita in autobuz sau in tren (sa numaram cate laptopuri cu conexiune wireless se plimba acum cu rapidul Bucuresti-Constanta?). Pentru carti, exista varianta e-Book. Nu faceti exces de text, pentru ca nu va fi citit. Spargeti textul in paragrafe, cu titluri relevante. In plus, sub 15% din utilizatori fac scroll pe o pagina web, asa incat incercati sa pastati informatia esentiala in partea de sus a paginii. Internetul e un mediu dinamic, utilizatorii obisnuiesc sa acceseze mai multe pagini in acelasi timp, si evident sunt mai usor distrasi de la continutul fiecareia dintre ele. Evident, un text dozat pentru astfel de conditii de citire nu inseamna nicidecum un text laconic, din care vizitatorul sa nu poata extrage nici o informatie utila. Dimpotriva, oferiti-i un coctail de esente, astfel incat sa obtina cat mai multe informatii intr-un mod cat mai clar organizat, in cat mai putin spatiu.

Prea putin text



Totusi, nu fiti laconici. Cine ajunge pe pagina, doreste sa se infomeze. Oferiti suficiente date, suficient continut, pentru vizitatori si pentru motoarele de cautare. Oricum, de obicei siturile web pacatuiesc prin prea mul text, nu prea putin. Text de tip sp@m/reclama Nu scrieti: ?Cel mai tare site de pe web?, ?Cea mai buna firma de consultanta? sau "Cea mai mare colectie de mp3-uri". Lasati-l pe vizitator sa decida, aratati-i respect. In plus, formulari prea comerciale au toate sansele sa piarda vizitatorul. Si el e satul de reclama, ca oricare dintre noi. Daca a venit in cautarea unei informatii, oferiti-i informatia, nu laude de sine. Sunteti indeajuns bun in ceea ce faceti ca sa-l convingeti cu fapte, nu cu vorbe goale si locuri comune care trec pe langa ureche fara a fi procesate. Sublinierile (underline) se folosesc doar pe linkuri, lasati-le acolo. Nu folositi cuvinte scrise cu majuscule, aceasta este o marca a sp@mului, de care Internautii s-au saturat pana dincolo. Nu vreti sa fiti asociati cu un fenomen negativ.

?ALT text? - text alternativ pe imagini


Tagul de text alternativ nu e o pretiozitate, ci o masura de crestere a eficientei. Unii utilizatori isi seteaza browserul sa nu descarce si imagini, pentru marirea vitezei de navigare. Daca nu aveti text alternativ pe o imagine din meniul web sitului, acesti utilizatori sunt vizitatori pierduti. Acelasi lucru se intampla daca din diferite motive pagina nu s-a decarcat complet, si imaginile nu sunt afisate (se intampla mai ales la conexiunile lente). Textul alternativ este un fel de ?roata de rezerva? pentru vizitatorii care vor sa afle informatii dintr-un web site. Folositi aceasta redundanta. mai ales ca, deloc neglijabil, cele mai populare motoare de cautare indexeaza textul alternativ.

Layout si dimensiuni - oricum, dar cu stil. Cu stilul propriu.



Specialistii inca disputa varianta cea mai eficienta de constructie a unei pagini web: dimensiuni fixe sau flexibile? Lasam acest subiect pentru alt articol, insa atragem atentia ca, oricare e alegerea, situl trebuie vizualizat optim in majoritatea configuratiilor. Asta presupune testare, dar si constructie optimizata: dimensiunea tabelelor, a textului (din nou, considerati un CSS, un stil propriu de text), linkuri corecte catre imagini etc.

Template sau plagiat - de ce sa fii original si creativ cand poti sa copiezi (fie si cu acordul sursei)?



Folosirea de template (sabloane) este o marca negativa si pentru un web designer si pentru clientul sau. Chiar daca acesta din urma nu va stii niciodata ca situl cu care se mandreste nu e nici pe departe unic, consideram o chestiune de etica profesionala si chiar de bun simt ca un mesaj personalizat sa fie transmis intr-o forma proprie. Singurele locuri unde se mai preteaza un template este un site personal sau un forum. Pentru o companie, un site dezvoltat pe sablon arata (si functioneaza) precum brichetele Zippo confectionate pe vapor. Aceasta nu este doar o chestiune de etica (pentru "web designer") dar si una de imagine (pentru companie).

Site map

Cu cat e mai mare un site, cu atat mai necesar devine un ghid de navigare. Utilizatorii sunt grabiti, deci trebuie sa le aratati exact unde gasesc ceea ce cauta. De asemena, si agentii de cautare gasesc foarte prietenoasa harta sitului, din aceleasi motive.

Mentenanta



Un site trebuie intretinut. Nu lasati informatii vechi, ?expirate?. aduceti mereu continut nou pentru vizitatori, dar si pentru motoarele de cautare ? daca vreti sa aveti un ranking bun. In fond, natura Internetului este data de insusi dinamismul sau. Tineti pasul. Lasam acesta lista deschisa, intrucat se stie ca intotdeauna e loc de mai bine, iar filosofia acestei afirmatii se bazeza pe adevarul faptului ca multimea erorilor este una infinita. Sa privim partea buna a lucrurilor: daca n-am gresi, n-am putea sa evoluam.