Grafica SIT – un element foarte important

grafica sitGrafica se foloseşte, in principal, pentru imbunătăţirea aspectului unui sit şi creşterea atractivităţii acestuia. Imaginile mai sunt folosite şi pentru sublinierea unui text sau al mesajului transmis de o pagina web. Este recomandat să includeţi insă, numai imaginile absolut necesare şi care sunt intr-adevăr valoroase.

Nu trebuie ca pagina web să arate ca o simpă inşiruire de imagini, indiferent cat de remarcabile ar fi acestea, luate individual. In această situaţie, pagina va arăta ca un brad de Crăciun, iar mesajul pe care vreţi să-l transmiteţi va fi mult diluat. Există şi excepţii, reprezentate de siturile web specializate si construite exclusiv pentru oferirea de imagini grafice, gratuite sau contracost. In acest caz, se folosesc thumbnails.

Thumbnails ( versiuni miniaturale ale imaginilor )

Acestea  sunt folosite cu succes  atunci cand se afişează o galerie cu imagini.
Se poate realiza astfel, o bună machetare a paginii iar cititorii nu sunt forţaţi să aştepte pană se incarcă imaginile la dimensiunea normală, ei dispunand totuşi de o reprezentare recognoscibilă a fiecărei imagini.

Atunci cand se folosesc fotografii sau imagini de mari dimensiuni,  vizitatorii vor decide dacă vor să le vadă. Şi in acest caz, este recomandat să se folosească ” thumbnails “. Acestea oferă in afara de previzualizare şi legături către imaginile cu dimensiuni normale .
De asemenea, este bine să avertizaţi cititorii asupra dimensiunii fisierului grafic pe care urmează să-l incarce. Puteţi face acest lucru prin afişarea dimensiunii fişierului langă ” thumbnail “, mai ales atunci cand depăşesc valoarea de 50 Kb.

Dimensiunea fişierelor grafice

Dimensiunea fişierelor grafice este determinată de suma informaţiilor oferite de o imagine. Astfel, fişierul grafic aferent unei imagini de dimensiuni mari, dar avand numai cateva culori poate să fie mai mic decat un fişier aferent unei imagini mult mai mici dar avand un număr mare de culori.

Pentru a realiza o pagină web cat mai bună, trebuie ca dimensiunile fişierelor grafice să fie reduse la minimum posibil, fără a afecta insă calitatea acestora. Este bine ca suma acestor fisiere să nu depaşească 30-40 Kb. La aceste dimensiuni ele se incarcă relativ repede. Din păcate insă, imaginile mari sau unele banere pot avea chiar si 75-100 Kb. Cu un modem avand o rată de transfer redusă, aceste imagini se incarcă in aproximativ 30 de secunde. Acesta este un timp suficient de lung pentru ca un vizitator să-şi piardă răbdarea şi să renunţe la vizitarea sitului.

setarea imaginilor

Grafica 1Daca aveţi cunoştinţe despre HTML, puteţi să folosiţi cateva trucuri pentru reducerea timpul de incărcare al fişierelor grafice. În acest mod, cititorii vor putea să inceapă citirea textului fără să aştepte incărcarea tuturor imaginilor.
Astfel, este recomandabilă folosirea atributelor “HEIGHT” si “WIDTH” alăturate etichetei “IMG“. In acest caz, browserul cunoaşte cat de mult spaţiu este ataşat fiecărei imagini şi incepe incărcarea textului imediat, în paralel cu incărcarea imaginii respective. Dacă nu specificaţi aceste atribute, browserul va calcula mai intai dimensiunile imaginii in comparatie cu celelalte elemente si ulterior va incepe incarcarea efectiva a imaginii respective .

Dacă vreţi să anulaţi chenarul care apare in jurul unei imagini folosite ca legatura, şi care uneori poate avea un aspect neplacut, puteţi să folosiţi atributul “BORDER=0“, ataşat etichetei IMG respective.

In final , eticheta IMG va avea un format de felul urmator :

<IMG SRC=”fisier_grafic.gif” LOWSRC=”grafic_rezolutie_scazuta.gif” ALT=”denumirea imaginii” BORDER=”0″ WIDTH=”400″ HEIGHT=”300″ >

Exemplu de sit web

In fiecare pagină a sitului web www.afaceri.net  am căutat să folosesc una sau două imagini sugestive care să simbolizeze, pe cat posibil, titlul sau subiectul principal din pagina respectivă. Pe această cale am dorit să imbunătăţesc aspectul paginii şi să subliniez intr-un anumit fel ideea principală. Pagina web nu trebuie să arate, in nici un caz, ca un bloc masiv de text deoarece cititorii vor obosi foarte repede şi vor renunţa să-l citească pană la capăt.

De asemenea, am căutat sa reduc dimensiunile fişierelor grafice pentru ca paginile web să poată fi încărcate intr-un timp cat mai scurt.

Din acelaşi motiv am folosit atributele ” HEIGHT ” si ” WIDTH ” alăturate etichetei ” IMG “.
În acest mod, browserul cunoaşte cat de mult spatiu este ataşat fiecărei imagini şi incepe incărcarea textului imediat, în paralel cu incărcarea imaginii respective. Dacă nu specificati aceste atribute, browserul va calcula mai intai dimensiunile imaginii .

Pentru ca imaginile să nu apară cu o bordură in jurul lor, am setat atributul BORDER=”0″.
Am folosit şi alte atribute pentru a alinia textul la stanga sau la dreapta imaginilor grafice, după cum a fost cazul.