Web design: Principii de baza in design - Alinierea

 

Alinierea inseamna ca elementele de pe pagina sunt aliniate unele in raport cu celalalte. Lipsa alinierii este principala problema de pe paginile Web, aceasta reprezinta o problema importanta si pe paginile tiparite, insa pare si mai prezenta si mai dezastroasa pe paginile Web. Nimic nu trebuie asezat la intamplare pe pagina. Se creeaza un aspect curat, sofisticat si proaspat al paginii daca fiecare element are o legatura vizuala cu un alt element de pe pagina.
Alinierea elementelor dupa latura stanga, dreapta sau centrat trebuie sa urmeze o anumita regula, si anume:
Alegeti UNA. Se alegei o singura aliniere care se utilizeaza pe toata pagina.

  1. Daca se opteaza a se alinia textul de baza in stanga, nu se pune titlul pe centru;
  2. Daca se aliniaza centrat o parte din text, atunci se aliniaza centrat peste tot.
  3. Nu amestecati alinierile.

Acest singur principiu va modifica radical aspectul paginilor.
Se pot face alinieri verticale orizontale si centrale.

O aliniere centrala se poate spune ca este:

  1. echilibrata;
  2. simetrica;
  3. calma;
  4. oficiala.

Aliniind o parte din text la stanga, o parte la dreapta si o parte centrat, se creaza senzatie de dezordine si se transmite impresia de amatorism.
Daca se aliniaza textul si imaginile, este bine sa indepartam textul de marginea stanga. Este obositor si distrage atentia sa dam cu ochii de marginea stanga a paginii browserului de fiecare data cand trecem la randul urmator. Cand decalam text (operatie de “indentare”), se poate face si din partea dreapta, impiedicand formarea randurilor de text lungi si dificil de citit.

Text pe butoane neglijent realizat (vezi figura de mai sus)

Alinierea orizontala este la fel de importanta ca si cea verticala. Este important sa vedeti butoane ca in exemplul de mai sus, in care literele nu se aliniaza pe orizontala. Aceasta deplasare “sus/jos/sus/jos” face ca toata manseta sa arate dezordonata. De aceea, pe langa alinierea verticala trebuie sa fim atenti si la alinierea orizontala a butoanelor si legaturilor.

Text pe butoane corect realizat (vezi figura de mai sus)

Literele stau pe o linie invizibila numita “linie de baza”. Manseta de legaturi este mai ordonata si mai organizata daca aliniem tot textul pe aceeasi linie de baza,. In majoritatea software-urilor de creatie pentru Web exista un buton pentru alinierea dupa linia de baza, de obicei in specificatiile pentru tabele.

Formular incorect realizat din punct de vederea al webdesign-ului (vezi formularul de mai sus)

Formularul acesta incepe excelent; exista cateva alinieri foarte bune, bine definite, dar si locuri in care textul pare sa fi fost trantit aleatoriu pe pagina.
Aliniere verticala in partea laterala a formularului lasa de dorit. Consolidam aspectul paginii, aliniind celalalte elemente dupa aceasta linie.
Totul trebuie sa aiba un motiv pentru a-si justifica locatia deoarece, nimic nu trebuie plasat arbitrar pe pagina. Nu azvarlim pur si simplu elementele si vedem cum si unde se lipesc. Trebuie sa putem explica motivul pentru care un element se afla in acel loc.
O pagina, poate sa fie instantaneu folosita, prin alinierea tuturor elementelor dupa o latura si pagina arata mult mai organizata. Daca lucrurile sunt organizate, ele comunica mai bine.
Alinierea nu inseamna ca totul este aliniat dupa aceeasi latura. Inseamna pur si simplu ca totul are aceeasi aliniere – fie lipit la stanga, fie lipit la dreapta, fie centrat.
Cand o margine buna se repeta, ea castiga in forta.

Formular corect realizat din punct de vederea al webdesign-ului (vezi formularul de mai sus).

Mai sus am dat un mod de aliniere optim, pentru formularul creat anterior. Se observa linia verticala dupa care se aliniaza casutele text, checkbox sau cea de submit. Foirmularul arata mult mai bine.
 

Sursa: curs "Webdesign" de Conf. dr.Livia SANGEORZAN

Ana A.

1Comentarii la "Web design: Principii de baza in design - Alinierea"

  1. Radu spune:

    Pentru un bolg care apartine unui magazin online cu meniul de navigare pe partea stanga, in sectiunea blog pe care parte este corect asezarea textului articolelor?

Adauga Comentariu

Mesaj

Trimite