Suport de Curs Designer Pagini Web

CONSTANA
Ion Lahovari 158 Tel.: + 40 241 516.848 + 40 722 344 480 Fax: + 40 341 814.416 E-mail: cursuri@gmb.ro web: www.ciid.ro
SUPORT DE CURS DESIGNER PAGINI WEB
I. COMUNICAREA SI DEZVOLTAREA PROFESIONALA

1. Dezvoltarea profesional 2. Comunicarea interactiv la locul de munc 3. Lucrul n echip
II. NORME GENERALE CU PRIVIRE LA NPM, PSI SI CALITATE IN UTILIZAREA ECHIPAMENTELOR SI DISPOZITIVELOR
1. Aplicarea procedurilor de calitate 2. Aplicarea normelor de tehnic a securitii muncii i a prevederilor pentru stingerea incendiilor 3. Introducerea informaiilor i datelor n formate electronice 4. Procesarea informaiilor i documentelor din formatele brute 5. Validarea datelor 6. Asigurarea securitii datelor 7. Utilizarea echipamentelor periferice-specifice III. PROGRAMA DE PREGATIRE 1. Analizarea scopului paginii web
1.1.Notiuni introductive. Termeni cheie 1.2.Definirea termenului World Wide Web (Web), Internet. Identificarea particularitilor de baz. nelegerea c Web este un serviciu al internetului. ntelegerea c Web-ul este setul complet de interlegturi (link-uri) de documente text (hypertext) de pe internet. 1.3.Definirea i nelegerea termenilor de browser, server Web. nelegerea c un browser este folosit pentru a accesa informaie stocat pe un server Web. 1.4.Definirea i nelegerea termenului de URL. 1.5.Definirea i nelegerea sistemului de funcionare al protocoalelor. Diferenierea protocoalele primare i modalitile de folosire: TCP/IP, HTTP, HTTPS, FTP. 1.6.Informaia de pe Web 1 GMB Computers
CONSTANA
1.7.Identificarea avantajelor de a publica informaii pe Web: beneficiile materiale, accesul la informaie a unui public larg, uurina n actualizare, interactivitatea cu publicul. 1.8.Definirea i nelegerea termenului de hyperlink. 1.9.Fundamentele HTML-ului 1.10. Definirea i nelegerea termenului de HTML nelegerea c HTML este un limbaj independent de un anumit soft i este scris n format text. 1.11. nelegerea c site-urile realizate n HTML sunt realizate pe o structur ierarhic. 1.12. nelegerea rolului recomandat de HTML pentru consoriul W3C. nelegerea beneficiilor recomandate ofer: interoperabilitatea site-urilor Web fa de browsere, accesibilitatea fa de persoanele cu dizabiliti.
2. Proiectarea structurii sit-ului

6.1. 6.2. 6.3. 6.4. 6.5. 6.6. 6.7. 6.8. 6.9. 6.10. 6.11. 6.12. 6.13. 6.14. 6.15. 6.16. Notiuni generale despre structura unui site Construirea unei pagini simple Procesarea imaginilor, crearea de animaii i flash-uri Folosirea tag-urilor de comand simple pentru o pagin Web: Aplicarea de stiluri paragrafelor. Setarea stilurilor bold, italic. Setarea culorii, aspectului i mrimii folosind tag-ul font. Vizualizarea codului surs a unei pagini Web ntr-un browser. Folosirea aplicaiei Introducerea i formatarea textului Paragrafe i formatarea paginilor Legturi (Hyperlinks) Tabele.Inserarea, tergerea unui tabel. Cadre (frames) Formulare simple Formatul i dimensiunea imaginilor
3. 4. 5. 6.
Elaborarea de prototipuri.Exercitii practice. Realizarea sit-ului Testarea sit-ului Publicarea sit-ului 6.1. nelegerea conceptului de ncrcare a unui Web site pe un server 6.2. Publicarea Website-ului pe server 7. ntreinerea sit-ului
2 GMB Computers
CONSTANA
Suportul de curs nu exclude i nici nu substituie instruirea asistat de ctre lectorul de specialitate. Acesta este conceput n scopul aprofundrii cunotinelor i abilitilor dobndite la curs. Deasemeni, suportul pentru studiu individual poate conine elemente suplimentare care pot fi utile cursantului, chiar dac nu sunt cuprinse n programa analitic.
Comunicarea si dezvoltarea profesionala
Definire
Comunicarea - schimbul de informaii, idei - a fost definit ca un proces interpersonal de transmitere i recepie de simboluri care au ataate nelesuri. Comunicarea este acel fenomen care permite crearea de legturi ntre oameni, ntre instituii i ntre instituii i oameni. Componentele procesului de comunicare sunt reprezentate de: emitor, mesaj, canal, receptor.
INFORMATIE / MESAJ
EMITENT Scopul/rolul comunicarii Obiectul comunicarii Canalul de comunicare Modalitatea de transmitere a informatiei Factorii perturbatori RECEPTOR
RASPUNS
Comunicarea face posibila coexistenta oamenilor. Salutul sau un gest prietenesc sunt forme simple de a stabili un contact cu ceilalti. Comunicarea directa intre oameni este realizata prin intermediul cuvintelor sau a gesturilor. Dar, pentru a face un schimb de idei sau pentru a impartasi cunostinte cu persoane aflate departe, e nevoie de mijloacele cu ajutorul carora sa se transmita informatiile la distanta: acestea sunt mijloacele de comunicare in masa sau mass-media.
A comunica si a informa
Comunicarea, informarea si mijloacele de comunicare depind unele de altele. Acesti termeni au sensuri diferite in functie de domeniile care au drept scop comunicarea informatiei. Pentru ziarist, informatia este expunerea unor fapte la care a asistat sau pe care le-a putut verifica. Pentru el, o informatie buna trebuie sa fie adevarata, noua, inedita si surprinzatoare. Mijloacele de comunicare sunt diferitele suporturi pe care ziaristii le folosesc ca sa transmita informatia (ziare, radio, televiziune etc.). Pentru inginerul din domeniul telecomunicatiilor, informatia este un semnal transmis unui destinatar prin mijloace tehnice. Inginerul numeste comunicare totalitatea operatiilor de prelucrare, de transmitere si receptionare a mesajului.
GMB Computers
CONSTANA
Pentru cei din domeniul publicitatii, comunicarea are drept scop cucerirea si influentarea consumatorului prin mesaje atragatoare. In functie de clientul care trebuie convins, sunt folosite diferite mijloace de comunicare. Pentru specialistii din stiintele umane, comunicarea este un mijloc folosit de oameni pentru a stabili contacte intre ei, pentru a crea si intretine legaturi intre membrii unui grup. Mass-media extind aceste legaturi la intreaga societate, iar telecomunicatiile sunt un mijloc de coexistenta la distanta.
Prelucrarea si difuzarea informatiei

Este greu sa comunicam marelui public anumite evenimente, de exemplu descoperirea unei noi molecule chimice. De aceea, este nevoie ca anumite persoane sa se ocupe de prelucrarea acestor informatii, astfel incat un numar cat mai mare de oameni sa poata afla. Acesta este rolul profesorilor si al ziaristilor: ei prezinta informatiile si le structureaza dand prioritate celor mai importante si mai interesante, in functie de publicul caruia I se adreseaza. Odata informatia prelucrata, aceasta trebuie sa fie difuzata publicului interesat. Distanta franeaza considerabil comunicarea. De aceea, de-a lungul secolelor, oamenii au inventat diferite moduri de a transmite informatiile. Astfel, pentru a comunica, ei pot vorbi (fata in fata, la telefon, la radio), scrie carti sau articole in ziar, pot face fotografii, pot filma, trimite scrisori prin posta, prin fax, prin reteaua Internet etc. diversitatea mijloacelor de comunicare face posibila exprimarea unor puncte de vedere diferite despre acelasi eveniment.
Comunicarea astazi
Astazi, putem transmite si primi informatii imediat, oriunde in lume. Datorita acestei rapiditati, verificarea informatiilor devine din ce in ce mai dificila, atat pentru ziaristi, cat si pentru public. Comunicarea este indispensabila, dar trebuie sa comparam si sa privim cu un ochi critic toate informatiile care ne parvin.
Etapele procesului de comunicare

EMITENT/INFORMATIE TRANSMISA RECEPTOR/INFORMATIE PRIMITA I. Pregatirea si analiza informatiei Se analizeaza: Identificarea datelor de intrare: Disponibilitatea documentului suport care poarta Identificarea scopului comunicarii informatia de comunicat pentru alegerea Stabilirea responsabilitatilor modalitatii adecvate de comunicare rezultate din mesajul primit Disponibilitatea resurselor / mijloacelor de Stabilirea actiunilor ce trebuie comunicare necesare: semnarea de primire pe intreprinse, adecvate informatiei documentele originale a copiilor, curieri pentru primite comunicarea scrisa, telefon, fax, spatii disponibile (centrala telefonica) Definirea informatiei: Definirea obiectului comunicarii (tipul informatiei) Identificarea receptorului / receptorilor Stabilirea frecventei de comunicare si a momentului transmiterii informatiei Anticiparea factorilor perturbatori: Stabilirea gradului de detaliere a continutului si/sau a limbajului (informatiile trebuie redactate intr-un limbaj adecvat gradului de intelegere al receptorului Anticiparea impactului informatiei asupra receptorului si a altor factori perturbatori potentiali
GMB Computers
CONSTANA
Resp. : Emitentul II. Transmiterea informatiei : Confirmarea de primire informatiei (daca este cazul) a
Informatia trebuie sa ajunga in timp util catre toti receptorii carora informatiile le sunt necesare si utile si/sau pentru care informatia este relevanta pentru eficacitatea sistemului de management.
Transmiterea raspunsului catre emitent, respectand cerintele de relevanta si adecvanta impuse oricarui tip de informatie. Daca nu au fost asigurate de catre emitent, cerintele minime necesare efectuarii analizei, se atentioneaza emitentul si se solicita revizuirea transmiterii informatiei, precizand explicit cerintele.
Resp.: emitentul III. Receptia, analiza si acceptarea raspunsului: Analiza raspuns aferent informatiei communicate, pentru a evalua: - masura in care informatia a fost corect receptionata, inteleasa, si/sau utilizata. - identificarea necesitatii de revizie a informatiei si retransmitere, daca este cazul Respectarea indicatorului de raspuns (nivelul de acceptare pentru raspuns) numar de raspunsuri raportat la numarul de receptori, valoarea admisibila fiind stabilita in functie de tipul informatiei si modalitatea de comunicare utilizata. In caz de neacceptare raspuns se stabilesc Actiuni corective/ Actiuni preventive Resp.: Emitentul IV. Analiza si imbunatatirea procesului de comunicare: Identificarea necesitatilor de initiere Actiuni Identificarea necesitatilor de corective/ Actiuni preventive, daca raspunsul initiere Actiuni corective/ Actiuni impune acest lucru (completari de continut al preventive, daca acceptul informatiei, schimbarea modalitatii de raspunsului impune acest lucru comunicare, extinderea transmiterii ei catre alti receptorului (completari de receptori, etc) continut al raspunsului, schimbarea modalitatii de Finalizarea comunicarii prin transmiterea catre comunicare, etc.) receptor a acceptului. Identificarea necesitatilor de imbunatatire a procesului de comunicare, pe baza experientei acumulate in timpul derularii procesului si initierea de actiuni de imbunatatire. Resp.: Emitentul Resp.: Receptorul Au fost identificate funciile comunicrii: - Funcia de informare; - Funcia de comand i instruire; - Funcia de influenare i convingere, ndrumare i sftuire; - Funcia de integrare i meninere.
GMB Computers
CONSTANA
Modaliti de comunicare
Exist urmtoarele tipuri de comunicare: A. Comunicare oral; B. Comunicare scris; C. Comunicare non-verbal.
Comunicarea oral
mbrac o serie de situaii specifice: Comunicarea fa n fa cu o persoan are avantajul c este direct i c permite folosirea tuturor mijloacelor verbale i non-verbale de comunicare. De asemenea, poate fi interactiv, permind ajustarea mesajelor pe parcurs, pe baza feed-back-ului verbal i non-verbal. Comunicarea interpersonal este important n situaii de evaluare a performanei i motivare, de dare de instruciuni, de rezolvare de conflicte, de negociere etc. Comunicarea interpersonal focalizat pe construirea de relaii interpersonale este necesar n procesul de ndrumare i sftuire da angajailor Comunicarea managerial n grup are o serie de funcii caracteristice cum ar fi: ajut la definirea grupului, sprijin procesul de implementare a deciziilor i schimbrii. O form a comunicrii n grup este comunicarea n faa unui auditoriu. Adresarea oral ara ca forme specifice mai importante: Prezentarea, care poate avea loc fie n interiorul organizaiei, fie n exteriorul ei. n cazul prezentrilor n interiorul organizaiei se presupune, n general, c auditoriul are caracteristici comune.
n legtur cu prezentrile n faa unui auditoriu extern organizaiei, pot aprea dou probleme importante: dificultatea adaptrii prezentrii i a vorbitorului la auditoriul i cadrul extern, mai puin cunoscute; faza dificil a ntrebrilor i rspunsurilor. Alte probleme care pot s apar att n cazul prezentrilor interne, ct i a celor externe, sunt: - prezentrile sunt confuze; - prezentrile sunt prea lungi; - prezentrile sunt neconvingtoare; - stilul de prezentare a informaiilor este deficitar. Briefingul este o prezentare mai scurt, cu scop de rezumare a unor informaii sau cu scop de informare la zi privind activiti de afaceri, proiecte n desfurare, programe sau proceduri. Ca format, briefingul este, de obicei, o comunicare ntr-un singur sens, de la vorbitor spre auditoriu (procesul de informare poate implica i auditoriul). Raportul are ca scop analiza situaiei unei activiti sau a unui proiect i const n prezentarea de informaii relevante pentru o anumit faz a acestora sau pentru finalizarea lor. Exist dou tipuri:
GMB Computers
CONSTANA
a) Raportul de situaie - se face printr-o prezentare de 30-40 minute. Scopul acestuia este de a familiariza auditoriul cu starea la zi a proiectului sau activitii i, uneori, s fac referiri la viitorul proiectului; b) Raportul final - este o prezentare formal major de 40-60 minute, destinat analizei muncii la ntregul proiect, de la nceput pn la sfrit. Are ca scop recomandarea pentru luarea unor decizii sau rezolvarea unei probleme, prezentarea unui rezultat final al muncii n cadrul unui proiect. Alte tipuri de comunicare oral: Filtrarea - reprezint tendina de a dilua sau de a opri un mesaj n curs de transmitere. Politica uilor deschise concretizat prin posibilitatea oferit de manager angajailor de a comunica direct, fr a parcurge circuitul ierarhic. Avantajul acestui tip de comunicare este nediluarea informaiei care ajunge n mod direct de la angajat la manager, fr alte persoane interpuse. Totodat, exist i dezavantaje, cum ar fi perioada mare de timp necesar unui manager pentru a-i asculta pe toi angajaii care au de fcut propuneri sau probleme de adus la cunotina sa. Efectul de cocoloire, adic tendina de a evita comunicarea tirilor proaste celorlali, are avantajul c evit o eventual panic creat de o veste proast, dar i dezavantajul c i mpiedic pe angajaii care ar putea avea soluii sau idei de rezolvare a crizei s i aduc aportul la clarificarea situaiei. Zvonul - reprezint comunicarea neverificat, aflat n circulaie. Aduce multe deservicii organizaiei, crend stri conflictuale sau oferind motive de bucurie care mai apoi nu pot fi concretizate. Jargonul este limbajul specializat folosit de deintorii unui anumit loc de munc. Comunicarea prin telefon. Aspectul distinctiv al acestei comunicri este lipsa din mesaj a elementelor de natur non-verbal. Aceasta genereaz o distan psihologic fa de interlocutor care duce n mod firesc la un coninut depersonalizat al mesajului. Comunicarea cu mass-media poate mbrca mai multe forme: - interviuri n exclusivitate sau spontane; - comunicate de pres; - conferine de pres. Pentru o comunicare oral eficient, managerul sau funcionarul public trebuie s aib n vedere urmtoarele elemente: a) crearea condiiilor: - se va rezerva timpul necesar; - se vor evita ntreruperile i deranjul din partea altor persoane; - se va crea o ambian plcut. b) nceputul ntrevederii: - managerul va cuta s fac n aa fel nct cel cu care comunic s se simt bine; - managerul va conduce convorbirea astfel nct solicitantul s treac repede la subiect. c) modul de desfureare a convorbirii: - se va preciza problema care se discut; - se va avea n vedere scopul care trebuie atins; - interlocutorul va fi ncurajat s spun tot ceea ce l preocup; - discuia va fi condus i controlat; - se vor evita contrazicerile directe i cearta; - managerul va rmne calm, politicos i stpn pe sine n orice moment, fiind mereu obiectiv; - se vor da rspunsuri clare i precise pentru a elimina orice nenelegere;
GMB Computers
CONSTANA
d) sfritul convorbirii: - se vor rezuma punctele comune la care s-a ajuns; - se va urmri s se obin acordul interlocutorului; - chiar dac nu se ajunge la nici o nelegere, managerul se va despri n termeni cordiali de interlocutor; Dintre regulile care trebuie respectate n timpul unei conversaii, menionm: -sigurana n expunere; -discutarea doar a aspectelor bine fondate; -se va vorbi calm, cu convingere i fr exagerri; -se va ine cont de scopul expunerii; -se va folosi o exprimare clar, precis, sugestiv; -se va practiva stilul concret, cu fapte precise i exemple; -se va pstra contactul vizual n timpul comunicrii; -se va controla mimica, evitnd exagerrile, gesticulrile i ticurile. Literatura de specialitate evideniaz faptul c viteza de gndire este de 400 de Cuvinte pe minut, iar cea de vorbire de 275 de cuvinte pe minut. De aici apare dificultatea de concentrare asupra mesajului, existnd tendina de a ne gndi simultan la mai multe lucruri n timp ce ascultm un mesaj. De asemenea, s-a observat faptul c faptele sau cifrele sunt ascultate cu mai mult atenie. O alt problem este faptul c receptorul nu ncearc s citeasc printre rnduri, s neleag mesajul ascuns dincolo de cuvintele, tonul i gesturile interlocutorului.
Comunicarea scris
Caracteristicile pe care trebuie s le ntruneasc un mesaj scris pentru a fi eficient sunt urmtoarele: -s fie uor de citit; -s fie corect; -s fie adecvat direciei de transmitere; -s fie bine gndit. nainte de a comunica ceva trebuie stabilit scopul pentru care se dorete transmiterea mesajului, adic dac este oportun transmiterea mesajului, dac reacia de rspuns este favorabil i dac mesajul transmis are anse de a-i atinge scopul. Urmtorul pas n procesul de scriere este clarificarea i sistematizarea gndurilor n legrur cu materialul asupra cruia s-a decis c e oportun scrierea lui. Acest proces cuprinde urmtoarele faze: -generarea; -sistematizarea; -organizarea materialului. Ultimul pas l reprezint scrierea propriu-zis a mesajului, ncepnd cu redactarea lui i continund cu editarea i punerea lui n forma adecvat. Este foarte important de menionat faptul c a gndi i a scrie reprezint dou procese diferite. Astfel, etapa de gndire reprezint aproximativ 40% din timpul necesar ntocmirii mesajului scris, aa cum se poate vedea din graficul de mai jos:
Comunicarea non-verbal
reprezint tipul de comunicare concretizat n transmiterea de mesaje prin intermediul expresiilor faciale, modulaiilor vocii, gesturilor i posturii corpului, care are loc n cadrul comunicrii orale, directe, fa n fa. n cadrul comunicrii non-verbale se poate analiza i mediul n care are loc comunicarea. Ambientul contribuie la o bun desfurare a edinelor sau a ntrevederilor de orice fel.
GMB Computers
CONSTANA
Comunicare prin mijloace moderne In principiu exista 2 mari domenii in care acesta este folosita reteaua Internet: 1. Comunicare a) Posta electronica (e-mail) prin care se pot transmite si primi mesaje Avantaje: 1. Transmitere rapida catre orice loc din lume; 2. Un mijloc ieftin si eficient de comunicare; 3. Permite folosirea de liste de distribuire a mesajelor; 4. Foloseste instrumente de gestiune a mesajelor. Dezavantaje: 1. Un fisier atasat poate contine un virus de computer; 2. Poate avea loc o supraincarcare a cutiei postale; 3. Se pot produce erori si neglijente in folosirea E-mail-ului; 4. Se obtin foarte multe mesaje nefolositoare (Junk Mail). b) Liste de discutii (discussion lists) care permit participarea la discutii si schimburi de informatii in grupuri profesionale c) Grupuri de stiri (Newsgroups) care permit consultarea sau participarea in grupuri de stiri publice Grupurile de stiri ( grupuri de discutii sau forum-uri de discutii ) reprezinta largi sisteme de comunicare prin care persoane avand diverse preocupari si pasiuni schimba informatii, discuta pe baza unor teme de interes general sau particular sau pun diferite intrebari. d) Chat-ul care permite comunicarea on-line a 2 sau mai multi utilizatori Una din utilizarile cele mai practice si directe ale comunicarii prin Internet este chat-ul (a discuta in traducere din engleza). Formele pe care le imbraca acest tip de comunicare sunt diverse. De la simple programe care includ linii de text pina la transmisii de sunet si video in timp real cu posibilitatea de video conferinta. Pe langa comunicarea in timp real a unor mesaje scrise prin serviciul chat sau comunicarea prin mesaje asigurata de serviciul de posta electronica, in reteaua Internet au fost dezvoltate si alte servicii pentru comunicarea in timp real: serviciile audio si video. Aceste servicii permit oamenilor dintr-o organizatie sa lucreze si sa colaboreze intr-o noua maniera. Ele asigura: - transmiterea vocii catre o alta persoana sau catre un grup de oameni; - transmiterea unei imagini televizate in direct catre o singura persoana sau catre mai multe persoane; - transmiterea prin Internet a informaliilor din emisiunile de radio si televiziune; - posibilitatea ca un grup de oameni sa citeasca si sa editeze un document. 2. Informare prin accesul la distanta si la surse de informatii a) World Wide Web ( WWW - sau mai pe scurt web-ul ) prin care se poate accesa si naviga prin paginile web care contin informatii de larga circulatie si la resurse cu ajutorul instrumentelor de cautare si a hyper legaturilor ( hyperlinks ) inserate in documente b) FTP ( File Transfer Protocol) care permite transmiterea si primirea de informatii la si de la distanta. Lucrand la distanta prin retea, apare necesitatea de a transfera fisiere intre statia locala si un server. Exista mai multe metode pentru aceasta; in orice caz avem nevoie de un program, rulat pe statia locala, care sa se conecteze la server si sa solicite transferul fisierelor, cerut de utilizator. c) Telnet care ofera posibilitatea de accesare a unor calculatoare situate la distanta.
GMB Computers
CONSTANA
Dezvoltarea profesional
Pregatirea profesionala
urmata de o dezvoltare profesionala continua trebuie sa constituie o prioritate att pentru organizatie, ct si pentru salariat, din dorinta comuna de a face performanta. Pregatirea profesionala urmata de o dezvoltare profesionala continua trebuie sa constituie o prioritate att pentru organizatie, ct si pentru salariat, din dorinta comuna de a face performanta. Pregatirea profesionala este un proces de instruire pe parcursul caruia partic ipantii dobndesc cunostinte teoretice si practice necesare desfasurarii activitatii lor prezente. Spre deosebire de pregatire, dezvoltarea profesionala este un proces mai complex, avnd drept obiectiv insusirea cunostintelor utile, att in raport cu pozitia actuala, ct si cu cea viitoare. Existenta unor angajati care nu mai reusesc sa tina pasul, pe plan profesional, cu mutatiile care au loc in modul de desfasurare a activitatilor din economia moderna reprezinta o problema care preocupa tot mai multe firme. Tot mai frecvente sunt cazurile in care salariati considerati ani la rnd ca eficienti pe posturile lor isi indeplinesc cu tot mai mare dificultate responsabilitatile, iar performantele lor sunt tot mai reduse. In toate domeniile de activitate, formarea si perfectionarea salariatilor au devenit o cerinta a perioadei in care traim. Daca in trecut tinerii care dobndeau o profesie reuseau, pe baza cunostintelor obtinute in timpul scolii, sa o exercite pe toata durata vietii, astazi cunostintele se perimeaza foarte rapid. In Romnia, perfectionarea este perceputa ca o necesitate, dar nu constituie inca o prioritate. Un program de pregatire profesionala va da rezultate numai daca se bazeaza pe o analiza atenta a necesitatilor unei organizatii. Succesul programului va depinde de masura in care se stie ce trebuie predat, de ce, pentru cine si in ce mod. Obiectivele unui astfel de program rezulta din nevoile interne ale organizatiei si sunt in concordanta cu obiectivele sale generale. Numai in acest mod formarea si perfectionarea profesionala pot fi cu adevarat eficiente, rezolvnd problemele viitorului odata cu cele ale prezentului. Specialistii considera ca orice organizatie trebuie sa mentina o stare de presiune continua asupra salariatilor sai pentru ca acestia sa fie motivati pentru autoperfectionare, evitndu-se astfel uzura cunostintelor. In acest scop, trebuie intreprinse urmatoarele actiuni: - cunoasterea ct mai exacta a cererii de pregatire profesionala si a evolutiei sale; - informarea celor interesati asupra posibilitatilor de pregatire profesionala; - organizarea unei evidente clare privind pregatirea profesionala a salariatilor in fiecare organizatie; - motivarea salariatilor si sprijinirea celor care doresc sa-si imbunatateasca pregatirea profesionala; - identificarea preocuparilor pentru aplicarea celor invatate; - realizarea unui control al actiunilor de pregatire profesionala; - coordonarea actiunilor de pregatire profesionala continua, fara a frna initiativele.
10
GMB Computers
CONSTANA
Pregatirea profesionala se poate organiza sub diverse forme in cadrul firmelor, in unitati specializate sau in institute de invatamnt superior. Realizatorul programului va incerca sa determine schimbarea in atitudinea cursantilor prin utilizarea metodelor de simulare, prin interpretarea de catre cursanti a unor roluri, prin studii de caz sau jocuri de intreprindere. La elaborarea proiectului programului de pregatire profesionala este necesar sa participe diferite compartimente, in functie de specificul activitatii lor. Se vor stabili metodele de invatare, mijloacele de predare, continutul, locul de predare si alte aspecte necesare. Orice combinatie a acestor elemente poate constitui un model de perfectionare profesionala. Fiecare model are o serie de avantaje si de dezavantaje de care se va tine seama in alegerea finala. Capacitatea de invatare este influentata de o serie de calitati (cunostinte, nivel general de inteligenta, aptitudini specifice, sanatate, vrsta, oboseala, motivatie) ale celor care se instruiesc. Oamenii invata in diferite moduri. Instructorul va tine seama de conditiile concrete in care se face instruirea. Sunt cazuri in care ritmul de asimilare este mai mare la inceput si apoi incetineste. Daca se asimileaza cunostinte noi, ritmul va fi mai lent la inceput si mai rapid dupa acumularea unui anumit nivel de cunostinte. In elaborarea unui program de pregatire profesionala se va tine seama de numarul orelor si de lungimea cursului, de nivelul de pornire si de sistemul de apreciere a rezultatelor. Diversitatea cerintelor de pregatire profesionala a salariatilor duce la existenta unui mare numar de metode de pregatire profesionala:a) Pregatirea profesionala la locul de munca, realizata prin instruire, ucenicie sau prin pregatirea de laborator. Instruirea la locul de munca permite formarea dexteritatilor practice specifice fiecarui post si se realizeaza prin instructaje efectuate de anumite persoane. Pregatirea prin ucenicie la locul de munca permite combinarea pregatirii teoretice cu cea practica, fiind utilizata, in mod frecvent, in cazul persoanelor care desfasoara activitati mestesugaresti. Pregatirea de laborator - unele activitati de pregatire pun accentul pe instructia emotionala si pe formarea unui anumit comportament. Prin aceasta metoda se studiaza evolutia comportamentului in cursul procesului de invatare, rezultatele obtinute la un moment dat fiind considerate drept punct de plecare pentru pregatirea ulterioara. b) Pregatirea profesionala in scopul indeplinirii responsabilitatilor functiei. Pentru angajatii care lucreaza in cadrul unor compartimente si chiar pentru manageri se pot folosi o serie de metode care constau in participarea angajatilor la rezolvarea unor probleme profesionale importante. Participarea, in grup, la elaborarea de proiecte, lucrari si studii are drept scop confruntarea cursantilor cu probleme reale, nemaiintlnite de ei pna atunci. In felul acesta, au posibilitatea sa propuna solutii, sa elaboreze variante, sa aleaga solutia optima si sa o aplice in practica. In acest caz, unul dintre obiectivele urmarite este de a invata cum s-ar putea aborda, in viitor, problemele similare. Delegarea sarcinilor. Primind de la seful ierarhic unele responsabilitati, un salariat isi poate insusi noi deprinderi si cunostinte profesionale. Cel care deleaga trebuie sa-i explice si sa-i demonstreze subalternului diferitele situatii cu care s-ar putea confrunta. In cazul folosirii acestei metode, sefii ierarhici trebuie sa constituie exemple de urmat att in ceea ce priveste metodele si stilul de munca, ct si personalitatea. Inlocuirea temporara a sefului ierarhic se foloseste pentru pregatirea profesionala a managerilor. Un manager poate fi inlocuit de un subaltern pe o anumita perioada, in mod voit sau fortuit. In acest caz, subordonatul ramne singur. Nemaiavnd pe cine sa intrebe, el va fi obligat sa ia singur decizii, sa studieze acte normative, lucrari de specialitate, experienta altor manageri de pe posturi similare. Avantajul consta in puternica implicare a cursantului (subordonatului) si in cunoasterea reactiilor proprii.
11
GMB Computers
CONSTANA
c) Rotatia pe posturi presupune trecerea unei persoane pe un alt post, din acelasi compartiment sau din compartimente diferite. Aceasta rotatie permite stabilirea evolutiei posibile a salariatului si identificarea postului in care performantele sale ar putea fi maxime. Metoda este utila si pentru pregatirea managerilor. d) Participarea la grupe eterogene de munca ofera posibilitatea celor care doresc sa-si imbunatateasca pregatirea profesionala sa invete de la ceilalti participanti, prin cunoasterea opiniilor si solutiilor lor. In acelasi timp, ei pot sa-si puna in valoare propriile competente. e) Participarea ca instructor la programe de pregatire. Alaturi de cadrele didactice, care au sarcini bine precizate in procesul de perfectionare profesionala, la aceasta activitate pot participa si alti specialisti, in calitate de instructori. Acestia, orict de bine ar fi pregatiti, au nevoie sa-si actualizeze pregatirea si sa-si insuseasca noi cunostinte. In felul acesta instructorii pot sa-si autodetermine cerintele de perfectionare. f) Participarea la sedinte, considernd sedinta ca o activitate in echipa, in cadrul careia au loc schimburi de informatii, de idei si opinii asupra modului de solutionare a problemelor. Participantii au astfel posibilitatea sa cunoasca si alte domenii dect cele cu care se confrunta in mod curent. Ei isi pot forma o imagine mai completa despre firma si despre problemele cu care aceasta se confrunta. La o regie autonoma locala exista o multitudine de programe de dezvoltare a personalului, dintre care unul, foarte bine pus la punct si cu o eficienta ridicata, are ca scop final introducerea unui sistem de management al resurselor umane bazat pe gestiunea competentelor. Ideea conceperii unui astfel de program a venit chiar de la psihologul regiei, care are o imagine de ansamblu a asteptarilor si aptitudinilor salariatilor, furniznd o informatie de calitate de care se tine seama in managementul resurselor umane. Obiectivele acestui program constau in: - crearea unor modele standard de competente pentru diferite familii de posturi; - introducerea unui sistem informatizat de gestiune a competentelor; - dezvoltarea competentelor manageriale.
Comunicarea interactiv la locul de munc

Comunicare reprezint ntiinare, tire, veste, raport, relaie, legatur. Cam acestea ar fi sinonimele care ne sunt oferite de catre dictionarul explivativ pentru comunicare. Dei pare simplu nelesul comunicarii este mult mai complex i plin de substrat. Comunicarea are o mulime de nelesuri, o mulime de scopuri i cam tot attea metode de exprimare i manifestare. Nu exist o definiie concret a comunicrii ns se poate spune cel puin c, comunicarea nseamn transmiterea intenionat a datelor, a informaiei. Ce se nelege prin comunicare: o provocare constant pentru psihologia social; o activitate; satisfacerea nevoile personale; legtura ntre oameni, etc. Societatea continua sa existe prin transmitere, prin comunicare, dar este corect sa spunem ca ea exista in transmitere si in comunicare. Este mai mult decat o legatura verbala intre cuvinte precum comun, comunitate, comunicare. Oamenii traiesc in comunitate in virtutea lucrurilor pe care le au in comun; iar comunicarea este modalitatea prin care ei ajung sa deina in comun aceste lucruri. Pentru a forma o comunitate sau o societate , ei trebuie sa aib in comun scopuri, convingeri aspiraii, cunostine - o intelegere comuna - "acelai spirit" cum spun sociologii. Comunicarea este cea care asigura dispoziii emoionale si intelectuale asemanatoare, moduri similare de a raspunde la ateptri i cerine.
12
GMB Computers
CONSTANA
Niveluri de comunicare
1. Logic 2. Paraverbal 3. Nonverbal Dintre acestea, nivelul logic (deci cel al cuvintelor) reprezinta doar 7% din totalul actului de comunicare; 38% are loc la nivel paraverbal (ton, volum, viteza de rostire...) si 55% la nivelul nonverbal (expresia faciala, pozitia, miscarea, imbracamintea etc.). Daca intre aceste niveluri nu sunt contradicii, comunicarea poate fi eficace. Daca insa intre niveluri exista contradicii, mesajul transmis nu va avea efectul scontat.
Tipuri de comunicare
Comunicarea intrapersonala . Este comunicarea n i catre sine. Comunicarea interpersonala. Este comunicarea ntre oameni. Comunicarea de grup. Este comunicarea ntre membrii grupurilor si comunicarea dintre oamenii din grupuri cu ali oamenii. Comunicarea de masa. Este comunicarea primit de sau folosita de un numar mare de oameni.
Scopul comunicrii:
sa atenionam pe alii. sa informam pe alii. sa explicam ceva. sa distram. sa descriem. sa convingem, etc. Pentru a descrie numeroasele nelesuri ale comunicarii pe care o folosim si o traim zilnic, folosim urmatorii trei termeni: a. Forma comunicarii Este un mod al comunicarii asa cum sunt vorbirea, scrierea sau desenul. Aceste forme sunt distincte si separate una de alta asa de mult, nct au sistemul lor propriu pentru transmiterea mesajelor. Astfel, cnd semnele sunt facute pe foaia de hrtie potrivit anumitor reguli (cum sunt cele ale gramaticii si ortografiei), atunci noi cream cuvinte si "forma" scrierii. b. Mediul comunicarii Este un mijloc al comunicarii care combina mai multe forme. Un mediu adesea poate implica utilizarea tehnologiei asa ca acesta este dincolo de controlul nostru. Spre exemplu, o carte este un mediu care foloseste forme ale comunicarii precum sunt cuvintele, imaginile si desenele. c. Media Sunt acele mijloace de comunicare n masa care s-au constituit ntr-un grup propriu. Exemple binecunoscute sunt radioul, televiziunea, cinematograful, ziarele si revistele. Toate acestea sunt distincte si prin modul prin care pot include un numar de forme de comunicare. Spre exemplu, televiziunea ofera cuvinte, imagini si muzica. Adesea termenul mass-media identifica acele mijloace ale comunicarii bazate pe tehnologie care fac o punte ntre cel care comunica si cel care recepteaza.
13
GMB Computers
CONSTANA
Limbajul
este codul cu care este transmis informatia, reprezint unealta comunicrii. n prima categorie intr limbajul. Limbajul reprezint codul comunicrii,este liantul ntre cel ce transmite informaia ,emintor, i cel ce primete informaia, receptor. Limbajul determina forma comunicarii. El este de trei feluri: Limbaj scris. Limbaj verbal. Limbaj nonverbal Judecata, sinele si societatea nu sunt structuri discrete, ci procese de interactiune personala si interpersonala. Interactiunea simbolica subliniaza importanta limbajului, ca mecanism fundamental in devenirea sinelui si judecatii. Personalitatea este ceea ce este propriu, caracteristic fiecarei persoane i o distinge ca individualitate; felul propriu de a fi al cuiva. Comunicarea are o foarte mare influen asupra personalitaii deoarece in ziua de azi individul se defineste in functie de ceilali iar comportamentul reprezinta o constructie a persoanei in interactiunea cu ceilalti. Interaiune atrage concomitent comunicare. Sinele se construieste in interactiune cu ceilalti. In felul acesta, definirea unei situatii nu este niciodata strict individuala, desi apare astfel; in acelasi timp, nici individul nu este doar o oglinda a celorlalti, ci introduce note personale in orice evaluare si raspuns. Cu cat se comunica mai mult cu atat cresc sansele de a se crea personalitati puternice. Comunicarea este cheia individului spre societate i integrarea n aceasta. Lipsa comunicarii atrage o indepartare iminenta faa de grup, echipa, societate, etc. Daca luam n discutie termenul de grup observam caci, chiar societatea din care facem parte este un grup. Grupul nseamna reguli, reputaie, el, munca n echip, etc . Sensuri determinate de interanctiune deci de comunicare. Atata timp cat exista o buna comunicare exist i un randament maxim, ns dac aceasta lipsete se poate ajunge la disensiuni sau, chiar mai ru. Functionarea unui grup mai mare se bazeaza pe reteaua care conecteaza diferite parti ale sale si-i asigura coerenta. Nuanta pe care o introduce Blumer ar putea chiar surprinde: "O retea sau o institutie nu functioneaza in mod automat datorita unei dinamici interioare sau unui sistem de cerinte: ea functioneaza pentru ca persoanele aflate in diferite puncte fac ceva, iar ceea ce fac este rezultatul modului cum definesc situatia in care sunt chemate sa actioneze" Arta de a comunica nu este un proces natural ori o abilitate cu care ne nastem. Noi nvatam sa comunicam. De aceea trebuie sa studiem ce nvatam ca sa putem folosi cunostintele noastre mai eficient. Orice comunicare implica creatie si schimb de ntelesuri. Aceste ntelesuri sunt reprezentate prin "semne" si "coduri". Se pare ca oamenii au o adevarata nevoie sa "citeasca" ntelesul tuturor actiunilor umane. Observarea si ntelegerea acestui proces poate sa ne faca sa fim mai constienti referitor la ce se ntmpla cnd comunicam. Este o alta lectura a comunicarii si semnificatiei sale legata de data aceasta de procese sociale de adancime, cum ar fi conservarea identitatii si coeziunii, exercitarea functiei vitale de integrare sociala, de mentinere si consolidare a unui humus psihologic comun. In nici una dintre ipostazele sale majore, societatea (comunitatea umana) nu poate exista fara comuni-care: nici in cea de dobandire a unei experiente comune (care presupune dialog), nici in cea de transmitere a zestrei culturale, nici in construirea acor-dului asupra unor probleme si dezlegari. comunicarea semnifica mult mai mult decat schimbul si raspandirea de informatii; comunicarea creaza si mentinea societatea.
14
GMB Computers
CONSTANA
Lucrul n echip
Lucrul in echipa este mijlocul prin care oamenii obisnuiti obtin rezultate neobisnuite.
Ce este munca in echipa?

Munca in echipa este o componenta care se regaseste in specificatiile fiecarui post disponibil intr-o companie si specialistul in recrutare analizeaza aceasta componenta pe parcursul procesului de selectie, utilizand diferite mijloace de utilizare: intrebari specifice care evalueaza capacitatea de interrelationare personala si de intelegere a nevoilor persoanei cu care interactioneaza. Prezenta calitatilor necesare pentru a putea fi un bun membru de echipa sau din contra,lipsa lor, pot fi factori decisivi in angajarea unei persoane ori in mentinerea ei intr-o organizatie. Necesitatea muncii in echipa a devenit tot mai evident ape masura ce companiile au inceput sa tina cont de nevoia de comunicare si contact uman a propriilor angajati, constientizand valoarea motivationala superioara a dialogului si sustinerii reciproce, intr-o echipa.
Cateva tehnici de baza pentru lucrul in echipa

Lucrul in echipa reprezinta structura fundamentala de interactiune pentru indivizii din orice organizatie, mare sau mica. Lucrul intr-o echipa poate insemna sa lucrezi cu un grup de oameni care stau in aceeasi incapere cu tine, sa lucrezi cu un grup de oameni dintr-un birou diferit sau chiar dintr-o tara diferita. Daca un grup de oameni lucreaza impreuna pentru un obiectiv comun si daca lucreaza impreuna la aceeasi sarcina, atunci acestia sunt o echipa indiferent de pozitia lor geografica. Asa ca de ce este important pentru organizatii sa incurajeze munca eficienta in echipa? Cel mai usor mod de a raspunde la aceasta intrebare este sa folosim o analogie cu lumea sporturilor. Lucrand eficient impreuna o echipa sportiva poate reusi lucruri pe care altii nu le pot realiza. De ce? Nu pentru ca au cei mai buni performeri individuali, ci pentru ca lucreaza eficient impreuna pentru acelasi scop. Ramanand la analogia din sport, o echipa sportiva este alcatuita dintr-un grup de indivizi cu competente complementare. Repetam, echipa poate lucra eficient numai daca toti membri recunosc punctele forte si competentele celorlalti pentru a maximiza potentialul echipei. Exemplu : Lucrezi pentru o firma care livreaza pizza la domiciliu. Sunteti recunoscuti pe plan local pentru cea mai buna pizza din oras, care este livrata intotdeauna cu cele mai bune servicii pentruclienti. Secretul succesului vostru este ca aveti un bucatar creativ care vine intotdeauna cu idei noi de topping-uri pentru aluatul sau preparat pe baza unei retete secrete, un manager care este foarte bun la negocierea reducerilor din partea furnizorilor, o persoana care face livrari si care cunoaste toate scurtaturile din oras (astfel ca pizza este livrata intotdeauna repede) si pe tine impreuna cu inca un coleg, care raspundeti la telefoane si intretineti o relatie foarte buna cu clientii. Firma are un program de servicii potrivit pentru toata lumea: Cea mai buna alegere, cel mai bun pret si cele mai bune servicii din oras! si cu totii lucrati pentru atingerea acestui obiectiv. In multe cazuri, echipa in care lucrati va fi recrutata si preselectata de un manager sau sef de echipa. Este posibil ca acestia sa fie si cei care stabilesc obiectivele generale ale unei activitati. Cu toate acestea, pentru a fi siguri ca toata lumea lucreaza pentru acelasi scop, este important ca toti membri echipei sa aiba ocazia sa isi impartaseasca ideile si sa planifice cum va fi atins scopul respectiv. In acest fel se vor simti proprietarii activitatii si vor fi mai dornici ca aceasta sa fie dusa la capat cu succes. Desi recunoasterea capacitatilor si punctelor forte ale celorlalti este importanta, o echipa eficienta va oferi posibilitatea si ca indivizii sa isi dezvolte competente noi. Intr-adevar, un indicator important al unei echipe puternice este reprezentat de situatia in care membriiechipei se
15
GMB Computers
CONSTANA
instruiesc reciproc pentru a dezvolta competente in domenii noi, permitandu-le prinurmare sa fie mai flexibili in modul in care isi impart sarcinile intre ei. Este dificil sa imbunatatesti eficienta unei echipe daca nu este toata lumea implicata in trecerea in revista periodica a progresului lor, identificarea aspectelor pozitive si a celor care ar putea fi realizate diferit sau mai bine. Atat procesele, cat si relatiile dintr-o echipa pot avea un impact semnificativ asupra succesului acesteia. Tratarea relatiilor in special poate fi o problema delicata si trebuie efectuata intr-un mod corespunzator, astfel incat feedbackul sa fie obiectiv, constructiv si sa se adreseze comportamentului fiecarui individ, care de fapt este schimbator. In concluzie, lucrul intr-o echipa nu inseamna ca relatiile vor fi intotdeauna armonioase. Dupa cum am spus, rareori se va intampla sa detineti controlul absolut asupra celor care sunt in echipa voastra si pe parcurs pot interveni conflicte intre personalitati. Conflictul in cadrul unei echipe este privit de experti ca o etapa naturala in progresul catre construirea unei echipe cu adevarat performante. Conflictele apar atunci cand indivizii dintr-o echipa se simt in stare sa isi exprime adevaratele ganduri si sentimente si prin urmare sunt date la iveala diferente de opinie si principii. Recunoasterea si tratarea acestei situatii este esentiala pentru progresul echipei si de multe ori in aceasta etapa se manifesta adevaratele zone de dezvoltare a indivizilor, iar membri echipei pot vorbi deschis si liber intre ei.
Recomandari
Asigurati-va ca toata lumea intelege clar sarcina de la inceput si ca urmareste acelasi obiectiv. Valorificati ideile intregii echipe referitoare la modul in care veti atinge obiectivul. Justificati-va propriile idei si respectati opinia celorlalti. Ajungeti la un consens referitor la modul in care va fi organizata munca pentru atingerea obiectivului. Oferiti asistenta celorlalti si solicitati ajutor daca aveti nevoie. Indepliniti sarcina si pastrati-va reciproc la curent cu progresul acesteia. Comportamentele care demonstreaza aceasta competenta - Manifesti interes pentru stabilirea contactelor cu colegii. - Interactionezi in mod eficient cu angajatii in diferite situatii - Intelegi rolul fiecarei persoane in grup - Te focalizezi pe atingerea obiectivelor - Respecti drepturile si convingerile altora - Asculti si intelegi nevoile si sentimentele celor din jur - Apreciezi si recunosti participarea activa la realizarea unei actiuni, incurajezi discutiile deschise, impartasesti idei si sugestii cu colegii Cum dezvolti lucrul in echipa in timpul facultatii ?
Invata din proiecte

Participa la scoli de vara, evenimente, conferinte organizate de facultate, asociatii studentesti. Cauta sa inveti din fiecare experienta de grup. Analizeaza si evalueaza impreuna cu coordonatorul de echipa/profesorul gradului tau de implicare in echipa, reflecteaza asupra a ceea ce ai facut, cum ai facut si de ce ai facut.
Dezvolta-te progresiv
Constientizeaza ce ai dobandit, accepta noi provocari si responsabilizari ca sa-ti permita sa-ti imbunatatesti activitatiile prin forte proprii daca ai inceput ca un simplu membru intr-o echipa de proiect, incearca sa tintesti ca la urmatoarea oportunitate sa detii un rol care sa includa si coordonarea altora din jurul tau. Proiectele pot fi de la cele foarte simple legate de scoala pana la a organiza evenimente in universitate sau pentru cercul tau de prieteni.
16
GMB Computers
CONSTANA
Experienta de lucru in echipa se construieste mai ales prin experiente in care oferi mai mult sprijin celor din echipa decat astepti ca ei sa-ti acorde tie. Cum dezvolti lucrul in echipa dupa angajare ?
Implica-te !
Participa activ in cadrul echipei, schimba informatii, asculta si intelege punctele de vedere ale celorlati membrii ai echipei. Incearca sa dezvolti idei noi pe baza celor spuse de ceilalti. Evita-l pe nu asa, stiu eu o alta metoda
Solicita feedback permanent !

Incearca sa te raportezi la parerea celor din jur. Asta nu inseamna ca trebuie sa te faci placut cu orice pret dar este important sa afli ce gandesc colegii tai despre actiunile tale. Impartaseste sugestiile si ideile celorlalti, manifesta flexibilitate in exprimarea punctelor de vedere diferite ale membrilor echipei.
Evalueaza-te
Analizeaza activitatea desfasurata in cadrul echipei :cum te-ai simtit, care a fost contributia in cadrul echipei? Daca ai avut parte de rezultate foarte bune, care au fost factorii de succes. Daca ai esuat in alte aspecte, care a fost cauza. Cu lectiile invatate intra in urmatoarea interactiune cu cei din jur mai pregatit sa contribui si sa-i ajuti sa obtina rezulate si mai bune. Surprinzator, si rezultatele tale vor creste pe masura.
Avantajele muncii in echipa

- primele, si cele mai evidente, sunt cele legate de climatul afectiv pozitiv care se presupune a se constitui in echipa.Membrii unei echipe ajung sa se cunoasca foarte bine, conlucrand la depasirea dificultatilor curente. - lucrul in echipa poate fi extreme de motivant deoarece fiecare proiect adduce cu sine experienta contactului cu ceilalti si bucuria de a beneficia de sprijinul acestora. Astfel daca legaturile intre angajati ajung sa fie puternice, confortul afectiv paote suplini si compensa alte lipsuri, inclusive salarizarea. Iata de ce, lucrul in echipa este adesea folosit ca mijloc de combatere si diminuare a rutinei zilnice. Nu salariul se constituie cel mai important factor de motivare, ci continutul muncii, natura sarcinilor curente si modul in care aceasta activitate, prestata 8-10 ore in fiecare zi, corespunde cel mai bine necesitatilor intrene de crestere si dezvoltare. Ce inseamna o munca rutinata: este o munca ce nu aduce nimic nou in planul solicitarilor cognitive. Oamenii simt ca se pot detasa si ca pot aplica acelasi tipar in fiecare zi. La un moment dat chiar, anumite activitati pot fi effectuate cu jumatate de atentie, ceea ce lasa timp pentru meditatie si pentru intarirea convingerii ca nu mai este nimic de invatat si deci, ca este timpul unei schimbari. Capacitatea de lucru in echipa A fi eficient intr-o echipa inseamna a fi capabil de a lucra si contribui la atingerea unui set de scopuri si obiective ale echipei. Recunoaste cum competentele si punctele forte ale celorlalti contribuie la cladirea unei echipe eficiente. Demonstreaza initiativa si contribui la obtinerea rezultatelor. Manifesta promptitudine in ajutarea celorlalti membri ai echipei sa gaseasca solutii si sa obtina rezultate. Accepta si ofera feedback intr-un mod constructiv si sensibil. ntelege rolul greselilor si al conflictelor in promovarea dezvoltarii echipei.
17
GMB Computers
CONSTANA
Norme generale cu privire la NPM, PSI si calitate in utilizarea echipamentelor si dispozitivelor
Aplicarea procedurilor de calitate

1. Aplic procedurile de calitate 1.1. Activitile sunt desfurate cu respectarea riguroas a cerinelor de calitate. 1.2. Realizarea exigenelor de calitate se face cu aplicarea tipurilor de aciuni preventive i corective adecvate. 2. Verific rezultatele i remediaz neconformitile 2.1. Deficienele de calitate sunt constatate prin comparaie cu cerinele de calitate. 2.2. Deficienele de calitate identificate sunt raportate persoanelor n msur s stabileasc modul de remediere a acestora. 2.3. Eventualele deficiene constatate sunt remediate cu operativitate, n conformitate cu procedurile interne.
Aplicarea normelor de tehnic a securitii muncii i a prevederilor pentru stingerea incendiilor

Scop
Prezentele instructiuni cuprind un set de prevederi minime si obligatorii privind securitatea si sanatatea in munca a vizitatorilor. Prin aplicarea si respectarea prevederilor din continut, se urmareste eliminarea riscurilor de accidentare a vizitatorilor pe parcursul vizitei efectuate.
Domeniu de aplicare
Instructiunile de lucru se aplica persoanelor care viziteaza societatea, inclusiv persoanelor care efectueaza cursuri in cadrul firmei, la Centrul de Instrire in Informatica Dobrogea.
Definitii si prescurtari
Pentru scopurile acestor instructiuni se aplica termenii si definitiile conform art. 5 din Legea 319/2006. Lucrator: persoana angajata de catre angajator, care isi desfasoara activitatea intr-un loc de munca si care duce la indeplinire o sarcina de munca, cu exceptia persoanelor care presteaza activitati casnice. Loc de munca: locul destinat sa cuprinda posturi de lucru, situat in cladirile sau sectiile societatii, inclusiv orice alt loc din aria societatii la care lucratorul are acces in cadrul desfasurarii activitatii. Echipament individual de protectie (EIP): orice echipament destinat sa fie purtat sau manuit de un lucrator pentru a-l proteja impotriva unuia sau mai multor riscuri care ar putea sa-i puna in pericol securitatea si sanatatea la locul de munca, precum si orice supliment sau accesoriu proiectat pentru indeplinirea acestui obiectiv. Alte definitii:
18
GMB Computers
CONSTANA
Cursant: persoana care efectueaza un stagiu de pregatire la CIID Constanta. Formator: persoana care desfasoara activitatea de predare a cursului.
Documente de referinta
4.1 Legea 319/2006 a Securitatii si Sanatatii in Munca. 4.2 Norme Metodologice de aplicare a Legii 319/2006 a Securitatii si Sanatatii in Munca. 4.3 Legislatia de circulatie pe drumurile publice in domeniu si Codul Rutier actual. 4.4 Regulamentul de ordine interioara al S.C GMB COMPUTERS S.R.L.
Instructiuni pentru vizitatorii punctelor de lucru

a. Itinerariul pentru vizitatori este caracterizat prin conditii de lucru normale, mai putin pentru vizitele la locurile de munca unde pot aparea variatii de temperatura sau intemperii. b. Vizitatorii au obligatia sa respecte regulamentul intern al societatii. c. Vizitele efectuate de persoanele straine unitatii se executa astfel: la/in sediul unitatii se executa pe baza de ecuson (nu prezinta riscuri majore); in spatiile si la instalatiile tehnologice - se executa cu insotitor din personalul societatii; in punctele de lucru - se executa instructajul privind securitatea si sanatatea muncii si apararea impotriva incendiilor de catre conducatorul locului de munca, iar vizitatorii vor fi insotiti pe parcusul deplasarii de o persoana competenta. d. Se vor asigura indicatoare de securitate. e. Echipamentele electrice in zona vizitata vor fi in perfecta stare de functionare, fara improvizatii. f. Zona de lucru vizitata va fi in perfecta ordine si curatenie, pentru a evita alunecarile, lovirile sau caderile. g.Vizitatorul de deplaseaza numai pe caile de circulatie indicate de catre insotitor. h. Este interzis fumatul in spatiile societatii pe tot parcursul vizitei, in afara locurilor de fumat special amenajate si dotate cu scrumirere si stingatoare. i.Vizitatorul va respecta ordinea si disciplina impuse, in caz contrar va parasi societatea. j.Vizitatorul este obligat sa ia la cunostinta prevederile prezentei instructiuni si sa semneze de luare la cunostinta in Procesul Verbal de instruire.
Masuri de prevenire in caz de incendii

Fumatul este interzis in incinta societatii. Nu se vor depozita substante inflamabile sau combustibile langa surse de caldura. Este interzisa utilizarea mijloacelor de stingere a incendiilor in alte scopuri. Nu se va suprasolicita instalatia electrica prin introducerea in priza a mai multi consumatori decat poate suporta aceasta.Pericol de scurtcircuit.
Masuri de supravietuire in caz de incendiu

Filtrati aerul respirat printr-o batista sau articol de vestimentatie. Daca sunteti obligat sa treceti printr-o perdea de foc, acoperiti-va fata si parul cu un articol de vestimentatie, eventual umezit si parcurgeti zona in viteza.
19
GMB Computers
CONSTANA
Daca va iau foc hainele, nu alergati si nu va dezbrati, asezati-va pe sol si va rostogoliti. Evacuarea se face in ordine, fara a crea panica. Este indicat ca persoanele aflate la parter sa paraseasca incaperea pe fereastra, lasandu-i pe cei de la etajele superioare sa parareasca cladirea pe iesirea principala. In cazul existentei fumului toxic, deplasarea se va face cat mai aproape de de sol (aplecat,in genunchi sau pe coate). In partea de jos este mai rece,este aer respirabil si exista vizibilitate. Nu va intoarceti in cladire dupa lucruri personale. Acordati primul ajutor atat cat este rational posibil persoanelor accidentate sau panicate fara sa va expuneti unui pericol prea mare.
Masuri de interventie in caz de incendiu

Prioritar in caz unei situatii de urgenta este salvarea persoanei proprii precum si a celorlalte persoane aflate in cladire. Alarmati personalul angajat precum si pe cel al imobilelor din vecinatate. Daca incendiul ia amploare si nu poate fi stins cu mijloace proprii, anuntati Inspectoratul pentru Situatii de Urgenta la tel.112. Apelul ete gratuit, numarul in orice retea de telefonie si in intreaga Uniune Europeana,telefonul mobil functioneaza cu tastele blocate,in zone fara acoperire si fara credit. Decuplati alimentarea cu energie electrica si alte fluide energetice ( gaz metan, oxigen). Interveniti cu mijloace de stingere din dotare hidranti,stingatoare pentru incendiu,nisip,apa.
Masuri de securitate la utilizarea echipamentelor de calcul

Cursantii care desfoar activiti de utilizare a echipamentelor de calcul vor respecta urmtoarele: Se interzice personalului de deservire a echipamentelor de calcul s intervin la tablouri electrice, prize, techere, cordoane de alimentare, grupuri stabilizatoare sau la orice alte instalaii auxiliare specifice. Se interzice efectuarea oricrei intervenii n timpul funcionarii echipamentului de calcul. Se interzice conectarea echipamentelor de calcul la prize defecte sau fr legtura la pmnt. Se interzice fumatul n ncperile cu volum mare de documente. Utilizatorii echipamentelor de calcul prevzute cu ecran de vizualizare trebuie s cunoasc necesitatea i posibilitile de reglare a mobilierului de lucru. Reglrile se vor efectua n raport cu cerinele sarcinii de munca, condiiilor de mediu i cu caracteristicile antropofuncionale i psihofiziologice individuale. Se vor regla n principal: luminana ecranului, contrastul intre caractere i font, poziia ecranului (nlime, orientare, nclinare ); nlimea i nclinarea suportului pentru documente; nlimea mesei de lucru ( daca este reglabila); nlimea suprafeei de edere a scaunului, nclinarea i nlimea sptarului scaunului. n cazul n care, la controlul oftalmologic, se constat c nu pot fi utilizai ochelari de corecie obinuii, lucratorii vor fi dotai cu mijloace de corecie speciale. n timpul lucrului la videoterminale, se va evita purtarea ochelarilor colorai.
20
GMB Computers
CONSTANA
Este obligatorie instruirea n utilizarea echipamentului de calcul nainte de nceperea activitii i ori de cte ori se modifica organizarea sau dotarea locului de munc. Se interzice utilizarea echipamentului de calcul pentru care nu s-a fcut instruirea necesar. Utilizatorul trebuie s cunoasc componentele i echipamentele periferice ale echipamentului la care i va desfura activitatea, precum i modul de deconectare al echipamentelor n cazul apariiei unor avarii. Punerea n funciune a unui echipament dup revizii sau reparaii se va face numai dup ce personalul autorizat s efectueze revizia sau reparaia confirma n scris c echipamentul respectiv este n bun stare de funcionare. Conductorul locului de munc va planifica i organiza activitile de prelucrare automat a datelor astfel nct activitatea zilnic n faa ecranului s alterneze cu alte activiti. n cazul n care alternarea activitilor nu este posibil, iar sarcina de munc impune utilizarea ecranelor n cea mai mare parte a timpului de lucru, se vor acorda pauze suplimentare fa de cele obinuite. Durata i periodicitatea pauzelor suplimentare se vor reglementa prin instruciuni proprii, cu consultarea unor instituii specializate sau specialiti, n funcie de modul de organizare a activitii i de caracteristicile sarcinii de munc (complexitate, ritm, durat, repetitivitate etc.) i vor fi incluse n timpul de lucru. Timpul de ateptare a rspunsului calculatorului nu va fi considerat ca pauz n activitatea lucrtorilor. Amenajarea locului de munc trebuie astfel realizat nct s ofere utilizatorilor confort i libertate de micare i s diminueze n msur maxim posibil riscurile de natur vizual, mental i postural. Posturile de munc trebuie concepute i amenajate astfel nct s permit unor persoane diferite s realizeze o gam divers de sarcini de munc, ntr-un mod confortabil i eficace, la nivelul de performane cerut. Amenajarea posturilor de munc trebuie s permit adaptarea acestora la schimbri de cerine i situaii. Locul de munc trebuie s permit o bun corelare ntre caracteristicile antropofuncionale ale utilizatorilor i munca lor prin asigurarea posibilitilor de reglare a diferitelor elemente componente ale acestuia, (fig. l)
Fig. 1 - Posibiliti de reglare a diferitelor elemente ale postului de munc la videoterminal Utilizatorii trebuie s aib posibiliti de modificare a poziiei de lucru, n timpul activitii. Dac utilizatorii se deplaseaz de ia un punct de lucru ia altul, este indicat s se prevad elemente de prindere sub planul de lucru, pentru a uura micarea (de ex. o canelur sub birou cu adncime suficient pentru prindere).
21
GMB Computers
CONSTANA
Distanele i unghiurile de vedere trebuie s fie in raport cu cerinele sarcinii de munc i n conformitate cu poziia de lucru standard, (fig.2).
Fig 2.-Poziie de lucru standard a- aezat b- ortostatism Pentru a pstra o poziie de lucru confortabil i pentru a evita reflexiile i efectul de orbire, utilizatorul trebuie s ncline, s basculeze sau s roteasc ecranul, oricare ar fi nlimea ochilor deasupra planului de lucru. Inlimea optim a centrului ecranului trebuie s corespund unei direcii de privire nclinate ntre 10 i 20 sub planul orizontal care trece la nivelul ochilor. nlimea tastaturii trebuie s asigure n timpul utilizrii mi unghi ntre bra i antebra de minimum 90. n poziie aezat, distana dintre planul de lucru i suprafaa de edere trebuie s fie cuprins ntre 200 i 260 mm. Ecranul, suportul de documente i tastatura trebuie amplasate la distane aproximativ egale fa de ochii utilizatorului, respectiv 600 150 mm. Videoterminalele vor fi astfel amplasate nct direcia de privire s fie paralel cu sursele de lumin (natural i artificial). Posturile de munc la videoterminale vor fi amplasate ntre irurile de corpuri de iluminat din ncperea de lucru. Videoterminalele vor fi amplasate la distan fa de ferestre. n cazul n care videoterminalele sunt amplasate n ncperi n care se desfoar i alte activiti, n apropierea ferestrelor vor fi amplasate posturile de luciu ce nu necesit activitate la ecran. Suprafeele vitrate nu trebuie s fie situate n faa sau n spatele utilizatorului. Se va evita, pe ct posibil, amplasarea videoterminalelor n ncperi cu suprafee vitrate de mari dimensiuni. Dac acest lucru nu este posibil, n cazul ncperilor mari, cu suprafee vitrate importante, dispuse pe mai muli perei, se vor lua msuri adecvate pentru mascarea zonelor cu luminan ridicat (perei mobili, storuri cu lamele orizontale sau verticale la ferestre etc). Pentru asigurarea cerinelor de securitate i stabilitate, la locul de munc trebuie: S se reduc la minimum vibraiile inerente sau transmise; S se elimine posibilitatea basculrii planului de lucru; S fie posibil reglarea nlimii mesei fr risc de coborre brusc i deci, de rnire; S nu se utilizeze obiecte improvizate pentru fixarea echipamentului de calcul. Amenajarea posturilor de munc ntr-o ncpere trebuie realizat astfel nct s se asigure: Accesul uor i rapid al utilizatorilor la locul lor de munc; Accesul uor i rapid al personalului de ntreinere la toate prile echipamentului, la poziiile cablurilor i la prizele electrice, fr ntreruperea activitii n desfurare sau cu o ntrerupere minim;
22
GMB Computers
CONSTANA
Un spaiu de lucru care s rspund nevoilor de spaiu personal, de comunicare ntre indivizi i de intimitate. Conductorii electrici i cablurile trebuie s respecte urmtoarele condiii: S nu prezinte risc de electrocutare la trecerea pe planul de lucru sau pe sol; S aib o lungime suficient pentru a se adapta la nevoile reale i previzibile ale utilizatorilor, inclusiv n cazul unei reamenajri a ncperii; S asigure accesul uor iar ntreinerea s se efectueze fr ntreruperea activitii; Cablajul trebuie s corespund ntregului domeniu de reglare a planurilor de lucru. Conductorii electrici nu vor traversa cile de acces fr a fi protejai mpotriva deteriorrilor mecanice.
Reguli de ergonomie in utilizarea calculatorui In aceasta categorie sunt cuprinse acele elemente care duc la crearea unui mediu sanatos de lucru, si anume: Pastrarea unei distante optime fata de monitor, pentru a evita afectarea ochilor, utilizarea ecranelor de protectie; Pozitionarea adecvata a monitorului, mouse-ului si tastaturii; Utilizarea unor scaune reglabile; Distanta adecvata pentru genunchi si coapse de la birou sau terminal; Tastatura ergonomica cu un design ce permite o pozitionare corecta a mainilor; Luminozitate si aerisire buna a incaperii; Pauze de 10 minute dupa fiecare 50 de minute in fata calculatorului.
Probleme de sanatate
Folosirea calculatorului necesita realizarea unor miscari stereotipe (miscari dese ale gatului, coatelor), ce pot duce la anumite afectiuni ale gatului, umerilor, coloanei vertebrale, etc. Aceste afectiuni se datoreaza miscarilor repetate, concept ce se numeste RSI (Repetitive Strain Injury - Accidentare cauzata de miscari repetate). Se pot enumera cateva dintre problemele de sanatate cauzate de lucrul cu calculatorul: Raniri ale ochilor si slabirea vederii; Oboseala; Problema cu spatele; Dureri de umeri; Dureri de cap. Cteva norme de protectie, care ajuta la crearea unui mediu de lucru sanatos pentru utilizatorii de computere sunt: Folosirea unei tastaturii detasabile pentru a evita durerile in maini si brate; Scaunul utilizat sa fie reglabil, confortabil, cu un spatar comod; Folosirea unui suport pentru cabluri; Cablurile de alimentare,sa fie bine legate si protejate; Genunchii trebuie sa fie la o inaltime de max. 70cm de sol; Asezarea monitorului la distanta potrivita, pentru a impiedica afectiuni ale ochilor; Asigurarea existentei unei surse de lumina pentru a evita oboseala ochilor; Dotarea ferestrelor cu jaluzele ajustabile pentru a evita stralucirea sau reflexia luminii; intreruperi frecvente ale lucrului, la computer.
23
GMB Computers
CONSTANA
Masuri de securitate privind semnalizarea locurilor de munca din GMB

Vizitatorii vor respecta urmatoarele panouri de semnalizare existente la locurile de munca. Interzis focul deschis si interzis fumatul
Fumatul interzis
Intrarea interzisa neautorizate
persoanelor
Pericol electric
Impiedicare
Cadere cu denivelare
Obligatii generale
Trecere pietoni
obligatorie
pentru
Brancarda
Cale (iesire) de salvare
Telefon
Stingator
Cale de iesire de salvare
Prim ajutor
220V
Semnalizare prize
24
GMB Computers
CONSTANA
Introducerea informaiilor i datelor n formate electronice
Utilizarea noiunilor de baz ale tehnologiei informaiei

Prile principale ale calculatorului personal i funciile lor sunt corect nsuite, difereniat n funcie de tipul de calculator. Funciile principale ale unui sistem de operare i aplicaiile soft sunt utilizate corect. Noiunile privind reelele de calculatoare sunt aplicate n activitate conform manualelor de utilizare. Securitatea informaiei i aspectele legate de viruii calculatoarelor sunt nelese i aplicate cu corectitudine.
Utilizarea funciilor de baz ale unui calculator personal i lucreaz cu directoare i fiiere
Pictogramele de baz de pe desktop sunt interpretate i folosite corect. Prile unei ferestre desktop sunt recunoscute cu promptitudine. Organizarea fiierelor i directoarelor, copierea, tergerea, arhivarea / dezactivarea fiierelor este realizat cu uurin. Facilitile de tiprire disponibile n cadrul sistemului de operare sunt folosite adecvat n activitatea curent.
Utilizeaz o aplicaie de procesare texte

Setrile, operaiile de baz, formatarea sunt executate corect i cu uurin. Tabelele, imaginile sau graficele sunt inserate ntr-un document conform precizrilordin manualele programelor de procesare. Folosete foile de calcul tabelar Operaiile de baz asociate cu dezvoltarea, formatarea i folosirea foilor de calcul sunt nelese corect i ndeplinite eficient. Graficele i diagramele sunt create i formatate conform opiunilor disponibile. Operaiile matematice i logice sunt realizate cu ajutorul formulelor de baz i funciilor corespunztoare.
Folosete o baz de date

Tabelele, interogrile, formularele i rapoartele sunt create i modificate conform cerinelor de lucru. Informaiile dintr-o baz de date sunt obinute utiliznd interogrile i instrumentele existente.
Realizeaz prezentri
Crearea, formatarea i finalizarea unei prezentri noi se face utiliznd operaiile de baz permise. Aplicaia este utilizat adecvat, prin operaii specifice.
25
GMB Computers
CONSTANA
Securitatea datelor
Este uor s spui c toi ne protejm sistemele i informaiile, dar nu este uor s spui de cine trebuie s ne protejm i nici cine reprezint cea mai mare ameninare la adresa afacerii noastre. Desigur, cea mai mare scurgere de date informaii furate cu privire la 45 de milioane de cri de credit de la distribuitorul TJX - a fost provocat de ctre infractori. ns cea de-a doua pierdere de anul trecut, de peste 25 de milioane de nregistrri de la HMRC, a fost cauzat de angajaii din sectorul public, prin rularea n reea a dou CD-uri necriptate. Acest lucru evideniaz problema real. Oricine poate provoca o scurgere de date fie c o face n cunotiin de cauz sau nu. Acum, cnd folosirea calculatorului devine omniprezent, datele putnd fi accesate, prelucrate, salvate i trimise din aproape orice locaie, nu trebuie s ne protejm doar mpotriva "bieilor ri", ci i mpotriva oamenilor obinuii. Cu toii greim. Credem c nu are importan dac nclcm regulile o singur dat. Din pcate, un astfel de incident este tot ce trebuie pentru ca o afacere s fie pus n pericolul de a pierde date. S privim mai atent cteva dintre tipurile de oameni i circumstanele de zi cu zi care pot cauza acest risc la adresa securitii.
Pot s iau asta cu mine?

Marea majoritate a pierderilor de date raportate n Regatul Unit, n ultimii ani, s-au ntmplat pentru c angajaii obinuii au copiat datele pe discuri sau dispozitive pe care nu ar fi trebuit s le aib. Este uor de fcut, i, n cele mai multe dintre cazuri, se face incontient. Este primul pas spre o scurgere de date. n noiembrie 2007, Check Point a efectuat o cercetare n rndul a 140 de manageri i administratori IT din companii britanice, din sectorul public i cel privat. 73 % dintre respondeni au afirmat c regulile de securitate IT publicate au acoperit problemele legate de protecia datelor, cum ar fi utilizarea USB-urilor. Din pcate, mai puin de jumtate dintre acetia nu aveau nicio soluie instalat (cum ar fi criptarea datelor sau controlul portului), care ar putea consolida acele reguli. Nu este nicio surpriz faptul c oamenii vor continua s copieze informaiile. Ei doar ncearc s lucreze ct mai eficient posibil, nu-i aa? Scurgerile de informaii nu vor nceta ns dect n cazul n care regulile sunt ntrite prin utilizarea soluiilor IT.
Obiceiuri locale
Luna trecut, Departmentul Securitii Naionale al SUA a confirmat ceea ce unii cltori epuizai tiu deja: agenilor de frontier le este permis s caute prin fiierele laptopului, n Blackberry, n telefonul inteligent sau n orice aparat digital, atunci cnd intrai n ar, chiar i atunci cnd nu exist o "cauz justificat". Funcionarii pot pstra informaiile sau ntregul calculator, s copieze ceea ce vor i s divulge aceste date i altor ageni. Chiar dac datele sunt criptate, chiar avei de gnd s refuzai s le dai parola? Desigur, n cazul n care datele nu sunt suspecte, recomandrile spun ca acestea s fie distruse. Dar putem fi siguri de asta? Avnd n vedere pierderile masive recente din baza de date a Guvernului, ai dori ca datele dumneavoastr s ajung n minile lor?
Cazul terminalului
Chiocurile de Internet i terminalele din aeroporturi sunt o ispit pentru muli oameni de afaceri. Este o ultim ans de a verifica e-mailuri nainte de zboruri lungi sau s fac ultimele schimbri pentru o prezentare important. Pn la urm, este doar cel mai bun mod de a folosi timpul mort.
26
GMB Computers
CONSTANA
Ce se ntmpl ns cu informaiile sensibile, dup ce persoana a terminat de lucrat pe calculator? Datele sunt terse definitiv din memorie? Au lsat un stick USB n urm? Care sunt implicaiile pentru regulile de securitate ale companiei, dac astfel de date sunt procesate de pe un calculator neprotejat? Uneori, managerii sunt cei care provoac cele mai mari riscuri n ceea ce privete informaiile.
Privire distanta
Nu uitai c oamenii v pot fura informaii doar privind sau citind, chiar i atunci cnd v-ai blocat cile electronice de furt al datelor. Iat cazul unui senior executiv care, n timp ce zbura spre Marea Britanie, a fost nevoit s i spun persoanei de lang el c i putea citi prezentarea confidenial i c cele dou companii la care lucrau erau de fapt rivale de moarte. Acest lucru a strnit o discuie aprins. i, n timp ce ansele ca acest lucru s se ntmple sunt destul de mici, se dovedete c nu poi fi sigur niciodat cine se uit peste umrul tu.
Marea reparaie
Ce ai face n cazul n care calculatorul dumneavoastr de acas sau laptopul merg prost? Ei bine, asta depinde de tipul de reparaie. Dac hardware-ul este cel care trebuie s fie reparat, atunci luai n considerare pstrarea hard disk-ului i trimitei laptopul fr el, pentru a evita copierea intenionat sau maliioas a datelor personale sau de afaceri. Dac unitatea n sine este defect, fii foarte ateni pe cine alegei s vi-l repare este posibil ca datele s poat fi salvate. Poate fi mai sigur s distrugei driverul i s luai unul nou de aceea back-up-urile obinuite nu numai c v permit accesul la informaii dac PC-ul este defect, ci sunt de asemenea importante pentru securitate.
Ai ncredere, dar verific

Aceste exemple subliniaz faptul c informaiile dumneavostr sunt doar la civa pai de a fi folosite n mod greit i c inteniile din spatele acelei utilizri greite nu conteaz. Desigur, trebuie s avei ncredere n personalul dumneavoastr, ns ar trebui s fii mai selectivi n ceea ce privete informaiile pe care le ncredinai, i, de asemenea, s verificai dac securitatea este meninut. Securitatea trebuie s fie automat pentru a o proteja mpotriva pierderilor i a scurgerilor de informaie. De asemenea, trebuie setat astfel nct angajaii dumneavoastr s nu poat modifica procesul. Nu lsai la ndemna personalului dumneavoastr deciziile cu privire la ceea ce trebuie securizat i cnd. n primul rnd, nu este treaba lor s decid acest lucru, i, n al doilea rnd, nu este ceva pentru care ei ar trebui s-i fac griji. Acest lucru nseamn c trebuie s v gndii la ce informaii le permii angajailor de la toate nivelurile s transporte cu ei. Iar aceasta presupune criptare automat a discurilor pe laptop i pentru orice informaie care este copiat pe dispozitive portabile de stocare. Scond din calcul potenialul erorii umane, facem un progres uria n ceea ce privete securitatea. Fie ca este vorba de securitatea personala, de securitatea bunurilor sau chiar de cea a datelor, aceasta este privita ca fiind o prioritate. Una dintre cele mai la moda si mai periculoase actiuni ce va poate compromite securitatea este atacul asupra datelor aflate pe computerul dv. Iata in continuare cativa pasi ce trebuie urmati pentru a va asigura ca sunteti protejati impotriva amenintarilor din retea sau de pe Internet, fie ca este vorba de virusi, programe de tip spyware sau spam.
27
GMB Computers
CONSTANA
1. un patch automat Pentru aceasta trebuie sa va asigurati ca sistemul de operare este setat sa isi faca singur update. n XP, pornirea acestuia se face din Start/Control Panel/Security Settings/Automatic Updates, iar pentru Windows 2000 calea este asemanatoare - se apasa Start, Settings, Control Panel, Automatic Updates. In ambele versiuni, verificati daca setarea "Automatic" este selectata, dar tot aici se mai poate seta si ca Windows sa va anunte daca face un update sau daca acesta va fi instalat manual. 2. nu asteptati dupa windows Daca PC-ul vostru a fost oprit pentru o perioada de cateva zile, nu asteptati sa porneasca update-ul automat de Windows, ci faceti din pagina de Web a Microsoft Windows Update prima dv. oprire. De asemenea, poate exista o intarziere intre momentul in care un patch este disponibil si momentul in care Windows Update il trimite catre dv. In general, Microsoft "scoate" patch-uri in a doua saptamana a fiecarei luni, deci, pentru a fi sigur, cautati manual update-ul la un interval de cateva saptamani. De asemenea, un alt lucru important pentru o securitate sporita este sa va faceti regulat un update al antivirusului sau al programului anti-spyware. Cel mai bine este sa le setati si pe acestea astfel incat procesul de update sa se desfasoare automat sau, chiar mai bine, sa faceti dv. personal acest lucru in fiecare saptamana. 3. folositi monitorul de securitate oferit de XP Cea mai bine venita componenta de securitate din Windows XP SP2 este Windows Security Center. Acest utilitar oferit de Microsoft monitorizeaza sistemul si va atrage atentia atunci cand antivirusul sau firewall-ul sistemului este dezactivat sau are o baza de date veche. Cu toate acestea, firewall-ul oferit de Windows nu poate asigura decat o protectie limitata. Pentru o securitate sporita recomandata ar fi dezactivarea firewall-ului din Windows si folosirea unui utilitar precum ZoneAlarm. 4. faceti vizibile extensiile fisierelor Mai multe tipuri de virusi se deghizeza sub forma unor fisiere inofensive, prin adaugarea la numele lor a unei extensii false (ex.: funnycartoon.jpg.exe), cu speranta ca sistemul vostru este setat sa ascunda astfel de extensii. n loc sa vedeti si extensia ".exe", sistemul va afisa doar ".jpg". Pentru a face acest tip de fisiere mai usor de depistat, deschideti Windows Explorer selectati meniul Tools/Folder Options/View si asigurati-va ca optiunea "Hide file extension for known file types" este debifata. Asigurarea securitatii administratiei publice solutiilor informatice a devenit o necesitate a
28
GMB Computers
CONSTANA
In ultimii ani, tot mai multe institutii din administratia publica centrala si locala au facut eforturi financiare considerabile pentru a-si moderniza sistemele informatice, lucru benefic atat din punct de vedere al cresterii eficientei angajatilor, cat si al rapiditatii cu care sunt solutionate problemele cetatenilor. La fel de importanta ca modernizarea si mentinerea functionalitatii acestor sisteme informatice este insa si asigurarea securitatii lor in fata tot mai numeroaselor amenintari cu care intreaga comunitate cibernetica se confrunta in ziua de astazi. Gradul inalt de securitate al unei retele informatice este dat tocmai de faptul ca fiecare componenta a sa este protejata Este deja un truism faptul ca securitatea datelor este importanta pentru oricine, functionar public sau angajat al unei companii, fie ca vrea sa protejeze date personale, fie ca exista interesul de a proteja date cu caracter public. Pericolele care pot aparea cel mai des in cazul unei retele ce functioneaza intr-o institutie publice sunt de tip virus, hacker, spam, spyware, bots, phishing si rootkits. Ovidiu Berdila, Senior Sales Specialist in cadrul companiei BitDefender, ne spune cum pot penetra aceste pericole o retea informatica. "Primul punct critic, indiferent de solutiile abordate, este utilizatorul. Asta deoarece un user ne-instruit poate crea probeleme de securitate indiferente de restrictiile impuse. Al doilea punct critic este reprezentat de solutiile software / hardware implementate. Nu intotdeauna cele mai scumpe solutii sunt cele mai eficiente si de aceea trebuie facuta o analiza competenta a posibilitatilor oferite de piata IT. Principalul pericol e alegerea unei solutii numai dupa diverse 'recomandari', fara a efectua un test prealabil al solutiei in discutie", spune Ovidiu Berdila. Cele mai cunoscute "porti" de intrare pentru pericolele care pandesc retelele informatice sunt Internetul, care e folosit ca o platforma de comunicare prin intermediul careia se echimba content, online bankinkg, jocuri, e-mailul (spam, virusi, scams) si instant messaging-ul. Cele mai expuse pericolelor amintite mai sus sunt serverele de fisiere, bazele de date, dar si mediile de stocare a datelor: flash-uri, CD/DVD-uri etc. "Gradul inalt de securitate al unei retele informatice este dat tocmai de faptul ca fiecare componenta a sa este protejata. Daca un singur calculator din retea, in aparenta lipsit de importanta (de exemplu, calculatorul secretarei, sa zicem), nu este protejat, el reprezinta vulnerabilitatea prin care poate fi atacat intreg sistemul, indiferent de sofisticatele solutii de securitate utilizate in rest", atentioneaza Ovidiu Berdila. Doua necesitati absolute: firewall-ul si copiile de siguranta Specialistii BiDefender atentioneaza ca asigurarea securitatii la nivelul sistemelor informatice folosite de institutiile administratiei publice nu se rezuma doar la cumpararea unor softuri de securitate, implicand si o parte de implementare si suport tehnic ulterior. De asemenea, trebuie tinut cont ca nici un soft, oricat de scump sau de nou aparut, nu este infailibil: vulnerabilitati in sistemele informatice se descopera aproape zilnic, iar in perioada de timp pana cand producatorul soft corecteaza eroarea, sistemele sunt vulnerabile. Una din principalele cauze ale batailor de cap cu securitatea informatica este tocmai nevoia ca aplicatiile software sa fie usor de utilizat de catre angajati. De obicei, atunci cand se instaleaza o aplicatie noua, se vrea ca angajatii sa aiba acces la ea imediat si se renunta la inceput la setarile de securitate.
29
GMB Computers
CONSTANA
"Cea mai buna metoda de a ne pune datele importante la adapost este crearea de copii de siguranta, ceea ce ne permite recuperarea integrala a datelor chiar si in situatia in care o parte dintre ele au fost sterse sau corupte de actiunea unui virus informatic. Datele importante de pe hard-disc trebuie arhivate periodic (si eventual criptate) iar arhivele rezultate trebuie transferate pe medii de stocare pe care sa le pastram la loc sigur", mai spune Ovidiu Berdila.
Pasii necesari pentru prevenirea infectarii retelei cu virusi

Pentru a preveni infectarea retelei cu virusi este necesara aplicarea a trei etape simple la toate informatiile sosite din exterior. Mai intai, se va folosi un program antivirus pentru a scana toate mediile de stocare externe, fisierele, programele executabile si anexele e-mail inainte de a le deschide pe un calculator din retea. In al doilea rand se va include protectia antivirus ca o componenta a firewall-ului astfel incat fisierele infectate sa nu poata intra in retea. In al treilea rand, se va instala un program de protectie antivirus pe fiecare sistem de retea, pentru a preveni transmiterea virusilor de la un calculator infectat. De asemenea, este necesar ca politica de securitate sa fie clar definita, cu accent pe educarea utilizatorilor retelei: fiecare configuratie care include o retea trebuie sa-si aiba propria politica de securitate; politica de securitate a fiecarei retele trebuie sa fie unica. Creearea unei politici de securitate se traduce prin dezvoltarea unui plan pentru rezolvarea aspectelor privind securitatea retelei. Cu alte cuvinte se incearca protectia utilizatorului si a retelei inainte ca un haker sa reuseasca sa compromita sistemul. In fine, inainte de acorda utilizatorilor acces la servicii, trebuie determinat nivelul securitatii datelor din sistem. Prin aceasta se determina nivelul de sensibilitate al datelor stocate de utilizatori. Nu este recomandata stocarea de informatii sensibile pe un sistem care nu urmeaza a fi securizat corespunzator. Utilizatorii care pot stoca informatii sensibile trebuie sa stie care sunt serviciile (daca acestea exista), corespunzatoare pentru stocarea acestor informatii, ei trebuie educati in acest sen. Obiectivul principal al unui program pentru protecia informaiilor l reprezint asigurarea ncrederii partenerilor de afaceri, avantajul competitiv, in conformitatea cu cerinele legale i maximizarea investiiilor. Indiferent de forma pe care o mbrac, mijloacele prin care este memorat, transmis sau distribuit, informaia trebuie protejat. ISO/IEC 17799 trateaz securitatea informaiilor prin prisma a trei elemente principale: Confidenialitatea informaiile sunt accesibile doar persoanelor autorizate; Integritatea asigurarea acurateei i completitudinii metodelor prin care se realizeaz prelucrarea informaiilor; Disponibilitatea utilizatorii autorizai au acces la informaii i la activele asociate n momente oportune. Pentru a putea realiza un program de securitate eficient este nevoie de politici, proceduri, practici, standarde, descrieri ale sarcinilor i responsabilitilor de serviciu, precum i de o arhitectur general a securitii. Aceste controale trebuie implementate pentru a se atinge obiectivele specifice ale securitii i pe cele generale ale organizaiei. Dependena din ce n ce mai mare de sistemele informaionale conduce lacreterea tipologiei vulnerabilitilor crora organizaiile trebuie s le fac fa. Mai mult, problema protecie trebuie s aib n vedere de multe ori interconectarea reelelor private cu serviciile publice. Dac la acest aspect mai adugam i problema partajrii informaiilor se contureaz un tablou destul de complicat n care implementarea unor controale eficiente devine o sarcin dificil pentru specialistul IT&C. Multe din sistemele existente pe pia au fost proiectate dup metodologia structurat dar nu au avut ca principal obiectiv i asigurarea unui anumit grad de securitate pentru c la
30
GMB Computers
CONSTANA
momentul respectiv tehnologia nu era att de dezvoltat i nici att de accesibil neiniiailor. Odat ns cu proliferarea Internetului ca i mijloc important al comunicrii moderne nevoia unor mecanisme de securitate proactiv a devenit o certitudine. n practic remarcm c multe instituii apeleaz la soluii tehnice externe care s le rezolve problemele de securitate fr a cuta s-i identifice nevoile i cerinele specifice. Identificarea controalelor interne care s asigure un grad corespunztor de securitate activelor informaionale ale unei instituii presupune o planificare riguroas i identificarea exact a obiectivelor respectivei instituii. Pentru a fi ns eficiente aceste 6 controale trebuie s aib n vedere pe toi angajaii i nu doar pe cei din compartimentul IT sau care au legtur direct cu acest domeniu. Securitatea informaiilor nu este doar o problem tehnic. Ea este n primul rnd o problem managerial. Standardul de securitate ISO/IEC 17799 rspunde nevoilor organizaiilor de orice tip, publice sau private, printr-o serie de practici de gestiune a securitii informaiilor. Standardul poate fi folosit n funcie de gradul de expunere a fiecrei organizaii n parte, pentru a contientiza la nivelul conducerii aspectele legate de securitatea informaiei, sau pentru a crea o cultur organizaional n ceea ce privete securitatea informaiilor, sau pentru a obine certificarea sistemului de securitate. Gradul de expunere a sistemelor informaionale variaz cu industria n care activeaz fiecare organizaie. Cu ct acest risc este mai mare, atenia care trebuie acordat securitii datelor ar trebui s fie mai mare. Instituiile financiare, industria aprrii, aerospaial, industria tehnologiei informaiei, industria electronic sunt sectoarele cu cel mai mare grad de risc n ceea ce privete securitatea informaiilor. Tot n aceast categorie de risc ridicat intr i instituiile guvernamentale, motiv pentru care adoptarea unei culturi organizaionale pe baza standardului ISO/IEC 17799 are un rol fundamental.
Tehnica de calcul Cunotinele necesare:

- concepte de baz ale tehnologiei informaiei - utilizarea computerului i organizarea fiierelor - procesare de documente, calcul tabelar - noiuni generale de baze de date - noiuni generale despre prezentri, comunicare i informaie
Tipuri de calculatoare n funcie de capacitate, vitez, cost, utilizatori tipici:

- mainframe - calculator de reea - minicomputer - laptop - asistent digital personal (PDA) etc.
Pri principale ale calculatorului personal:

- unitatea central de prelucrare - hard-disc
31
GMB Computers
CONSTANA
- dispozitive de intrare - dispozitive de ieire - memorie - dispozitive periferice etc.
Dispozitive de introducere date:

- mouse - tastatura - trakball - scanner - touchpad - lightpens - camera video - microfon etc.
Dispozitive de ieire:
- uniti de afiare video (ecran, monitor) - imprimante - plotter - difuzoare - sintetizatoare voce etc.
Aplicaii soft
- programe de prelucrare texte - programe de calcul tabelar - baze de date - programe pentru contabilitate - aplicaii multimedia etc. Pictograme de baz: fiiere, directoare / foldere, aplicaii, imprimanta, coul de gunoi etc. Pri ale unei ferestre desktop: bara de titlu, bara de instrumente, bara de meniuri, bara de start, bara de derulare etc.
Operaii de baz procesare text:

- introducere text - introducere caractere / simboluri speciale - selectare caracter, cuvnt, propoziie, paragraf, document ntreg etc. - editare - copiere - mutare - tergere - nlocuire text etc.
Operaii de baz la prezentri:

- vizualizare prezentare - utilizare abloane - introducere text, poze, imagini - utilizare grafice i diagrame - alegerea animaiei etc.
32
GMB Computers
CONSTANA
Operaii specifice la prezentri:

- creare tabele standard - folosire imagini ntr-un diapozitiv - importare i desenare obiecte - animare text i diapozitive etc.
Operaii de utilizare a aplicaiei pot fi:

- crearea tabelelor standard - folosirea imaginilor dintr-un diapozitiv - importarea i desenarea obiectelor - animarea textului i a diapozitivelor etc.
Programa de pregatire designer pagini WEB
Editoare de pagini web

FrontPage - Microsoft Frontpage este un program de editare HTML, produs de Microsoft care a fcut parte din grupa de programe Microsoft Office din 1997 pn n 2006, ncepnd cu decembrie 2006 a fost nlocuit cu Microsoft Expression Web Designer. HyperText Markup Language (HTML) este un limbaj de marcare utilizat pentru crearea paginilor web ce pot fi afiate ntr-un browser (sau navigator). Scopul HTML este mai degrab prezentare a informaiilor paragrafe, fonturi, tabele .a.m.d. dect descrierea semanticii documentului. Specificaiile HTML sunt dictate de World Wide Web Consortium (W3C). AceHTML - Editor HTML in cod sursa. AceHTML Pro este un instrument cu o interfata care poate fi personalizata si care va permite sa construiti si sa intretineti un site Web profesional. Ofera un suport pentru HTML, JavaScript, CSS, ASP si PHP. Nvu - se pronunta n-view, este o solutie completa pentru crearea unui site web. Acest editor rivalizeaza cu cele mai mari nume din domeniu: FrontPage, Dreamweaver, etc. Aplicatia grupeaza un centralizator de fisiere web si un editor de pagini grafice di tipul WYSIWYG. Managerul de fisiere web permite publicarea rapida a ultimii versiuni a unui site. Scopul Nvu este de a facilita procesul de creatie si de a-l face mai accesibil utilizatorilor debutanti din domeniu. In acelasi timp, utilizatorii avansati vor avea posibilitatea de a edita direct in cod sursa. Este posibila editarea simultana a mai multor pagini simultan datorita tabulatorilor. Previzualizarea paginii este integrala si nu necesita nici un navigator aditional. Mecanismul de afisare utilizat pentru a vizualiza paginile web respecta normele si standardele in vigoare de pe Web.
33
GMB Computers
CONSTANA
Alte editoare: CoffeeCup HTML Editor 2006 CoffeeCup HTML Editor contine doua editoare intr-unul singur. Daca stii HTML sau vrei sa inveti foloseste editorul de cod care are standardele setate inca din 1996. Pentru a face pagini web fara sa stii html foloseste optiunea "drag and drop" din... 1 Cool Button Tool - Java 1 Cool Button Tool - Java iti permite sa creezi o serie larga de stiluri de butoane care include schimbarea culorii, a actiunii, adancimea, textul, transparenta, sunetul sau imaginea din care va fi construit butonul. SWFText SWFText iti permite sa creezi animatii text foarte usor. Iti da la dispozitie peste 150 de efecte so peste 20 de fundale pentru text. Este foarte usor de folosit, si chiar si utilizatori fara cunostinte de Flash pot sa faca in doar cativa pasi o... KoolMoves KoolMoves este ideal pentru a creea gama larga de componente Web: de la banere, sisteme de navigare, slide-show-ri multimedia si pana la pagini Web complete. Pentru userii avansati contine interfata de action- scripting Flash MX 2004. Dreamweaver MX 2004 Dreamweaver MX 2004 este alegerea profesionala pentru dezvoltarea de pagini Web si aplicatii.Combina o larga varietate de unelte pentru design cu editarea de cod permitand utilizatorilor de orice nivel sa creeze site-uri foarte rapid. Actual Drawing Actual Drawing este un program care te ajuta sa faci pagini Web fara sa stii HTML. Programul are propriul editor de poze, o multitudine de efecte cu care iti poti personaliza siteul. Tersus Visual Programming Platform Folosind Tersus puteti creea aplicatii web folosind doar diagrame vizuale in loc de cod. In acest fel se pot creea aplicatii web intr-un timp mult mai scurt si cu un efort minim. HTMLGate FREE Un eficient si puternic editor web care inglobeaza o paleta de unelte necesare pentru crearea siturilor web. PHP Designer 2005 PHP Designer 2005 este un PHP editor gratuit care inglobeaza o tabela completa de unelte pentru programarea in PHP. 1st Page 2000 - HTML Editor 1st Page 2000 este un editor HTML profesional cu ajutorul caruia se pot construii situri web rapid. Acesta vine cu peste 450 de java scripturi incluse.
34
GMB Computers
CONSTANA
Internet
Internet reprezint cea mai mare reea de calculatoare din lume, iar cea mai cunoscut aplicaie a sa este World Wide Web (www). Pentru a avea acces la informaiile coninute de World Wide Web este necesar un browser, proiectat special pentru sistemul de operare folosit. Pagina grafic a browserului conine pe lng bara de titluri, de meniuri i o bar cu unelte specifice. Aceast bar conine urmtoarele butoane: Butoanele Back i Forward se folosesc pentru a parcurge rapid paginile vizualizate anterior. Home . aceast pictogram conduce la pagina de nceput (Start Page), care reprezint punctul de plecare de fiecare dat cnd se lanseaz programul Internet Explorer. Orice pagin Web poate fi declarat ca pagin proprie de nceput. Favorites . dac se gsete o pagin care va fi vizitat i alt dat se execut clic pe acest buton i ea va fi adugat n dosarul Favorites. Search . executnd clic pe acest buton se deschide o pagin de cutare care permite introducerea cuvintelor sau frazelor cu ajutorul crora pot fi gsite site-uri Web care pot conine informaia cutat. Adress . fiecare pagin Web are propria sa adres, denumit adres URL (Universal Resource Locator). Dac se introduce adresa n aceast caset, sau se execut clic pe o legtur, pentru a introduce automat adresa URL, Internet Explorer va gsi pagina respectiv i o va afia pe ecran. Pentru a putea lucra n reeaua Internet terbuie ndeplinite urmtoarele condiii: 1. n primul rnd, trebuie conectat calculatorul. 2. Calculatorul are nevoie de o adres. Toate informaiile care sunt transmise prin Internet se deplaseaz dintr-un loc n altul cu ajutorul unor etichete speciale de adrese electronice. Adresa IP a fiecrui calculator const ntr-un numr lung mprit n patru grupe de maximum trei cifre. (TCP este prescurtarea sintagmei Transmission Control iar IP . Internet Protocol. TCP/IP . este numele protocolului standard folosit de calculatoare pentru a schimba informaii n reeaua Internet) Universitatea din Craiova, Facultatea de tiine Economice Drobeta Turnu Severin 3. Calculatoarele au nume care corespund adreselor. n Internet exist calculatoare speciale care lucreaz pentru a .traduce.aceste nume n adresele IP corespunztoare. Definirea i nelegerea termenului de hyperlink. Ce este un Hyperlink? Un hyperlink, descrie o referina care poate fi accesata direct din cadrul unui document hypertext. Aceast zon din care hyperlink-ul poate fi activat se numete ancora. inta este locul ctre ceea ce indica link-ul,aceasta putnd fi o alt locaie n cadrul aceleai pagini sau aceluiai document, o alta pagin sau document, sau o locaie specific n interiorul unei alte pagini sau document- depinde de tipul de hypertext.Aciunea de a insera un hyperlink n alt loc poart denumirea a pune link.
Structura unei adrese Web

Orice calculator aflat in reea are o anumit adres (adresa IP) ce i permite s fie identificat n mod unic n cadrul reelei. Adresa IP este format din adresa de reea i adresa calculatorului care primete mesajul. Ea reprezint un numr pozitiv reprezentat pe 32 de bii. Structura general a unei astfel de adrese este formata din trei pri: o parte care indica tipul adresei, o
35
GMB Computers
CONSTANA
parte care i dentifica reeaua la care este conectat sistemul i o alta care identifica conexiunea prin care sistemul se leaga la reea . Adresa IP este format din clas.reea.gazd . Clasa adresei - n funcie de clasa careia i aparine adresa, numarul de bii rezervai pentru celelalte cmpuri va fi diferit. n prezent exista patru clase de adrese: clasa A, clasa 8, clasa C i clasa D. Practic reeaua internet se mparte n sute de domenii de nivel superior care fiecare la rndul su se mparte n subdomenii i aa mai departe. Numrul total de domenii nu se cunoate dinainte, ci depinde de sistemul de organizare adoptat. Practic cele mai cunoscute domenii sunt cele generice - care indic n general un domeniu organizaional de ar - reprezint un cod cu ajutorul cruia se identific ara de apartenen a domeniului. Dintre cele mai cunoscute domenii generice putem enumera:
Domeniile de ar in general sunt formate din dou litere i corespund codului internaional al mainilor.
Dezvoltarea paginilor Web

Ce este HTML?
HTML este prescurtarea pentru HyperText Markup Language. HyperText este metoda prrin care navighezi pe web apsnd pe text special numit hyperlink care te direcioneaz ctre alte pagini. Prin hyper se nelege neliniar adic, poi ajunge ctre orice loc de pe Internet cand vrei apsnd pe link-uri nu exist ordine prestabilit n care se fac lucrurile. Markup este ceea ce extensiile HTML fac textului din interiorul lor. l marchez ca un anumit tip de text (text n italic, de exemplu). HTML este un limbaj, avand codul i sintaxa sa, ca orice alt limbaj.
Ce este o pagin HTML?

O pagin HTML este un document care folosete limbajul HTML pentru a indica modul n care va fi format textul cand va fi afiat - adic va diferenia textul pe categorii: link-uri, titluri, paragrafe, liste etc, - i pentru a nsoi textul cu forme interactive, imagini ncadrate i alte obiecte
Cum arat codul HTML?

Consider c avem o pagin web simpla salvat ntr-un fiier de tip text numit simplepage.html. La stanga poti vedea pagina web aa cum arata cand este deschisa cu un browser web. La dreapa poti vedea codul paginii web, asa cum arata cand este deschis cu un editor de text
36
GMB Computers
CONSTANA
De ce soft ai nevoie pentru a dezvolta pagini HTML? Desi HTML-ul unei pagini web poate fi scris n orice editor de text (ex : Notepad), editoare specializate de HTMLpot oferi o usurina n scrierea codului i o funcionalitate sporit. Nici nu e nevoie s stii HTML ca s faci o pagin web. Exista o mulime de forme n care poti edita HTML: text, object i WYSIWYG (prezentat mai jos)
Ce ofera editoarele de sursa?

Editoarele text de HTML de regula ofer formatare de text (highlighting). Template-uri, Text, toolbar-uri, i keyboard shortcuts pot insera rapid elemente i structuri HTML. Exist unelte de auto completare care pot fi de un real ajutor. Folosirea editoarelor text presupune cunoaterea de HTML i de orice alte tehnologii care urmeaza a fi folosite ca de exemplu CSS, Javascript i limbaje de scripting pe partea de server. n imaginea ataata se poate vedea un document html ntr-un editor html care permite formatarea corespunzatoare (highlighting) a textului.
Ce este o unealta WYSIWYG ?

What You See Is What You Get (WYSIWYG) ceea ce vezi e ceea ce primeti editoarele html ofera o interfaa de editare care se aseaman cu pagina vazuta la final intr-un browser web. Deoarece utilizarea unui editor wysiwyg nu necesit cunotine html sunt mai uor de folosit de un nceptor.
Ce este WWW (World Wide Web)?

(WWW sau scurt "Web") este un sistem de documente hipertext interconectate, denumite pagini web i accesate prin Internet. Paginile Web pot conine text, imagini, video, i alte
37
GMB Computers
CONSTANA
elemente multimedia. Se navigheaz ntre ele cu hiperlink-uri (en: hyperlinks). Paginile web pot fi vizionate cu un browser web.
World Wide Web

Navigarea prin World Wide Web
De fiecare dat cnd se execut clic pe pictograma Internet Explorer, programul caut n reea pagina de nceput. n cazul cnd se deschide mereu aceeai pagin pentru navigarea n Internet aceasta poate fi declarat pagin de nceput astfel: 1. Avnd deschis n Web pagina respectiv se alege View, Options i se execut clic pe eticheta Navigation. 2. Se verific ca n lista Page s fie afiat pagina de nceput. 3. Se execut clic pe butonul Use Current. Aceeai caset de dialog permite i iniializarea adreselor care apar pe ecran cnd se execut clic pe butoanele Quick Links.
Paginile Web
Cele mai diverse sau cele mai importante evenimente din lume pot fi gsite n World Wide Web. Aici exist multe pagini de informaii pe care oricine le poate vedea . de la cele mai simple pn la cele foarte valoroase care conin text, imagini grafice, sunete i animaie, n funcie de obiectivul urmrit i bugetul pe care l-a avut la dispoziie creatorul ei. Aceste pagini Web pot conine legturi de tip hipertext, pe care se poate executa clic pentru a sri instantaneu la alt pagin Web, legat de prima (frazele subliniate reprezint legturi de hipertext ctre alte pagini din Web). De asemenea, paginile Web pot conine fiiere multimedias (fiiere de sunet/muzic, animaie i chiar clipuri video) care sunt derulate automat atunci cnd se vizualizeaz o pagin Web.
Salvarea, tiprirea i descrcarea paginilor Web

Pentru a salva o pagin Web sub form de fiier, se alege File, Save As File. Dac se intenioneaz vizualizarea paginilor n Internet Explorer sau editarea lor n Word se folosete formatul HTML (codul surs corespunztor paginii Web . Hyper Text Markup Language). Formatul text se alege dac se dorete doar salvarea textului. Pentru a copia textul dintr-o pagin Web, se selecteaz textul, se execut clic pe butonul drept al mouse-ului i se alege opiunea Copy i acesta poate fi adugat n alt document Windows sau ntr-unul creat cu ajutorul aplicaiilor Office. Pentru a copia o imagina grafic dintr-o pagin Web se mut cursorul mouse-ului pe aceasta, se execut clic pe butonul drept al mouse-ului i se selecteaz opiunea Save Picture As. Pentru a tipri o pagin Web, se execut clic pe butonul Print.
Ce este un Hypertext?
Hypertext (vine de la "more than just" - mai mult dect text) este o forma de text care confera o funcionalitate mai bogat comparativ cu textul normal, prin faptul c permite utilizatorului capacitatea de a explora noi link-uri ctre alte pagini legate(linked) de cuvinte sau imagini specifice. Spre deosebirede textul normal hypertext poate conine tabele, imagini i alte elemente ce faciliteaza o prezentare. Oricare dintre acestea poate fi un hyperlink. Alte
38
GMB Computers
CONSTANA
forme de interaciune pot fi deasemenea prezente, spre exemplu o bula coninnd text poate s apar cnd mouse-ul trece pe o anumita zona, un video poate fi pornit sau oprit, sau un form poate fi completat i trimis.Cel mai bun exemplu de hypertext astazi este World Wide Web.
Ce este un browser web?

Un browser web este o aplicaie soft care permite unui utilizator s afieze text, imagini, video, muzica, jocuri i alte informaii gsite ntr-o pagin web din WWW (Word Wide Web) localizat ntr-o reea local.Textul i imaginile dintr-o pagin web conin deobicei hiperlink-uri ctre aceeai sau alt pagin web. Un website este un set de pagini web interconectate. Browserele web permit utilizatorului s acceseze uor informaia de pe mai multe pagini web prin parcurgerea acestor link-uri.
Ce este un server web?

Toata lumea stie, probabil, ce inseamna Internet: acea colectie uriasa de echipamente legate intre ele in scopul schimbului de informatii sau servicii. Daca ar fi sa simplificam mult ideea de internet, am putea considera ca acesta este o retea de calculatoare in care fiecare nod (calculator) gazduieste informatii sau servicii ce pot fi accesate de publicul larg. Aceste calculatoare din internet poarta numele de servere. In sens larg, un server este un dispozitiv (combinatie de hardware si software) care ofera servicii si/sau informatii utilizatorilor (clientilor). O data cu notiunea de server apare si cea de arhitectura client-server, care se refera la un ansamblu format dintr-un dispozitiv server (furnizor de informatii) si un dispozitiv (calculator) client, conectate prin intermediul unei retele si care fac schimb de informatii. Cel mai comun exemplu al acestui ansamblu este dat de functionalitatea de partajare a fisierelor in retea (File Sharing). Spre exemplu, un calculator contine un folder partajat (share-uit) si un alt calculator copiaza folderul prin retea. In aceasta situatie, calculatorul care ofera folderul are functia de server iar cel care preia folderul - pe cea de client. Rolul de client/server nu este statornic in acest scenariu, oricare din cele doua calculatoare putand oricand sa detine oricare din functii. Asadar notiunea de server se aplica in momentul in care dispozitivul din retea (calculatorul) ofera informatii sau servicii. Un tip particular de server, este server-ul web. Un server web este un sistem care gazduieste si ofera pagini web prin intermediul unei retele. De cele mai multe ori, termenul de server web desemneaza a aplicatie, un program care ruleaza pe calculatorul-server si care
39
GMB Computers
CONSTANA
este responsabil cu primirea cerintelor de la utilizatori si transferarea paginilor web catre ei. Serverul Web este un computer care furnizeaza pagini web, ceea ce implica c acele pagini web sunt stocate pe el. Fiecare server are o adresa IP (Internet Protocol) i posibil un nume de domeniu. O adresa IP arat astfel: 150.140.142.81. Totui, este mai intuitiv s foloseti un URL (Uniform Resource Location), care include un nume de domeniu. De exemplu, dac tastezi URL-ul http://www.upatras.gr/index.html in browser, acesta trimite o cerere serverului al crui nume de domeniu este upatras.gr. Acest server apoi intoarce pagina numit index.html i o trimite browserului.
Definirea i nelegerea termenului de URL.

Un localizator uniform de resurse (sau Adres uniform pentru localizarea resurselor, abreviat URL) este o secven de caractere standardizat, folosit pentru denumirea, localizarea i identificarea unor resurse de pe Internet, inclusiv documente text, imagini, clipuri video, expuneri de diapozitive, etc. Standardul a fost introdus de Tim Berners-Lee pentru a fi utilizat n World Wide Web, specificaiile actuale fiind cuprinse n RFC1738. URL-ul este un caz particular al unei specificaii mai ample numite URI (Identificator uniform de resurse), standardizat de acelai W3C. Cateva chestiuni despre optimizarea URL-ului pentru motoarele de cutare
Prezena cuvintelor-cheie n URL

Este preferabil s se utilizeze cuvinte-cheie strategice n URL-uri, mai degrab dect numere sau elemente lipsite de sens. Realitatea este c motoarele in cont de prezena cuvintelorcheie n URL-uri. Totui, nu trebuie s atepi miracole cu acest element de optimizare. Att ct se poate, evit s foloseti n URL-ul blogului tu cuvintele care aduc prea puin sens (de exemplu articolele). Dar n anumite cazuri este necesar s fie pstrate, fie pentru c sunt importante pentru identificare, de exemplu ar fi ciudat i contraproductiv ca un blog despre Neamul oimretilor s aib ca URL ceva de genul http://neamsoimaresti.com/.
Bonus pentru AdSense

Dac URL-ul conine cuvinte-cheie asociate paginii, AdSense va putea s se serveasc de ele pentru a selecta publicitatea, mai ales atunci cnd pagina nc nu s-a umplut de coninut (ulterior, ca n toate cazurile, acesta decide).
Separatoarele de cuvinte n URL

Pentru a separa n mod corect cuvintele din URL-uri, trebuie s se utilizeze caractere interpretate ca fiind separatori. Cel mai bun este linioara clasic (de exemplu, http://urele-culinioar.blogspot.com/) i n niciun caz linioara jos. Atenie ns, pentru moment MSN Search indexeaz foarte rar paginile al cror URL are mai mult de dou linioare clasice.
40
GMB Computers
CONSTANA
Lungimea unui URL

Lungimea nu este o problem pentru motoarele de cutare, care pot indexa URL-uri foarte lungi. Dimpotriv, nu este prea practic din punctul de vedere al utilizatorului, care poate grei pur i simplu la tastarea adresei, sau, dac introduce adresa ntr-un blogroll sau o face public ntr-un forum, se constat c este adesea trunchiat pentru a evita deformrile de afiaj. Sunt detalii banale, dar ci vizitatori poteniali nu se pierd astfel pentru simplul fapt c nu poi obliga pe nimeni s fie atent! Remarc n treact cea mai lung adres a unui blog romnesc gzduit pe blogspot, care poate fi consultat aici. E haios, recunosc, e pentru Guiness Book, dar e o idee nefericit din punctul de vedere al utilizatorului.
URL multiplu sau nu?

Dac o pagin este accesibil pornind de la dou sau mai multe URL-uri, exist un risc privind duplicarea de coninut (duplicate content). Dac acelai coninut este accesibil pornind din mai multe locuri, motoarele de cutare ncearc automat s determine ceea ce se numete URL canonic, adic URL-ul cel mai legitim al paginii (un criteriu este acela al adresei care are cele mai multe legturi pe diverse alte bloguri i site-uri). Se indexeaz atunci URL-ul canonic, i nu se indexeaz celelalte. Problema este c e dificil de prevzut care URL va fi reinut de ctre motoare. Pe de alt parte, o pagin accesibil de la mai multe URL-uri are o mare bil neagr n termeni de strategie a Page Rank-ului, pentru c optimizarea i risipete eforturile pe mai multe adrese n loc s se concentreze pe una singur. Din acest motiv nu sftuiesc pe nimeni s apeleze la trucul URL-urilor multiple pentru acelai blog.
Definirea i nelegerea sistemului de funcionare al protocoalelor. Diferenierea protocoalele primare i modalitile de folosire: TCP/IP, HTTP, HTTPS, FTP.
Un protocol este un sistem de reguli i proseduri ce guverneaz comunicaia dintre dou dispozitive. Exist o mul ime de protocoale dar nu toate sunt compatibile, dar, atta timp ct cele dou dispozitive folosesc acelai protocol, ele pot schimba date. Anumite protocoale afecteaz legturile hardware, n timp ce alte protocoale afecteaz transmisiile de date inclusiv parametrii i semnalele folosite n transmisiile asincrone (n general modemul). Pe scurt, protocoalele reprezint de fapt o modalitate prin intermediul creia diferite modele de calculatoare pot comunica ntre ele. Exist mai multe tipuri de protocoale: ~ Protocoalele de aplicaii - ofer schimbul de date ntre aplicaiile existente ntr-o reea , ca de exemplu : File Transfer Protocol (FTP) sau Simple Mail Transfer Protocol (SMTP) File Transfer Protocol (FTP) este un proces ce permite schimbul de fiiere ntre dou calculatoare. Simple Mail Transfer Protocol (SMTP) este un protocol folosit la transmiterea mesajelor electronice. ~ Protocoalele de transport - ca de exemplu Transmission Control Protocol (TCP) - controleaz modul de transmitere a datelor i asigur transmiterea corect a datelor ntre utilizatori ~ Protocoalele de reea - ca de exemplu Internet Protocol (IP) - cel mai simplu protocol de comunicare ntre calculatoare ce asigur transmiterea informaiilor sub
41
GMB Computers
CONSTANA
forma unor pachete (un pachet este o informaie logic ce cuprinde informaii att despre localizarea datelor ct i despre datele utilizatorului). Transmission Control Protocol/Internet Protocol (TCP/IP) este protocolul standard folosit pentru a comunica de-a lungul Internetului. Hypertext Transfer Protocol (HTTP) este o metod prin care paginile WWW sunt transferate prin reea. HTTP este un protocol simplu care descrie cererile recepionate de la clieni i rspunsurile primite de la servere. Hypertext Transfer Protocol Secure (HTTPS) reprezint o combinaie a protocoalelor HTTP i SSLITLS care permite criptarea datelor schimbate cu un server web i autentificarea acestuia, prin intermediul certificatelor digitale emise de autoriti de certifica re (de exemplu VeriSign, Thawte Consulting). Se pot consulta informaii despre identitatea server-ului prin click pe butonul cu un lact ce apare n bara de adrese sau de stare a browser-ului utilizat.
Conexiunile HTTPS protejeaz de instrui transferul datelor i sunt folosite n mare parte n operaiuni de plat pe World Wide Web i operaiuni importante n cadrul sistemelor informaionale corporative
Securitate
Conceptul de site web protejat (folosirea numelui de utilizator i a unei parole) Unele site-uri ofer posibilitatea pstrrii confidenialitii datelor dumneavoastr. De aceea pentru a avea acces la date va trebui s avei creat un cont i anume va trebui s avei un nume de utilizator (username) i o parol (password). Cu acest nume de utilizator i cu parola putei avea acces la datele din contul dumneavoastr . Exemplu de site web protejat este orice site de mail.
Criptarea datelor i utilizarea acesteia

Criptarea sau codificarea datelor este procesul cu ajutorul caruia informaia este greu de descifrat sau de citit. Scopul criptrii este acela de a nu permite accesul persoanelor neautorizate la anumite date n timpul transmiterii lor sau atunci cnd sunt pstrate pe diferite suporturi magnetice. Pentru a decodifica datele este necesar o cheie de decodificare. Au aprut diferite tipuri de codificri imposibil de spart ce au condus la discuii foarte mari deoarece aceste coduri pot fi folosite de organizaiile teroriste pentru comunicare. Conceptul de certificat digital O dat cu dezvoltarea reelei Internet, a aprut necesitatea autentificrii unor documente n format electronic transmise n reea. Dezvoltarea sistemelor de plat non-cash, a comerului electronic, a telefoniei mobile i n general a tuturor mijloacelor de transmisie de date care necesit criptare sau autentificare a condus la crearea unei noi situaii juridice. O semntur digital reprezint o informaie care I identific pe expeditorul unui document. Semntura digital este creat prin criptarea coninutului documentului, folosind cheia criptografica a expeditorului. Aceasta face ca semntura s fie unic att pentru fiier, ct i pentru deintorul cheii. Orice modificri aduse documentului afecteaz semntura , oferinduse astfel att integritate, ct i autentificare. Semnturile digitale utilizeaz criptarea asimetric
42
GMB Computers
CONSTANA
in care se folosete o cheie pentru a crea semntura i o alt cheie, legat de prima, pentru a o verifica. ntr-un sistem de securitate a cheii publice, toi participanii au nevoie de propria cheie de semnare, sau cheie privat. Certificatele sunt emise de teri de ncredere, cunoscui sub numele de autoriti de certifica re (AC), care i asum responsabilitatea pentru identificarea utilizatorilor i pentru acordarea cheilor. AC-urile sunt deseori administrate de companii care sunt n msur s garanteze pentru dreptul de desfurare a afacerii. n mod asemntor, companiile mari pot folosi AC-uri interne organizaionale pentru a identifica personalul i funcia fiecruia , n scopul autentificrii tranzaciilor de comer electronic. Orice persoan care dorete s obin un certificat digital se adreseaz mai nti unei autoriti de certificare autorizat . Orice autoritate de certificare solicit utilizatorului informaii minime privind identitatea acestuia, nainte de a-i elibera acest certificat. Dup furnizarea acestor informaii i verificarea lor, autoritatea de certificare respectiv aprob sau respinge, dup caz, cererea formulat de ctre acea persoan . Cele mai folosite certificate se bazeaz pe standardul ITU-T X. 509. Aceasta este o tehnologie fundamental folosit n Windows 2000 PKI (Public Key Infrastructure). Trebuie ins reinut c acesta nu este singurul mod de certificare.
Virus si malware
Termenul malware identific o categorie de programe de calculator create intenionat pentru a deteriora sau a se infiltra ntru-un computer sau reea de computere, fr consimmntul proprietarului / utilizatorului. Este folosit ca termen general pentru a desemna orice form intruziv , suprtoare de cod de program. Termenul de virus este folosit uneori pentru a identifica toate formele de malware, inclusiv viruii de Calculator. n prezent exist un numr foarte mare de virui. Printre cei mai importani , amintim: - vierme (worm) - nu solicit un program "gazd ", fiind greu de descoperit. EI se reproduce prin autocopierea de la un calculator la altul prin intermediul reelei. Obiectivul principal const n blocarea calculatoarelor i reelelor . Spre deosebire de virui , viermii nu infecteaz fiierele . - virus - sunt programe de calculator proiectate s infecteze fiiere . Se gsesc in codurile programelor infectate i acioneaz cnd aceste programe sunt rulate. Pot fi programai s se activeze cnd sunt ndeplinite anumite condiii (o anumit dat calendaristic , o anumit aciune a utilizatorului etc). Aceste mici programe distrug informaiile aflate pe calculator i mpiedic funcionarea aplicaiilor. - cal troian (trojan) - nu are nevoie de "gazd " i nu prolifereaz . Un "cal troian" se va ascunde ntr-un program cunoscut permind accesul i controlul deplin la calculatorul infectat. La instalare, nu creeaz suspiciuni utilizatorului i nici nu atrage atenia . Acest tip de virus atac i distruge datele de pe hard-disk. - programe spion (spyware) - aplicaii ce colecteaz informaii despre o persoan sau organizaie fr tiina i consimmntul acestora. Aceste programe fur date ce sunt folosite n scopuri publicitare sau financiare. Tipul de informaii furate variaz de la nume si parole de utilizatori, adrese IP i DNS pn la date utilizate n operaiuni de plat folosind servicii de online banking si magazine virtuale. - pcleli (hoax) - sunt mesaje trimise prin e-mail care conin avertizri false despre un virus existent i care cer s fie avertizate toate persoanele cunoscute. Uneori, aceste avertizri conin i fiiere ataate menite, chipurile, s stopeze sau s elimine virusul. Retrimiterea mesajului la alte destinaii face ca virusul s se multiplice. - macro - se va folosi de facilitatea de a crea macrocomenzi oferit de unele programe cum ar fi Microsoft Oftice i Lotus Ami Pro. Dac utilizatorul va folosi facilitile oferite prin crearea de comenzi macro pentru a-i uura munca, virusul va folosi aceast facilitate pentru a se rspndi i a-i ndeplini scopul distructiv. Viruii de macro infecteaz fiierele de tip document i se rspndesc cu ajutorul documentelor transmise ntre utilizatori. Astfel c atunci cnd
43
GMB Computers
CONSTANA
copiai anumite fiiere pe calculator de pe Internet exist pericolul ca aceste fiiere s conin diferii virui care s duc la funcionarea necorespunztoare a sistemului de operare. De aceea trebuie ca atunci cnd copiai ceva de pe Internet s verificai fiierul respectiv cu ajutorul unui program antivirus.
Pericolul folosirii crilor de credit pe Internet

Nu este tocmai recomandat s utilizai crile de credit pentru a cumpra diferite produse de pe Internet, deoarece exist pericolul de a fi fcut public contul dumneavoastr de card i atunci altcineva ar putea folosi banii din contul dumneavoastr .
Termenul Firewall i protejarea reelelor de calculatoare

Firewall-ul este un sistem de securitate, de obicei format dintr-o combinaie de hardware i software, cu scopul de a proteja o reea mpotriva ameninrilor ce vin din partea altor retele, ca de exemplu Internetul. Firewall-urile mpiedic comunicarea direct cu calc'ulatoarele externe reelei i vice versa. n locul comunicrii directe, toate informaiile sunt filtrate de un proxy server. Firewall-ul nregistreaz att volumul de informaii schimbat cu celelalte calculatoare, ct i ncercrile persoanelor neautorizate de a cpta acces la date. Proxy server este o component a unui firewall care organizeaz traficul pe internet de la o reea LAN, ct i ctre o reea LAN. EI decide dac Ias diferite mesaje s treac prin reea, ofer acces la reea i filtreaz diferitele cereri venite din partea utilizatorilor pentru a evita accesul persoanelor neautorizate. Un cont utilizator este un set de informaii ce comunic sistemului de operare ce resurse (fiiere, directoare, aplicaii, dispozitive periferice i de stocare) putei s accesai, ce permisiuni de modificri avei i care sunt preferinele personale, cum ar fi fundalul pentru desktop i alte setri. Conturile utilizator permit partajarea resurselor cu ali utilizatori, dar n acelai timp s avei fiiere i setri proprii. Fiecare persoan acceseaz computerul cu un nume de utilizator i o parol, astfel nct doar utilizatorii autorizai s aib acces.
Programe de Control Parental

Programele de Control Parental ajut la gestionarea modului n care copii utilizeaz computerul. Avei posibilitatea s setai urmtoarele opiuni: Limite de timp - permite folosirea computerului n anumite intervale de timp; se pot stabili diferite ore pentru fiecare zi a sptmnii ; dac suntei conectai i timpul expir, copii vor fi deconectai automat. Jocuri - controlai accesul la jocuri, alegei un nivel de evaluare, tipurile de coninut ce vor fi blocate; Blocarea anumitor programe - stabilii ce programe vor fi blocate s ruleze; Interzicerea accesului la anumite site-uri web; Monitorizarea lucrului cu computerul.
Identificarea avantajelor de a publica informaii pe Web: beneficiile materiale, accesul la informaie a unui public larg, uurina n actualizare, interactivitatea cu publicul.
44
GMB Computers
CONSTANA
Avantajele internetului drept canal de promovare pentru produse sau servicii

Este un mijloc rapid si usor de accesat de catre oricine, utilizat pentru informare de un numar crescator de persoane; Internetul este o unealta perfecta pentru informare si invatare. Este un mijloc de comunicare foarte flexibil, are capacitatea de a modifica imediat continutul unui mesaj, putand reactiona imediat sub imboldul presiunii concurentiale; Are avantajul ca poate transporta mesaje publicitare complicate, ce pot contine in acelasi timp text, imagine si sunet in proportia dorita de client (mesaje multimedia); Costurile publicitatii pe internet sunt mici comparativ cu celelalte modalitati de promovare de produs, serviciu sau marca; In actualul peisaj oferit de massmedia traditionala, internetul reprezinta canalul cu cea mai mare raza de actiune ce poate fi utilizat pentru realizarea unor campanii de publicitate nationale sau globale.
Dezavantajele utilizarii internetului in publicitate:

Consumatorii in varsta prezinta inca reticenta in a utiliza internetul pentru achizitii de produse sau servicii deoarece trebuie sa-si ofere informatiile cartilor de credit, iar site-urile destinate tranzactiilor si comertului nu sunt mereu sigure. Numarul mare de oferte disponibile si imposibilitatea de a intra in contact direct cu produsul ii determina pe multi consumatori sa prefere mijloacele traditionale de informare si achizitie. Unii consumatori prefera achizitionarea unui produs sau serviciu direct, astfel le ofera mai multa incredere si au senzatia de control asupra situatiei. Este evident ca sunt mai multe avantaje ale publicitatii pe Internet, unele poate nedescoperite inca. Concluzia este ca evolutia actuala a internetului ofera solutii din ce in ce mai variate de promovare. Publicitatea pe internet fiind mult mai raspandita decat cea din media traditionala. Avantajele tangibile Creterea vnzrilor, care conduce la creterea veniturilor prin ctigarea de: O noi clieni, noi piee de desfacere O clieni existeni (vnzri repetate) O clieni existeni (vnzri indirecte)Reducerea costurilor de marketing prin: reducerea timpului de servire a clienilor vnzri online
45
GMB Computers
CONSTANA
reducerea costurilor privind imprimarea i distribuirea elementelor de publicitateReducerea costurilor de aprovizionare: nivel redus al inventarului creterea competiiei ntre furnizori reducerea timpului de procesare a comenzilor Reducerea costurilor administrative prin intermediul unor procese de afaceri maieficiente, cum ar fi recrutarea personalului sau plata facturilor Avantaje intangibile Prezentarea imaginii firmeiBrandulCampanii de marketing mai rapide i mai eficiente, inclusiv PR Cicluri de producie ale produselor mai rapide, care permit o adaptare mairapid la cerinele pieeimbuntirea serviciilor oferite clienilor Adaptarea la cerinele viitoruluiSatisfacerea dorinelor consumatorilor ct mai bineIdentificarea de noi parteneri de afaceri i imbuntirea relaiilor cu partenerii mai vechiUn management mai bun al informaiilor de marketing i mai ales al celor referitoare la clieniFeedback din partea clienilor n ceea ce privete produsele sau serviciileoferite Principalele avantajele ale comerului electronic Ca i un mediu comercial, Web ofer un numr important de beneficii care pot fi examinate att la nivelul consumatorilor ct i la nivelul firmelor. Un beneficiu important al consumatorilor este accesul la cantitatea mare deinformaii dinamice pentru sprijinirea lurii deciziilor. n plus caracterul interactiv aWebului permite cutare mai adnc, neliniar iniiat i controlat de clieni. De acum ncolo, comunicarea prin Web este mai mult condus de client, fa de massmedia tradiional, dirijat de cerinele furnizorului.Abilitatea Webului de a aduna, analiza i controla cantiti mari de date poate permite compararea cumprrilor i accelerarea procesului de gsire a articolelor.Webul faciliteaz proba i permite pe moment o satisfacie, clienii pot testa produsele online ceea ce stimuleaz cumprrile. De asemenea exist probabilitateaca produsele greu de gsit s fie disponibile i o selecie mai larg a articolelor datorit lrgimii i eficienei Webului. n plus avantajele pentru consumatorii industriali sunt date de costurile reduse datorit competiiei n procurarea materiilor prime, deoarece mai muli furnizori pot concura ntro pia electronic deschis.Acesta determin pe competitori s ofere produse de gam larg i de mai buncalitate i de a produce articole conform cererii. Din poziia de cumprtor, ctigul esenial este timpul deoarece acelai produs /serviciu poate fi cumprat mai ieftin, putnd fi vizitate mai multe magazine ntruntimp scurt. Din punct de vedere al companiilor ce utilizeaz comerul electronic avantajele sunt multiple: creterea semnificativ a vitezei de comunicare, n special pentru comunicaiile internaionale; mbuntirea eficienei, dat fiind faptul c datele nu mai trebuie retastate manualatt n calculatorul vnztorului, ct i al cumprtorului, permind minii delucru s fie utilizat mai productiv; erorile de retastare se elimin; ciclurile de producie i cumprare se reduc drastic reducerea unor costuri, utiliznd emailul scad costurile cu pota sau mesagerieiar EDI poate nsemna o mare reducere a stocurilor i a costurilor legate de ciclulde cumprare; ntrirea relaiilor cu clienii i cu furnizorii, prin siteul Web al companiei care prezint permanent partenerilor ultimele informaii necesare acestora iar EDIimplic lucrul ntro strns legtur a partenerilor; o cale rapid i comod de furnizare a informaiilor despre o companie sau despre produsele sale prin intermediul unor siteuri www, a Intraneturilor sau Extraneturilor. canale alternative de vnzare, cum sunt afacerile prin intermediul unui site Web.1. Beneficii pentru firme
46
GMB Computers
CONSTANA
Extinderea la piee internaionale; Scdera costului de creare, procesare, distribuire, pstrare i gsire ainformaiei bazat pe hrtie; Creeaz posibilitatea modelrii produselor i serviciilor pe nevoilecumprtorilor; Costuri de comunicaie mai mici.2. Beneficii pentru consumatori D posibilitatea consumatorilor s cumpere sau s fac tranzacii 24h/zi,n tot timpul anului din aproape orice locaie; Acord consumatorilor mai multe posibiliti de alegere; Cumprtorii pot s aleag mai uor cel mai mic pre pentru un produs sauserviciu. Tipologia pieelor electronice globale Literatura de specialitate clasific pieele electronice globale n patru grupe: piee electronice intrinsec globale care se ocup cu produse globale,consumatori, furnizori (exemplu: ntreinere, reparaii, automobile). piee locale global organizate (de exemplu, licitaiile de bunuri perisabile); piee locale cu infrastructur global asociaii de export n care produsele sunt exportate global prin colaborarea productorilor. Beneficii pentru societate D posibilitatea mai multor persoane s lucreze de acas i s cumpere de acas ceea ce rezult n trafic mai mic pe strzi i popualre sczut aaerului; Permite ca anumite mrfuri s fie vndute la preuri mai sczute, cuavantaje pentru cei cu venituri mai mici; Crete eficiena i/sau mbuntesc calitatea.Beneficiile firmei sunt canalizate ndeosebi n domeniul distribuiei, comunicrii, precum i beneficii operaionale. Prin utilizarea Webului ca un canal de distribuie,costurile de distribuie sau costul vnzrii se contracteaz la zero. Acesta este mai probabil n domeniul publicitii, furnizarea informaiilor sau produse digitale. Mai mult, cumprtorii i vnztorii se pot contacta direct eliminnd cheltuieli demarketing i constrngerile impuse de asemenea interaciuni n lumea terestr, fcnddistribuia mai eficient. Timpul pentru desvrirea tranzaciilor comerciale sereduce, transformnduse n eficiene adiionale. Tehnologia ofer firmelor oportunitatea de a monitoriza alegerile consumatorilor prin dezvluirea preferinelor lor n comportamentul de navigare i cumprare prin Web.n general firmele utilizeaz Webul pentru a furniza informaii despre firm idespre oferta lor, precum i pentru comunicare intern i extern cu alte firme iconsumatori. Siteurile Web sunt la dispoziia clienilor 24 de ore pe zi,7 zile pesptmn. Caracterul interactiv al mediului poate fi folosit de marketeri pentruatragerea ateniei clienilor, prin angajarea lor ntrun dialog care este o comoditate pentru ambele pri, acesta oferind oportunitatea de a croi comunicaie precis cuconsumatorii individuali, permind clienilor de a solicita informaii ct doresc.Obinerea informaiilor relevante despre clieni, care sunt utilizate n scopul de aservi mai eficient n viitor permite firmelor s dea informaii clienilor despre ofertelelor i de a obine informaii despre clieni, despre necesiti, preferinele lor. Unaspect important este oportunitatea competiiei bazate pe axele specialitii n loc deaxele preurilor.Beneficiile operaionale ale Webului, n cazul vnzrilor, sunt erori reduse i ctigde timp n procesarea informaiilor; costuri reduse prin accesarea electronic a bazelor de date a ofertei. n plus este facilitat crearea de noi piee i segmente de pia precum i intrarea mai uoar pe pieele existente i timp mai redus pentrutranzacii. Prin acesta este mai uoar i mai ieftin gsirea clienilor potenialieliminnd i obstacolele dintre diferii pai ai subproceselor de afaceri.
47
GMB Computers
CONSTANA
Limbajul HTML
Istoric al Limbajului HTML
Unul din primele elemente fundamentale ale WWW ( World Wide Web) este HTML (Hypertext Markup Language), care descrie formatul primar in care documentele sunt distribuite si vazute pe Web. Multe din trasaturile lui, cum ar fi independenta fata de platforma, structurarea formatarii si legaturile hypertext, fac din ele un foarte bun format pentru documentele Internet si Web. Primele specificatii de baza ale Web-ului au fost HTML, HTTP si URL. HTML a fost dezvoltat initial de Tim Berners-Lee la CERN in 1989. HTML a fost vazut ca o posibilitate pentru fizicienii care utilizeaza computere diferite si schimba intre ei informatie utilizand Internetul. Erau prin urmare necesare cateva trasaturi: Independenta de platforma, posibilitati hypertext si structurarea documentelor. Independenta de platforma inseamna ca un document poate fi afisat in mod asemanator de computere diferite (deci cu fonte, grafica si culori diferite ), lucru vital pentru o audienta atat de variata. Hipertext inseamna ca orice cuvant, fraza, imagine sau alt element al documentului vazut de un utilizator ( client ) poate face referinta la un alt document, ceea ce usureaza mult navigarea intre multiple documente sau chiar in interiorul aceluiasi document. Structurarea riguroasa a documentelor permite convertirea acestora dintr-un format in altul, precum si interogarea unor baze de date formate din aceste documente.
Structura limbajului HTML

HTML sau HyperText Markup Language este, asa cum o sugereaz si definitia, un limbaj de marcare pentru hypertext. Poate esti putin ngrijorat cnd vezi c HTML este un limbaj de marcare si esti ngrozit de gndul c trebuie s nveti asa ceva. Este cazul s nu-ti faci probleme ntruct HTML este un limbaj de marcare si nu un limbaj de programare precum C, C++, VisualBasic, etc. Ei bine, Hipertext se refer la modalitatea n care se fac legturile intre diferite documente HTML. n fapt, hipertext trebuie nteles ca un text mai profund dect dect un text normal. De exemplu, o pagin de hypertext nu este doar o simpl pagin de text, asa cum ai fi tentat s crezi la prima vedere. Ea este o pagin care, pe lng textul propriuzis, mai contine si niste legturi (hiperlegturi) ctre alte texte care abordeaz acelasi subiect ca si cel tratat n pagina de unde se fac legturile (hiperlegturile sunt acele texte subliniate sau nu, de cele mai mute ori scrise cu albastru si, atunci cnd ne pozitionm cu mouse-ul asupra lor, cursorul devine activ). Astfel vom constata c, pentru un subiect oarecare, avem la dispozitie o documentatie impresionant ce poate fi accesat de la o simpl pagin de hipertext (prin intermediul hiperlegturilor). Datorit acestor trimiteri ctre alte texte constatm c textul initial are o profunzime mult mai mare, dect ar avea un text normal care este limitat doar la ceea ce se vede. Pentru a simplifica lucrurile hypertextul trebuie nteles ca un text cu legturi ctre alte texte. O parte dintre avantajele hipertextului fata de textul tiparit sint: forma neliniara a hipertextului ofera capabilitati eficiente de parcurgere a continutului; mediile electronice pot stoca o cantitate impresionanta de informatii; hipertextul ofera o mai buna vizualizare a continutului si o navigare rapida, orict de complexe ar fi documentele, tinind cont de specificatiile utilizatorilor; in cadrul sistemelor hipertext, interogarile, filtrarile, diversele preferinte si adnotarile
48
GMB Computers
CONSTANA
utilizatorilor pot fi refolosite ori de cite ori este necesar, putind fi stocate in cadrul structurii hipertext a documentelor folosite.
Lucrul cu HTML
nainte de orice comentariu, s considerm urmtorul exemplu: <HTML> <HEAD> <TITLE>PRIMUL DOCUMENT</TITLE> </HEAD> <BODY> <H4>PRIMUL EXEMPLU</H4> <P>Acesta este un paragraf</P> </BODY> </HTML> mai jos este redat rezultatul unui asemenea document: Acesta este un paragraf S analizm exemplul de mai sus. Acesta este un exemplu de document HTML cu un numar minim de elemente. Structura minim obligatorie a unui document HTML este format din elementele HTML, HEAD, TITLE si BODY iar ordinea de aparitie a acestora este ca n exemplul prezentat.
Primul element va fi elementul HTML (mai exact tag-ul de nceput al acestui element). ntre tagul de nceput si tagul de sfrsit al elementului HTML se vor regsi toate elementele ce intr in structura unui document HTML. Urmtorul element este elementul HEAD. ntre tag-urile acestui element vor fi cuprinse alte elemente care vor contine diferite date cum ar fi autorul documentului, descrieri ale documentului, cuvinte reprezentative care sunt utilizate de motoarele de cautare ( Yahoo, AltaVista, Lycos, etc), stilul documentului, titlul documentului, etc. Aceste elemente vor fi luate n discutie ntr-o alta sectiune. Cu exceptia elementului TITLE, toate celelalte elemente cuprinse ntre tag-urile elementului HEAD nu vor fi afisate in fereastra browserului. n exemplul nostru am folosit elementul TITLE. Acesta nu semnific numele fisierului HTML ci reprezint titlul documentului si va fi afisat in bara de titlu a browserului (adic acea bar care este de
49
GMB Computers
CONSTANA
culoare albastr cind este activ care contine si butoanele de maximizare, minimizare si nchidere a browserului). Dup elementul HEAD urmeaz tagurile elementului BODY. ntre tag-urile acestui element vor fi incluse toate elementele care vor fi afisate n fereastra browserului, adic acele elemente care au un impact vizual asupra paginii de web. n exemplul de mai sus nu sunt dect dou elemente si anume un antet ( sau titlu ) definit de elementul H si un paragraf definit cu ajutorul elementului P. Lista elementelor ce pot fi incluse intre tag-urile elemenului BODY este mai cuprinztoare si va fi prezentat n continuare.
Cnd am discutat despre elemente si tag-uri, nu am prezentat cte tipuri de elemente HTML exist. Acum, dup ce ai vzut care este structura obligatorie a unui document HTML, vei putea s ntelegi de cte feluri sunt elementele HTML. Elementele HTML sunt de dou feluri: 1. Elementele cuprinse ntre tag-urile elementului BODY sunt denumite generic elemente de tip Block-Level. Cu alte cuvinte, sunt elemente care definesc o structur mai mare n cadrul unui text cum ar fi paragrafe, liste, citate mai mari, tabele, etc. Exemple de elemente block-level: P, TABLE, UL, OL, BLOCKQUOTE, etc 2. Elementele care actioneaz asupra unei portiuni de text, care sunt cuprinse n cadrul unui element de tip Block-Level, se numesc elemente de tip inline (continute ntr-o linie de text). Cele mai utilizate elemente de tip inline sunt elementele cu ajutorul crora se modific aspectul textului sau mai tehnic spus sunt acele elemente cu ajutorul crora se realizeaz formatarea textului. Elementele de tip inline nu se limiteaz dor la elementele de formatare acestea fiind doar o parte dintre ele. Exemple de elemente inline: EM, I, B, STRONG, BIG, A, BR, FONT, etc. Pe msur ce vei avansa vei afla mai multe despre aceste elemente. Pentru a exemplifica cele de mai sus s considerm urmatorul exemplu: <P> Acesta <EM> este </EM> un paragraf </P> n acest exemplu elementul P este un element de tip block-level si elementul EM, care este continut de elementul P, este un element de tip inline. Observatie: un element de tip inline poate fi continut n orice element de tip block-level dar nu orice element de tip block-level poate fi continut de un alt element de tip block-level. Pe lng acest lucru trebuie acordat o mare atentie si modului de realizare a unor astfel de constructii, evitnduse constructiile nlntuite.
Un document poate contine unul sau mai multe titluri. Pentru aceasta HTML dispune de elementul H (heading). Forma general este: <Hnr> TITLU </Hnr> unde nr este un numr ce poate avea valori de la 1 la 6 n functie de importanta care o are titlul respectiv n cadrul documentului. H1 va duce la realizarea de titluri foarte evidente iar H6
50
GMB Computers
CONSTANA
va reprezenta forma cea mai putin evident. Mai jos sunt redate modurile de afisare pentru fiecare valoare n parte. <H1>Titlu realizat cu H1</H1> <H2>Titlu realizat cu H2</H2> <H3>Titlu realizat cu H3</H3> <H4>Titlu realizat cu H4</H4> <H5>Titlu realizat cu H5</H5> <H6>Titlu realizat cu H6</H6> Modul de afisare al titlurilor difer n functie de fonturile utilizate (setul de caractere care este utilizat pentru afisarea paginii n fereastra browserului). De exemplu chiar dac utilizm H2 pentru realizarea titlurilor, modul de prezentare poate diferi dac sunt utilizate fonturi diferite. n exemplul de mai jos am prezentat un asemenea caz. Pentru alinierea pe orizontal se foloseste atributul ALIGN iar valorile pe care le poate lua sunt left, right, center si justify. Mai jos este un exemlu de titlu centrat n pagin. <H3 ALIGN="center">Acest titlu este centrat</H3> Not: utilizarea elementului H trebuie fcut cu dicernmnt. Ca regul general nu este estetic s intercalm n sens invers dou titluri de mrimi diferite, adic s avem n pagin o succesiune de titluri de forma H2, H1, H5. Ele trebuie utilizate n ordinea importantei care o sugereaz si este corect s le folosim ntr-o ordine descresctoare. Arunc o privire la exemplul urmtor si ncearc s-ti imaginezi ct de inestetic ar putea arta o pagin n care s fie prezente titluri n succesiunea prezentat mai jos. Standardul official HTML este World Wide Web Consortium (W3C), care este afiliat la Internet Engineering Task Force (IETF). W3C a enuntat cateva versiuni ale specificatiei HTML, printre care si HTML 2.0, HTML 3.0, HTML 3.2, HTML 4.0 si, cel mai recent, HTML 4.01. In acelasi timp, autorii de browsere, cum ar fi Netscape si Microsoft, au dezvoltat adesea propriile extensii HTML in afara procesului standard si le-au incorporate in browserele lor. In unele cazuri, cum ar fi tagul Netscape, aceste extensii au devenit standarde adoptate de autorii de browsere. In mai 1996, W3C a scos pe piata specificatia HTML 3.2, care era proiectata sa reflecte si sa standardizeze practicile acceptatela scara larga. Deci, HTML 3.2 include tagurile HTML 3.0 ce erau adoptate de autorii de browsere ca Netscape si Microsoft plus extensii HTML raspandite. In bilantul asupra HTML, W3C recomanda ca providerii de informatii sa utilizeze specificatia HTML 3.2. Versiunile curente ale majoritatii browserelor ar trebui sa suporte toate, sau aproape aceste taguri. n prezent, HTML 4.0 este mai putin utilizat fiind deja publicate specificatiile HTML 4.01.
Accesibilitatea web se refera la accesul persoanelor cu dizabilitati la continutul web. Mai clar, accesibilitatea web inseamna un design web care permite persoanelor cu dizabilitati sa perceapa, inteleaga, navigheze si sa interactioneze cu paginile web in mod eficient si sa creeze continut web. Exista milioane de oameni cu dizabilitati care afecteaza modul in care ei folosesc web-ul. In momentul de fata majoritatea site-urilor web au bariere de accesibilitate care fac accesul persoanelor cu dizabilitati la site dificil sau chiar imposibil. Totusi, daca site-urile web si software-ul web ar fi accesibile, persoanele cu dizabilitati ar putea folosi web-ul intr-un mod eficient.
51
GMB Computers
CONSTANA
Accesibilitatea web tine cont de toate tipurile de dizabilitati, inclusiv vizuale, auditive, fizice, de vorbire, cognitive si neurologice. Pentru mai multe informatii, vezi "How People with dizabilities Use the Web", un document in engleza care explica felul in care diferitele dizabilitati afecteaza folosirea web-ului. De accesibilitatea web beneficiaza si persoanele fara dizabilitati. Spre exemplu, un principiu cheie al accesibilitatii web este flexibilitatea. Flexibilite cu privire la diferite nevoi, situatii sau preferinte. De flexibilitate beneficiaza toate persoanele care folosesc web-ul, inclusiv persoane fara dizabilitati in anumite situatii (spre exemplu o conexiune proasta la internet), persoane cu dizabilitati temporare (spre exemplu o persoana cu mana rupta), si unele persoane in varsta. Pentru mai multe informatii, vezi "Developing a Web Accessibility Business Case for Your Organization."
Etapele realizarii unei aplicatii

Pentru realizarea unei aplicaii profesionale multimedia sau Web se parcurg 5 faze majore (figura de mai jos.): 1. Concepia (culegerea specificaiilor i analiza) 2. Realizarea propriu zis ( proiectarea, testarea, realizarea prototipului) 3. Publicarea i promovarea aplicaiei (testarea prototipului) 4. Exploatarea i ntreinerea aplicaiei (modificarea i dezvoltarea prototipului) 5. Evoluia aplicaiei ( dezvoltarea acesteia prin parcurgerea unui nou ciclul de analiz, proiectare, implementare, testare) Concepia aplicaiei Concepia reprezint faza n care firma care dorete realizarea unei aplicaii multimedia i definete obiectivele aplicaiei i stabilete coninutul i sursele de lucru. Aceasta presupune crearea aplicaiei, crearea coninutului, constituirea surselor de lucru, planing, estimarea timpului necesar realizrii aplicaiei, repartiia sarcinilor n echip i managementul fazei. Crearea aplicaiei presupune stabilirea celor patru obiective specifice aplicaiilor multimedia: concept, filosofie, inginerie i public.
52
GMB Computers
CONSTANA
Crearea coninutului implic o concentrare a eforturilor echipei n realizarea elementelor media specifice publicaiilor electronice: Constituirea surselor de lucru pornete de la cele existente deja n proiect i identific sursele necesare a fi create prin proiect.
Echipa de realizare
Echipa de elaborare a proiectului cuprinde civa specialiti care au competene distincte i rol bine definit n realizarea acestui proiect, conform figurii Seful proiectului Rol: Coordoneaz dezvoltarea unei aplicaii multimedia i asigur succesul artistic, tehnic i informatic, de la faza de concepie pn la finalizarea concret a acesteia. Sarcini: Proiecteaz, coordoneaz i controleaz procesul de producie n cadrul unui proiect multimedia, Realizeaz structura siteului n colaborare cu infograficianul, Rspunde de evaluarea resurselor necesare pentru realizarea proiectului,
53
GMB Computers
CONSTANA
Webmaster
Rol: Responsabil de mentenana produsului sau serviciilor multimedia. Sarcini: Asigur i menine comunicaia ntre membrii echipei furniznd resurse hardware i gestionnd tranzaciile, mesajele sau schimbul interactiv de informaii ntre utilizatori, menine statisticile de frecventare a unui site, pentru a permite evaluarea eficacitii sau rentabilitii procedeelor utilizate, asigurnd ameliorarea acestora,etc
Webdesigner
Rol: Realizeaz elementele de interfa i navigare precum i cele de interactivitate cu vizitatorii siteului. Sarcini: Proiecteaz i realizeaz interfee SQL / PHP, Dezvolt alte aplicaii: scripturi, CGI proceduri C++, appleturi Java, servlei etc.
Programator multimedia
Rol: Asigur realizarea tehnic i dezvoltarea informatic a unei aplicaii multimedia pe baza analizei, dezvoltrii i optimizrii, folosind aplicaii interactive cu funcionaliti specifice. Sarcini: Asambleaz i integreaz diferite medii componente i programeaz aplicaii specifice
Infografician (infodesigner)
Rol: Specialist n grafica 2D, 3D care asigur retuarea imaginilor, fotografiilor i a altor elemente grafice, design sonor, video, montaj numeric, imagini de sintez etc. Sarcini: Realizeaz structura grafic pornind de la arhitectura site-ului
Sectiunile unui document HTML

Un document HTML este impartit in trei sectiuni: Sectiunea de informatii HTML Sectiunea de antet a documentului Corpul documentului Controalele <HTML> si <HTML> incadreaza antetul si corpul documentului .Ele comunica interpretorului HTML ca blocul de text cuprins intre ele este scris si formatat in limbajul HTML
54
GMB Computers
CONSTANA
standard. Prezenta acestor etichete in document este optionala.Structura explicata a unui document HTML: <html> <head>  <title>Structura Documentului HTML</title> <META http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body>  Salut. Aceasta este o pagina Web cat se poate de simpla. </body> </html>
Structura unei pagini web: <html>
<head> <title>Titlul paginii</title> </head>
<body> Coninutul paginii </body>
</html>
Sectiunea de informatii
Sectiunea de informatii HTML ofera informatii asupra versiunii limbajului HTML folosit. Multe editoare de HTML insereaza automat textul necesar la inceputul documentului Exemplu: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Antetul documentului
Sectiunea de antet a documentului este incadrata de controalele <HEAD> si </HEAD>. Prezenta celor doua controale in document este optionala, insa ea ajuta la o impartire mai
55
GMB Computers
CONSTANA
clara a documentului pe sectiuni.Antetul documentului cuprinde, in general, informatii precum titlul documentului (pentru a fi afisat pa baza de sus a a ferestrei programului de navigare sau pentru ca documentul sa poata fi mai usor identificat de catre utilizator), cuvinte-cheie care folosesc motoarelor de cautare de documente, precum si alte informatii legate de documentul creat. Informatiile folosite in aceasta sectiune nu sunt afisate de catre browser, ele avand doar rol informativ. Astfel: <TITLE> indica titlul documentului. Textul aflat aici va fi - de obicei- afisat pe bara de titlu al programului de exporare sau va putea fi folosit de utilizatori pentru pastrarea documentului in listele specifice ale acestui program. <META> si <LINK> ofera asa-numitele meta-informatii despre document declarand anumite proprietati impreuna cu valorile acelor proprietati. Daca valoarea unei proprietati este definita intern se va folosi controlul <META>, iar daca valoarea va fi luata dintr-o locatie oarecare din exterior se va folosi controlul <LINK>. Succesul folosirii acestor doua controale depinde in mare masura de interpretorul de HTML utilizat de catre utilizator. De exemplu, cu ajutorul elementului META se pot preciza informatiile care vor fi trimise in "header-ul" documentului, adica informatii specifice protocolului HTTP si pe care browserul le "citeste" pentru a pregati afisarea documentului.Se folosesc formularile: http-equiv= pentru numele informatiei meta content= pentru continutul (valoarea) informatiei respective. In exemplul de mai jos se foloseste informatia meta Content-Type pentru a preciza: tipul documentului setul de caractere folosit Tipul documentului este - pentru un document HTML - "text/html". Setul de caractere reprezinta o multime de caractere folosite in alfabetul diferitelor limbi, caractere identificate printr-un numar de cod. De aceea, pentru ca browserul sa poata descifra corect informatia pe care o primeste este recomandabil ca acest atribut sa fie specificat in antetul fiecarui document. Seturile de caractere sunt niste standarde stabilite de catre ISO (Organizatia Internationala pentru Standardizare) si reprezinta reguli de codificare a caracterelor. Printre cele mai folosite astfel de seturi aminitim: ISO 8859-1 -(sau ISO Latin-1) reprezinta setul care contine cele mai raspandite extensii ale alfabetului latinsi este cel mai des intalnit ISO 8859-5 - alfabetul chirilic ISO 8859-6 - alfabetul arab ISO 646 - codificarea ASCII restransa (pe 7 biti, adica 128 de caractere) Exemplu: <META http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> Pentru alte tipuri de informatii meta cuprinse in antet se va utiliza formularea <META name="[nume proprietate]" content="[valoare proprietate]"> In acest mod se pot specifica informnatii privind autorul paginii respective, sau informatii in scopuri de indexare a paginii de catre paianjeni sau motoare de cautare Web. Exemplu: <META name="author" content="Superman"> <META name="keywords" content="Sport, fotbal, FIFA"> Despre elementul LINK vom vorbi intr-unul din capitolele urmatoare.
56
GMB Computers
CONSTANA
Corpul documentului
Corpul documentului este locul unde se plaseaza continutul efectiv al documentului si este incadrat de controalele <BODY> si </BODY>. Chiar daca marcarea corpului documentului cu cele doua etichete este optionala, folosirea lor va determina o mai mare claritate in impartirea documentului pe sectiuni. Controlul <BODY> poate sa contina atribute referitoare la fondul si marginile documentului sau culoarea textului. Astfel: background = "imagine.jpeg" seteaza imaginea de fond a documentului. bgcolor = "#0000ff" seteaza culoare fondului documentului (Aqua). In cazul in care ambele sunt prezente, browserul cauta fisierul mentionat ca imagine de fond. Daca acesta exista, el va fi afisat si multiplicat pentru a acoperi intreaga suprafata a documentului, culoarea de fond fiind vizibila numai daca fondul imagini este transparent. Daca nu, fondul documentului va fi dat de culoarea setata de catre bgcolor. text = "#ff0000" seteaza culoarea textului existent in document. Pentru a seta dimensiunile marginilor din stanga si de sus ale documentului se folosesc atributele: Pentru Internet Explorer: topmargin - pentru marginea de sus leftmargin - pentru marginea din stanga Pentru Netscape Navigator: marginheight - pentru marginea de sus marginwidth - pentru marginea din stanga Pentru Internet Explorer exista posibilitatea de a atasa unui document un fond sonor. Aceasta se poate realiza prin folosirea in antetul documentului a elementului BGSOUND. Doua dintre atributele acestuia sunt foarte importante: src - determina fisierul audio care va fi rulat de catre browser la incarcarea documentului in fereastra loop - determina de cate ori va fi repetata secventa de sunet respectiva. O valoare egala cu -1 determina repetarea continua a sunetului Exemplu:Document cu imagine de fundal <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Document cu imagine si sunet de fundal</title> <meta http-equiv=content-type content=text/html; charset=iso-8859-1> <bgsound src=muzica.mp3 loop=-1> </head> <body background=pozamea.jpg bgcolor=#ff0000 text=#800080> Acest document are o imagine in fundal </body> </html> Exemplu:Document cu setarea culorii fundalului si a dimensiunii marginilor <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Document cu culoare de fond</title>
57
GMB Computers
CONSTANA
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="#00FFFF" text="#000080" marginwidth=0 marginheight=0 leftmargin=0 topmargin=0> Aceasta pagina are culoarea de fond "aqua". Textul va fi tiparit cu culoare albastra <br> Marginile documentului au fost fixate la <b>"0"</b> prin setari care vor fi acceptate si de Internet Explorer si de Netscape Navigator </body> </html> In cazul in care in corpul documentului interpretorul HTML gasete o eticheta pe care nu o recunoaste (o eticheta scrisa gresit, inexistenta sau o eticheta de sfarsit care nu are eticheta de inceput corespunzatoare) el nu o va lua in considerare, tiparind doar eventualul continut marcat de eticheta respectiva. Insa aceste etichete "scapate" in corpul documentului pot provoca diferente semnificative intre forma dorita si cea obtinuta a continutului afectat!
Ce este Flash?
s piard din calitate. ecesit cunotinte de programare i este uor de nvtat. Filmele Flash au extensia .swf. Cum port aduga filme flash n pagina mea? n seciunea HTML, Integrarea Multimedia, vom arta cum se pot aduga fiiere video n pagina web. Acelai lucru se aplic cand trebuie adugat un film flash. Cu toate asta exist i o metod alternativ pentru a adauga flash in pagina web: <object width="550" height="400"> <param name="movie" value="somefilename.swf"> <embed src="somefilename.swf" width="550" height="400"> </embed> </object> Cine poate vedea i crea filme flash? Pentru a vedea filme flash e nevoie de Adobe Flash Player. Dac nu este instalat Adobe Flash Player poate fi downloadat gratis de pe siteul Adobe. Pentru a putea crea filme flash este nevoie trebuie cumprat un program Flash. Ultima versiune de la Adobe este Adobe Flash Professional CS4 Dac nu este instalat vreun program Flash, poate fi luat un trial de 30 de zile. Cum se poate crea un obiect care se mic? 1. Se creaz un fiier Flash nou (File->New sau Ctrl+N). Se alege Flash Document. 2. n timeline-ul care apare, exist un layer (Layer 1) cu un blank keyframe(Keyframe gol).
Se selecteaz un keyframe i folosind Oval Tool i o culoare la alegere.
58
GMB Computers
CONSTANA
3.Selectm frame-ul 30 din timeline i prin click-dreapta adugam frame-uri.
Astfel, poza dinamica pe care am creat-o va avea o durata de 30 de frame-uri. 4. Selectm orice frame din timeline i intrm in Properties Panel i dintre parametri alegem micarea.
Selectm frame-ul 30 prin dublu click dreapta i l convertim in cadru-cheie. 6. Urmnd aceeai procedura, adugam un cadru-cheie in frame-ul 2, frame-ul 15 i frame-ul 29.Acum, timeline-ul ar trebui s arate astfel: 7. Selectm frame-ul 2 i mutam mingea pe care am creat-o cu 2-3 pixeli deasupra poziiei iniiale. Apoi selectm frame-ul 15 i mutam mingea mai departe in sus. Apoi selectm frame-ul 29 i facem ceea ce am fcut i in frame-ul 2.Astfel am terminat animaia mingii. 8. In scopul de a face ca micarea obiectului s para cat mai reala, putem aduga o umbra care va urmri micarea sa. Astfel, cream un nou strat sub stratul creat pentru minge.
9. Adugam 30 de frame-uri exact cum am fcut pentru i cu Oval Tool cream o elipsa pe care o coloram gri. 10.Selectm din Properties Panel parametrul dintre forma, la fel cum am ales micarea la paragraful 4.Parametrul va avea valoarea -100. Timeline-ul ar trebui s arate astfel:
minge
Ease
11.Adugam un cadru-cheie in frame-ul 15 i micoram mrimea umbrei utiliznd Free Transform Tool. 12. Acum putem vizualiza lucrarea noastr apsnd Ctrl+Enter i o salvam cu o extensie Flash (.swf) movie file.
59
GMB Computers
CONSTANA
Despre elemente si tag-uri

Asa cum ai vzut n introducere, structura unui document poate contine mai multe elemente cum ar fi: un titlu sau antet, unu sau mai multe paragrafe, un tabel, un citat, etc. n cazul HTML exist echivalentul acestor elemente si care poart tot denumirea de elemente. Denumirea acestor elemente reprezint, de regul, prescurtarea (n unele cazuri doar initialele) de la forma in limba englez a elementului respectiv. De exemplu, elementul P (paragraph) indica un paragraf, elementul TABLE indic un tabel, elementul UL (unordered list) indic o list neordonat, etc. S privim putin la exemplul urmator: <P>Acesta este un paragraf</P> <P>Acesta este un alt paragraf si, prin urmare, va fi scris pe un rnd nou.</P> Asa cum se vede din exemplul de mai sus, pentru a indica c o anumit portiune din text trebuie s fie afisat ca un paragraf folosim elementul P, element ce este format din 2 tag-uri. Primul tag, care este si tagul de inceput, este format din doua paranteze unghiulare (<) si (>) ntre care se pune elementul dorit (n cazul nostru P). Tagul de sfrsit are n plus fat de tag -ul de nceput si un backslash (/) dup prima parantez unghiular (</P>). Tag-ul de nceput indic browser-ului unde ncepe elementul respectiv si tag-ul de sfrsit unde se termin acel element. De regul, elementele sunt formate din aceast pereche de tag-uri, dar exist si elemente care nu au dect un singur tag. Arunc o privire asupra exemplului de mai jos: <P>Acesta este un rnd<BR>Acest text va fi scris pe rndul urmtor</P> Tag-ul <BR> indic ntreruperea continuittii unei expresii, adic ceea ce se afl scris dup acest element va fi scris pe rndul imediat urmator. A nu se confunda rezultatele actiunii tagului <BR> cu cele ale tag-ului <P>, la acesta din urm scrierea textului ncepnd la un rnd distant fat de ultimul paragraf. ntruct nu exist nici o logic pentru care ar exista un tag de nceput si unul de sfrsit n cazul elementului BR, acesta este format dintr-un singur tag (nu am putea cuprinde un cuvnt sau o expresie ntre cele dou taguri ntruct nu are sens). Asemenea elementului <BR> mai exist alte elemente dar le vei descoperi pe parcurs.
Cteva consideratii asupra elementelor
Numele elementului nu este case-sensitive adic, chiar dac utilizm majuscule sau caractere obisnuite, rezultatul este acelasi. De exemplu <EM> este echivalent cu <Em> sau <em>. De multe ori este permis ca n cazul unor elemente tag -ul de sfrsit s fie omis. Acest lucru nu este indicat dar nici nu constituie o greseal dac se utilizeaz aceast pra ctic numai la elementele care permit acest lucru. Exemplul de mai jos ilustreaz acest lucru.
60
GMB Computers
CONSTANA
<ul> <li>Unu</li> - cu tag de sfrsit <li>Doi - fr tag de sfrsit <li>Trei</li>- cu tag de sfrsit </ul>
o o o
Unu Doi Trei
De notat c prezenta tag-ului de sfrsit </UL> este obligatorie, omisiunea fiind posibila numai pentru elementul LI. Sunt elemente care pot contine alte elemente dar este interzis ca tagurile elementelor s fie nlntuite. Pentru a ntelege mai bine am dat un exemplu n care am utilizat trei elemente teoretice. <Tag1> <Tag2> <Tag3> EXEMPLU </Tag3> </Tag2> </Tag1> Cele trei perechi de tag-uri au efect asupra modului de afisare al cuvntului EXEMPLU. Nu conteaz care este primul tag folosit. Constructia din exemplul anterior are acelasi efect cu cea de mai jos. Asadar nu conteaz ordinea de aparitie a tagurilor. Ceea ce conteaz este pastrarea simetriei tag-urilor fat de textul aflat ntre ele. <Tag3> <Tag2> <Tag1> EXEMPLU </Tag1> </Tag2> </Tag3> Dac cele dou exemple reprezentau o construcsie corect, mai jos este prezentat o constructie cu tag-uri nlntuite. <Tag1> <Tag2> <Tag3> EXEMPLU </Tag1> </Tag3> </Tag2> Mai jos am prezentat un alt exemplu.
<P> Acesta este <B> un paragraf </B> </P> <P> Acest paragraf este <B> scris </P> incorect </B> n exemplul de mai sus, elementul B (cnd spun elementul B m refer la cele dou taguri ale acestui element, iar acest lucru este valabil pentru fiecare element n parte) poate fi continut de elementul P dar este interzis o constructie n care elementul B s rmn n afara elementului P. Dac unele browsere ar reusi totusi s citeasc o asemenea constructie incorect, n alte cazuri se poate ca rezultatele s fie imprevizibile si prin urmare pagina cu o astfel de constructie s fie afisat incorect. Acesta este doar un exemplu prin urmare, regula nu se limiteaz doar la elementele prezentate mai sus.
61
GMB Computers
CONSTANA
Atributele unui element

Atributele unui elemenent definesc diferite proprietati pentru elementul n cauz. Un element poate avea mai multe atribute iar acestea trebuie mentionate numai n tag-ul de nceput al elementului. S lum drept exemplu elementul HR cu ajutorul cruia se realizeaz trasarea unei linii. Acest element are mai multe atribute cum ar fi:

ALIGN - defineste pozitionarea n pagin a liniei SIZE - indic grosimea liniei WIDTH - indic lungimea acesteia (WIDTH=lungime, ntindere dar, la elementul HR, cea mai bun interpretare este de "lungime")
De exemplu o expresie de forma : <HR ALIGN="CENTER" WIDTH="50%"> va duce la realizarea unei linii pozitionate n centrul documentului iar cu ajutorul atributului WIDTH="50%" am specificat c aceast linie va fi trasat doar pe jumatate (50%) din ltimea documentului, asa cum se poate vedea si mai jos. Daca se omite precizarea acestor atribute atunci browser-ul va lua n considerate niste valori implicite. Pentru cazul particular analizat aici, atributul ALIGN va avea ca valoare implicita valoarea RIGHT, iar atributul WIDTH va avea valoarea 100%. Pentru exemplificare am prezentat mai jos cele spuse pn acum. <HR> Dac te uiti cu atentie la modul cum a fost trasat aceast linie vei vedea c, desi are o valoare de 100%, ea nu a fost trasat pe toat lungimea ecranului. Acest lucru se datoreaz faptului c linia n cauz a fost ncadrat ntr-un tabel. Dac vei ncerca si tu acest exemplu vei vedea c linia va fi trasat pe toat ltimea ecranului. n ceea ce priveste tabele, despre ele voi vorbi ceva mai trziu.
Consideratii asupra atributelor
Valorile atributelor pot fi prezentate sub mai multe forme. In cazul atributului WIDTH din exemplul precedent acesta are valoarea 100% care, de fapt, este o valoare relativ. Acelasi atribut poate avea o valoare fix exprimat n pixeli. Acest lucru se ntmpl pentru unele atribute care definesc proprietati cum ar fi, de exempu, lungimea unui element. Pentru alte elemente exist alte atribute cum ar fi atributul COLOR ce defineste culoarea unui element sau a unui font si n acest caz i se poate atribui ca valoare numele unei culori (yellow, green, red, etc) sau valoarea hexazecimal a acelei culori. Mai jos sunt cteva exemple de atribute (atributele sunt colorate n rosu si valorile atribuite sunt colorate n verde)
<FONT COLOR="RED"> <FONT COLOR="#FFFFFF"> - este echivalent cu <FONT COLOR="WHITE"> <TABLE WIDTH= "100%"> - atributul WIDTH are o valoare relativa <TABLE WIDTH= "640"> - atributul WIDTH are o valoare fixa
62
GMB Computers
CONSTANA
Valoarea atributului trebuie cuprins ntre ghilimele simple sau duble. Utilizarea ghilimelelor poate fi omis dac valoarea atribuit atributului n cauz este format dintr un grup de litere de forma A-Z, sau a-z, semnul minus ( - ) sau un punct ( . ). Aceast regul este valabil in cazul utilizrii alfabetului Englez. Chiar dac ncadrarea n ghilimele a valorii acestor atribute nu este obligatorie, utilizarea acestora este o practic des ntlnit n rndul realizatorilor de pagini HTML. Prin ncadrarea n ghilimele a valorii atributelor ne va fi mai usor atunci cnd vom dori s modificm o pagin HTML cu un continut ceva mai stufos. ntruct am prezentat cteva aspecte ale atributelor, este cazul s mai spun c nu este necesar specificarea tuturor atributelor. Atunci cnd utilizm un element putem specifica doar atributele care duc la modificarea valorilor initiale, urmnd ca restul atributelor sa aib valoarea implicit. Chiar dac nu ai cum s cunosti toate aceste valori cu timpul le vei retine, mai ales c multe dintre acestea au o valoare usor de intuit.
nainte de orice comentariu, s considerm urmtorul exemplu:

<HTML> <HEAD> <TITLE>PRIMUL DOCUMENT</TITLE> </HEAD> <BODY> <H4>PRIMUL EXEMPLU</H4> <P>Acesta este un paragraf</P> </BODY> </HTML>
mai jos este redat rezultatul unui asemenea document: Acesta este un paragraf S analizm exemplul de mai sus. Acesta este un exemplu de document HTML cu un numar minim de elemente. Structura minim obligatorie a unui document HTML este format din elementele HTML, HEAD, TITLE si BODY iar ordinea de aparitie a acestora este ca n exemplul prezentat.
Primul element va fi elementul HTML (mai exact tag-ul de nceput al acestui element). ntre tagul de nceput si tagul de sfrsit al elementului HTML se vor regsi toate elementele ce intr in structura unui document HTML. Urmtorul element este elementul HEAD. ntre tag-urile acestui element vor fi cuprinse alte elemente care vor contine diferite date cum ar fi autorul documentului, descrieri ale documentului, cuvinte reprezentative care sunt utilizate de motoarele de cautare ( Yahoo, AltaVista, Lycos, etc), stilul documentului, titlul documentului, etc. Aceste elemente vor fi luate n discutie ntr-o alta sectiune. Cu exceptia elementului TITLE, toate celelalte elemente cuprinse ntre tag-urile elementului HEAD nu vor fi afisate in fereastra browserului. n exemplul nostru am folosit elementul TITLE. Acesta nu semnific numele fisierului HTML ci reprezint titlul documentului si va fi afisat in bara de titlu a browserului (adic acea bar care este de culoare albastr cind este activ care contine si butoanele de maximizare, minimizare si nchidere a browserului). Dup elementul HEAD urmeaz tagurile elementului BODY. ntre tag-urile acestui element vor fi incluse toate elementele care vor fi afisate n fereastra browserului, adic acele elemente care au un impact vizual asupra paginii de web. n exemplul de mai sus nu sunt dect dou elemente si anume un antet ( sau titlu ) definit de elementul H
63
GMB Computers
CONSTANA
si un paragraf definit cu ajutorul elementului P. Lista elementelor ce pot fi incluse intre tag-urile elemenului BODY este mai cuprinztoare si va fi prezentat n continuare. Cnd utilizm un editor de text lucrurile sunt destul de simple. Dac dorim s facem trecerea la un nou paragraf nu trebuie dect s apasm tasta ENTER de dou ori si lucrurile sunt rezolvate. n cazul unui browser acest lucru se va ntmpla cnd acesta va ntilni elementul P in cadrul fisierului HTML. Cu alte cuvinte, browserul va afisa ca un paragraf tot textul cuprins ntre tag-urile <P> si </P>. n cazul n care este omis utilizarea acestor tag-uri ntregul text cuprins de tag-urile elementului BODY va fi tratat ca un paragraf unic. Acum trebuie s lmurim cteva aspecte referitoare la editarea documentelor HTML
Spre deosebire de editoarele de text, browser-ele nu tin cont de modul de arnjare n pagin a textului surs. De exemplu, un paragraf scris sub forma: <P>Acest text este scris pe un rd. Acest text se afl pe rndul urmtor</p>
va fi afisat sub forma unei singure linii, ca mai jos: Acest text este scris pe un rd. Acest text se afl pe rndul urmtor n cadrul fisierului surs se pot scrie mai multe paragrafe (dar pot fi si alte elemente) pe un singur rnd. De exemplu o expresie de forma: <h3>Titlu</h3> <P>Acesta este un paragraf</P><P>Acesta este un alt paragraf</P>
este corect si este echivalent cu expresia de mai jos:
<h3>Titlu</h3> <P>Acesta este un paragraf</P> <P>Acesta este un alt paragraf</P> Pozitionarea pe orizontal a textului se face cu ajutorul atributuli ALIGN. n tabelul de mai jos sunt prezentate valorile acestuia precum si efectele produse prin utilizarea acestor valori. Atribut LEFT CENTER RIGHT JUSTIFY Functie Alinierea textului la marginea stng a ferestrei. Centrarea textului. Alinierea textului la marginea dreapt a ferestrei. Alinierea textului la ambele margini.
S vedem cum lucreaz n practic aceste atribute: <P>Acesta este un paragraf aliniat la snga</P>
De remarcat c valoarea imlicit a atributului ALIGN este LEFT. Prin urmare, dac nu se specific nici un atribut, paragraful va fi aliniat automat la marginea stng a ferestrei browserului. <P ALIGN="CENTER">Acesta este un paragraf centrat</P>
64
GMB Computers
CONSTANA
<P ALIGN="RIGHT">Acesta este un paragraf aliniat la dreapta</P> Utilizarea atributului ALIGN="JUSTIFY" va avea drept rezultat alinierea textului la ambele margini. Prin alinierea unui paragraf la ambele margini apare un inconvenient de ordin estetic si anume faptul c, prin aceast fortare, spatiul dintre cuvinte nu va mai fi acelasi. Acest spatiu va varia n functie de modul n care se va umple rndul respectiv. Pe de alt parte, dac nu se atribuie aceast valoare, spatiul dintre cuvinte va fi acelasi dar textul va fi aliniat neuniform la marginea la care nu este aliniat (va avea un aspect "zimtat"). Rmne la latitudinea realizatorului de pagini web dac s foloseasc sau nu aceast valoare. Nu am s dau exemplu de paragrafe aliniate la ambele margini. Dac vrei s vezi cum sunt aliniate priveste la modul n care se face alinierea n acest site.
Utilizarea repetat paragrafelor goale (adic o succesiune de elemente sub forma <P><P><P>) n scopul realizrii unui spatiu mai mare ntre dou paragrafe nu constituie o solutie corect. Chiar dac un browser poate interpreta corect acest lucru exist browsere care nu citesc dect un singur paragraf gol, urmnd ca restul paragrafelor goale s fie ignorate. n plus, recomandrile W3C sugereaz s nu fie utilizate paragrafe goale. ntre dou paragrafe va rmne un rnd liber. Distanta dintre paragrafe poate fi modificat dar acest lucru nu poate fi realizat prin intermediul elementelor existente in HTML. Dac dorim s modificm spatiul dintre paragrafe va trebui s utilizm CSS. Pn la aparitia CSS, distanta dintre dou paragrafe putea fi modificat cu ajutorul elementului BR. Aceast metod d rezultate bune dar nu ne permite un control foarte riguros asupra spatiului dintre paragrafe. Chiar dac utilizarea tag-ului de sfrsit (</P>) nu este obligatorie este indicat s nu fie omis. Lipsa acestui tag va face ca elementul imediat urmtor s nu mai fie pozitionat la un rnd distant fat de paragraf. Din aceasr cauz rezultatul final va fi diferit fat de ceea ce am fi dorit s realizm.Aceast regul este bine s fie aplicat tuturor elementelor HTML. n plus, utilizarea ambelor tag-uri ne va usura munca atunci cnd sntem nevoiti s facem modificri n documentul initial. In acest mod citirea textului surs se face mai usor. Asa cum am vzut si la elementul H iar acum la elementul P, atributul ALIGN sugereaz alinierea pe orizontal. Acest atribut precum si valorile sale sunt identice pentru mai multe elemente din cadrul HTML. ntre tag-urile elementului P nu se pot afla dect alte elemente de tip inline (cum ar fi EM, B, TT, I, STRONG, etc). Elementul P nu trebuie s contin alte elemente de tip block-level, inculsiv un alt paragraf.
n practic pot exista situatii in care s dorim ca o fraz s fie scris pe un nou rnd. Un asemenea lucru s-ar putea ntmpla atunci cnd schimbm subiectul prezentat si dorim ca reluarea textului s se realizeze pe rndul urmtor. Acest lucru este posibil prin utilizarea elementului <BR>. Textul care urmeaz acestui element va fi scris pe rndul urmtor. Spre deosebire de elementul <P> care determina aparitia unui rnd gol, n cazul elementului <BR> nu se mai ntmpl acest lucru. Elementul BR este format dintr-un singur tag si anume <BR>. Un exemplu de utilizare a elementului BR este atunci cnd scriem o adres postal. n exemplul de mai jos am ilustrat acest lucru. Ionescu Vlad<br> Str. Dezrobirii, Nr.7, Et.4, Ap.16<br> Sector 3, Bucuresti<br> Romnia rezultat:
65
GMB Computers
CONSTANA
Ionescu Vlad Str. Dezrobirii, Nr.7, Et.4, Ap.16 Sector 3, Bucuresti Romnia Elementul BR poate fi utilizat ntr-o mutitudine de situatii, dar trebuie tinut cont de aspectu final al paginii realizate, aspect ce este influentat de o serie de factori care pot varia de la un utilizator la altul (mai corect spus de la un vizitator al paginii tale la altul). Nu trebuie s abuzm cu utilizarea elementului BR. S presupunem c vizitatorii paginii tale au setate rezolutii diferite pentru monitor. n aceast situatie modul de afisare a paginii va dif eri. De exemplu la o rezolutie de 800 X 600 un rnd va cuprinde mai multe caractere si deci mai multe cuvinte n timp ce la o rezolutie de 640 X 480 numrul acestora va fi mai mic. Astfel, dac ai utilizat elementul BR pentru a da paginii un aspect mai plcut, sau din oricare alte motive, trebuie s te asiguri c ea va pstra acelasi aspect la rezolutii diferite. ntruct am discutat de ntreruperea continuittii unei linii de text este cazul s vedem si reversul medaliei. n practic pot exista situatii n care s dorim ca un grup de cuvinte s fie scris pe un singur rnd. De exemplu s presupunem c avem o expresie n care apare numele unei firme. Pentru a fi sugestivi vom dori s ne asigurm ca acest nume va fi scris pe un singur rind si nu pe rnduri separate. S considerm de exemlu Coca Cola. Pentru a fi siguri c n orice situatie expresia Coca Cola va fi prezentat pe acelasi rind vom plasa ntre cele doua nume caracterul special Non Breaking SPace definit cu ajutorul entittii . Prezenta acestui caracter special ntre cele dou nume mpiedic plasarea lor pe rnduri separate.n exemplul de mai jos am prezentat cele dou situatii. n acest exemplu am folosit operatorul pentru Coca Cola<br> n acest exemplu nu am folosit operatorul pentru Coca Cola Mai jos am incadrat aceast expresie intr-un tabel cu o lungime predefinit pentru a simula fereastra browserului. n acest exemplu am folosit operatorul pentru Coca Cola n acest exemplu nu am folosit operatorul pentru Coca Cola Definitie: Entittile, constituie o metod de reprezentare a caracterelor care nu ar putea fi redate corect n cadrul unui document HTML dac ar fi scrise ca atare, direct de la tastatur, sau care nu sunt disponibile la tastatur. O entitate va fi scris sub forma &nume entitate;. Mai jos sunt exemplificate cteva entitti precum si caracterele aferente. < ( < ) - semnul mai mic dect > ( > ) - semnul mai mare dect © ( ) - semnul pentru copyright & ( & ) - semnul ampersand β () - litera beta din alfabetul grecesc Pentru detalii suplimentare vezi Caractere speciale n HTML Nota: de multe ori se spune direct caracterul special n loc de caracterul special Non Breaking Space definit de entitatea Browserele nu interpreteaz mai mult de un spatiu gol lsat ntre cuvintele unei expresii. O expresie de forma:
66
GMB Computers
CONSTANA
<p>Acesta
este
un
paragraf</p>
Pentru a realiza un spatiu gol vom folosi caracterul special plasat acolo unde dorim s obtinem spatiul n cauz. Mai jos este dat un exemplu: <p>Acesta este un paragraf</p> Acesta este un paragraf
Ca si n cazul elementului P, utilizarea succesiv a mai mulor tag-uri <BR><BR><BR> poate fi ignorat de browser, urmnd ca acesta s interpreteze doar primul tag, restul urmnd a fi ignorate. n aceast situatie, utilizarea repetat a tag-ului BR n vederea obtinerii unor rnduri goale nu constituie o solutie corect. Pentru a obtime rnduri goale vom folosi caracterul special urmat de tag-ul <BR>. n exemplul de mai jos este prezentat aceast solutie. <p>Acesta este un paragraf.<br> <br> <br> <br> Aici este continuarea paragrafului.</p> Observatie: aceat constructie nu este necesar cnd utilizm tag-ul <BR> pentru a realiza ruperea continuittii n cadrul unui paragraf. Utilizarea operatorului urmat de tag -ul <BR> se foloseste doar atunci cnd dorim s utilizm tag-ul <BR> n scopul realizrii unor rnduri goale. n aceats lectie ai nvtat despre primele elemente care stau la baza unui document HTML. Ai nvtat despre paragrafe (elementul P) si despre titluri (elementul H). n continuare am vorbit despre elementul BR cu ajutorul cruia putem manipula textul n cadrul unui document HTML nainte de a trece la prezentarea acesui subiect este cazul s vedem ce nseamn text preformatat. Acest lucru se refer la un text cu o anumit aranjare n pagin, cum ar fi o secven de program, versuri, etc. n cadrul unui paragraf, browserul nu va ine cont de modul de aranjare al textului. S privim la exemplul de mai jos i s vedem cum va fi afiat sursa unui pr ogram scris n limbajul C atunci cnd este ncadrat ntr-un paragraf. <p> #include "stdio.h" #include "conio.h" void main(void) { int nr; printf("\nIntroduceti un numr ntreg:"); scanf("%d",&nr); printf("Ptratul su este %d.",nr*nr); getch(); } </p> #include "stdio.h" #include "conio.h" void main(void) { int nr; printf("\nIntroduceti un numr ntreg:"); scanf("%d",&nr); printf("Ptratul su este %d.",nr*nr); getch(); } Aa cum se vede i n exemplu, textul cuprins ntr-un paragraf va fi afiat pe un rnd pn ce acesta se va ocupa dup care se trece la rndul urmtor. Dac am fi utlizat tag-ul BR pentru a fora trecerea la alt rnd am fi reuit s facem ca liniile de program s arate ca n realitate, dar efortul depus ar fi fost mai mare. n plus, pentru obinerea alinierii, ar fi trebuit s utilizm ent itatea de mai multe ori.
67
GMB Computers
CONSTANA
Pentru a permite afiarea textului preformatat, HTML dispune de elementul PRE. Textul cuprins ntre tag-urile <PRE> i </PRE> va fi redat exact cum apare el n codul surs. Acest text va pstra toate caracteristicile referitoare la aliniere, distana ntre rnduri, etc. Textul cuprins ntre cele dou tag-uri se va deosebi de restul documentului prin faptul c va fi scris cu caractere de tip teletype, care imit caracterele utilizate la maina de scris. La redarea unor exemple n acest tutorial am folosit elementul PRE pentru a afia in document sursa acelor exemple. Mai jos am prezentat un exemplu n care am utlitat elementul PRE pentru a reda un program scris n C. <PRE> #include "stdio.h" #include "conio.h" void main(void) { int nr; printf("\nIntroduceti un numr ntreg:"); scanf("%d",&nr); printf("Ptratul su este %d.",nr*nr); getch(); } </PRE> #include "stdio.h" #include "conio.h" void main(void) { int nr; printf("\nIntroduceti un numr ntreg:"); scanf("%d",&nr); printf("Ptratul su este %d.",nr*nr); getch(); } Observatie: Atunci cnd dorim s redm n pagina noastr o secven de cod HTML, trebuie inut cont de faptul c anumite caractere (cum ar fi parantezele unghiulare care ncadreaz tag-urile) nu pot fi redate dac sunt scrise ca atare. Pentru a putea fi redate trebuie folosite entitile corespunztoare fiecrui caracter special. Mai jos am redat trei dintre cele mai utilizate caractere speciale precum si entitile acestora.

< ( < ) - semnul mai mic dect > ( > ) - semnul mai mare dect & ( & ) - semnul ampersand
De exemplu, dac dorim ca n cadrul unei expresii s introducem caracterul ( < ) atunci va trebui s folosim entitatea corespunztoare acestui caracter. Entitatea ce definete acest caracter este de forma < ntre tag-urile PRE i PRE putem utiliza i tag-ul <BR> precum i tag-ul <P>. Pe lng aceste elemente, putem folosi i elementele de formatare fizic sau logic a caracterelor. Chiar dac nu am discutat despre aceste elemente, mai jos am prezentat un asemenea exemplu. <pre> <em>Viaa e un bun pierdut</em> vrut</b></em> </pre> Viaa e un bun pierdut Cnd n-o trieti cum ai fi vrut <em><b>Cnd n-o trieti cum ai fi
68
GMB Computers
CONSTANA
nainte de a vedea ce atribute are elementul PRE trebuie s mai spun c, de fapt, elementul PRE poate conine nu numai elementele precizate anterior. n fapt, el poate conine orice element de tip "coninut ntr-o linie" (inline). O list complet cu aceste elemente poate fi consultat aici. Tagul <PRE> are un singur atribut i anume atributul WIDTH. Forma general este: <PRE WIDTH="Numr"> unde valoarea numr este un numr zecimal care reprezint numrul de caractere ce pot fi scrise pe un rnd. n practic, acest atribut este ignorat de browsere. Observatie: ntruct atributl WIDTH este ignorat de browsere, trebuie s fim precaui atunci cnd dorim s introducem n pagin un text preformatat. Cu alte cuvinte, dac textul cuprins ntre tag-urile <PRE> i </PRE> va fi scris doar pe o singur linie, acesta va fi afiat n pagin doar pe o singur linie, indiferent de ct de lung este aceasta. ntruct, pentru textul cuprins ntre tag-urile elementului PRE, ruperea rndurilor nu este realizat n mod automat de ctre browser, s-ar putea s ne trezim c avem o pagin de web cu o lime egal cu lungimea e xpresiei cuprinse ntre tag-urile elementului amintit mai sus. Elementul ADDRESS este utilizat pentru a oferi informaii despre persoana de contact. Persoana de contact poate fi autorul unui material publicat pe Internet sau , la fel de bine, poate fi vorba despre modalitile de contactare a unei firme care prezint produse "online". De regul, ntre tag-urile ADDRESS vom plasa numele persoanei de contact dar i o legtur ctre aceasta. Dei nu am discutat despre legturi HTML, am s ilustrez mai jos dou situaii de utilizare a elementului ADDRESS. n exemplul care urmeaz am folosit ADDRESS pentru a indica autorul unui document i modalitatea de contactare a acestuia. n aceast situaie elementul ADDRESS va fi ultimul element din cadrul documentului. <ADDRESS> Autor: <A HREF="http://www.petrescu.dnt.ro">Petrescu Adrian<A> </ADDRESS> Autor: Petrescu Adrian n exemplul dat, legtura este fcut catre site-ul autorului. La fel de bine puteam s precizm o adres de email. Mai jos am fcut acest lucru. <ADDRESS> Autor: <A HREF="mailto:petrescu@yahoo.com">Petrescu Adrian<A> </ADDRESS> Autor: Petrescu Adrian Diferenele dintre cele dou exemple se pot observa cnd te poziionezi cu mouseul deasupra numelui. n acel moment, in bara de stare a browserului va fi afiat adresa le care se face trimitere. Dac autorul documentului dispune de un site propriu i de adres de mail, atunci pot fi redete ambele legturi. <ADDRESS> Autor: <A HREF="http://www.petrescu.dnt.ro">Petrescu Adrian<A> < <A HREF="mailto:petrescu@yahoo.com">petrescu@yahoo.com<A> > </ADDRESS>
69
GMB Computers
CONSTANA
Autor: Petrescu Adrian < petrescu@yahoo.com > n continuare este prezentat o alt situaie n care se impune utilizarea elementului ADDRESS. n practic aceast situaie poate fi ntlnit la sftitul unei pagini n care se face prezentarea unui produs. <ADDRESS> Pentru detalii i comenzi contactai <A HREF="mailto:comenzi@dnt.ro">comenzi@dnt.ro<A> sau la telefon XXX.47.29 <ADDRESS> Pentru detalii i comenzi contactai comenzi@dnt.ro sau la telefon XXX.47.29 Elementul ADDRESS nu trebie utilizat dect pentru a sugera persoana de contact. Dac vrei s redai o adres potal va trebui s utilizezi BR, aa cum am artat ntr-un exemplu anterior. ADDRESS poate fi coninut n mai multe elemente de tip bloc dar cele mai utilizate sunt BLOCKQUOTE, CENTER, DD, DIV, LI, TD, TH, etc. Acest element nu dispune de nici un atribut care s ne permit un control asupra poziionrii pe orizontal. El va fi plasat implicit la marginea din stnga a documentului. Pentru controlul poziionrii va trebui s utilizm alte metode de aliniere. Aceste metode sunt descrise n continuare Acum, dup ce am prezentat principalele elemente HTML care ne permit realizarea unui document HTML, voi spune cte ceva despre modul n care putem controla amplasamentul n pagin al unor astfel de elemente. Pn acum am vzut c un asemenea control putea fi fcut prin intermediul atributului ALIGN, n cazul n care elementul beneficia de un asemenea atribut. S ne reamintim de exemplu, cum puteam controla amplasarea unui paragraf: <P ALIGN="CENTER">Acesta este un paragraf centrat</P>
Acesta este un paragraf centrat n mod asemntor, puteam utiliza acest atribut i n cazul trasrii unei linii orizontale, folosind o expresie de forma (<HR ALIGN="CENTER">). Toate bune i frumoase pn la acest punct. Ce ne facem atunci cnd, de exemplu, dorim s centrm o list? n general, ce trebuie s facem atunci cnd dorim s controlm poziia unui element care nu suport atributul ALIGN? n acest caz exist mai multe soluii (dintre care unele sunt mai avansate i nu le voi discuta acum). Soluia optim ar fi utilizarea CSS despre care nu tim nimic. Pn s utilizezi CSS va trebui s apelm la metodele de poziionare ce pot fi obinute cu ajutorul unor elemente HTML. Exist trei metode pentru controlul alinierii pe orizontal a elementelor HTML. Aceste metode utilizeaz tag-uri specializate (mai mult sau mai puin) n controlul alinierii. Toate aceste metode constau n plasarea elementelor care dorim s fie poziionate ntre tag-urile indicate mai jos:

<CENTER></CENTER> <DIV ALIGN="valoare"></DIV>
70
GMB Computers
CONSTANA
<TABLE></TABLE>
Dintre toate metodele enumerate mai sus, cea mai eficient este cea care utilizeaz tabelele (elementul TABLE). ntruct acestea impun o discuie mai aprofundat, nu am prezentat aici centrarea cu ajutorul tabelelor. Elementul CENTER definete un bloc al crui coninut este centrat orizontal. Cu alte cuvinte, toate elementele cuprinse ntre tag-urile <CENTER> i </CENTER> vor fi centrate n pagin. Pentru a ntelege cum lucreaz acest element am prezentat exemplu n care am folosit o list neordonat. <CENTER> <P>Aici avem un paragraf</P> <ul> <li>Bucureti <li>Braov <li>Constana </ul> </CENTER> Rezultatul const n centrarea tuturor elementelor incluse ntre tagurile <CENTER> i </CENTER>, aa cum se poate observa mai jos. Aici avem un paragraf Bucureti Braov Constana S vedem ce se ntmpl dac elementul CENTER este inclus n alte tag-uri. Pentru aceasta s privim exemplul de mai jos: <P>Aici avem un paragraf</P> <UL> <LI><center>Bucureti</center> <LI>Braov <LI>Constana </UL> Aici avem un paragraf

Bucureti
Braov Constana
Dup cum se poate deduce foarte uor din cele dou exemple prezentate, elementul CENTER poate conine alte elemente HTML (toate elementele de tip bloc ct i elementele inline) dar poate fi coninut de elemnte precum BODY, BLOCKQUOTE, DL, LI, precum i alte elemente mai puin utilizate. Elementul CENTER nu poate fi plasat n elemente precum P, OL, UL sau TABLE (poate fi plasat n LI). n continuare am prezentat un exemplu n care se impune utilizarea elementului CENTER n cadrul unui citat definit cu ajutorul elementului BLOCKQUOTE. <BLOCKQUOTE> <P>...Care este nsuirea romanului ULTIMA NOAPTE DE DRAGOSTE, NTIA NOAPTE DE RZBOI? Este aceea de a fi o proz superioar. Un om cu un suflet clocotitor de idei i pasiuni, un om inteligent i neprihnit totodat, plin de subtilitate, de patrundere psihologic, dar i naiv cu inocene (i cu talent de poet), vorbete despre dragostea lui, despre femeie, aa cum o vede el ...</P> <CENTER><CITE>George Clinescu</CITE><CENTER> </BLOCKQUOTE>
71
GMB Computers
CONSTANA
...Care este nsuirea romanului ULTIMA NOAPTE DE DRAGOSTE, NTIA NOAPTE DE RZBOI? Este aceea de a fi o proz superioar. Un om cu un suflet clocotitor de idei i pasiuni, un om inteligent i neprihnit totodat, plin de subtilitate, de patrundere psihologic, dar i naiv cu inocene (i cu talent de poet), vorbete despre dragostea lui, despre femeie, aa cum o vede el ... George Clinescu n exemplele date de mine am utilizat elementul CENTER pentru a centra o list. In practic este puin probabil s se realizeze centrarea unei liste utiliznduse o astfel de soluie (se observ foarte uor c centrarea obinut n acest mod las de dorit). Cu alte cuvinte exemplul dat are un scop mai mult didactic i mai puin practic. n realitate, centrarea unei asemenea liste se realizeaz cu ajutorul tabelelor. De fapt este vorba de un tabel n care am introdus o list. Deoarece nu am discutat nc despre tabele nu am prezentat aici soluia complet pentru centrarea unei liste. Cu toate acestea, am prezentat mai jos modul n care va arta o asemenea list.

Bucureti Braov Constana
Recomandrile W3C (WWW Consortium) ne indic faptul c elemntul CENTER este de evitat a fi utilizat n HTML 4.0, n locul acestuia fiind de pref erat CSS. Toate lucrurile par minunate pn n acest punct. Ceea ce nu se spune n aceste recomandri (nici nu se poate acest lucru) este c unele browser-e nu interpreteaz corect toate declaraiile CSS. n aceast categorie intr, de exemplu, i centrarea tabelelor (TABLE). Sunt situaii (destul de rare, dar exist) n care nici expresia de forma <TABLE ALIGN="CENTER"> si nici o declaraie CSS de forma TABLE {margin-left: auto; margin-right: auto;} nu va fi interpretat corect de unele browsere (este vorba de generaiile mai vechi). n aceast situaie vom putea utiliza cu succes "nvechitul" element CENTER. Despre asemenea situaii voi discuta n seciunea dedicat tabelelor.
Elementul DIV dispune de mai multe atribute dar numai atributul ALIGN face obiectul prezentei discuii. Restul atributelor sunt utilizate n combinaie cu CSS. Toate elementele plasate ntre tagurile <DIV ALIGN="valoare"> i </DIV> vor fi aliniate conform valorii atributului ALIGN. Valorile acestui atribut pot fi: left, center, right i justify. n continuare am s reiau un exemplu folosit anterior dar de data aceasta voi folosi DIV n loc de CENTER. <DIV ALIGN="right"> <P>Aici avem un paragraf</P> <ul> <li>Bucureti <li>Braov <li>Constana </ul> </DIV> Aici avem un paragraf

Bucureti Braov Constana
ntre tag-urile elementului DIV pot fi incluse toate elementele de tip "n linie" i de tip "bloc".
72
GMB Computers
CONSTANA
Utilizarea elementelor CENTER i <DIV ALIGN="center"> este destul de restrns n ultimul timp. n locul acestora se prefer utilizarea tabelelor sau a CSS. Metodele de poziionare prezentate aici nu le exclud pe cele pe care le-am amintit pn acum. De exemplu, elementele CITE i ADDRESS pot fi incluse ntr-un paragraf n care s utilizm atributul ALIGN.
Elementele de formatare fizic indic n mod exact modul n care va fi afiat textul. Numele acestor elemente sunt date de iniiale (mai mult) i cuvinte (mai puin) reprezentnd iniialele sau prescurtrile din limba englez a unor cuvinte care, fiecare n parte, indic modul n care va arta textul. de exemplu, I este iniiala de la ITALIC (cursiv), indicnd n mod exact c textul cuprins ntre tag-urile acestui element va fi scris cu caractere cursive. n concluzie, elementele de formatare fizic nu sugereaz intenia realizatorului. n schimb ele indic foarte clar modul n care va arta. Mai jos am prezentat elementele de formatare fizic precum i rezultatele utilizrii acestor elemente.
<B> <I> <TT> <U>
Acest text este Bold Acest text este Italic (cursiv) Acest text este TeleType Acest text este Underline
<STRIKE> Acest text este STRIKE <BIG> <SMALL> <SUB> <SUP> Acest text este Big Acest text este Small Acest text este SUBscript Acest text este SUPrascript
Nu sunt prea multe de spus despre aceste elemente. Cred c exemplele sunt edificatoare. Doar n cazul elementelor BIG i SMALL trebuie s spun c sunt scrise cu litere mai mari (BIG), respectiv mai mici cu o unitate fa de restul textului. Despre unitile de msur ale caracterelor voi discuta n cadrul elementului FONT. Elementele de formatare fizic pot fi incluse unele n altele dar nu pot fi nlnuite. Prin intermediul elementului FONT se controleaz modul n care arat caracterele ntr-un document HTML. Elementul FONT este un element de tip "coninut ntr-o linie" adic nu poate conine elemente de tip bloc, precum un paragraf, titlu, tabel, etc. Cu alte cuvinte, de fiecare dat cnd scriem un paragraf, list, titlu, tabel, etc. va trebui s utilizm elementul FONT ca mai jos: <P><FONT>Acesta este un paragraf</FONT></p> <H1 class="normal"><FONT>Acesta este un titlu</FONT></H1>
73
GMB Computers
CONSTANA
Aa cu se poate observa, elementul FONT fiind un element de tip "n linie", necesit ntodeauna i prezena tag-ului de sfrit. Observaie: aa cum am spus, elementul FONT este un element de tip "n linie". El nu poate conine elemente de tip bloc dar poate conine alte elemente de tip "n linie", inclusiv un alt element FONT. Trebuie s reii acest lucru ntruct ne va permite s ne uurm munca, aa cum vei vedea mai trziu. Dac se omite utilizarea tag-ului FONT atunci browser-ul va utiliza familia de fonturi setat implicit. Elementul FONT dispune de trei atribute prin intermediul crora se precizeaz familia de fonturi, marimea i culoarea acestora. n atbelul de mai jos sunt prezentate cele trei atribute ale elementului FONT. Atribut FACE SIZE Semnificaie definete fontul utilizat definete mrimea fonturilor Valoare Numele unui font precum: Verdana, Arial, Times New Roman, etc un numr cu valori ntre 1...7. 1 reprezint valoarea cea mai mic. un nume de culoare sau valoarea hexazecimal a acesteia. De regul, se folosete valoarea hexazecimal.
COLOR definete culoarea fontului
Dac, n cadrul tag-ului FONT, nu se precizeaz nici unul din aceste atribute atunci prezena acestui tag nu va avea nici un efect. n aceast situaie vor fi utilizate setrile implicite ale browser-ului. Exemplul de mai jos este o ilustrare a celor spuse: <P><FONT>Acesta este un paragraf</FONT></p> rezultat: Acesta este un paragraf Se observ c fontul implicit este Times New Roman. Observaie: fontul utilizat n acest site este Arial (sau Verdana n cazul variantei tiprite). Cu toate acestea, exemplele prezentate redau n mod exact situaiile reale (adic fonturile reale). n continuare am s fac o prezentare mai detaliat a acestor atribute. Cu ajutorul atributului FACE se specific ce fonturi va utiliza browser-ul atunci cnd va afia documentul HTML. Atributul FACE va avea drept valoare numele unui font. Mai jos am redat un exemplu: <P><FONT FACE="impact">fontul Impact</FONT></P> fontul Impact
74
GMB Computers
CONSTANA
Numele fontului nu este "case sensitive", adic nu conteaz dac folosim majuscule sau caractere normale la scrierea acestuia. n schimb, numele fontului trebuie scris exact, fr a se omite nici o liter. De exemplu expresia: FONT FACE = "ARial" este echivalent cu FONT FACE = "ARIaL" n schimb, expresia FONT FACE = "ARia" va face ca browser-ul s utilizeze fontul implicit. n cazul n care familia de fonturi (mai corect spus fontul) are un nume mai lung, trebuie s fim ateni la spaiile dintre cuvinte. omiterea unui asemenea spaiu va face ca browser-ul s nu poat recunoate fontul n cauz. Am ilustrat mai jos o asemenea situaie: <P><FONT FACE="Comic Sans MS">Comic Sans MS</FONT> rezultat: Comic Sans MS <P><FONT FACE="Comic Sans M">Comic Sans MS</FONT> Comic Sans MS Dup cum am mai spus, nu putem ti cu exactitate ce fonturi sunt instalate pe calculatoarele vizitatorilor. Din acest motiv atributul FACE poate accepta mai multe valori. Aceste valori trebuie separate prin virgul si, pentru a fi mai uor de distins, un spaiu liber. De exemplu: <P><FONT FACE="Verdana, Arial, Modern">...text...</FONT></P> Aceste valori vor fi citite de browser n ordinea apariiei. Cu alte cuvinte, fcnd referire la exemplul anterior, dac un vizitator nu are instalat primul font specificat (Verdana), atunci va fi citit n mod automat valoarea imediat urmtoare (Arial). Dac nici aceast font nu exist, atunci va fi utilizat urmtoarea valoare, .a.m.d. Dac s-au epuizat toate valorile specificate (fr a se gsi una dintre ele) browser-ul va utiliza fontul setat implicit. n practic am ntlnit documente HTML care nu aveau definit dect un singur font. Acest lucru poate fi periculos, sfatul meu fiind s foloseti cel puin dou fonturi. n acest fel se evit anumite neplceri legate de modul n care va arta documentul. Atributul SIZE definete mrimea uni font. Acesta poate lua valori de la 1 la 7. Aceste valori sunt echivalente cu urmtoarele mrimi exprimate n puncte (pt):
75
GMB Computers
CONSTANA
Valoare Valoare echivalent 1 2 3 4 5 6 7 8pt 10pt 12pt 14pt 18pt 24pt 36pt
Am redat aceste valori echivalente pentru a avea o imagine asupra mrimii fonturilor (lucru valabil n cazul n care ai folosit un editor de text, aceste mrimi fiind similare). Mai jos am dat un exemplu de utilizare a atributului SIZE: <FONT FACE="Arial" SIZE="1">Size 1</FONT> <FONT FACE="Arial" SIZE="2">Size 2</FONT> <FONT FACE="Arial">Size 3</FONT> <FONT FACE="Arial" SIZE="4">Size 4</FONT> <FONT FACE="ARIAL" SIZE="5">Size 5</FONT> <FONT SIZE="5">Size 5</FONT> Size 1 Size 2 Size 3 Size 4 Size 5 Size 5 Dintre aceste exemple se remarc cele scrise cu rou. n primul caz se poate vedea c, dac se omite specificarea atributului SIZE, browser-ul va considera o mrime implicit pentru fonturi. Aceasta este 3 i, aa cum vei vedea, este luat drept mrime de referin. n ultimul exemplu se poate vedea cum, atunci cnd nu se specific atributul FACE, browserul va utiliza fonturile setate implicit (Times New Roman) dar va lua n considerare atributul SIZE. Atributul SIZE poate avea valori absolute sau valori relative. Atunci cnd dorim s atribuim o valoare absolut, vom folosi o expresie de forma: SIZE="1" sau SIZE="nr" unde nr este un numr cu valori ntre 1...7. n cazul n care se folosesc valori relative, atributul SIZE va fi scris sub forma: SIZE="+1" sau SIZE="-1" sau SIZE="+2", etc. n acest caz, valoarea "+1", "-1" sau "+2" se va raporta la mrimea de referin care este 3. n funcie de semnul aflat n faa numrului, mrimea fonturilor va fi mai mare cu 1, 2, sau mai mic cu 1. Pentru a fi mai explicit am dat cteva exemple:
<FONT FACE="Arial" SIZE="-2">Size 1</FONT> <FONT FACE="Arial" SIZE="-1">Size 2</FONT> <FONT FACE="Arial">Size 3</FONT> <FONT FACE="Arial" SIZE="+1">Size 4</FONT> <FONT FACE="ARIAL" SIZE="+2">Size 5</FONT> <FONT FACE="ARIAL" SIZE="+3">Size 5</FONT> Size 1 Size 2 Size 3 Size 4 Size 5 Size 6 Size 7
76
GMB Computers
CONSTANA
Utilizarea atributului SIZE cu valori relative este mai des ntlnit atunci cnd se utilizeaz elementul BASEFONT (va fi discutat puin mai trziu). n prezent, mrimea fonturilor este un subiect controversat. Nu exist o prere unanim privitoare la ce mrime s aib fonturile. Acest lucru se datoreaz numrului foarte mare de configuraii existente n ceea ce privete rezoluia monitoarelor. De exemplu, un font cu atributul SIZE="1" poate foarte uor s devin indescifrabil pe un monitor cu rezoluie mare (de genul 1024X768) sau n cazul unui laptop. Pe aceast tem exist o ntreag literatur ce nu face subiectul prezentului tutorial. Pe viitor este posibil s realizez un material pe aceast tem. Observaie: ncepnd cu HTML varianta 4.0 beneficiem de ajutorul CSS. Prin intermediul CSS se poate realiza un control mult mai flexibil n ceea ce privete mrimea fonturilor. n CSS mrimea fonturilor nu se limiteaz doar la valorile 1...7, aceast mrime poate lua i alte valori. Pn s nvei CSS poi utiliza foarte bine i tagul FONT dac, respeci cele scrise n acest tutorial. n plus, n cazul unor variante mai vechi de browser-e, CSS nu poate fi interpretat i, ca atare, prezena elementului FONT poate fi absolut necesar. Prin intermediul atributului COLOR se specific culoarea fontului. Acest atribut poate avea drept valoare fie numele unei culori, fie valoarea hexazecimal a acesteia. Este de reinut c valoarea hexazecimal trebuie s fie precedat de semnul "#". Mai jos sunt redate aceste culori mpreun cu valorile hexazecimale corespunztoare. black = "#000000" silver = "#C0C0C0" gray = "#808080" white = "#FFFFFF" maroon = "#800000" red = "#FF0000" purple = "#800080" fuchsia = "#FF00FF" green = "#008000" lime = "#00FF00" olive = "#808000" yellow = "#FFFF00" navy = "#000080" blue = "#0000FF" teal = "#008080" aqua = "#00FFFF"
Valoarea hexazecimal a unei culori este dat de valoarea hexazecimal a culorii RGB. Ca s fiu mai clar, o culoare este format dintr-o combinaie de culori de baz. Aceste culori sunt n numr de trei i anume: Red (rou), Green (verde), Blue (albastru). Valoarea hexazecimal a unei culori obinute prin combinarea celor trei nuane specificate mai sus va fi dat sub forma : COLOR="#RRGGBB"
77
GMB Computers
CONSTANA
unde RR, GG, BB reprezint valoarea n hexazecimal a fiecrei nuane de culoare. Aceste valori hexazecimale sunt obinute din convertirea valorilor zecimale ce corespund fiecrei culori. De exemplu, pentru a obine culoarea SILVER (argintiu) vom avea o combinaie de culori RGB ale crei valori n zecimal vor fi: Red = 192 Green = 192 Blue = 192
Utiliznd un calculator care s aib funcia de transformare din zecimal n hexa, vom obine valoarea C0 drept echivalentul lui 192 n zecimal. Prin urmare, valoarea n hexa a culorii SILVER va fi cea de mai jos: COLOR="#RRGGBB" adic COLOR="#C0C0C0"
Valoarea exprimat n zecimal pentru oricare din culorile de baz Red, Green sau Blue se va afla numai n intervalul 0...255. Observaie: culorile prezentate n tabelul anterior sunt n numr de 16, ele putnd fi recunoscute de browser nu numai dup valoarea hexazecimal, dar i dup numele acestora. n realitate numrul de culori (nuane) ce poate fi obinut prin combinarea celor trei culori de baz (RGB) poate fi mult mai mare. De regul, se folosete un numr de numai 216 culori care mai sunt numite i "culori sigure". Revenind la atributul COLOR, s vedem cteva exemple concrete. <FONT FACE="Arial" SIZE="2" COLOR="#FF0000">Acest text este rou</FONT> <FONT FACE="Arial" SIZE="2" COLOR="green">Acest text este verde</FONT> Acest text este rou Acest text este verde Este de preferat ca utilizarea numelui unei culori drept valoare pentru atributul COLOR s fie evitat. Valoarea hexazecimal a unei culori este mult mai bine suportat de browsere. Altfel spus, este posibil s existe unele browsere care s nu recunoasc numele unei culori (lucru ntlnit mai ales n cazul n care se folosete numele unei culori care nu face parte din cele 16 numite anterior). Acest lucru nu nseamn c valorile hexazecimale ale culorilor trebuie s fie memorate. Pe Internet poi gsi o mulime de programe utilitare care fac conversia culorilor din zecimal n hexa. O soluie i mai bun este s ai un fiier HTML care s conin aceste culori (sub forma unui tabel ca cel prezentat de mine) i care s poat fi consultat de cte ori este necesar. O alternativ pentru elementul FONT o constituie utilizarea tagului <BASEFONT>. Am spus tag-ul <BASEFONT> ntruct elementul BASEFONT nu const dect dintr-un singur tag. Nu exist nici un tag de sfrit. De regul, tagul <BASEFONT> este utilizat pentru a defini familia de fonturi, culoarea i mrimea acesteia, atribute ce urmeaz s fie meninute pentru ntreg documentul, sau pentru poriuni mai mari dintr-un document. Atributele i valorile acestora sunt identice cu cele utilizate n cadrul elementului FONT. Toate elementele HTML ce urmeaz tagului BASEFONT vor utiliza fonturile i proprietile acestora, proprieti ce au fost declarate n tag-ul BASEFONT. Excepia de la aceast regul o reprezint elementul H. Aces-
78
GMB Computers
CONSTANA
ta va pstra valorile iniiale sau, dac conine un element FONT, va pstra caracteristicile stabilite de acesta. Mai jos am redat un exemplu de utilizare a tag-ului BASEFONT. <BASEFONT FACE="Arial, Verdana" SIZE="3"> <P>Acesta este un paragraf</P> <UL> <LI>Unu <LI><FONT SIZE="-2">Doi</FONT> <LI>Trei </UL> <P>Alt paragraf</p> Acesta este un paragraf

Unu Doi Trei
Alt paragraf S vedem puin ce se poate deduce din acest exemplu. Primul lucru care se observ este c atributele specificate n tag-ul <BASEFONT> sunt suprascrise prin utilizarea tag-ului FONT. Dup tag-ul de sfrit </FONT> documentul va recpta atributele declarate n BASEFONT. De asemenea, putem plasa mai multe taguri BASEFONT ntr-un singur document. n acest caz ultimul tag BASEFONT va suprascrie tagul BASEFONT anterior lui. Dac sunt folosite numai cteva atribute (de ex. doar SIZE) restul atributelor nu vor fi motenite de la tag-ul BASEFONT anterior celui n cauz. n acest caz vor fi utilizate valorile implicite setate de browser. Elementul BASEFONT poate fi coninut de toate elementele de tip "n linie" i de tip "bloc", cu excepia elementului PRE. Observaie: Netscape Navigator 4.0 nu interpreteaz corect elementul BASEFONT. Concret, acesta va ignora fonturile declarate n atributul FACE. n mod similar va trata i atributul COLOR. Dac foloseti browser-ul amintit (cred c i Netscape Communicator se comport similar) vei putea observa cele descrise aici. Dac eti curios poi s copiezi acest exemplu i s vezi modul n care se comport n browser-ele amintite. n plus, elementul BASEFONT este ignorat n interiorul tabelelor. ntruct, aa cum vei vedea, tabelele sunt folosite intensiv, este recomandat s nu se foloseasc elementul BASEFONT. Dac ii neaprat s foloseti BASEFONT atunci este bine s utilizezi numai atributul SIZE, urmnd ca restul atributelor s fie declarate prin intermediul tag-ului FONT. nainte de a trece la abordarea acestui subiect, trebuie s repet c am tratat problema referitoare la declararea fonturilor lund n calcul numai elementul FONT. Am fcut aceast precizare ntruct fonturile pot fi controlate i cu ajutorul CSS. Chiar i aa, mare parte din cele spuse mai jos rmn valabile, indiferent de metoda utilizat pentru controlul fonturilor. Ca o prere personal, este foarte bine s cunoti utilizarea elementului FONT i, mai apoi, cnd vei nva CSS, s vezi ce posibiliti noi sunt oferite prin aceast metod. n continuare voi prezenta cteva aspecte ce trebuie avute n vedere atunci cnd lucrm cu fonturile.
cu riscul de a m repeta, fac urmtoarea observaie: nu trebuie utilizat doar un singur font pentru atributul FACE. Orict de siguri am fi c acel font se gsete pe calculatoarele vizitatorilor, trebuie folosite cel puin dou fonturi. Acestea ar trebui s aib o
79
GMB Computers
CONSTANA
nfiare ct mai asemntoare. n exemplul de mai jos va trebui s evitm o construcie ca cea scris cu rou. <FONT FACE="Arial, Verdana" SIZE="3">...</FONT> <FONT FACE="Arial, Comic Sans MS" SIZE="3">...</FONT>

n continuare am prezentat modul n care arat fiecare din fonturile utilizate n exemplul anterior. Font Arial Font Verdana Font Comic Sans MS Este uor de observat modul n care arat fontul Comic Sans MS. n cazul n care fontul Arial nu se va regsi pe staia de lucru a unui vizitator va fi utilizat fontul imediat urmtor. ntruct diferena dintre Arial i Comic Sans MS este destul de mare, pagina va arta neplcut. din dorina de a cuprinde ct mai multe informaii n prima pagin a site-ului (lucru firesc, alminteri) muli realizatori de pagini HTML vor opta pentru utilizarea atributului SIZE="1". Cnd te decizi s utilizezi un font cu atributul SIZE="1", trebuie s ai n vedere c nu toate fonturile se preteaz a fi utilizate cu o asemenea mrime. De exe mplu, citirea unui paragraf scris cu fontul Times New Roman poate fi foarte obositoare la o asemenea dimensiune. Pentru exemplificare am prezentat un exemplu:
<FONT FACE="TIMES NEW ROMAN" SIZE="1">Font Times New Roman</FONT> <FONT FACE="VERDANA" SIZE="1">Font Times New Roman</FONT>

Font Times New Roman Font Times New Roman De regul, fonturi precum Arial, Verdana, Helvetica se preteaz cel mai bine (se disting cel mai uor) pentru a fi utilizate cu atributul SIZE="1". fontul aleas trebuie s fie n concordan cu subiectul prezentat. De exemlu, nu este indicat s utilizm un font precum Comic Sans MS pentru a prezenta o tire de maxim importan. este de evitat s folosim ntr-un document mai mult de 2, maxim 3 tipuri de fonturi. n caz contrar documentul va fi obositor pentru cititori, existnd i riscul de a deveni un fel de "varz online". titlurile nu trebuie declarate cu elementul FONT. Dac vei proceda aa, titlul tu nu va mai putea fi interpretat ca atare de motoarele de cutare. Mai jos este un exemplu de declarare a unui titlu cu ajutorul elementului FONT. <FONT SIZE="3"><B>Despre HTML</B></FONT>
Tutorial HTML n locul unei asemenea construcii, am putea s folosim elementul FONT n cadrul elementului H. n aceast situaie vom preciza prin intermediul elementului FONT ce font s fie utilizat pentru scrierea titlului. <H4><FONT FACE="Arial, Verdana">Tutorial HTML</FONT><H4>
Rezultatul este redat mai jos: realizatorii de pagini web folosesc doar cteva fonturi (eventual din familii diferite) i n combinaii predefinite. Mai jos am dat cteva combinaii foarte des ntlnite.
80
GMB Computers
CONSTANA
<FONT FACE="Verdana, Arial, Helvetica"> <FONT FACE="Times New Roman, Serif"> <FONT FACE="Verdana, Arial, Helvetica, MS Sans Serif"> <FONT FACE="Verdana, Arial, Helvetica, sans-serif"> <FONT FACE="Verdana, Arial, Geneva, Helvetica, Sans-Serif">
De remarcat c fonturile prezentate sunt i cele mai rspndite. Mai corect spus, ele sunt instalate implicit de sistemele de operare (cel puin de Windows). nainte de a trece mai departe trebuie s tii c exemplele prezentate aici nu reprezint dect anumite variante foarte utilizate. Aceasta nu nseamn c nu poi folosi i alte variante. Am spus c toate fonturile de mai sus sunt instalate implicit de Windows. Lucrul este ad evrat pentru Arial, Verdana, Times New Roman. Restul de fonturi sunt foarte rspndite pe alte platforme (Mac, UNIX). Exemplul scris cu rou are ansele cele mai mari s funcioneze pe mai multe platforme. De exemplu, echivalentul fontului Arial ce se regsete n Windows este fontul Helvetica n cazul unui Machintosh. De notat c se utilizeaz drept soluie final precizarea unei ntregi familii de font-uri. Acest lucru poate fi de folos n cazul n care nu se gsete nici unul din fonturile specificate individual. Faptul c FONT este un element de tip "n linie" ne oblig s-l precizm n interiorul fiecrui element HTML. Acest lucru devine obositor dac vei tasta de fiecare dat acest tag (mpreun cu atributele sale). Pentru a ne face viaa mai uoar este bine ca mai nti s scriem textul regulat cu tag-urile HTML necesare i, mai apoi, utiliznd copy i paste, s plasm tag-ul FONT unde dorim. n acest fel nu vom scrie tag-ul FONT dect o singur dat. Modificarea ulterioar a atributelor SIZE sau FACE nu mai este o treab foarte dificil. Aa cum am mai spus, elementul FONT poate conine alte elemente de tip "n linie", inclusiv un alt element FONT. Acest lucru ne scutete de tastarea repetat a denumirii fontului. n cazul n care folosim elemente FONT inculse unele n altele trebuie s fim foarte ateni pentru a nu obine elemente nlnuite. Mai jos am prezentat un exemplu n care am artat cum se poate face acest lucru. n loc s scriem o expresie de forma:
<P><FONT face="verdana, arial" size="2" color="#ff0000"> Font Verdana, size=2.</FONT></P> <P><FONT face="verdana, arial" size="3" color="#ff0000"> Font Verdana, size=3.</FONT></P> <P><FONT face="verdana, arial" size="4" color="#ff0000"> Font Verdana, size=4.</FONT></p>
Rezultatul este redat mai jos: Font Verdana, size=2. Font Verdana, size=3. Font Verdana, size=4. Un rezultat similar am putea obine dac vom folosi o construcie ca cea de mai jos:
<P><FONT face="verdana, arial" size="2" color="#ff0000"> Font Verdana, size=2.<br> <br> <FONT size="3">Font Verdana, size=3.<br> <br> <FONT size="4">Font Verdana, size=4. </FONT></FONT></FONT>
Rezultatul este redat mai jos: Font Verdana, size=2. Font Verdana, size=3. Font Verdana, size=4. De remarcat c, n afar de utilizarea unor elemente FONT incluse unul n altul, am utilizat de mai multe ori consctrucia <br> <br> pentru a simula mai multe paragrafe. Pe web am gsit anumite "sfaturi" care sugereaz utilizarea elementului FONT fr a se ine cont de "inlnuire". Cu toate c browser-ul va interpreta corect chiar i o ase-
81
GMB Computers
CONSTANA
menea construcie nu este recomandat s recurgi la asemenea "trucuri murdare". n schimb, dup ce vei nva CSS, vei putea scpa de elementul FONT i de toate neplcerile legate de acesta. Mai jos am prezentat un exemplu n care se utilizeaz tag-uri nlnuite. <P><FONT face="verdana, arial" size="1" color="#ff0000"> Font Verdana, size=1.</P> <P><FONT size="3">Font Verdana, size=3.</P> <P><FONT size="4">Font Verdana, size=4. </font></font></P> <UL TYPE="disc"> <LI>unu <LI>doi </UL> </FONT>
Font Verdana, size=1. Font Verdana, size=3. Font Verdana, size=4. unu doi Trebuie remarcat cum, dei avem o groaz de construcii nlnuite, prima declaraie a elementului FONT se transmite i listei neordonate UL.
nainte de a trece la publicarea paginii realizate, este bine s o vizualizezi la diferite r ezoluii i cu diferite browser-e. n acest fel te asiguri c fonturile utilizate se comport corespunztor ateptrilor tale.
n practica curent ne putem lovi de situaii n care fonturile cele mai utilizate (a se citi cele mai des ntlnite pe calculatoarele vizitatorilor) nu se preteaz la ceea ce intenionm s realizm. n aceast situaie vom fi nevoii s utilizm anumite trucuri pentru ca un vizitator s viziona site-ul aa cum a fost el gndit. n continuare am s prezint dou metode prin care se poate rezolva problema fonturilor mai puin utilizate. O prim metod const n realizarea unei legturi care s permit unui vizitator instalarea fontului dorit. Cu toate c nu am vorbit despre realizarea legturilor n HTML, m simt dator s prezint aceast metod. Va trebui s o reii, cel puin n scop informativ. n exemplul care urmeaz am s folosesc fontul ZurichCalligraphic Italic. Dac, din ntmplare, acest font se regsete i pe calculatorul tu, vei putea vedea corect exemplul dat. n caz contrar, vei putea s-l "descarci" prin intermediul unei legturi. <FONT FACE="ZurichCalligraphic Italic, Arial" SIZE="5"> Font ZurichCalligraphic Italic</font> Mai jos este rezultatul obinut. Font ZurichCalligraphic Italic Dac ceea ce vezi este similar cu ceea ce se afl mai jos, nseamn c dispui de fonturile ZurichCalligraphic Italic. n caz contrar, nu dispui de asemenea fonturi. Mai jos este dat modul n care ar trebui s arate aceste fonturi: 1. Pentru a pune la dispoziie acest font, va trebui s plasm o expresie ca cea de mai jos: <P>Acest site necesit fonturi <tt>ZurichCalligraphic Italic</tt>.<BR> Click <A HREF="zurichi.ttf">aici</A> pentru a obine aceste fonturi.</P> 2. Acest site necesit fonturi ZurichCalligraphic Italic. Click aici pentru a obine aceste fonturi.
82
GMB Computers
CONSTANA
3. Dac vei ncerca exemplul anterior, va trebui s cunoti i modul n care se instaleaz fonturile n Windows. De fapt, acesta este i neajunsul acestei metode. Muli utilizatori nu cunosc cum se instaleaz fonturile. Observaie: dac utilizezi Netscape pentru a viziona acest site, exemplul anterior nu va fi redat corect (chiar dac dispui sau nu dispui de fontul ZurichCalligraphic Italic). Acest lucru se datoreaz modului n care Netscape "lucreaz" cu CSS (cu toate acestea nu exlud nici o eventual eroare de proiectare a acestei pagini). n Internet Explorer nu exist o asemenea problem. Dac vei folosi COPY i PASTE pentru a copia exemplul dat vei obine rezultate identice n ambele browsere menionate mai sus. 4. n ceea ce privete modul de realizare al legturilor, nu am s insist n momentul de fa asupra acetui aspect. Ceea ce trebuie s spun este c ntre ghilimelele expresiei <A HREF="..."> nu am precizat dect numele fiierului care conine fontul ZurichCalligraphic Italic. Acest lucru se potrivete pentru site-ul meu. n realitate este posibil ca expresia plasat ntre ghilimele s fie mult mai lung. Despre aceste lucruri vei nva n lecia dedicat legturilor. 5. O alt metod const n utilizarea unor imagini care s conin textul dorit. n acest fel putem utiliza orice font dorim, fr s ne punem problema dac acestea sunt sau nu disponibile pe calculatoarele vizitatorilor. n plus, aceast metod ne permite s prelucrm fonturile dup bunul plac (este vorba de adugarea unor efecte artistice). Utiliznd aceast metod am putut reda modul n care arat fonturile ZurichCalligraphic Italic, chiar dac acestea nu se regsesc pe calculatorul tu. Pentru aceasta am folosit o imagine denumit font.gif care a fost realizat cu un editor de imagini. Fundalul folosit a fost de culoare alb pentru a coincide cu fundalul acestui site. Pentru a observa mai bine, n exemplul de mai jos am ncadrat ntr -un chenar imaginea font.gif. <P>Aceasta este o imagine</P> <img src="font.gif">
Rezultatul este redat mai jos:
Aceasta este o imagine 6. Aceast metod este mai des utilizat dect cea prezentat anterior. Problema care o ridic aceast metod este legat de dimensiunea mare pe care o va avea un astfel de document HTML. Acest fapt ne oblig s plasm documentul pe un server mai rapid (nu ca cel pe care este site-ul meu). Chiar i n acest caz trebuie s avem n vedere c nu toi "navigatorii" dispun de modemuri performante. Dac inem cont i de calitatea liniilor telefonice atunci s-ar putea s ajungem la concluzia c o asemenea metod nu este foarte indicat. De asemenea, este posibil ca unii utilizatori s nu aib activat n browser opiunea "show pictures". n aceast situaie nu va fi ncrcat nici o imagine i, prin urmare, site-ul nostru va arta neplcut. 7. Browserele din generaiile mai noi (de la Internet Explorer 4.0 i Netscape Navigator 4.3 n sus) dispun de suport pentru a permite realizatorilor de pagini web s utilizeze fonturi ce vor fi descrcate automat n momentul accesrii unei pagini de web (am s le numesc fonturi incluse). Utilizarea unor astfel de fonturi necesit o experien mai bogat n realizarea paginilor HTML. n cazul n care se apeleaz la o astfel de soluie revine din nou n actualitate incompatibilitatea dintre browsere. Internet Explorer i Netscape utilizeaz tipuri diferite de fonturi incluse. Cele dou tipuri de fonturi sunt: Embedded OpenType (extensia .eot) - realizate de Microsoft TrueDoc (extensia .pfr) - realizate de Netscape i Bitstream
83
GMB Computers
CONSTANA
Datotit eforturilor depuse de compania Bitstream, fonturile de tip TrueDoc pot fi interpretate att de Internet Explorer ct i de Netscape. Pentru a putea vedea aceste tipuri de fonturi n Internet Explorer este nevoie de instalarea unor fiiere suplimentare. Chiar i aa se pare c lucrurile nu funcioneaz foarte bine. Subiectul legat de utilizarea fonturilor incluse este mult mai complex necesitnd i cunotiine de CSS. Dac eti curios poi citi despre acest subiect n seciunea dedicat fonturilor din site-ul Webmonkey n concluzie, nu trebuie apelat la fonturi mai puin utilizate dect dac nu se poate altfel. n aceast situaie este bine s ii seama de publicul cruia i te adresezi. Dac este un public mai "instruit", vei putea plasa o legtur care s pun la dispoziie fonturile necesare. Dac, n schimb, vei avea un public foarte diversificat, atunci va trebui s utilizezi imagini care s conin fonturile necesare. Aceast metod este foarte des ntlnit la site-urile publicitare si la cele cu material destinat adulilor. n acest ultim caz se pare c vizitatorii sunt dispui s atepte mai mult ncrcarea unei pagini, tiind c ceea ce urmeaz s vad este "hot". nainte de a termina mai spun un lucru: nu trebuie s realizezi o imagine de dimensiunea unei pagini de web, imagine care s conin tot textul necesar. n acest situaie toi vizitatorii vor adormi pn se ncarc pagina (dac vor avea rbdare). XML Unealta pentru a descrie datele XML NU ESTE un inlocuitor pentru HTML. XML descrie date, n timp ce HTML afieaza date. XML ruleaz pe mai multe platforme de soft i are o unealta independenta de hardware pentru a transmite date JavaScript - Scripting pe partea de client Scripting pe partea de client se refer la programarea comportamentului unui browser. -o pagin Web
ASP or PHP Scripting pe partea de server Scripting pe partea de server este despre programarea unui serviciu pe Internet n urma cruia se poate livra mai mult coninut dinamic. Cu scripting pe partea de server se pot: Edita dinamic, schimba sau aduga noi elemente Accesarea unei baze de date i ntoarcerea rezultatului n parte -ul n functie de browser Prelucrarea datelor cu SQL SQL este limbajul standard pentru accesarea i manipularea bazelor de date.SQL este folosit pentru a accesa i manipula date n MySQL, SQL Server, MS Access, Oracle, Sybase, DB2, i alte sisteme baze de date. Cunotinele SQL sunt importante pentru oricine vrea s stocheze sau s obina date dintr-o baza de date. Frontpage sau Microsoft Expression Web Introducerea si editarea textului; folosirea etichetelor paginii; formatarea textului; alinierea si spatierea paragrafelor; crearea listelor; adaugarea ilustratiilor; modificarea unei teme; imbuna-
84
GMB Computers
CONSTANA
tatirea aspectului unui sit web.Dupa ce v-ati facut o ideie despre cum arata pagina, puteti sa incepeti sa introduceti si sa editati textul. Mai intai trebuie sa schimbati textul din paragraful de
deschidere.
Efectuati pasii urmatori : 1.Derulati pagina pana la inceputul ei si plasati indicatorul mouse-ului undeva in textul paragrafului care incepe cu Coment :,apoi executati clic pentru a-l selecta. (Cand un elemenet a fost predefinit de FontPage, puteti sa-l selectati folosind acesta metoda cu un singur clic). Observati ca indicatorul isi schimba forma. 2.Scrieti urmatorul paragraf pentru a inlocui textul selectat : (Scopul organizatiei nonguvernamentale PNR conform statutului). 3.Selectati paragraful de sub titlul Our Mision si scrieti urmatoarea prepozitie : (Extras din statutul PNR). 4.Executati clic pe butonul Save pentru a salva modificarea (Daca FontPage va intreaba daca doriti sa marcati lucrarea ca finalizata, executati clic pe No). 5.Stergeti titlul Company Profile, paragraful de sub el si bara orizontala de deasupra paragrafelor, selectandu-le si apasand tasta Delete. Refolosirea textului din alta sursa - Daca vreti sa refolositi in werb-ul cre 636h78g at un intreg fisier din alta sursa, este foarte usor sa il inserati. Mai intai, plasati punctul de inserare acolo unde vreti sa apara fitierul respectiv. Apoi, alegeti File din meniul Insert si executati dublu clic pe fisierul pe care vreti sa il imserati. (Aveti grija ca optiunea pentru Files Of Type sa corespunda tipului de fisier pe care vreti sa il inserati). FontPage va converti fisierul in format HTML si il va insera in locul unde se gaseste punctul de inserare. Nu veti introduce nici un text sub titlul Contact Indormation, dar nu trebuie sa eliminati paragraful din caseta de rezervare. Cititi in continuare sectiunea urmatoare pentrua afla de ea. Modificarea alinierii paragrafelor In configuratia standard prestabilita FontPage aliniaza la stanga paragrafele cand creati paginile web. Uneori insa veti dorisa realiniati paragraful sau o portiune de text. Haideti sa centram paragraful in partea de jos a paginii 1.Derulati pagina pana jos si plasati punctul de insertie undeva in paragraful care incepe cu cuvintele Send mail to. Font Page vaafisa un chenar in jurul acestei selectii si a altor doua sectiuni din pagina, deoarece ele sunt marcate drept chenare partajate si apar in toate paginile web-ului. 2.Executati clic pe butonul Center de pe bara cu instrumente de formatare. Acum, textul apare centrat in toate paginile. Modificarea spatierii paragrafelor Cand introduceti textul in modul de afisare pagina, daca apasati tasta Enter creati un nou paragraf la fel ca in alte aplicatii din Office. Insa, in acelasi timp este adaugat si un
85
GMB Computers
CONSTANA
rand liber inaintea paragrafului anterior si paragraful nou creat. Cand nu doriti acel spatiu liber intre cele doua paragrafe, trebuie sa folositi o intrerupere de rand in loc sa introduceti un nou paragraf, astfel : 1.Derulati pagina pana la inceput, plasati punctul de insertie la sfarsitul paragrafului introductiv si apasati tasta Enter. 2.Acum, scrieti urmatorul text : If you like what you see, tell others. (Daca va place ce vedeti, spuneti si altora). 3.Blocati tasta Shift si apasati tasta Enter. Punctul de inserare se va muta pe randul urmator fara a mai fi introdus un rand suplimentar gol. Acum, scrieti urmatorul text : If you don't, tell us ! (Daca nu va place, spuneti-ne noua). Folosirea etichetelor paginilor Probabil ati observat ca in modul de afisare pagina, apar trei etichete (Normal, HTML si Preview) in partea de jos a spatiului de lucru, care seamana cu etichetele unui registru de calcul din Excel. Aceste etichete ofera trei moduri diferite de afisare a unei pagini din web. Eticheta Normal, care este cea activa, este locul in care puteti introduce si edita articolele din pagini. Eticheta HTML afiseaza codurile HTML incluse in pagini, iar in eticheta Preview sunt afisate paginile asa cum ar arata cand sunt incarcate intr-un browser de Web. Pentru a nu complica lucrurile cu discuii aprofundate despre ce este i ce nu este un URL, am preferat s trec direct la prezentarea unui exemplu concret de realizare a unei legturi. Ceea ce este mai jos definete o legtur ctre un motor de cutare romnesc: <A HREF="http://www.gaseste.com/">motor de cutare</a> motor de cutare Aa cum se poate vedea, atunci cnd o ancor are un atribut HREF ea va defini o legtur ctre un alt document HTML a crui adres (URL) este valoarea atributului HREF. Partea vizibil a legturii, adic textul curins ntre tag-urile <A> i </A>, este difereniat de restul textului n sensul c va avea alt culoare i, eventual, va fi subliniat. ntruct, prin utilizarea CSS, se poate lucra foarte mult asupra formai de prezentare a unei legturi, nu se mai poate spune cu certitudine c textul unei legturi va fi subliniat. Aceast regul ar trebui respectat ntructva dar, lucrurile depind n mare msur de gusturile realizatorului. n ceea ce privete sintaxa folosit n exemplul precedent, trebuie reinute dou aspecte:

valoarea atributului HREF ( URL-ul ) trebuie ncadrat n ghilimele ntruct elementul A este de tip "n linie", prezena tag-ului de sfrit este absolut necesar. n caz contrar, legtura s-ar putea s cuprind paragrafe ntregi.
Dup prezentarea acestui exemplu practic, mai jos este redat forma general a unei legturi: <A HREF="URL">textul legturii</a> unde:
86
GMB Computers
CONSTANA
HREF - (Hypertext REFerence = referina hipertext) are drept valoare o adres URL. Adresa URL este de forma: "http://numedomeniu"
http:// - protocolul de transfer pentru documente HTML. Practic, aceast expresie este prezent n toate adresele URL care fac trimitere ctre alte documente HTML. Varianta actual a acestui protocol permite i transferul de fiiere non-HTML. numedomeniu reprezint adresa la care dorim s puncteze legtura. Aa cum vei vedea, denumirea corect pentru numedomeniu este DNS (iniialele de la Domain Name Space)
Observaie: Prezentarea noiunii de URL a fost fcut n lecia care trata lucrul cu imaginile n HTML. Dac nu ai parcurs acesat lecie este cazul s arunci o privire asupra noiunii de URL. n ceea ce privete adresele URL relative i absolute, principiul de realizare i de funcionare este absolut identic cu cel prezentat n exemplele ilustrate. Singura diferen este c n loc de un fiier grafic putem avea un document HTML (i nu numai). Atributul HREF poate avea drept valoare o adres absolut sau o adreas relativ, n funcie de localizarea fizic a fiierelor HTML dar i de preferinele realizatorului. n exemplul prezentat la nceput se face referire la o resurs extern (n sensul c nu se afl pe acelai site n care se regsete pagina HTML din care am fcut apelarea). n acest caz se spune c legtura definit este o legtur extern. La fel de bine pot exista legturi interne dar i legturi locale. n continuare vei vedea ce nseamn i n ce situaii se utilizeaz astfel de legturi. Legturiile interne sunt legturi n cadrul aceluiai document HTML. Prin intermediul unor astfel de legturi se faciliteaz navigarea n documentele lungi care, n absena unor asfel de legturi, ar necesita utilizarea intensiv a barei de scroll (bara de defilare din dreapta ferestrei). Un astfel de document ar putea fi o list de ntrebri frecvente (cunoscute i sub numele de FAQ) privitoare la un anumit domeniu de activitate. Desigur, acesta este un exemplu clasic. n practic exist mult mai multe situaii n care s-ar impune utilizarea legturilor interne. De exemplu, chiar i leciile din acest site s-ar preta foarte bine la aplicarea unor astfel de legturi. Pentru a nelege legturile interne, am s prezint un exemplu practic de realizare a unei pagini cu ntrebri frecvente. Pentru a realiza o astfel de list, fiecare ntrebare va fi definit drept o legtur care va puncta ctre rspunsul corespunztor. Pentru aceasta va trebui s definim exact locul unde dorim s puncteze legtura (adic rspunsul ntrebrii). Pentru a realiza acest lucru se utilizeaz elementul A cu atributul NAME aa cum se vede mai jos: <A NAME="nume">raspuns intrebare</A> unde valoarea atributului NAME este un nume sugestiv pentru realizatorul paginii. n practic o astfel de construcie va arta ca mai jos: <OL> <LI><A HREF="#raspuns1">ntrebarea 1</A> <LI><A HREF="#raspuns2">ntrebarea 2</A> <LI> . . . . . . . . . . . . . . . . . </OL> <OL> <LI><A HREF="raspuns1">text raspuns 1...</A> <LI><A HREF="raspuns2">text raspuns 2...</A> <LI> . . . . . . . . . . . . . . . . . . </OL>
87
GMB Computers
CONSTANA
Observaie: am preferat s utilizez o list ordonat. La fel de bine se puteau utiliza i alte elemente precum paragrafe, liste ordonate, etc. De asemenea, pentru a vedea la lucru exemplul precedent, exist o variant complet a acestuia. Primele dou construcii (scrie cu albastru) constituie legturi interne i vor fi tratate ca atare de browser, n sensul c vor fi afiate diferit. ntruct locul unde puncteaz legturile se afl in acelai document HTML, pe post de adres URL nu vom avea dect expresia alctuit din semnul diez (#) urmat de numele atribuit ancorei unde dorim s puncteze aceast legtur. O astfel de adres URL se mai numete i adresa URL cu fragment, unde fragmentul este reprezentat de expresia #nume. De reinut c atunci cnd o adres URL puncteaz ctre o ancor cu atributul NAME, prezena semnului diez (#) naintea numelui ancorei este absolut obligatorie. Ultimele dou construcii (cele n care am utilizat atributul NAME) reprezint locul unde se va face saltul atunci cnd se face clic asupra ntrebrilor care corespund acestor rspunsuri. n cazul n care o ancor este utilizat cu atributul NAME (pentru a defini un anumit loc dintr-un document HTML) se mai spune c elementul A definete o ancor (sau ancor cu nume, sau ancor denumit). Valoarea atributului NAME trebuie s fie unic n cadrul aceluiai document dar pot exista i atribute cu aceeai valoare, condiia fiind ca aceste valori care coincid s nu se regseasc n acelai document (pagin). Observaie: n situaia n care elementul A se utilizeaz cu atributul HREF, se mai spune c elementul A definete o legtur. Sun puin cam ciudat: "o ancor definete o ancor" i "o ancor definete o legtur". n acest caz, de ce nu ar exista un alt element pentru a defini o legtur ? ntruct scopul acestui tutorial este unul educativ, am forat puin nota. n realitate o legtur este format din dou ancore: o ancor surs (cu atributul HREF) i o ancor destinaie (cu atributul NAME). n cazul n care nu se specific nici o ancor de destinaie (adic o ancor cu atributul NAME) atunci se consider c aceast ancor va fi implicit nceputul documentului la care se face referire. n concluzie, o ancor definete o ancor i att. n cazul n care utilizm atributul HREF ancora este o ancor surs (definete o legtur), iar n cazul n care utilizm atributul NAME, ancora este o ancor destinaie ( definete o ancor, ancor cu nume, ancor denumit, sau alt defiie pentru acest termen). Spre deosebire de realizarea unei legturi, la realizarea unei ancore cu nume efectul vizual nu este cu nimic diferit fa de restul textului. Din aceast cauz trebuie s fii foarte atent cnd realizezi astfel de ancore. Spun acest lucru ntruct, omiterea tagului de sfrit </A> , nu este sesizabil n cadrul browser-ului Internet Explorer, n schimb n Netscape Communicator (pn la varianta 4.72) acest lucru produce scrierea mai groas a textului n anumite situaii. Revenind la exemlul discutat, se poate constata cu uurin c nu este complet. Nu este complet ntruct nu are o opiune care s ne permit revenirea la seciunea dedicat ntrebrilor. O asemenea opiune s-ar dovedi foarte util n cazul unor documente foarte lungi (nu uita c exemplul meu este unul clasic dar, n realitate, rspunsurile la ntrebri ar putea fi foarte lungi). Pentru a realiza o astfel de list, vom utiliza n cadrul unei ancore att atributul HREF ct i atributul NAME. Construcia unei astfel de liste este redat mai jos: <OL> <LI><A NAME="1" HREF="#raspuns1">ntrebarea 1</A> <LI><A NAME="2" HREF="#raspuns2">ntrebarea 2</A> <LI> . . . . . . . . . . . . . . . . . </OL> <OL> <LI><A HREF="raspuns1">text raspuns 1...</A><A HREF="#1">inapoi</A> <LI><A HREF="raspuns2">text raspuns 2...</A><A HREF="#2">inapoi</A> <LI> . . . . . . . . . . . . . . . .
88
GMB Computers
CONSTANA
. . </OL> nainte de a trece mai departe, vreau s mai fac cteva precizri referitoare la definirea i utilizarea unei ancore.
n cazul n care defineti o ancor cu nume, nu este necesar ca ntreg textul s fie cuprins ntre tag-urile unei asemenea ancore. Este suficient s fie cuprins doar primul cuvnt. n cazul n care att legtura ct i destinaia acesteia (ancora cu nume) se afl n acelai ecran, acionarea unei asemenea legturi nu va produce o afiare a destinaiei la nceputul paginii. n caz contrar, acionarea unei asemenea legturi va face ca destinaia s fie afiat la nceputul paginii. o ancor poate fi inclus ntr-un element HTML precum paragrafe, liste, tabele, etc. de regu, legturile sunt colorate n albastru i sunt subliniate (ele pot fi i nesubliniate dar nu ai nvat pn acum cum se poate realiza acest lucru). De asemenea, poate ai observat c o legtur vizitat va fi apoi colorat diferit de legturile nevizitate (n acest site nu se ntmpl acest lucru). Elementul n care sunt definite atributele unei legturi (este vorba de atributele care determin culorile unei legturi) este elementul BODY. Acest element nu este tratat n lecia de fa. exemplele prezentate de mine sunt cazuri particulare. La fel de bine putem plasa legturi interne pentru a simula sumarul unei pagini de web.
Sunt legturi ntre documente HTML aflate pe acelai server (la aceeai adres). n aceast situaie se pot utiliza att adrese URL relative dar i absolute. De exemplu, dac dorim ca ntrun document intitulat exemplu.html s plasm o legtur ctre un alt document numit probe.html i care se afl ntr-un director diferit (s zicem mm), vom avea o construcie de forma: <A HREF="mm/probe.html">text legtur</A> Adresa URL putea fi scris i n form absolut, ca mai jos: <A HREF="http://www.numesite.com/mm/probe.html">text legtur</A> La fel de bine, ntr-un document pot exista i ancore cu nume. n acest situaie legtura care va puncta o astfel de ancor va conine adresa (relativ sau absolut) la care se va aduga i numele ancorei. De exemlu, s presupunem c avem situaia ilustrat mai jos: Dac n fiierul orae.html avem un titlu de forma: <H4> <A NAME="buc">Bucureti - capitala Romniei</A></H4> n fiierul romania.html putem avea o construie ca cea de mai jos, pentru a face trimitere ctre ancora definit anterior: <P>Acum este disponibil un <A HREF="descriere/orase.html#buc">tur virtual al Bucuretiului</A></P>
89
GMB Computers
CONSTANA
Presupunnd c adresa unui astfel de site ar fi fost www.romania.ro, am fi putut avea adrese URL absolute de forma: <A HREF="http://www.romania.ro/descriere/orase.html#buc"> ...</A> De cele mai multe ori, n cazul legturilor locale se prefer utilizarea adreselor relative. Acest lucru este mult mai comod pentru cel ce realizeaz pagina i, n plus, mai confer i o serie de alte avantaje. Sunt legturi care puncteaz ntodeauna ctre resurse aflate pe alte servere de web (sau la alte adrese de internet). Pentru realizarea legturilor externe se vor utiliza numai adrese URL absolute. n cazul n care n pagina de destinaie exist i ancore cu nume, adresa URL poate conine i numele acelei ancore. Mai jos se regsete un astfel de exemplu: <a href="http://www.w3.org/TR/REC-html40/struct/text.html#edef-BLOCKQUOTE"> recomandarile WWW CONSORTIUM</A> Observaie: Trebuie avut n vedere c nu poi avea drept de scriere asupra unei pagini gzduite pe un alt server (execeptnd cazul n care ai avea mai multe site-uri). n aceast situaie nu-i rmne dect s vizionezi codul surs al paginii HTML la care doreti s te legi, i s vezi dac exist ancore cu nume. n cazul n care exist astfel de ancore, poi realiza o legtur ctre o astfel de ancor. Cu toate acestea, nu este o practic onest s se realizeze astfel de legturi, cu excepia unor cazuri speciale. De cele mai multe ori, o legtur extern ar trebui s puncteze la pagina de nceput a site-ului i nicidecum n mijlocul unei pagini din acel site. n cele ce urmeaz am s prezint trei legturi externe care sunt identice din punct de vedere al aciunii realizate. <A HREF="http://lumea3w.20m.com">......</A> <A HREF="http://www.lumea3w.20m.com/">......</A> <A HREF="http://lumea3w.20m.com/index.html">......</A> Toate cele trei variante prezentate mai sus sunt corecte i puncteaz ctre aceeai adres. De exemplu, prima construcie difer de urmtoarea prin faptul c nu s-a mai precizat expresia www, iar la sfrit am mai adugat un slash care indic separarea dintre directoare. n funcie de configurarea serverului pe care este plasat site-ul, expresia www poate fi omis. n mod similar stau lucrurile i n cazul semnului slash. Acesta va fi pus automat de multe browser-e (Netscape Communicator face acest lucru ncepnd cu versiunea 6.0) dar numai n anumite situaii aa cum am descris mai jos. n tot cazul, este bine s se foloseasc ortografia complet (adic s se includ toate slash-urile aa cum este exemplul scris cu albastru), pentru a evita erorile dar i pentru a face o impresie bun unui vizitator ceva mai avizat. n plus, slash-ul poate lipsi numai dac se face referire la pagina de start a unui site. Ca s fiu mai explicit am s spun c pagina de start (index.html) este invocat automat dac este apelat o adres URL ca cea prezentat n primele dou exemple. O atfel de adres URL nu cuprinde o cale ctre un anumit fiier sau, mai corect spus, este doar adresa DNS a site-ului apelat. Ultima expresie din exemplul dat mai sus include o adres complet ctre pagina de start a acestui site. De cele mai multe ori nu se folosete o asemenea construcie, prefernduse utilizarea adresei URL de baz. Acest lucru se datoreaz faptului c serverele sunt config urate astfel nct pagina de start a unui site s fie inserat n mod automat. De regul, pagina
90
GMB Computers
CONSTANA
de start a unui site poart denumiri sugestive precum index.htm(l), default.htm(l), home.htm(l), etc. Observaie: fiindc veni vorba de pagina de start a unui site, trebuie s ai n vedere c aceasta va avea un nume predefinit. n concluzie, atunci cnd te hotrti s rea lizezi un site, trebuie s ai n vedere c numele paginii de start trebuie s coincid cu cel specificat n documentaia pus la dispoziie de firma (serverul) care ofer gzduire pentru site-ul tu. Dac, de exemplu, prima pagin trebuie s aib numele index.html i tu vei numi prima pagin sub forma start.html, cei ce vor accesa site-ul tu vor fi ntmpinai de un mesaj de eroare. Pe lng cele dou atribute eseniale (HREF i NAME), o ancor mai dispune i de alte atribute mai puin utilizate dar care uneori se dovedesc a fi foarte utile. Cteva dintre aceste atribute sunt prezentate n continuare.
TARGET - indic cadrul (n cazul de fa este vorba de fereastra browser-ului) n care va fi afiat documenul apelat de o legtur. Acest atribut poate avea valorile prestabilite _blank, _self, _parent i _top sau un nume pe care l atribuim unui cadru. ntruct acest atribut este utilizat ndeosebi n cazul unui site format din cadre (despre care nu am vorbit nc), doar valoarea _blank este util n momentul de fa. O expresie de forma : <A HREF="http://www.yahoo.com/" TARGET="_blank">Yahoo</A>
va face ca adresa invocat de aceast legtur s fie afiat ntr-o nou fereastr a browser-ului. Fereastra din care s-a fcut apelarea rmne deschis n continuare. Valoarea _self va face ca afiarea site-ului (sau documentului) invocat de o legtur s se realizeze n aceeai fereastr (n acest fel va disprea documentul din care s-a fcut apelarea). Dac nu se specific atributul TARGET, acesta va fi considerat implicit ca avnd valoarea target="_self". TITLE - acest atribut ofer informaii suplimentare despre o legtur atunci cnd ne poziionm cu mouse-ul asupra ei. Modul de afiare este identic cu cel al atributului ALT din cadrul tag-ului IMG. Atributul TITLE nu este interpretat de toate browser-ele. Netscape Communicator suport acest atribut ncepnd cu versiunea 6.0. Exemplu: <A HREF="http://www.yahoo.com/" TITLE="motor de cautare">Yahoo</A>
pe lng atributele prezentate, exist i alte atribute mai puin utilizate precum rel, rev, type, shape, coords, etc. De exemplu, atribute precum shape i coords sunt utilizate numai la realizarea unei hri imagine (sau imagine de tip hart). evenimentele intrinseci vor fi prezentate n seciunea dedicat JavaScript. Aceste evenimente sunt asociate implicit unei ancore iar n cazul n care sunt specificate vor determina executarea scriptului aferent. De exemplu, evenimentul onmouseout indic faptul c un eveniment se va produce atunci cnd mouse-ul este mutat n afara unei legturi. Aciunea care trebuie s se produc n urma acestui eveniment este specif icat ntr-un script. Mai jos este un exemplu:
91
GMB Computers
CONSTANA
<A HREF="exfaq.htm" TARGET="_blank" onmouseout='alert("Aceasta legatura va afia un exemplu")';> exemplu</A>
exemplu - dac vei trece cu mouse-ul peste aceast legtur (nu te vei ori deasupra ei) va aprea o csu de atenionare. Evenimentele intrinseci sunt disponibile pentru majoritatea elementelor HTML dar, momentan, consider c nu este necesar s le amintesc. n cazul elementului A am prezentat acest exemplu pentru a putea s-i faci o idee asupra noiunii de eveniment intrinsec.
Pe lng textul obinuit se poate opta i pentru includerea unei imagini n cadrul unei legturi. De regul, n cazul n care se folosete o imagine pentru a reprezenta o legtur, se renun la text. n schimb, informaiile suplimentare pot fi oferite prin intermediul textului alternativ. Acesta poate fi furnizat prin intermediul atributului TITLE, sau prin intermediul atributului ALT din cadrul tag-ului IMG. Ultima variant este de preferat ntruct atributul ALT este interpretat i de Netscape Communicator. O legtur grafic se realizeaz prin plasarea unei imagini ntre tag-urile unei ancore. De exemplu: <A HREF="http://lumea3w.20m.com/"> <IMG SRC="pics/tlogo.gif" ALT="Tutoriale WEB"></A> Dup cum se poate vedea, cnd o imagine este folosit pentru a reprezenta o legtur ea va fi nconjurat automat de o bordur albastr ca i cum ar sugera o legtur subliniat. Pentru a elimina aceast margine vom utiliza atributul BORDER din tag-ul <IMG> i i vom atribui valoarea zero. <A HREF="http://lumea3w.20m.com/"> <IMG SRC="pics/tlogo.gif" BORDER="0" ALT="Tutoriale WEB"></A> rezultat:
Dac nu i mai aduci aminte de anumite lucruri legate de includerea imaginilor n paginile HTML, am s-i reamintesc c trebuie specificate i dimensiunile imaginii (atributele WIDTH i HEIGHT) chiar dac eu nu am fcut-o. Numrul de imagini ce pot fi incluse n cadrul unei legturi nu este limitat. De exemplu, se pot aduga mai multe imagini (mai multe taguri <IMG> mpreun cu fiierele grafice aferente) sau, n cazul n care dorim s avem i text n cadrul unei legturi, putem plasa un text nainte sau dup tag-ul IMG, n funcie de locul n care dorim s apar textul. n tot cazul, utilizarea mai multor imagini pentru a reprezenta o singur legtur este un lucru destul de rar ntlnit. Prin intermediul unei legturi se pot apela i alte resurse, diferite de clasicele fiiere HTML. Un exemplu foarte des ntlnit ar fi o legtur care puncteaz ctre o imagine. O astfel de legtur ar putea face ca o imagine mic s reprezinte o legtur grafic ctre aceeai im agine dar la dimensiuni mult mai mari. Singura condiie ce trebuie ndeplinit este ca fiierul grafic s fie recunoscut de browser (fiiere .jpg sau .gif). Un exemplu de astfel de legtur se regsete mai jos. <A HREF="pics/bigfrog.jpg" TITLE="broasca marita" TARGET="_blank"> <IMG SRC="pics/frog.gif" width="80" height="60" BORDER="0" ALT="broasca marita"></A>
92
GMB Computers
CONSTANA
n cazul n care se omite textul alternativ este bine s se includ i text n cadrul legturii. De exemplu: <A HREF="pics/bigfrog.jpg" TARGET="_blank"> <IMG SRC="pics/frog.gif" width="80" height="60" BORDER="0"><br> Broscu n Zoom</A> Broscu n Zoom n afar de imagini putem avea legturi ctre fiiere n diverse formate. De exemplu, putem avea legturi care s fac referire la fiiere audio, video, fiiere n format Acrobat Reader (fiiere cu extensia .pdf), etc. Mai jos este redat un exemplu de legtur care apeleaz un fiier video. <A HREF="test.mpg">Fiier video</A> La apelarea unei asemenea legturi browser-ul va cuta s vad dac poate asocia extensia acestui fiier cu unul din programele disponibile pe calculatorul gazd. Aceste programe pot rula independent de browser sau pot fi disponibile chiar n browser (cunoscute sub denumirea de plug-in). Dac browser-ul tie ce program trebuie utilizat pentru citirea fiierului apelat, va trece la deschiderea programului n cauz i apoi se va reda filmul coninut n fiierul test.mpg. n caz contrar va trece la salvarea fiierului dar numai dup ce vizitatorul este ntrebat dac accept acest lucru. Observaie: Comportamentul descris mai sus nu este identic pentru toate tipurile de fiiere i nici pentru toate browser-ele. De exemplu, pot exista situaii n care lucrurile s se ntmple aa cum am descris mai sus dar pot exista i cazuri n care s apar o csu de dialog prin care vizitatorul s fie ntrebat dac dorete descrcarea fierului apelat sau dac dorete deschiderea acestui fiier cu o anumit aplicaie. Un alt exemplu ar putea fi o legtur ctre un document n format PDF. Aceste documente pot fi vizionate cu softul Acrobat Reader. n cazul n care este instalat acest soft, fiierul va putea fi citit. <A HREF="tutorial.pdf">Tutorial HTML n format PDF</A> De cele mai multe ori dimensiunea unui fiier n format PDF sau a unor fiiere video i audio este considerabil. n aceast situaie este de evitat a se utiliza astfel de fiiere, n special n cazul serverelor lente. n schimb se pot utiliza alte soluii. De exemplu, am putea utiliza o variant HTML care s se apropie ct mai mult de aspectul vizual al unui fiier n format PDF (acest lucru poate fi obinut printr-o utilizare inteligent a CSS). Un alt lucru de care trebuie inut cont este c un fiier PDF vizionat online nu este neaprat salvat. De aceea, o variant mai bun ar fi s comprimm fiierul (chiar dac rata de comprimare este foarte sczut) i s-l punem la dispoziie sub forma unei legturi de genul : <A HREF="tutorial.zip">Tutorial HTML n format PDF</A> La acionarea unei astfel de legturi fiierul ZIP va fi salvat. Se evit n acest fel activarea plug-in-ului Acrobat Reader. n tot cazul, acesta este doar un sfat i nu o regul. O alt soluie (i cea mai des utilizat) ar fi introducerea unei note n care s se precizeze
93
GMB Computers
CONSTANA
modalitatea de salvare a unor astfel de fiiere. n acest fel se vine n ajutorul celor ce nu sunt familiarizai cu internetul. Observaie: ceea ce urmeaz este mai mult un sfat care se adreseaz navigatorilor i mai puin realizatorilor de pagini web. Dac te ntlneti cu fiiere care nu doreti s fie ncrcate n browser (sau n plug-in-ul aferent) poi executa clic pe butonul drept al mouse-ului atunci cnd eti poziionat deasupra unei asemenea legturi, iar din meniul care va aprea vei selecta save target as. n acest fel se va evita acionarea legturii i implicit pornirea softului care ar putea citi un asemenea fiier. Acest lucru se poate dovedi foarte util cnd ai puin memorie sau un procesor mai puin performant.Dac nu tii ctre ce fiier puncteaz o legtur, atunci poi privi n bara de stare a browser-ului i acolo va scrie ntreaga adres URL a legturii. Acest lucru se ntmpl numai cnd te poziionezi cu mouse-ul asupra legturii n cauz. Discuia despre ce fiiere ar trebui sau nu ar trebui oferite prin intermediul unei legturi este mult mai lung i necesit explicaii mai complexe. Am s m limitez doar la cteva idei principale:
fiierele care se preteaz a fi comprimate, este bine s fie comprimate. Fiiere n fo rmat doc, xls, dbf, etc. se preteaz foarte bine la comprimare. n acest fel timpul necesar descrcrii se reduce considerabil. realizarea legturilor ctre diferite tipuri de fiiere nu este ntodeauna posibil. Acest lucru depinde n mare msur i de server. Cu alte cuvinte nu toate serverele suport aceleai tipuri de fiiere. De regul (dar nu obligatoriu), sunt suportate cele mai utilizate formate de fiiere precum fiiere de tip (.htm, .html, .gif, .jpg, .doc, .pdf, .zip, .mpg, .avi, etc.). Dac vrei s foloseti un tip de fiier mai puin utilizat, este bine s citeti documentaia serverului pentru a vedea dac acel tip de fiier este suportat. n caz contrar este posibil s nu poi realiza o accesare corect a acelui fiier. Totui, n unele situaii este posibil ca fiiere ce nu sunt suportate de server s poat fi transferate corect (deoarece acest lucru depinde i de browser). Cea mai sigur rezolvare este s arhivezi fiierul. Formatul ZIP este suportat de marea majoritate a serverelor. nu toate formatele de fiiere folosite n mod clasic se preteaz a fi utilizate i pe internet. ntruct vitezele de transfer pentru utilizatorii casnici sunt limitate apar numeroase limitri, n special n domeniul multimedia. De aceea se prefer utilizarea unor formate specializate precum .mp3 (compresie foarte bun i sunet de calitate) sau .ra (real audio - permite un flux audio n timp real). Exist diverse metode de legare la fiierele de tip real audio. Pentru mai multe detalii poi accesa http://www.real.com/. De asemenea, utilizarea unor astfel de formate necesit si un soft specializat n decodarea fiierelor respective. ar mai fi destule observaii de fcut dar, dac vizitatorii acestui site o vor cere, am s ncerc s realizez o pagin care va trata problemele legate de multimedia.
Cnd am discutat despre imagini am fost nevoit s fac o prezentare succint a noiunii de URL. La momentul respectiv am considerat acea prezentare ca fiind suficient. Acum, dup ce am vorbit despre hiperlegturi, este necesar o prezentare mai detaliat a noiunii de URL, pentru a putea completa subiectul care trateaz realizarea hiperlegturilor. Am preferat s revin asupra unor noiuni precum adrese relative sau adrese absolute considernd c nu stric s mai revezi aceste aspecte. De asemenea, am ncercat o prezentare puin mai tehnic (fr s exagerez) a termenului DNS i IP ntruct le consider chestiuni de cultur general pentru un realizator de pagini web. Dac nu consideri utile astfel de informaii poi omite paragafele n cauz.
94
GMB Computers
CONSTANA
URL reprezint iniialele de la Uniform Resource Locator care, n traducere, nseamn Locator Uniform de Resurse. Un URL indic locaia unei resurse (adic a unui fiier html, grafic, video, etc). Mai clar spus, un URL reprezint adresa de internet unde se regsete o anumit resurs. Datorit faptului c un URL reprezint n fapt o adres, se mai folosete i termenul de adres URL n loc de URL. Acest termen este des utilizat chiar dac nu este ntodeauna corect. Observaie: uneori se prefer ca n locul noiunii de URL s se foloseasc termenul URI (Universal Resource Identifiers). Nu este o greeal dar trebuie s tii c URL este un subset al noiunii de URI. Identificatorii Universali de Resurse (URI) cuprind momentan doar noiunea de URL intenionndu-se ca pe viitor s cuprind i alte tipuri de construcii pentru localizarea diferitelor resurse. n continuare am s prezint sintaxa unei adrese URL. Forma general a unei adrese URL este redat mai jos: protocol://server_Gazd : PORT/cale/numefiier.htm (html, gif, zip, etc.) Aceasta este forma general a unei adrese URL. Un exemplu de adres URL este redat mai jos: http://www.numesite.com:80/director/index.html
protocol - protocolul utilizat pentru accesarea unei resurse ce se regsete pe internet. Cel mai utilizat este protocolul HTTP (Hypertext Transfer Protocol). Acest protocol permite accesarea i transferul paginilor de web (documente hipertext). Pe lng HTTP se mai utilizeaz i protocoale mai vechi precum FTP (File Transfer Protocol) pentru transferul fiierelor, TELNET, GOPHER - pentru accesarea unui server Gopher, etc. Dintre toate protocoalele enumerate doar HTTP are o utilizare foarte larg, restul fiind utilizate ocazional. Pe lng aceste protocoale, exist i o serie de alte protocoale nou aprute cu o utilizare nc restrns. Un exemplu de protocol nou aprut este protocolul pentru TV. n plus, exist i protocoale specializate n transferul anumitor tipuri de fiiere cum este, de exemlu, protocolul PNM utilizat numai pentru accesarea fiierelor audio n format Real Audio.. n cadrul unei adrese URL termenul de protocol nu definete neaprat un protocol. n acel loc se poate plasa i o construcie specific necesar apelrii diverselor resurse (de ex. un program de mail, apelarea unor grupuri de informaii, etc). server_Gazd - adresa DNS (Domain Name Space) a serverului care gzduiete siteul sau adresa de IP a acestui server. DNS (sau numele domeniului) este adresa unui domeniu scris cu caractere i este sub forma: www.numesite.com (ro, edu, org, etc)
Aceast adres se poate prezenta sub diverse forme i nu conine n mod obligatoriu i expresia WWW (n funcie de modul n care este setat serverul).
95
GMB Computers
CONSTANA
n spatele unei adrese DNS se afl adresa de IP i este echivalent cu adresa DNS. Adresa de IP este o modalitate de reprezentare a adreselor folosit de protocoalele TCP/IP i difer de adresa DNS (una din diferene) prin faptul c este prezentat sub form numeric. O adres IP este unic pentru fiecare calculator sau domeniu aflat n reeaua Internet i folosete o schem de adresare pe 32 de bii (4 octei). Forma general a unei adrese de IP este: w.x.y.z unde w, x, y, z - au valori cuprinse ntre 1 - 254
ntruct adresa de IP este echivalentul numeric al adresei DNS, expresiile de mai jos sunt echivalente: http://lumea3w.20m.com http://208.185.127.162
Numerele care apar n cadrul unei adrese IP nu sunt ntmltoare. De exemplu, n cadrul unei adrese IP prima poriune (w) descrie reeaua nsi. Restul (x.y.z) descrie adresa echipamentului (calculatorului) n cadrul reelei. n funcie de valorile atribuite primei poriuni (w) a unei adrese IP, reelele sunt divizate n trei clase (sau licene) i anume: A, B i C. Aceast clasificare este fcut n funcie de complexitatea i dime nsiunea reelei. De exemplu, n reelele din clasa A prima parte a adresei de IP are valori cuprinse ntre 0 - 127. ntruct definesc reele foarte mari i complexe (eventual st rategice), toate adresele de clas A nu mai sunt de mult timp disponibile. Beneficiarii unor astfel de adrese sunt organizaiile guvernamentale americane, universiti, sau mari companii ("cine mparte parte i face"). M opresc aici ca s nu te agresez c u prea multe informaii. Nu este o tragedie dac nu ai priceput cum st treaba. De regul se utilizeaz numai adrese DNS fiind mult mai uor de reinut i de scris. Observaie: licena de utilizare a unui domeniu de adrese IP este controlat de InterNIC (Internet Network Information Center). Cu alte cuvinte, dup ce achii o tax val abil doi ani, poi cumpra propriul domeniu de internet. Dar nu asta am vrut s spun. Ca un cunosctor al internetului trebuie s tii cum se poate afla cine se ascunde n spatele unei adrese DNS sau a unei adrese de IP. O conversie IP - DNS i invers se poate face cu aa numitele programe "traceroute". Un astfel de program are drept scop principal afiarea nodurilor de internet prin care treci pentru a ajunge la o anumit adres dar poate fi utilizat i pentru a realiza o co nversie IP - DNS (dac exist o asemenea adres DNS). Un "traceroute" poate fi accesat pe serverul de la Stanford Linear Acceleration Center. Exist posibilitatea de a afla chiar i numele posesorului unui anumit domeniu. Acest lucru se face prin intermediul "serviciului whois" care, n fapt, reprezint interogarea unor baze de date n care sunt nregistrate aceste informaii. O astfel de baz de date poate fi interogat la Whois.Userland.com pentru domenii cu extensia .com, .org, etc., iar pentru domenii din Europa poi accesa RIPE Network Coordination Centre. Ca o
96
GMB Computers
CONSTANA
concluzie, trebuie s tii c toate site-urile vizitate de tine vor putea determina cu exactitate cine ai fost (prin ce provider de internet eti conectat) i ce IP ai avut ct timp ai stat n reea. Desigur, exist i excepii de la regul dar, de cele mai multe ori, cu puin efort se poate determina un eventual "intrus nepoftit".

port - portul serverului de web. De cele mai multe ori valoarea portului este 80, motiv pentru care nu se specific n cadrul adresei URL. cale - calea ctre fiierul ce urmeaz s fie accesat numefiier - fiierul la care se face referire.
n continuare am s prezint diferite tipuri de adrese URL i cnd sunt utilizate aceste adrese. Dei cele prezentate pn acum au descris modul de realizare a legturilor ntre documentele html, am s revin pe scurt asupra acestui subiect.
Realizarea legturilor ctre documente HTML se face utiliznd o adres URL care conine protocolul HTTP. O adres URL care face referire la un document HTML este de forma: http://www.numesite.com/director/index.html Continuarea acestui subiect o cunoti (se folosete elementul A cu atrib. HREF, .....). Trebie s reii prezena obligatorie a protocolului http. Observaie: adresele URL pot fi din punct de vedere al scrierii, relative sau absolute. n cazul unei adrese URL relative, nu nseamn c nu este specificat protocolul utilizat. Acest lucru nu este fcut n mod explicit de ctre realizatorul paginii de web. n schimb, acest sarcin cade n seama browser-ului. Browser-ul va memora adresa URL de baz (acea adres sub forma http://www.numesite.com/) i, folosind procedeul cunoscut sub numele de concatenare, va "lipi" adresa URL relativ la adresa URL de baz. O descriere complet a noiunii de adres URL absolut i adres URL relativ este realizat la sfritul acestei lecii n seciunea "Adrese URL relative i adrese URL absolute" Invocarea unui program de e-mail se face tot prin intermediul unei legturi. De aceast dat adresa URL va conine n locul protocolului http:// o expresie mailto: (dispar cele dou slashuri) urmat de adresa de e-mail la care dorim s se trimit un anumit mesaj. Un exemplu de astfel de adres URL este redat n cele ce urmeaz: <A HREF="mailto:webmaster@lumea3w.20m.com"> webmaster@lumea3w.20m.com</A> rezultat webmaster@lumea3w.20m.com n plus, o astfel de construcie URL mai poate conine i subiectul mesajului. Cu alte cuvinte, cnd va fi apelat programul de e-mail prin intermediul unei asemenea legturi, va aprea i
97
GMB Computers
CONSTANA
cmpul Subject completat, pe lng adresa de e-mail care va fi n cmpul To. O astfel de construcie este prezentat mai jos: <A HREF="mailto:webmaster@numesite.com?subject=Probe"> webmaster</A> De remarcat prezena semnului ntrebrii pentru a separa Subject de mailto. n cmpul Subject am fi putut avea o expresie mult mai lung. Pentru a putea scrie asemenea expresii trebuie s fie utilizate codurile escape pentru anumite caractere. Observaie: codurile escape sunt reprezentrile caracterelor n hexazecimal. Forma general a unui cod escape este %HH unde HH reprezint valoarea hexazecimal. Mai jos sunt cteva caractere i codurile escape aferente.

spaiu - %20 ! - %21 " - %22 # - %23 & - %26 / - %2F : - %3A ? - %3F
ntruct o adres URL poate conine caractere rezervate precum semnul diez (#) - semnific o adres URL cu fragment, semnul ntrebrii, etc., va trebui s utilizm secvenele escape acolo unde dorim s plasm anumite caractere interzise sau cu o anumit semnificaie (cnd sunt utilizate ntr-o adres URL). Ca s fiu mai explicit am s spun c aceste caractere nu pot aprea n numele unui fiier, al unei adrese DNS, etc. dect dac sunt scrise n hexazecimal. n schimb ele vor fi scrise ca atare dac sunt utilizate n scopurile pentru care au fost rezervate (de ex. semnul diez face trimitere la o ancor cu nume, etc).
Pentru a nu rmne nelmurit am s-i art un exemplu de adres URL care necesit utilizarea codurilor escape. http://www.numesite.com/cgi/exemplu.cgi?URL=http%3A%2F%2F www.abstract.ro Mai jos este redat "traducerea" adresei URL. http://www.numesite.com/cgi/exemplu.cgi?URL=http:// www.abstract.ro Plasat ntr-o ancor, o astfel de adres URL va putea fi vzut n bara de stare a browserului n cazul n care te poziionezi cu mouse-ul asupra legturii. n funcie de browser-ul utilizat se vor vedea caracterele n hexa sau normal (I.E. i N.C 6.0). Exemplul anterior este unul imaginar n care se apeleaz un script CGI. De cele mai multe ori reprezentarea caracterelor n hexa se face cnd se apeleaz astfel de scripturi. Ca s nelegi
98
GMB Computers
CONSTANA
cte ceva din acel exemplu am s mai spun c ceea ce urmeaz semnului ntrebrii reprezint o variabil (este vorba de URL) necesar scriptului exemplu.cgi, respectiv valoarea acesteia (adresa URL scris cu caractere n hexa). Din fericire, n momentul de fa nu vei fi nevoit s apelezi la codruile escape dect n cazurile prezentate n continuare (dar nu este obligatoriu). Alminteri mi nive greu s cred c cineva i va numi un fiier sub forma probe#1.html sau ceva de genul sta. De exemplu, pentru a specifica un subiect mai lung voi folosi o construcie de forma: <A HREF= "mailto:webmaster@numesite.com?subject=Merge%20sau%20nu%20merge%3F"> webmaster</A> La apelarea legturii webmaster ar trebui s se deschid programul de e-mail instalat pe calculatorul tu i n cmpul Subject s fie o expresie de forma: Merge sau nu merge ? n exemplul precedent am folosit o adres URL de tip "mailto". La o astfel de adres URL caracterele rezervate sunt semnul egal, semul ntrebrii si semnul apersand (&). n plus spaiile goale sunt reprezentate n hexazecimal. Dup cum vezi semnul diez (#) nu mai este rezervat n acest tip de adres URL.
Problema este c semnul ampersand este un caracter rezervat n HTML i n acest caz ar trebui s folosim entitatea . Ca s fiu sincer nu vreau s mai lungesc discuia dar, din cte tiu, ntr-o adres de tip mailto se poate folosi semnul ampersand fr a fi utilizat entitatea corespunztoare. n tot cazul, la carte scrie c acest caracter trebuie specificat prin intermediul entitii &. Dac eti amator de teorie te las s studiezi singur cea mai recent specificaie despre adresele URL de tip mailto, specificaie ce se gsete la adresa info.internet.isi.edu/in-notes/rfc/files/rfc2368.txt Cele prezentate pn acum sunt lucruri standardizate n HTML i ar trebui interpretate corect de toate browser-ele i programele de e-mail. Precizrile care urmeaz au fost incluse relativ recent n specificaiile oficiale, drept urmare este foarte posibil s nu fie interpretate corect de unele browser-e mai vechi. Mergnd puin mai departe, poi specifica nu numai subiectul unui mesaj de e-mail ci i celelalte cmpuri care sunt disponibile ntr-un program de e-mail (cmpurile CC, BCC, BODY). Singura problem care intervine este c aceste opiuni au fost incluse recent n standardul URL. Totui, din probele efectuate de mine i din studiul realizat pe net, se pare c precizarea unor astfel de cmpuri nu creeaz probleme deosebite cu toate c nu este exclus contrariul. Pentru a completa i celelalte cmpuri dintr-un e-mail trebuie s ii cont de urmtoarele aspecte:
dac primele dou specificaii (mailto:adresa-mail?subject=text%20subiect) erau separate de semnul ntrebrii, toate cmpurile ce urmeaz acestor dou specificaii trebuie
99
GMB Computers
CONSTANA
separate de semnul ampersand (&), semn ce trebuie redat sub form de entitate (&). De asemenea, trebuie reinut c valorile atribuite cmpurilor de e-mail nu sunt cuprinse ntre ghilimele. includerea anumitor caractere precum un spaiu gol, semnul ntrebrii, etc, trebuie realizat prin intermediul codurilor escape corespunztoare. Acest lucru este valabil cnd se dorete prezena unor astfel de caractere n corpul mesajului, n adresa de e-mail, etc i nu n cazul n care ele sunt folosite pentru a realiza anumite delimitri aa cum am artat n continuare.
innd cont de cele precizate mai sus, o legtur care va invoca un program de e-mail i care va cuprinde mai multe cmpuri completate va arta ca n exemplul urmtor: <A HREF= "mailto:webmaster@numesite.com?subject=Merge%20sau%20nu%20merge%3F &cc=webmaster1@numesite.com&body=Introdu%20adresa%20de%20 email%20!"> webmaster</A> La apelarea legturii webmaster n programul de e-mail ar trebui s apar urmtoarele cmuri:
To: webmaster@numesite.com From: adresa ta de e-mail Subject:Merge sau nu merge ? Cc: webmaster1@numesite.com Bcc:
Introdu adresa de email ! nainte de a recurge la o asemenea legtur este bine s verifici dac funcioneaz corect toate codurile escape utilizate. Dac ai dubii asupra unora dintre ele, este bine s nu te complici cu o astfel de legtur. Ar mai fi cte ceva de adugat la acest subiect dar m opresc aici. Pentru moment cred c am spus destule pentru a putea realiza o legtur "mailto". Nu uita c o astfel de legtur nu trebuie s cuprind neaprat tot felul de opiuni "exotice". Este suficient s cuprind doar adresa de e-mail. Restul poate fi fcut de vizitatori ... FTP (File Transfer Pprotocol) este un protocol folosit pentru transferul fiierelor de pe serverele de FTP. Utilizarea protocolului FTP era foarte rspndit n perioada de nceput a webului. De cnd protocolul HTTP poate suporta i transferul fiierelor, utilizarea protocolului FTP nu mai este aa de rspndit. Aceasta nu nseamn c nu se mai folosete deloc. n general toate firmele productoare de software i mai toi furnizorii de servicii internet (ISP) au servere de FTP de unde se pot transfera diverse softuri gratuite sau de evaluare.
100
GMB Computers
CONSTANA
Forma unei adrese URL care face referire la un server de FTP este identic cu adresa URL a unei pagini de web schimbndu-se doar protocolul (ftp:// n loc de http://). Mai jos este redat forma general a unei adrese URL: ftp://user:parola@nume_Gazda:port/cale/numefiier De cele mai multe ori serverele FTP accept orice vizitator (sunt servere anonime). Datorit acestui fapt, expresia (user:parola@) nu se specific ntr-o adres URL care face trimitere ctre un site FTP. La fel stau lucrurile i n cazul portului. Serverele FTP folosesc, de regul, portul 21. Nici acesta nu trebuie specificat. n concluzie, o legtur ctre un site FTP va arta ca mai jos: <A HREF="ftp://ftp.microsoft.com/">FTP Microsoft</A> ntruct nu am precizat un anumit fiier, la accesarea unei astfel de legturi browser-ul va afia toate directoarele ce se afl n rdcina serverului. De aici poi s caui fiierul care te intereseaz dei este destul de greu. Cel mai bine este ca o adres URL s puncteze exact ctre fiierul dorit. O astfel de opiune este folosit destul de rar. Aceasta ntruct legarea la un grup de informaii (USENET) depinde n mare msur i de furnizorul de servicii internet. Forma unei astfel de legturi este: <A HREF="news:numele grupului de tiri">...</a> De exemplu, un grup de tiri este alt.internet.services. Conveniile de numire a grupurilor de tiri se bazeaz pe o structur ierarhhic. n sintaxa unui astfel de grup, primul grup de litere reprezint categoria din care face parte grupul de tiri. n ex. dat de mine alt indic un grup de informaii alternativ. La fel de bine exist i prescurtri precum news - pentru tiri, rec - subiecte recreative, sci - tiin, etc. Ceea ce urmeaz primului grup de litere indic mai precis subiectul abordat. n exemplul de fa este vorba de internet.
Domeniul este foarte vast i l-am amintit pentru propria ta cultur. Dac vei avea curiozitatea s te apleci mai mult asupra acestui subiect vei constata foarte repede ct de mare este numrul grupurilor de tiri existente. Serviciul GOPHER este un strmo al reelei WWW. Pe serverele GOPHER se regsesc fiiere de tip text. Cu timpul aceste fiiere au fost convertite n HTML iar serverele GOPHER au devenit servere de web. Cu toate acestea, chiar i n zilele noastre se mai pot gsi servere gopher funcionale. De obicei, pentru cantiti mari de text care ar necesita mult munc pentru a fi convertite n format HTML, se prefer utilizarea serverelor GOPHER. Adresa URL care punctez ctre un server GOPHER va conine protocolul gopher://. n rest este identic cu o adres URL clasic. n continuare este un exemplu de legtur ctre un server gopher meninut de guvernul argentinian: <A HREF="gopher://gopher.mcye.gov.ar">....</A>
101
GMB Computers
CONSTANA
O list cu serverele GOPHER existente la ora actual se regsete la adresa www.galaxy.com/GJ/ dar, dup cum spuneam, multe servere gopher s-au transformat n servere de web. n tot cazul, din lista existent la galaxy.com nu am putut regsi prea multe servere GOPHER iar cele pe care le-am gsit nu puteau fi accesate. Pentru a economisi timp n cutarea unor astfel de servere, mai jos am redat cteva adrese de servere GOPHER operaionale.
gopher://gopher.mcye.gov.ar/ gopher.unicom.com/11/gn-info www.fsz.bme.hu/hungary/gopher.html fatty.law.cornell.edu Mai exist i alte tipuri de adrese URL care folosesc alte scheme de adresare dect cele prezentate de mine. ntruct utilizarea unor astfel de adrese URL este aproape inexistent, nu am mai pierdut timp cu prezentarea lor. Dac ai parcurs pas cu pas acest tutorial, termeni precum adres URL absolut sau adres URL relativ i sun familiar. Chiar dac este aa, nu pot ncheia lecia dedicat adreselor URL fr s m aplec asupra acestor noiuni elementare ale limbajului HTML. Chiar dac ai priceput noiunile de adres URL absolut i relativ, o recapitulare a acestora nu-i poate duna. n schimb, dac ai ajuns la aceast pagin prin intermediul unei legturi, este foarte probabil ca ordinea de prezentare a subiectelor tratate s i se par puin ilogic. n mod normal noiunile de adres URL relativ (absolut) ar fi trebuit prezentate imediat dup descrierea unei adrese URL. Nu tiu ce s zic. Sper s fie bine cum am procedat.
Adresele URL absolute cuprind adresa complet ctre o anumit resurs aflat pe internet. Mai jos se afl un exemplu de adres absolut: http://www.lumea3w.20m.com/thtml/intro.html O adres absolut va cuprinde n mod obligatoriu protocolul folosit (http), numele domeniului (DNS-ul sau IP-ul), calea ce trebuie urmat i numele fiierului la care se face referire (n exemplul dat este vorba de fiierul intro.html aflat n directorul thtml). n cazul n care se apeleaz pagina de start a unui site (adic o adres de forma www.numesite.com) se poate omite numele paginii de start dar numai dup ce ai verificat dac serverul este setat s ncarce automat aceast pagin.
Adresele absolute sunt utilizate n special n cazul n care se face referire la resurse ce nu sunt localizate pe acelai site cu documentul n care este plasat o astfel de legtur. Asta nu nseamn c folosirea lor este interzis n alte cazuri.
102
GMB Computers
CONSTANA
O adres URL (fie absolut fie relativ) nu trebuie s cuprind nici un spaiu gol i nici semne precum diez (#) sau alte semne ce au o funcie rezervat ntr-o adres URL. Redarea unor astfel de caractere se face utiliznd codurile escape.
Pentru a nu avea neplceri este bine ca att numele fiierelor salvate ct i scrierea adreselor URL s se fac cu litere mici. Marcajul HTML principal pentru introducerea referintelor catre alte pagini HTML sau catre elemente din cadrul aceleiasi pagini web este <a>. El trebuie sa contina atribute, in caz contrar neafectand formatarea documentului. <a>Aici</a> ar trebui sa fie un link ! Pentru a activa linkul vom adauga atributul href. <a href="pagina.html">Aici</a> este un link ! Referintele pot fi absolute sau relative. Referintele pot fi catre pagini html, dar si catre alte tipuri de fisiere (imagini, fisiere audio, video, documente in alte formate, etc.)
Tabelele pot aparea dificile la inceput, dar cu putina rabdare si practica vei vedea ca nu sunt asa cum par. Tagul <table> este folosit pentru a deschide un tabel. Inauntrul acestui tag vom gasi alte doua taguri tipice <tr> (liniile tabelului) si <td> (coloanele tabelului). Dar cea mai buna explicatie ar fi in momentul de fata un exemplu:
<table border="1"> <tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr> </table>
Vizualizare
Row 1 Cell 1 Row 1 Cell 2
Row 2 Cell 1
Row 2 Cell 2
103
GMB Computers
CONSTANA
Continutul va fi plasat in interiorul casutelor tabelului. O casuta este ceea ce se afla intre <td> si </td>. Atributul border stabileste latimea marginii tabelului.
HTML - Tabele asimetrice

Pentru a forma tabele asimetrice vom folosi "rowspan" pentru a traversa mai mute linii si "colspan" pentru a traversa mai multe coloane. Deasemenea daca vrem ca prima linie sa serveasca de titluri pentru toate coloanele vom folosi tagul <th>. Acestea vor fi scrise cu litere ingrosate dupa cum vom vedea in exemplu urmator:
<table border="1"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr><td rowspan="2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr> <tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr> <tr><td colspan="3">Row 3 Cell 1</td></tr> </table>
Vizualizare
Column 1 Column 2 Column 3
Row 1 Cell 2 Row 1 Cell 1 Row 2 Cell 2
Row 1 Cell 3
Row 2 Cell 3
104
GMB Computers
CONSTANA
Row 3 Cell 1
HTML - Spatierea celulelor

Cu ajutorul atributelor "cellpadding" si "cellspacing" vom defini distanta dintre celule. "cellspacing" stabileste marimea marginii, iar "cellpandding" stabileste distanta dintre margine si continut. In exemplu urmator a fost adaugata deasemenea putina culoare. <table border="1" cellspacing="10" bgcolor="rgb(0,255,0)"> <tr> <th>Column 1</th> <th>Column 2</th> </tr> <tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr> </table>
VIzualizare
Vizualizeaza acest exemplu intr-o fereastra noua.
Pentru a face mai bine diferenta vom elimina marginea din exemplu anterior. <table border="1" cellpadding="10" bgcolor="rgb(0,255,0)"> <tr> <th>Column 1</th> <th>Column 2</th>
105
GMB Computers
CONSTANA
</tr> <tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr> </table>
Cadre (frames)
O modalitate de structurare avansata a unui document HTML este mpartirea ferestrei browserului n mai multe ferestre distincte, denumite cadre (frames). Aceasta facilitate permite afisarea simultana, n aceeasi fereastra a browserului, a doua sau mai multe documente HTML diferite, cte unul n fiecare cadru. Pentru a realiza acest lucru sunt necesare urmatoarele: un document de definire a cadrelor care contine etichetele care stabilesc numarul, dimensiunile si asezarea cadrelor n pagina cte un fisier HTML pentru fiecare cadru n parte, prin care se stabileste continutul cadrului respectiv. De exemplu, o pagina Web care contine doua cadre va fi definita prin trei documente HTML: documentul de definire a cadrelor, care specifica dimensiunile si asezarea cadrelor n pagina; cele doua documente care descriu continutul fiecarui cadru n parte.
n esenta, cadrele fac posibila afisarea n fereastra browserului a mai multe pagini, simultan. n cadrul documentului de definire a cadrelor, blocul <BODY> </BODY> este nlocuit de blocul <FRAMESET> </FRAMESET>. n acest tip de document blocul <BODY> numai este folosit. n interiorul ta<FRAME>. blocului <FRAMESET>, fiecare cadru este introdus prin etiche-
Pentru a crea tabele de forme oarecare se folosesc atributele colspan si rowspan care permit extinderea unei celule peste celulele din dreapta ei, respectiv peste celulele de sub ea. Unui tabel i se poate atasa un titlu prin eticheta <CAPTION> si se pot introduce celule cu rol de cap de tabel prin eticheta <TH>.
106
GMB Computers
CONSTANA
ntr-un tabel se pot defini grupuri de coloane cu ajutorul etichetei container <COLGROUP> </COLGROUP>. n cadrul acestui grup, aspectul fiecarei coloane n parte este stabilit prin eticheta <COL>. Modul de afisare al marginilor tabelului precum si al liniilor despartitoare dintre linii si celule se poate stabili cu ajutorul atributelor frame si rules. 1. a) b) c) 2. La ce serveste eticheta <TD>? Pentru a insera un tabel n pagina. Pentru a insera o linie ntr-un tabel. Pentru a insera o celula de date ntr-o linie a tabelului. Urmatoarea constructie genereaza un tabel cu o line si doua celule. <TABLE bgcolor="white"> <TR bgcolor="red"> <TD bgcolor="blue">celula 11 <TD>Celula 12 </TABLE> Ce culoare vor avea cele doua celule? a) b) c) Amndoua alb, deoarece asa este setata culoarea tabelului. Amndoua rosu, deoarece asa a fost setata culoarea liniei. Celula 11 albastru, deoarece culoarea ei a fost setata explicit si celula 12 rosu, deoarece face parte din linia a carei culoare a fost setata rosu. La ce servesc atributele width si height ale etichetei <TABLE>? Stabilesc dimensiunile tabelului n pagina. Aliniaza tabelul fata de restul elementelor din pagina. Stabilesc dimensiunile celulelor tabelului. Ce efect are urmatoarea constructie: <TABLE border cellspacing="5" cellpadding="10">?
3. a) b) c) 4.
107
GMB Computers
CONSTANA
a)
Textul din celule este distantat cu 5 pixeli fata de chenarul celulelor, iar celulele sunt distantate ntre ele cu 10 pixeli. Textul din celule este distantat cu 10 pixeli fata de chenarul celulelor, iar celulele sunt distantate ntre ele cu 5 pixeli. Chenarul tabelului are grosimea de 5 pixeli iar chenarul celulelor grosimea de 10 pixeli. Care dintre urmatoarele constructii aliniaza la dreapta continutul celor doua celule? <TR align="left"><TD align="right">celula 11<TD>celula 12 <TR><TD align="right">celula 11<TD>celula 12 <TR align="right"><TD>celula 11<TD>celula 12 La ce foloseste eticheta <TH>? Introduce o celula de date. Introduce o celula cu rol de cap de tabel. Introduce o linie cu rol de cap de tabel. Pentru a atasa un titlu tabelului folosim eticheta: <HEAD> <CAPTION> <TITLE> Ce efect are atributul colspan n constructia urmatoare: <TR><TD colspan="3">cel 11 cel 12 cel 13?
b)
c) 5. a) b) c) 6. a) b) c) 7. a) b) c) 8.
a) b) c) 9. a) b) c)
Unifica trei celule pe orizontala. Unifica trei celule pe verticala. Unifica cte trei celule, att pe orizontala ct si pe verticala. n care dintre constructiile urmatoare chenarul tabelului nu este afisat? <TABLE border> </TABLE> <TABLE border="0"> </TABLE> <TABLE border="-1"> </TABLE>
108
GMB Computers
CONSTANA
10. a) b) c)
Atributul align al etichetei <TABLE> realizeaza: Alinierea tabelului fata de restul elementelor din pagina. Alinierea textului n tabel. Alinierea textului n fiecare celula a tabelului.
<HEAD> <TITLE>cadre3</TITLE> </HEAD> <FRAMESET rows="*, *" cols="*, *"> <FRAME src="tabele1.html"> <FRAME src="tabele2.html"> <FRAME src="tabele4.html"> <FRAME src="tabele6.html"> </FRAMESET> </HTML> Cadrele, ca si alte elemente ale paginii Web (liste, tabele), se pot imbrica, adica pot fi incluse cadre n interiorul altor cadre. n Exemplul 10.4 este creata o pagina cu trei cadre mixte. Pentru a construi pagina se procedeaza din aproape n aproape. Mai nti, pagina este mpartita n doua cadre de tip coloana, dupa care al doilea cadru este mpartit n doua cadre de tip linie. Pagina va avea aspectul din Figura 10.4. Exemplul 10. 4 <HTML> <HEAD> <TITLE>cadre4</TITLE> </HEAD> <FRAMESET cols="30%, *"> Definirea documentului ce va fi afisat ntr-un cadru se face prin atributul src (source). Acesta este un atribut obligatoriu al etichetei <FRAME>, si primeste ca valoare adresa URL a documentului HTML care va fi ncarcat n acel cadru.
109
GMB Computers
CONSTANA
Definirea cadrelor se face prin mpartirea ferestrelor n linii si coloane: mpartirea unei ferestre ntr-un numar de cadre de tip coloana se face cu ajutorul atributului cols al etichetei <FRAMESET> ce descrie acea fereastra; mpartirea unei ferestre n cadre de tip linie se face cu ajutorul atributului rows al etichetei <FRAMESET> care descrie fereastra. Valorile atributelor cols si rows sunt liste de elemente separate prin virgula care descriu modul n care se face mpartirea ferestrei. Valorile acestor atribute pot fi exprimate n mai multe moduri: %) n pixeli - n care caz valoarea este un numar ntreg n procente din dimensiunea ferestrei (un numar cuprins ntre 1 si 99, urmat de simbolul
n dimensiuni relative, n*. Simbolul n* semnifica faptul ca linia sau coloana astfel definita ocupa a n-a parte din spatiul ramas dupa dispunerea n fereastra a liniilor, respectiv coloanelor precedente (vezi exemplele de mai jos). Exemplul 1: cols="200 , * , 50% , * Aceasta constructie descrie o mpartire n patru cadre de tip coloana, dintre care prima are 200 pixeli, a treia ocupa jumatate din spatiul total disponibil, iar a doua si a patra ocupa n mod egal restul de spatiu ramas disponibil. Exemplul 2: rows="200 , 50% , 1* , 2* " n acest exemplu, pagina este mpartita n patru cadre de tip linie, dintre care prima are 200 pixeli, a doua ocupa jumatate din spatiul total disponibil iar a treia si a patra ocupa restul de spatiu ramas disponibil, care se mparte n trei parti egale, al treilea cadru ocupnd o parte, iar al patrulea ocupnd doua parti. Observatii daca mai multe elemente din lista sunt configurate cu * , atunci spatiul disponibil ramas pentru ele se va mparti n mod egal. n cadrul unui bloc <FRAMESET> poate fi inclus un cadru prin eticheta <FRAME> sau un alt bloc <FRAMESET> obtinndu-se astfel cadre imbricate. n majoritatea exemplelor care vor urma am folosit ca URL-uri pentru documentele pe care le contin cadrele, pagini deja construite n capitolele anterioare. Daca ati salvat documentele HTML cu numele specificate n eticheta <TITLE> puteti verifica direct exemplele care vor
110
GMB Computers
CONSTANA
urma. Daca preferati sa ncarcati n cadrele descrise n exemplele urmatoare alte documente, va trebui sa faceti modificarile necesare specificnd numele acestor fisiere. Exemplul 10.1 mparte pagina n doua cadre verticale, fiecare ocupnd jumatate din pagina. Aspectul paginii este cel din Figura 10.1. Exemplul 10. 1 <HTML> <HEAD> <TITLE>cadre1</TITLE> </HEAD> <FRAMESET cols="*, *"> <FRAME src="liste1.html"> <FRAME src="liste4.html"> </FRAMESET> </HTML> n Exemplul 10.2 este creata o pagina Web cu trei cadre orizontale. Primul cadru are 100 de pixeli, al treilea ocupa 30% din fereastra browserului, iar al doilea ocupa restul spatiului. Pagina arata ca n Figura 10.2. Exemplul 10. 2 <HTML> <HEAD> <TITLE>cadre2</TITLE> </HEAD> <FRAMESET rows="100 , * , 30%"> <FRAME src="liste1.html"> <FRAME src="liste2.html"> <FRAME src="liste3.html"> </FRAMESET>
111
GMB Computers
CONSTANA
</HTML> Exemplul 10.3 creaza o matrice patrata de 4 cadre (2 x 2). Pentru a realiza acest lucru, se folosesc simultan cele doua atribute cols si rows. Pagina descrisa n acest document va avea aspectul din Figura 10.3. Exemplul 10. 3 <HTML> auto - bara de derulare este vizibila atunci cnd este necesar. Aceasta optiune lasa browserului posibilitatea de a adauga sau nu bara, n functie de dimensiunea textului din cadru. Exemplul 10.7 ilustreaza functionarea atributului scrolling n cele trei situatii. Exemplul 10. 7 <HTML> <HEAD> <TITLE>cadre7</TITLE> </HEAD> <FRAMESET rows="*, *, *"> <FRAME src="text1.html" scrolling="yes" noresize> <FRAME src="text7.html" scrolling="no" noresize> <FRAME src="text8.html" scrolling="auto" noresize> </FRAMESET> </HTML> Din Figura 10.7 se observa ca, deoarece la primul cadru textul nu depaseste dimensiunea ferestrei, bara de derulare nu este afisata desi atributul scrollingare valoarea "yes". n cel de-al doilea cadru bara de derulare nu este afisata, indiferent de dimensiunea textului din cadru. La cel de-al treilea cadru, prezenta sau absenta barei de derulare este conditionata de dimensiunea textului. Aici, deoarece textul depaseste dimensiunea ferestrei, bara este afisata. <FRAME src="tabele1.html">
112
GMB Computers
CONSTANA
<FRAMESET rows="*, *"> <FRAME src="tabele2.html"> <FRAME src="tabele4.html"> </FRAMESET> </FRAMESET> </HTML> ` Pentru a stabili culoarea chenarului unui cadru se utilizeaza atributul bordercolor. Acest atribut primeste ca valoare un nume de culoare sau o culoare definita n conformitate cu modelul RGB. Atributul bordercolor poate fi atasat att etichetei <FRAMESET> pentru a stabili culoarea tuturor chenarelor cadrelor incluse, ct si etichetei <FRAME>, pentru a stabili culoarea chenarului pentru un cadru individual. Exemplul 10.5 ilustreaza atributul bordercolor. Pagina descrisa n acest document are aspectul din Figura 10.5. Exemplul 10. 5 <HTML> <HEAD> <TITLE>cadre5</TITLE> </HEAD> <FRAMESET cols="20%, *" bordercolor="green" border="15"> <FRAME src="text3.html"> <FRAMESET rows="*, *"> <FRAME src="text4.html" bordercolor="blue"> <FRAME src="text5.html"> </FRAMESET> </FRAMESET> </HTML> Atributul border al etichetei <FRAMESET> permite configurarea latimii chenarelor tuturor cadrelor la un numar dorit de pixeli. Valoarea atributului border este un numar ntreg,
113
GMB Computers
CONSTANA
ce reprezinta numarul de pixeli, valoarea prestabilita fiind de 5 pixeli. n mod prestabilit, chenarul unui cadru este afisat si are aspect tridimensional. Pentru a obtine cadre fara chenar se utilizeaza setarea border="0". Afisarea chenarului unui cadru se mai poate dezactiva si daca se utilizeaza atributul frameborder cu valoarea "no". Acest atribut poate fi atasat att etichetei<FRAMESET> (dezactivarea fiind valabila pentru toate cadrele incluse) ct si etichetei <FRAME> (dezactivarea fiind valabila numai pentru un singur cadru). Valorile posibile ale atributului frameborder sunt: yes - echivalent cu 1 no - echivalent cu 0 Cadrele din Exemplul 10.6 nu au chenar. Dupa cum puteti observa din Figura 10.6 crearea unor cadre fara chenar poate duce la aparitia unor ambiguitati n pagina asa nct acest efect trebuie folosit cu atentie. Exemplul 10. 6 <HTML> <HEAD> <TITLE>cadre6</TITLE> </HEAD> <FRAMESET rows="*, *" border="0"> <FRAME src="tabele1.html"> <FRAME src="tabele2.html"> </FRAMESET> </HTML> Chiar daca dimensiunile unui cadru au fost stabilite n mod explicit prin valorile atributelor etichetei <FRAMESET>, utilizatorul are posibilitatea de a altera aceste dimensiuni cu ajutorul mouse-ului. n scopul prevenirii acestei situatii se poate utiliza atributul noresize, atasat etichetei <FRAME>, al carui efect este cel de blocare a posibilitatii de redimensionare a cadrului.
114
GMB Computers
CONSTANA
Atributul scrolling al etichetei <FRAME> este utilizat pentru a adauga unui cadru o bara de derulare sau de defilare (scrolling bar), care permite navigarea n interiorul documentului afisat n cadru. Valorile posibile ale atributului scrolling sunt: yes - bara de derulare este prezenta ntotdeauna; no - bara de derulare nu este disponibila;
Din Figura puteti observa ca aspectul unui cadru intern este ntructva similar cu cel al unei imagini in-line. Eticheta <IFRAME> se introduce n cadrul blocului <BODY> si n cazul folosirii ei nu mai este necesar un document de definire a cadrelor. Pentru situatia cnd browserul nu accepta cadre interne, am asigurat o versiune a paginii care nu contine astfel de cadre (cadre10.html) introdusa prin eticheta <A>. Continutul acestei pagini este foarte simplu, servind doar la ilustrarea modului n care poate fi construita o alternativa la pagina cu cadre interne (Exemplul 10.10) Exemplul 10. 10 <HTML> <HEAD> <TITLE>cadre10</TITLE> </HEAD> <BODY> <H1 align="center">Pagina fara cadre interne</H1><HR> </BODY> </HTML> Iata un alt exemplu (Exemplul 10.11) n care am creat o pagina care contine trei link -uri iar acestea deschid paginile referite de ele n cadrul intern din centrul paginii. Figura 10.10 reda aspectul acestei pagini. Exemplul 10. 11 <HTML> <HEAD> <TITLE>cadre11</TITLE>
115
GMB Computers
CONSTANA
Atributele marginheight si marginwidth ale etichetei <FRAME> permit stabilirea distantei n pixeli dintre continutul unui cadru si marginile verticale, respectiv orizontale ale cadrului. Valorile posibile ale acestor atribute sunt: un numar de pixeli procente din naltimea, respectiv din latimea cadrului
n Exemplul 10.8 fereastra browserului este mpartita n trei cadre de tip coloana de dimensiuni egale. n toate cele trei cadre este afisat acelasi document, ceea ce difera este pozitionarea documentului n fiecare cadru. Astfel, n cadrul din stnga, atributele marginheight si marginwidth. nu este specificata nici o valoare pentru
n cadrul din mijloc, se stabileste distanta de 50 de pixeli ntre marginea superioara si cea inferioara a cadrului si text. n cadrul din dreapta se stabileste o distanta de 30 de pixeli ntre marginea din stnga si cea din dreapta a cadrului si text. Pagina are aspectul din Figura 10.8. Exemplul 10. 8 <HTML> <HEAD> <TITLE>cadre8</TITLE> </HEAD> <FRAMESET cols="* , * , *"> <FRAME src="text1.html"> <FRAME src="text1.html" marginheight="60"> <FRAME src="text1.html" marginwidth="40"> </FRAMESET> </HTML> Atentie! Exista browsere care nu suporta cadre. Pentru acestea se utilizeaza n interiorul blocului <FRAMESET> eticheta <NOFRAMES> </NOFRAMES>. Daca browserul poate sa interpreteze cadre, va ignora ce se gaseste n aceasta portiune, iar daca nu, materialul cuprins n zona<NOFRAMES> </NOFRAMES> va fi singurul care va fi recunoscut si afisat.
116
GMB Computers
CONSTANA
Este de precizat si faptul ca ntre <NOFRAMES> </NOFRAMES> se pot introduce orice alte etichete HTML (inclusiv imagini, hyperlink-uri, tabele). Un cadru intern este specificat prin intermediul etichetei <IFRAME> </IFRAME>. Ea defineste o arie rectangulara n interiorul documentului, arie n care browserul va afisa un alt document HTML, complet, inclusiv marginile si barele de derulare. Un cadru intern se insereaza ntr-o pagina Web n mod asemanator cu o imagine, n interiorul blocului <BODY>, asa cum rezulta din urmatorul exemplu: <IFRAME src="tabele10.html" height=40% width=50%> </IFRAME> n acest caz, am specificat ca dorim un cadru intern care are 40% din naltimea si 50% din latimea paginii curente. Atributele acceptate de eticheta <IFRAME> sunt n parte preluate de la etichetele <FRAME> si <FRAMESET>, cum ar fi: src, border, frameborder, bordercolor, marginheight, marginwidth, scrolling, name. O parte din atributele <FRAME> sunt comune cu cele ale etichetei <IMG>: vspace, hspace, align, width, height. n Exemplul 10.9 am construit un cadru intern n care se deschide unul dintre documentele HTML create la capitolulTabele. Exemplul 10. 9 <HTML> <HEAD> <TITLE>cadre9</TITLE> </HEAD> <BODY> <H1 align="center">Cadre interne</H1><HR> <CENTER> <IFRAME width="60%" height="50%" name="icad" src="tabele4.html"> Daca vedeti acest text inseamna ca browserul dumnevoastra nu suporta cadre interne. <P><A href="cadre10.html">Pagina fara cadre interne</A>
117
GMB Computers
CONSTANA
</IFRAME> </CENTER> </BODY> </HTML> Exemplul 10. 14 <HTML> <HEAD> <TITLE>cadre14</TITLE> </HEAD> <BODY> <H3>Aici se vor deschide paginile referite de legaturile din cadrul stang</H3><HR> </BODY> </HTML> Salvati cele trei fisiere cu numele specificate si deschideti browserul fisierul cadre12.html pentru a observa cum functioneaza atributele prezentate. cu
Atributul target al etichetei <FRAME> accepta si anumite valori predefinite si anume: _self - ncarcarea noii pagini are loc n cadrul curent _blank - ncarcarea noii pagini are loc ntr-o fereastra noua, anonima
_parent - ncarcarea noii pagini are loc n cadrul parinte al cadrului curent daca acesta exista, altfel are loc n fereastra curenta a browserului _top - ncarcarea noii pagini are loc n fereastra browserului ce contine cadrul curent.
Urmatorul exemplu ilustreaza felul cum functioneaza aceste valori ale atributului target. </HEAD> <BODY> <A href="tabele4.html" target="icad">Fisierul1</A><BR>
118
GMB Computers
CONSTANA
<A href="tabele5.html" target="icad">Fisierul2</A><BR> <A href="tabele6.html" target="icad">Fisierul3</A><BR> <CENTER> <IFRAME width="60%" height="50%" name="icad" src="cadre11.html"> Daca vedeti acest text inseamna ca browserul dumnevoastra nu suporta cadre interne. <P><A href="cadre10.html">Pagina fara cadre interne</A> </IFRAME> </CENTER> </BODY> </HTML> n exemplu am folosit atributul name al etichetei <IFRAME> cu ajutorul caruia am atribuit un nume acestui cadru si anume "icad". Acest lucru a fost necesar pentru a specifica, prin intermediul atributului target al etichetei <A>, faptul ca link-urile se vor deschide n cadrul intern. Daca ntr-unul dintre documentele deschise n cadru exista link-uri, acestea vor deschide paginile referite de ele n cadrul curent. Acest comportament se poate schimba prin plasarea n eticheta <A> a atributului target, care precizeaza numele ferestrei (cadrului) n care se va ncarca pagina noua referita de legatura, conform sintaxei: <A href="URL" target="nume_frame"> </A> Numele unui cadru este stabilit prin atributul name al etichetei <FRAME> conform sintaxei: <FRAME name="nume_frame"> n Exemplul 10.12 este prezentata o pagina Web cu doua cadre. Documentul de definire a cadrelor este cadre12. htmlal carui aspect este redat n Figura 10.11. Exemplul 10. 12 <HTML> <HEAD> <TITLE>cadre12</TITLE>
119
GMB Computers
CONSTANA
</HEAD> <FRAMESET cols="20%, *"> <FRAME src="cadre13.html"> <FRAME src="cadre14.html" name="cadru_dreapta"> </FRAMESET> </HTML> Documentul de definire a cadrelor mparte pagina n doua cadre de tip coloana. n cel din stnga se va deschide documentul cadre13.html iar n cel din dreapta, documentul cadre14.html. Cel de-al doilea cadru a fost numit "cadru_dreapta". n Exemplul 10.13 este creat documentul cadre13.html. Acest document contine, dupa cum observati, patru link-uri.Prin intermediul atributului target am specificat cadrul n care se vor deschide acestea. Toate aceste legaturi deschid paginile referite de ele n cadrul drept. Exemplul 10. 13 <HTML> <HEAD> <TITLE>cadre13</TITLE> </HEAD> <BODY> <A href="tabele6.html" target="cadru_dreapta"> Legatura 1 </A><BR> <A href="tabele7.html" target="cadru_dreapta"> Legatura 2 </A><BR> <A href="tabele8.html" target="cadru_dreapta"> Legatura 3 </A><BR>
120
GMB Computers
CONSTANA
<A href="cadre14.html" target="cadru_dreapta"> Home </A><BR> </BODY> </HTML> n Exemplul 10.14 este creat documentul cadre14.html. asociate si etichetei <FRAMESET>, caz n care efectul lor se va aplica tuturor cadrelor din set. Prezenta barelor atributului scrolling. de derulare ntr-un cadru ntr-un se stabileste cu ajutorul
Pentru a pozitiona documentul atributele marginwidth si marginheight.
cadru
se
folosesc
ntr-o pagina Web se pot introduce si cadre interne, cu ajutorul etichetei <IFRAME> </IFRAME>. Pentru a specifica fereastra sau cadrul n care se va deschide un document se foloseste atributul target care poate avea ca valoare numele ferestrei (cadrului) sau poate avea o valoare predefinita. Este recomandat sa asigurati o versiune fara cadre a documentului HTML, pentru ca acesta sa poata fi vizualizat cu browserele care nu suporta cadre. Pentru aceasta, elementele care fac parte din versiunea fara cadre se includ ntre etichetele <NOFRAMES> </NOFRAMES>. 1. a) b) c) 2. a) b) c) n ce zona a unui document HTML se introduce blocul <FRAMESET>? n blocul <BODY> n blocul <HEAD> <FRAMESET> formeaza un bloc separat. Cum se introduce un cadru n pagina? Prin eticheta <FRAMESET> Prin eticheta <FRAME> Prin eticheta <SRC>
121
GMB Computers
CONSTANA
Documentul de definire a cadrelor este prezentat n Exemplul 10.15 aspectul sau fiind cel din Figura 10.12. Pagina construita n acest exemplu contine doua cadre orizontale. n cel de sus este ncarcat documentul cadre17.html iar n cel de jos, documentul cadre16.html. Exemplul 10. 15 <HTML> <HEAD> <TITLE>cadre15</TITLE> </HEAD> <FRAMESET rows="30%, *"> <FRAME src="cadre17.html"> <FRAME src="cadre16.html"> </FRAMESET> </HTML> Exemplul 10.16 construieste documentul cadre16.html care contine trei legaturi catre fisiere HTML create la capitolulFormatarea textului. Fiecare dintre aceste legaturi are specificat atributul target pentru a ilustra modul n care functioneaza acesta. Exemplul 10. 16 <HTML> <HEAD> <TITLE>cadre16</TITLE> </HEAD> <BODY> <A href="text4.html" target="_blank"> Aceasta legatura se deschide in alta fereastra </A><BR> <A href="text5.html" target="_self"> Aceasta legatura se deschide in fereastra curenta
122
GMB Computers
CONSTANA
</A><BR> <A href="text6.html" target="_parent"> Aceasta legatura se deschide in fereastra parinte </A><BR> </BODY> </HTML> Documentul cadre17.html prezentat n Exemplul 10.17 este o pagina Web foarte simpla care se va deschide n cadrul de sus. Exemplul 10. 17 <HTML> <HEAD> <TITLE>cadre17</TITLE> </HEAD> <BODY> <H1 align="center">Atributul target</H1> </BODY> </HTML> Pentru a observa modul de functionare al atributului target salvati cele trei fisiere sub numele specificate si deschideti cu browserul documentul cadre15.html. Desi cadrele reprezinta o maniera destul de spectaculoasa de a structura o pagina Web, ele prezinta o multime de dezavantaje. ncarcarea unei pagini care contine cadre se face mai greu, indexarea paginii de catre motoarele de cautare este mai dificila. De asemenea, deoarece documentul din fiecare cadru are propriul URL , este mai greu pentru vizitator sa retina adresa paginii n Favorites. si, nu n ultimul rnd, deoarece exista browsere care nu suporta cadrele, este indicat sa asigurati pentru fiecare pagina astfel structurata si o versiune fara cadre, ceea ce implica un efort suplimentar. Avnd n vedere toate aceste aspecte, este bine sa limitati folosirea cadrelor n paginile dumneavoastra doar la situatiile n care nu puteti proceda altfel.
123
GMB Computers
CONSTANA
Un formular este un ansamblu de zone active alcatuit din butoane, casete de selectie, campuri de editare etc. Formularele va asigura construirea unori pagini Web care permit utilizatorilor sa introduca efectiv informatii si sa le transmita serverului. Formularele pot varia de la o simpla caseta de text, pentru introducerea unui sir de caractere pe post de cheie de cautare - element caracteristic tuturor motoarelor de cautaredin Web - pana la o structura complexa, cu multiple sectiuni, care ofera facilitati puternice de transmisie a datelor. O sesiune cu o pagina web ce contine un formular cuprinde urmatoarele etape: 1. Utilizatorul completeaza formularul si il expedieaza unui server. 2. O aplicatie dedicata de pe server analizeaza formularul completat si (daca este necesar) stocheaza datele intr-o baza de date. 3. Daca este necesar serverul expedieaza un raspuns utilizatorului. Un formular este definit intr-un bloc delimitat de etichetele corespondente <form> si </form>. Exemplu de formular: <form method="POST" action="--WEBBOT-SELF--"> <p> <input type="submit" value="Submit" name="B1"> <input type="reset" value="Reset" name="B2"> <input type="text" name="T1" size="42"> </p> </form>
Exista doua atribute esentiale ale elementului <form>. 1. Atributul action precizeaza ce se va intampla cu datele formularului odata ce acestea ajung la destinatie. De regula, valoarea atributului action este adresa URL a unui script aflat pe un srver WWW care primeste datele formularului, efectueaza o prelucrare a lor si expedieaza catre utilizator un raspuns. <form action="http://www.domeniu.com/cgi-bin/nume_fis.cgi">. Script-urile pot fi scrise in limbajele Perl, C, PHP, Unix shell. Exemplu de script php. 2. Atributul method precizeaza metoda utilizata de browser pentru expedierea datelor formularului.Sunt posibile urmatoarele valori:
get (valoarea implicita). In acest caz, datele din formular sunt adaugate la adresa URL precizata de atributul action; - nu sunt permise cantitati mari de date (maxim 1 Kb) - intre adresa URL si date este inserat un "?". Datele sunt adaugate conform sintaxei: nume_camp = valoare_camp. Intre diferite seturi de date este introdus un "&".
124
GMB Computers
CONSTANA
Exemplu: www.domeniu.com/cgi-bin/nume_fis.cgi?nume1 = valoare1&nume2 = valoare2; post In acest caz datele sunt expediate separat. Sunt permise cantitati mari de date (ordinul MB)
Pentru ca un formular sa fie functional, trebuie precizat ce se va intampla cu el dupa completarea si expediere. Cel mai simplu mod de utilizare a unui formular este expedierea acestuia prin posta lectronica (e-mail). Pentru aceasta se foloseste un atribut al etichetei <form> si anume action care primeste ca valoare "mailto:" concatenat cu o adresa valida de e-mail catre care se va expedia formularul completat. 1.Executati clic cu butonul din dreapta pe articolele marcate selectate si alegesi List Properties din meniul contextual pentru a afisa caseta de dialog List Properties. 2.In eticheta Picture Bullets, selectati optiunea Specify Picture din sectiunea Picture, apoi executati clic pe butonul Browse. 3.In caseta de dialog Select Picture, executati clic pe butonul Clip Art pentru a deschide fereastra Clip Gallery. 4.Derulati categoriile afisate si executati clic pe categoria Web Bullets & Buttons. 5.Selectati o optiune (de ex. romb bicolor). 6.Executati clic pe Insert Clip, apoi executati clic pe OK in caseta de dialog List Properties. Pozitionarea ilustratiilor : Pentru a repozitiona o ilustratie, selectati-o, executand clic cu butonul din dreapta pe ea, apoi alegeti Picture Properties din meniul contextual. Dupa care executati clic pe eticheta Appearance pentru a modifica alinierea si spatierea pe orizontala si pe verticala pentru ilustratie. In sectiunea Size puteti sa executati clic pe caseta de validare Specify Size si sa scrieti o valoare exacta pentru latime ti inaltime. Puteti sa afisa bara cu instrumente Positioning si sa scrieti pozitia in pagina a ilustratiei in valori absolute. Pentru ca ilustratia sa apara in fata sau in spatele unui text suprapus pe ea, executati clic pe butonul Bring Forward, respectiv pe butonul Send Buckward. Adaugarea unor ilustratii artistice Una din cele mai interesante caracteristici ale multor pagini Web o constitue includerea de imagini intens colorate si chiar fotografii. Cu siguranta veti dori sa plasati in web-ul vreat de dvs. si imagini pentru a ilustra un punct de vedere, pentru a prezenta o idee sau doar pentru a imbunatati aspectul general. Sa adaugam acum cateva ilustratii in vweb-ul dvs.(PNR) : 1.Reveniti in pagina de deschidere, alegand Index.htm din meniul Window.
125
GMB Computers
CONSTANA
2.Plasati punctul de inserare la sfarsitul paragrafului de dupa titlul Our Mission si apasati tasta Enter de doua ori. 3.Executati clic pe butonul Center pentru a centra noul paragraf. 4.Alegeti Picture, apoi Clip Art din meniul Insert pentru a deschide fereastra Clip Gallery. 5.Executati clic pe categoria Nature, executati clic pe prima ilustratie cu un copac si executati clic pe butonul Insert Clip. Bara cu instrumente Picture : Puteti sa folositi butoanele de pe bara cu instrumente Picture ca sa creati orientarea unei ilustratii, contrastul si luminozitatea ei, precum si pozitia ei in pagina. Executati clic pe butonul Auto Thumbnail pentru a afisa ilustratia intr-un format mai mic si a atasa o hiperlegatura la ilustratia in marime naturala. De asemenea, puteti sa creati puncte de interes cu ilustratii pe care vizitatorii sa poata executa clic pentru a ajunge intr-un alt loc.(hartile sunt un bun exemplu de elemente grafice in care puteti plasa puncte de interes). Nu-I rau deloc. Dar ilustratia este ceva cam mare. Sa rezolvam acum si acesta problema : 1.Executati clic pe ilustrasie pentru a o selecta. FrontPage va afisa bara cu instrumente Picture in partea de jos a ferestrei. 2.Trageti marcajul in coltul din dreapta jos in sus si spre stanga pana cand ilustratia ajunge la o inaltime de 3,5 cm. 3.In fine, plasati punctul de insertie sub ilustratie si apasati tasta Delete pentru a elimina spatiul suplimentar dintre ilustratie si linia orizontala de sub ea. Formate grafice : Formatele grafice Graphic Interchamge Format (GIF) si Joint Photographic Expert Group (JPEG sau JPG) sunt folosite frecvent in paginile de Web deoarece pot fi afisate an majoritatea browser-elor de Web. Aceste formate prezinta si avantajul comprimarii, prin care se economiseste timp la incarcare si spatiu de stocare. Alte formate grafice pe care le puteti intalni au extensiile PICT, BMP, PCX, TIFF si EPS. Daca ilustratia pe care o inserati are in fundal alta culoare decat pagina, puteti sa faceti culoarea de fundal transparenta pentru ca ilustratia sa se integreze mai bine in pagina. Pentru acesta, selectati ilustratia si executati clic pe butonul Set Transparent Color de pe bara cu instrumente Picture. Cand FontPage va atrage atentia ca imaginea va fi convertita in format GIF, executati clic pe OK. Apoi, plasati indicatorul mouse-ului pe fundalul ilustratiei. Cand acesta ia forma unui creion cu radiera avand atasata o sageata, executati clic o data pentru a face fundalul transparent. Acum, fundalul paginii va deveni din nou vizibil sub ilustratie.
126
GMB Computers
CONSTANA
Ilustratia cu copac pe care ati inserat-o este inglobata in pagina de deschidere, dar nu a fost inca salvata ca parte a fisierului cu pagina de deschidere. Pentru a actualiza pagina web-ului salvand si ilustratia introdusa, efectuati pasii urmatori : 1.Executati clic pe butonul Save. FontPage va afisa caseta de dialog specifica. 2.Executati clic pe OK pentru a adauga fisierul grafic in fisierele care contin web-ul dvs. Imbunatatirea aspectului web-ului Inainte de a incheia acest capitol, vreau sa va mai arat cateva moduri de modificare a unor elemente, cum ar fi tema, fundalul si culorile web-ului pentru a le adapta necesitatilor dvs. Alte moduri de modificare a unei teme : - Cand modificati o tema, aveti grija sa verificati optiunile disponibile din caseta de dialog Themes. De exemplu, cand executati clic pe butonul Colors, puteti sa selectati alta xhema de culori in eticheta Color Schemes si sa modificati culorile inluse, folosind eticheta Color Wheel. Cu butoanele Graphics si Text puteti sa modificati articole de genul ilustratiilor folosite pentru anumite elemente sau stilul textului folosit pentru diferite titluri. Modificarea unei teme Cand ati aplicat tema Blank web-ului dvs. (PNR) FontPage a aplicat tuturor paginilor atributele de formatare si schema de culori a temei respective. O pagina fara tema : - In anumite cazuri, este posibil sa vreti ca una sau mai multe pagini ale web-ului creat sa nu foloseasca tema pe care ati aplicat-o. Pentru a elimina o tema dintr-o pagina, afisati pagina respectiva, executati clic cu butonul din dreapta pe o zona libera din ea si alegeti Theme din meniul contextual pentru a afisa o caseta de dialog. Avand selectata optiunea Selected Page(s), executati clic pe (No Theme) in lista de teme, apoi executati clic pe OK. Uneori insa veti dori sa aduceti modificari in atributele de formatare ale unei teme predefinite. Spre exemplificare, sa operam rapid cateva modificari in tema Blank : 1.Avand pagina de deschidere afisare pagina, alegeti Theme din meniul Format pentru a afisa o caseta de dialog specifica. 2.Selectati tema prestabilita (Blank) in lista de teme si executati clic pe butonul Modify din partea de jos a casetei de dialog. FontPage va afisa un rand de butoane sub caseta Sample. 3.Executati clic pe butonul Colors, apoi executati clic pe eticheta Custom pentru a afisa optiunile. 4.Executati clic pe sageata din dreptul casetei Item si selectati Heading 1. 5.Acum, executati clic pe sageata din dreptul casetei Color si selectati reed din al doilea rand.
127
GMB Computers
CONSTANA
6.Repetati pasii anteriori pentru a formata toate paragrafele din Heading 2 si Heading 3, aplicandu-le culoarea rosie. Apoi, executati clic pe OK. 7.Deoarece nu puteti salva modificarile de formatare intr-o tema predefinita, executati clic pe butonul Save As pentru a afisa caseta de dialog Save Theme. Scrieti denumirea webului (PNR) ca nume pentru noua tema si executati clic pe OK. 8.In fine, executati clic pe optiunea All Pages din sectiunea Apply Theme To si executati clic pe OK pentru a aplica noua tema tuturor paginilor din web. 9.Alegeti Exit din meniul File si executati clic pe Yes in cazul in care FontPage va intreaba daca vreti sa salvati vreunul din elementele web-ului. Modificarea fundalului fara a folosi o tema : Daca vreti sa modificati fundalul unei pagini fara sa folositi o tema, mai intai eliminati tema din pagina respectiva. Apoi, executati clic cu butonul din dreapta pe o zona libera din pagina si alegeti Page Properties din meniul contextual. In eticheta Background, executati clic pe caseta de validare background Picture, apoi pe butonul Browse pentru a gasi fisierul grafic pe care vreti sa il folositi ca fundal, sau executati clic pe sageata din dreptul casetei Background si selectati alta culoare pentru fundal. Daca nici una dintre culorile standard nu corespund nevoilor dvs., executati clic pe More Colors pentru a afisa alte optiuni. (In acesta eticheta, puteti sa modificati culorile folosite pentru text, hiperlegaturi, hiperlegaturi vizitate si hiperlegaturi active.). De asemenea puteti sa executati clic pe optiunea Get Background Information From Another Page din partea de jos a casetei de dialog, apoi pe butonul Browse pentru a gasi un fisier in care exista culoarea de fundal pe care vreti sa o aplicati paginii curente. Pentru aaplica modificarile, executati clic pe OK.
Testarea i nregistrarea siteului

Verificare
Servicii de validare HTML i testarea paginilor web presupun funcii suplimentare care: verific structura documentelor; verific erorile de sintax; analizeaz imaginile; verific legaturile interne i externe; valideaza i testeaza paginile web ,etc FTP se folosete cnd: se transfera ( upload ) pentru prima dat fiierele unui site la o gazd web; se nlocuiete un fiier sau o imagine; se ncarc ( download ) un fiier de pe un alt calculator; se permite accesul unei alte persoane pentru a ncarca/descrca un fiier din site-ul propriu. Publicarea site-ului pe un server web
Scopul final al construirii unui site este publicarea lui pe Internet. Pentru aceasta, n linii mari trebuiesc ntrunite cteva condiii.
Gazduire
n primul rnd, site-ul trebuie gzduit pe un server. Serverul trebuie s fie disponibil accesului prin Internet. IP-ului serverului este preferabil s-i fie asociat un nume de domeniu. Pentru ntrunirea acestor condiii, de obicei se apeleaz la un furnizor de servicii gen nume i/sau gzduire de pagini web. Aceste servicii pot fi achiziionate contra cost sau gratuit. Gratuitatea
128
GMB Computers
CONSTANA
poate s implice respectarea anumitor condiii impuse de furnizorul de servicii (subdomeniu, durat limitat, acceptarea plasrii unor reclame n paginile gzduite, etc.).
Copyright
Atenie: nu plasai pe site texte, imagini sau nregistrri de orice fel, dac acestea fac obiectul drepturilor de autor. Luai nti legtura cu autorul i obinei-i acordul scris. Pentru a beneficia de vizitatori, site-ul odat creat i gzduit, trebuie popularizat prin intermediul unuia sau mai multor motoare de cutare.
Cteva sfaturi:
1. Respectai regulile impuse de W3C de scriere a codului sursa si a tag-urilor. n caz contrar, siteul va fi greu de inteles de catre motoarele de cautare si nu se va afisa corect n browsere. 2. Coninutul trebuie redactat corect si trebuie s ofere informatii interesante pentru vizitatori. Astfel, paginile vor putea urca in rezultatele motoarelor de cautare. 3. Cuvintele cheie intr-o pagina web sunt importante in clasamentul rezultatelor motoarelor de cautare. 4. Meta tag-urile sunt importante pentru o pagina web. In general, continutul tag-urilor Title si Description se afiseaza in rezultatele motoarelor de cautare : este util deci sa propuneti un continut atractiv pentru vizitatori. 5. Inscrieti siteul in Google Webmaster Tools. Acesta are o interfata care va ofera un instrumentar pentru optimizarea site-ului precum si pentru monitorizarea performantelor site-ului in raport cu Google dar si cu alte motoare de cautare. 6. Creati un fisier sitemap.xml (va poate ajuta Google Webmaster Tools), care sa contina lista tuturor URL-urilor paginilor. Plasat la radacina site-ului, acest fisier va fi analizat de robotii motoarelor de cautare si acestia vor putea indexa mai bine paginile site-ului. 7. Link-urile catre site-ul dumneavoastra sunt pentru motoarele de cautare nite voturi de popularitate. Daca obtineti linkuri care provin de la site-uri cunoscute pe web si care abordeaza aceeasi tematica, atunci acest lucru va avantaja pozitionarea siteului in rezultatele motoarelor de cautare. 8. Monitorizati-va traficul pe site: din ce zone geografice este accesat, daca accesele sunt directe, prin linkuri sau prin motoare de cautare, ce browsere si sisteme de operare se folosesc, ce cuvinte cheie sunt cautate mai des. Pentru aceasta folositi instrumentarul pus la dispozitie de provider. 9. Link-exchange este o tehnica eficienta dar trebuie folosita cu atentie.
129
GMB Computers
CONSTANA
Evitai

Legaturile cu site-urile web care fac spam. Ei nu fac altceva decat sa abuzeze de optimizarea dumneavoastra. Folosirea de texte ce apartin altui domeniu. De regula veti fi acuzat de duplicare continut sau clonare de site-uri. Acest lucru este penalizat de catre motoarele de cautare. Folosirea exagerata de cuvinte cheie in elementele HTML. Evitati folosirea de cuvinte cheie care nu au legatura cu continutul in descrieri, titluri de pagini sau linkuri, alt-urile imaginilor, etc. Pot fi considerate ca spam si se penalizeaza. Este bine sa folositi cuvinte cheie relevante pentru pagina respectiva. Evitati duplicarea cuvintelor cheie in meta-taguri. Se considera spam si se penalizeaza. Nu abuzati de pagini flash. Paginile realizate in flash nu pot fi citite de robotii motoarelor de cautare. Se pot adauga unele elemente care sa poata fi citite dar ele nu pot ajuta acest site pentru rezultatele dupa cuvinte cheie. Evitati schimbarea frecventa a geolocatie IP-ului Astazi Romania, maine SUA si peste 2 luni Spania. Acest lucru aduce scade mult modul de evaluare al site-ului. Nu folositi diverse 'trucuri' pentru a include in continut o abundenta de cuvinte cheie pe care motoarele de cautare sa le poata citi dar vizitatorul, nu. Se penalizeaza.
Intreinerea i actualizarea siteului

Pentru ca siteul creat s aib succes i s atrag noi vizitatori, trebuie ntreinut i actualizat periodic. Intretinerea i actualizarea unui site web se realizeaz cu diferite scopuri:mbuntirea proiectarii i machetarii; actualizarea sau adugarea unor informaii suplimentare;realizarea unor versiuni multilingve;ca soluie a feedbackului, pentru a rspunde la comentariilor, cerinelor sau observaiilor vizitatorilor;pentru a corecta erorile i problemele funcionale aprute n timpul proiectrii. Intreinerea eficient a siteului, se poate realiza pe baza unui plan de ntreinere, etapizat n timp, care poate s conin: frecvena de actualizare; imbunatatirile sau modificarile aduse; informatii i resurse de actualitate; comentariile sau recomandarile vizitatorilor;poziia n clasamentul motoarele de cautare;mbuntirea configuraiei hardware i resursele software suplimentare.
Actualizarea
siteul dup ce a devenit operational este o sarcin obligatorie ce presupune: mbuntrea unor caracteristici tehnicofuncionale;adugarea de noi opiuni;actualizarea coninutului informaional;etc.
Feedbackul siteului
Metoda feedbackului este important pentru creterea numrului de vizitatori i posibilitatea de ai exprima opiniile, sugestiile i comentariile n legtur cu un site web dar n acelai timp reprezint o soluie de marketing on line pentru companii.
Email ul
este cea mai important i mai uoar cale de a recepiona mesaje de la
130
GMB Computers
CONSTANA
cititori i de aceea este obligatorie furnizarea adresei email pe fiecare pagin.
Cri de oaspei (guestbooks)

unde cititorul poate si scrie impresiile i comentariile dup vizitarea unui site.
Lista de discuii (discussion list)

crete gradul de interactivitate cu vizitatorii Oferindu-le posibilitatea s schimbe impresii i s-i exprime punctul de vedere.
Contoare de pagin (hit counters)

pentru a cunoate gradul de vizitare al siteul realizat i pentru a realiza statistici ale vizitatorilor, informaii utile n realizarea unei campanii de marketing online eficiente. Aceste contoare pot s afieze informaii referitoare la: numrul de accesri totale/ lunare/sptmnale/zilnice, tipul de browser folosite pentru vizitarea paginilor, ara/continentul de provenien pentru fiecare vizitator i sistemul de operare folosit.
131
GMB Computers

Suport de Curs Designer Pagini Web

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Suport de Curs Designer Pagini Web

Загружено:

Авторское право:

Доступные форматы

CONSTANA

SUPORT DE CURS DESIGNER PAGINI WEB

I. COMUNICAREA SI DEZVOLTAREA PROFESIONALA

2. Proiectarea structurii sit-ului

Comunicarea si dezvoltarea profesionala

Prelucrarea si difuzarea informatiei

Etapele procesului de comunicare

Comunicarea interactiv la locul de munc

Ce este munca in echipa?

Cateva tehnici de baza pentru lucrul in echipa

Invata din proiecte

Solicita feedback permanent !

Avantajele muncii in echipa

Norme generale cu privire la NPM, PSI si calitate in utilizarea echipamentelor si dispozitivelor

Aplicarea procedurilor de calitate

Aplicarea normelor de tehnic a securitii muncii i a prevederilor pentru stingerea incendiilor

Instructiuni pentru vizitatorii punctelor de lucru

Masuri de prevenire in caz de incendii

Masuri de supravietuire in caz de incendiu

Masuri de interventie in caz de incendiu

Masuri de securitate la utilizarea echipamentelor de calcul

Masuri de securitate privind semnalizarea locurilor de munca din GMB

Intrarea interzisa neautorizate

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale (iesire) de salvare

Cale de iesire de salvare

Introducerea informaiilor i datelor n formate electronice

Utilizarea noiunilor de baz ale tehnologiei informaiei

Utilizeaz o aplicaie de procesare texte

Folosete o baz de date

Pot s iau asta cu mine?

Ai ncredere, dar verific

Pasii necesari pentru prevenirea infectarii retelei cu virusi

Tehnica de calcul Cunotinele necesare:

Tipuri de calculatoare n funcie de capacitate, vitez, cost, utilizatori tipici:

Pri principale ale calculatorului personal:

- dispozitive de intrare - dispozitive de ieire - memorie - dispozitive periferice etc.

Dispozitive de introducere date:

Operaii de baz procesare text:

Operaii de baz la prezentri:

Operaii specifice la prezentri:

Operaii de utilizare a aplicaiei pot fi:

Programa de pregatire designer pagini WEB

Editoare de pagini web

Structura unei adrese Web

Dezvoltarea paginilor Web

Ce este o pagin HTML?

Cum arat codul HTML?

Ce ofera editoarele de sursa?

Ce este o unealta WYSIWYG ?

Ce este WWW (World Wide Web)?

World Wide Web

Salvarea, tiprirea i descrcarea paginilor Web

Ce este un browser web?

Ce este un server web?

Definirea i nelegerea termenului de URL.

Prezena cuvintelor-cheie n URL

Bonus pentru AdSense