DesignerWeb

CSS-ul poate fi un limbaj extrem de puternic pentru designeri. Totusi, in mare parte, CSS-urile produse sint la fel de bune ca si principiile pe care le urmeaza designerul ce creeaza codul. Ai spune ca oricine poate “rupe in doua” CSS-ul, insa exista o diferenta majora intre cei ce scriu CSS si cei care produc CSS-uri remarcabile, de top. Pentru a te atesigura ca esti pe pista cea buna, am cules de pe net opt principii pe care orice designer ar trebui sa le urmeze.

1. Fa-ti timp pentru a trece testul de validare

Daca ai de gand sa investesti timp in scrierea codurilor de CSS, va avea sens doar daca iti faci timp pentru validarea codului pe care il creezi. Validarea codului te va ajuta sa elimini orice problema si iti va da siguranta ca siteul va arata bine pentru toti vizitatorii tai (excluzand anumite situatii in care utilizatorii folosesc IE6).

In completare la asta, va trebui sa-ti validezi si fisierele HTML sau XHTML. Inainte de asta insa, asigura-te ca ai declarat corect tipul documentului (HTML sau XHTML DOCTYPE). Declararea DOCTYPE-ului (am lasat in engleza pentru a se intelege corect de catre toata lumea) ar putea parea un detaliu nesemnificativ, insa de multe ori am dat peste colegi care aveau probleme designul siteurilor la care lucrau, pentru a constata apoi ca nu era decat din cauza ca nu declarasera corect tipul documentului sau nu il declarasera deloc.

2. Nu abuza de div-uri

Deoarece div-urile ofera un nivel ridicat de flexibilitate, poti cadea imediat in capcana de a le folosi in mod excesiv. Aceasta problema a devenit asa de intalnita in randul designerilor incat comunitatile de CSS au creeat chiar si un termen pentru asta: divitus. Pentru a nu cadea victima acestei probleme, inainte de a folosi tagul DIV, intreaba-te daca nu cumva exista un tag HTML care poate face aceeasi treaba. Spre exemplu, in loc sa creezi un div pentru titlurile paginilor sau ale modulelor siteului tau, de ce sa nu personalizezi tagurile clasice de H1 sau H2?

Odata luata in considerare problema div-urilor, vei observa imediat beneficiile utilizarii tag-urilor HTML corespunzatoare in locul div-urilor. Nu doar va reduce numarul liniilor de cod pe care trebuie sa le scrii (care-ti vor salva considerabil timpul, si va fac siteul sa se incarce mai rapid), dar va conferi codului tau o structura mai logica.

3. Gandeste-te de doua ori cand iti denumesti clasele CSS

Daca intrebi un designer ne-experimentat cum se decide asupra numelor claselor, ar spune ca nu prea conteaza. Chiar daca din punct de vedere tehnic este adevarat, aceasta abordare este de cele mai multe ori gresita. In timp ce unii designeri nu pun pret pe numele claselor CSS, altii se gandesc inainte de a le denumi, dar le denumesc gresit. Nu vreau sa te bat la cap cu exeple teoretice, asa ca voi incerca sa ma explic in termeni concreti. Sa spunem ca trebuie sa creezi o clasa pentru a controla una dintre casutele de pe pagina ta. Casutga este situata in partea de jos a paginii, va contine comentariile vizitatorilor, iar tu vei folosi CSS-ul pentru a-i atribui un fundal albastru si pentru a controla spatierea (padding). In loc sa o numim .casuta-albastra (cum fac multi designeri bine intentionati), denumeste-o .casuta-comentarii. Motivul pentru care .casuta-comentarii este un nume de clasa mult mai bun decat .casuta-albastra este ca atunci cand te decizi sa schimbi fundalul din albastru in verde (sau cand te hotarasti sa muti casuta in alta pozitie a paginii), nu vei avea nici un semn de indoiala ca modifici casuta corecta, sau nu vei pune in incurcatura pe cel care va prelua munca la siteul in cauza.

4. Nu ignora imprimantele

Deoarece faci parte din minoritatea celor care respira si se hranesc cu tehnologie, ai parte de resursele si mediile de care ceilalti nici macar nu au auzit. De exemplu, probabil ca ai gasit metode de a economisi (cat de mult posibil) hartia din imprimanta ta. In timp ce (probabil) iti salvezi resursele in del.icio.us sau in bookmarks-urile din contul tau Google (prin Google Toolbar), o mare parte dinre utilizatorii de internet vor lista aceleasi resurse.

Luand in considerare acest aspect, este important sa folosesti CSS pentru a face continutul siteului tau sa se impace cu imprimanta. Vizitatorii vor aprecia efortul pe care l-ai depus pentru ca siteul tau sa arate bine, dar cand vor decide sa listeze pagina de pe siteul tau, te vor aprecia si mai mult cand vor realiza ca paginile listate contin doar textul pe care ei l-au vrut (fara imaginile care fac siteul tau sa arate bine pe calculator, dar vor consuma cartusele de tus ale imprimantei). Deoarece CSS-ul face ca totul continutul unui site sa fie bine formatat in momentul listarii, si asta foarte simplu si rapid, nu exista nici o scuza pentru un designer adevarat sa neglijeze acest pas in procesul de creatie.

5. Nu inceta sa inveti

Ai putea crede ca suna a cliseu, dar probabil ca este cel mai important din lista. Daca iti dedici timpul pentru a ajunge cel mai bun designer, asigura-te ca lucrezi la extinderea cunostintelor in CSS. Din fericire, acest pas, pe cat de important este, pe atit de usor de urmat este. Cantitatea de resurse gratuite in acest domeniu este imensa pe internet. Tasteaza “CSS” pe Google si vei vedea ca sint peste 400 de milioane de rezultate (si numarul creste de la o zi la alta).

Totodata, poti studia siteurile altor designeri CSS, pentru a observa diverse tehnici de lucru. Inregistreaza-te in comunitatile de design CSS, citeste comentariile, problemele si rezolvarile celorlalti, si urmeaza sfaturile altor designeri de top. Cu timpul vei deveni si tu un designer renumit – poate reusim impreuna .

Related posts:

1. Design & inovatie
2. 10 greseli de web design
3. 20 de exemple de mega-meniuri in web design