| CATEGORII DOCUMENTE |
Inainte de a aborda tipurile de caractere care pot fi utilizate in documentele Web, se cuvine mentionat un fapt: HTML nu este un limbaj orientat spre aspectul (layout) paginii, ci spre continutul acesteia.
Importanta acestei mentiuni rezida in aceea ca etichetele HTML nu impun, cum s-ar putea crede, ci 'sfatuiesc' marea varietate de browsere care proceseaza pagina Web, cum sa afiseze textul. Ceea ce impun ele cu adevarat este continutul, textul in sine, nu forma de prezentare.
Desigur ca nu se poate vorbi de cealalta extrema, a unui arbitrariu absolut, in care fiecare browser va afisa textul sub o forma absolut imprevizibila. Un text cu o anumita formatare pentru Internet Explorer, sa spunem, va fi vizualizat practic identic de toti utilizatorii acestui tip de browser.
Exista numeroase etichete care permit formatarea caracterelor si ne ofera posibilitatea de a da textului din pagina Web aspectul dorit.
Eticheta care se foloseste pentru a da unui caracter sau unui sir de caractere (unui text) aspectul dorit este eticheta container <FONT> </FONT>
Intre eticheta de inceput si cea de sfarsit se insereaza textul sau caracterul ale carui caracteristici dorim sa le stabilim.
Inainte de a discuta despre atributele etichetei <FONT> sa luam un exemplu:
<FONT size='2' color='red' face='arial'>Ion Luca Caragiale </FONT>
Efectul liniei de mai sus este afisarea textului 'Ion Luca Caragiale' cu fonturi Arial, de culoare rosie si de marime egala cu 2 puncte.
Sa analizam succesiv cele trei atribute ale etichetei <FONT>
size - dimensiunea textului - poate fi un numar intre 1 si 7 (dimensiuni absolute), intre -1 si -3 sau intre +1 si +4 (dimensiuni relative, adica raportate la dimensiunea deja existenta a fontului). Dimensiunea prestabilita (default) a fonturilor este 3.
Daca dimensiunile mentionate depasesc intervalul 1-7, browserul rotunjeste automat valorile pentru a le incadra in acest interval.
color - culoarea textului - este culoarea cu care va fi afisat textul prezent intre etichete (in exemplul nostru, 'Ion Luca Caragiale
face - tipul de font - determina tipul de font care va fi utilizat la afisarea textului.
Tipurile cele mai uzuale sunt:
Arial
Tahoma
Helvetica
Times New Roman
Courier
Verdana
Atributul etichetei permite precizarea fie a unui singur tip de font fie a mai multora, separate prin virgula. Precizarea mai multor fonturi ajuta in eventualitatea cand primul tip indicat nu este instalat pe calculatorul celui care viziteaza pagina, si se face ca in exemplul de mai jos.
<FONT face='arial, verdana, times new roman'>
In aceasta situatie browserul va alege singur din lista primul tip de font pe care il recunoaste, ignorandu-le pe urmatoarele.
Atentie!
La stabilirea tipului de caracter utilizat in pagina tineti seama de faptul ca nu toti utilizatorii au instalate pe computerele lor acelasi set de caractere ca si dumneavoastra. Din acest motiv, folosirea unor caractere exotice, de efect, poate conduce la un esec in cazul cand utilizatorul nu are instalat acel font.
Din acest motiv este de preferat folosirea unor fonturi cu utilizare larga, cum sunt cele mentionate mai sus.
In Exemplul 4.1 vom aplica pe rand fiecare dintre cele trei atribute mentionate asupra unui text.
Exemplul 4. 1
<HTML>
<HEAD>
<TITLE>fonturi1</TITLE>
</HEAD>
<BODY bgcolor='yellow'>
<FONT size='5' face='tahoma' color='green'>Manual de HTML si design Web</FONT><BR>
<FONT size='+3' face='arial' color='red'>Manual de HTML si design Web</FONT><BR>
<FONT size='-1' face='courier new' color='blue'>Manual de HTML si design Web</FONT>
</BODY>
</HTML>
Pentru a stabili aspectul textului unei intregi pagini Web, putem folosi eticheta <BASEFONT> Spre deosebire de <FONT> aceasta nu este o eticheta container, deoarece efectul ei se refera la tot textul din pagina. Nu se foloseste pentru a stabili caracteristicile unui bloc de text.
Este indicat sa fie inclusa in documentul HTML imediat dupa eticheta <BODY>. Atributele etichetei <BASEFONT> sunt aceleasi cu cele ale etichetei <FONT> respectiv: size, color, face.
In Exemplul 4.2 vom construi o pagina careia ii setam textul cu atributele:
face - tip de font Arial, size - dimensiunea fontului 2, color - culoare albastra. O parte din text va avea alt tip de font, alta marime si culoare, acestea fiind stabilite prin folosirea etichetei <FONT>.
Exemplul
<HTML>
<HEAD>
<TITLE>fonturi2</TITLE>
</HEAD>
<BODY bgcolor='white'>
<BASEFONT face='arial' color='blue' size='2'>
Am ajuns la lectia despre fonturi a <FONT face='arial black' color='red' size='4'>Manualului de HTML</FONT>
</BODY>
</HTML>
Pentru a afisa simultan o parte din text intr-un mod diferit am folosit eticheta <FONT>
Desi eticheta <BASEFONT> face parte din standardul HTML 3.2, atributele sale nu sunt recunoscute de browserele Netscape. Ca urmare, acesta va afisa textul utilizand propriile setari prestabilite (default), ignorand atributele mentionate in eticheta <BASEFONT>
Urmatorul exemplu (Exemplul 4.3) afiseaza un cuvant avand literele de marimi diferite.
Exemplul 4. 3
<HTML>
<HEAD>
<TITLE>fonturi3</TITLE>
</HEAD>
<BODY bgcolor='white'>
<BASEFONT face='arial black' color='red'>
<FONT size='4'>G</FONT>
<FONT size='5'>R</FONT>
<FONT size='6'>A</FONT>
<FONT size='7'>T</FONT>
<FONT size='6'>U</FONT>
<FONT size='5'>I</FONT>
<FONT size='4'>T</FONT>
</BODY>
</HTML>
Sa trecem in revista, in continuare, alte etichete care schimba aspectul unui caracter sau al unui bloc de text.
Eticheta <BIG> </BIG> face fonturile mai mari decat dimensiunea curenta.
<BIG>Text cu caractere mari</BIG>
Text cu caractere mari
Eticheta <SMALL> </SMALL> face fonturile mai mici decat dimensiunea curenta.
<SMALL>Text cu caractere mici</SMALL>
Text cu caractere mici
Etichetele <B> </B> (bold) si <STRONG> </STRONG> realizeaza scrierea cu caractere aldine, sau ingrosate (bold).
<B>Text ingrosat 1</B>
Text ingrosat 1
<STRONG>Text ingrosat 2</STRONG>
Text ingrosat 2
Etichetele <I> </I> (italic) si <EM> </EM> emphasized)realizeaza scrierea cu caractere italice.
<I>Text inclinat 1</I>
Text inclinat 1
<EM> Text inclinat 2</EM>
Text inclinat 2
Etichetele <S> </S> si <STRIKE> </STRIKE> realizeaza scrierea textului taiat de o linie orizontala.
<S>Text taiat 1</S>
Text taiat 1
<STRIKE>Text taiat 2</STRIKE>
Text taiat 2
Eticheta <U> </U> (underlined) realizeaza sublinierea textului.
<U>Text subliniat</U>
Text subliniat
Atentie!
Utilizarea textului subliniat trebuie facuta cu grija, intrucat acesta poate fi confundat cu un link.
Eticheta <SUP> </SUP> (superscript). Prin intermediul ei se pot insera in document caractere/texte plasate deasupra nivelului liniei de scriere.
Apa ingheata la 0 <SUP>0</SUP>C
Apa ingheata la 0
Eticheta <SUB> </SUB> (subscript). Prin intermediul ei se insereaza texte plasate sub nivelul liniei de scriere.
Coordonatele X<SUB>1</SUB>, Y<SUB>2</SUB>
Coordonatele X1, Y2
Este de remarcat faptul ca etichetele <BIG> si <SMALL> sunt executate diferit in diverse browsere.
Astfel, in Netscape <BIG> face textul mai mare cu un punct iar <SMALL> mai mic cu un punct decat dimensiunea curenta.
In Internet Explorer, <BIG> afiseaza textul cu fonturi de dimensiune 4 iar <SMALL> cu fonturi de dimensiune 2. Etichetele <BIG> si <SMALL> pot fi repetate pentru a obtine un efect mai accentuat.
Exemplele urmatoare ilustreaza modul cum pot fi utilizate aceste etichete.
Exemplul 4. 4
<HTML>
<HEAD>
<TITLE>fonturi4</TITLE>
</HEAD>
<BODY>
<BASEFONT face='arial' color='blue'>
<BIG>Etichete</BIG> care <EM>schimba</EM> aspectul <SMALL>textului</SMALL>
</BODY>
</HTML>
Exemplul 4. 5
<HTML>
<HEAD>
<TITLE>fonturi5</TITLE>
</HEAD>
<BODY>
<FONT face='arial' size='5'>Acesta este font Arial </FONT><BR>
<FONT face='algerian' size='4' color='green'>Acesta este font Algerian </FONT><BR>
<FONT face='courier' color='blue'><STRONG>Acesta este font Courier </STRONG></FONT><BR>
<FONT FACE='vivaldi' size='5' color='gray'><U>Acesta este font Vivaldi </U></FONT><BR>
<FONT FACE='garamond'><EM>Acesta este font Garamond </EM></FONT><BR>
<FONT FACE='modern' size='7' color='brown'><STRIKE>Acesta este font Modern </STRIKE></FONT><BR>
</BODY>
</HTML>
Dupa cum ati observat mai sus, exista doua etichete al caror efect este acelasi: accentuarea textului fie prin scrierea cu caractere italice fie cu caractere aldine.
Etichetele <B> si <I> se numesc etichete fizice, iar <EM> si <STRONG> etichete logice. Etichetele de titluri de la <H1> la <H6> sunt, de asemenea, etichete logice. Diferenta dintre cele doua tipuri de etichete este legata de felul cum sunt ele executate de diversele tipuri de browsere.
Astfel, etichetele fizice impun browserului afisarea in formatul exact, precizat prin intermediul lor. Daca browserul nu suporta acest format, etichetele sunt ignorate.
Spre deosebire de etichetele fizice, cele logice lasa browserului libertatea de a alege cel mai bun mod de a indeplini comanda transmisa prin eticheta. De exemplu, efectul etichetei <EM> este, in cele mai multe browsere, scrierea textului cu caractere italice. Totusi, daca un anumit tip de browser nu suporta acest format de caractere, va accentua totusi textul intr-un alt mod, cel mai bun de care dispune.
Alte etichete logice utilizate in documentele HTML sunt:
<CITE> </CITE> (citation) Eticheta folosita pentru inserarea unui citat. De obicei, citatul este afisat cu caractere italice.
<CODE> </CODE> (code) Etichete folosite pentru inserarea in text a unor secvente de cod scrise intr-un limbaj de programare. In general secventele de cod sunt afisate cu fonturi Courier.
<DFN> </DFN> (definition) Eticheta este folosita pentru a insera in text definitia unor termeni. Este utila la crearea indexului sau glosarului unui document.
<KBD> </KBD> (keyboard) Aceasta eticheta logica se foloseste pentru a indica un text care urmeaza a fi introdus de la tastatura, ca in urmatorul exemplu:
Pentru a parasi programul tastati <KBD>quit</KBD>
<SAMP> </SAMP> (sample) Este o eticheta logica folosita pentru a insera o mostra de text.
<TT> </TT> (teletype) Aceasta eticheta se foloseste pentru a afisa textul inclus intre etichete cu fonturi monospatiate. Tipul de font monospatiat (cum este de exemplu Courier) are proprietatea ca fiecarui caracter i se rezerva acelasi numar de pixeli pe ecran. Astfel, caracterul 'i' va avea alocat tot atata spatiu pe ecran ca si caracterul 'W
'Courier' este un font monospatiat.
Mai trebuie precizat si faptul ca utilizarea unora dintre etichetele de formatare a fonturilor asa cum au fost prezentate ele in acest capitol tinde sa fie inlocuita cu foile de stiluri (Cascade Style Sheets) despre care vom vorbi intr-un capitol viitor.
Pentru a stabili aspectul unei anumite secvente de text aceasta este inclusa intre etichetele <FONT> </FONT> conform sintaxei:
<FONT size='numar' color='#RGB sau nume_culoare' face='tip_font'> text </FONT>
Pentru a seta aspectul textului in toata pagina Web se foloseste eticheta <BASEFONT> conform sintaxei:
<BASEFONT size='numar' color='#RGB sau nume_culoare' face='tip_font'>
accentuarea textului se poate face folosind diverse etichete pentru scrierea cu caractere aldine, cu caractere italice, cu caractere mai mari sau mai mici decat dimensiunea curenta a fonturilor.
Etichetele sunt de doua tipuri: fizice si logice, etichetele fizice fiind orientate catre aspectul textului iar cele logice catre semnificatia textului in cadrul documentului.
a) <DEFAULT>
b) <BASEFONT>
c) <TARGET>
a) character
b) type
c) face
a) <FONT face='arial'>
b) <FONT face='arial, verdana'>
c) <FONTface='verdana'>
<FONT size='+1'>
a) Afiseaza textul cu fonturi de marime 1.
b) Afiseaza pe pagina textul '
c) Afiseaza textul cu fonturi de dimensiune mai mare cu un punct decat dimensiunea curenta.
a) <DARK>
b) <STRONG>
c) <BIG>
a) scrierea textului cu caractere italice
b) inserarea unei imagini
c) scrierea textului cu caractere mai mici decat cele curente
<FONT face='arial, verdana, times new roman', size='4'><B>text</FONT></B>
a) Nu se pot preciza mai multe tipuri de fonturi ca valori pentru atributul face
b) Tipurile specificate nu se pot scrie cu caractere aldine
c) Etichetele <FONT> si <B> nu se inchid corect.
a) Sunt amandoua etichete logice.
b) Sunt amandoua etichete fizice.
c) Servesc amandoua la scrierea textului cu caractere italice.
<BASEFONT face='arial' size='5'>text</BASEFONT>
a) <BASEFONT> nu este o eticheta container
b) <BASEFONT> nu suporta atributul face
c) <BASEFONT> nu suporta atributul size
<FONT='arial, verdana, times new roman'>
a) Textul se afiseaza cu toate cele trei tipuri de fonturi.
b) Textul se afiseaza cu primul tip de font, dintre cele trei, pe care il recunoaste browserul.
c) Eticheta nu era nici un efect intrucat este incorecta.
|
Politica de confidentialitate | Termeni si conditii de utilizare |
Vizualizari: 1414
Importanta: 
Termeni si conditii de utilizare | Contact
© SCRIGROUP 2024 . All rights reserved
