Ned Snell Crearea paginilor WED Traducere de Marius Moldovan FARM sce (eu My AI] BCU. -iAs) TeoraTitlul original: Teach Yourself to Create Web Pages in 24 Hours Copyright © 2001, 2000 Teora Toate dreptuile asupra versiunil In mba roman& apartin EditutlTeora. Reproducerea integrala sau parjalé a textului sau ailustrafilr din aceasta carte este posibild numai cu acordul prealabil scrs al Edituril Teora. ‘Authorized translation from the English language edition published by SAMS Publishing. Copyright © 1999 All rights reserved. No part of this book may be reproduced or transmitted in any form cr by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from the Publisher. Romanian language edition published by Teora Publishing, Copyright © 1999 Teora Calea Mogilor nr. 211, sector 2, Bucurest Fax: 01/210.38.28 e-mail teora@teora.kappao ‘Teora - Cartea prin posté CP 79~ 30, cod 72450 Bucuresti, Romania Tel: 017282.14. 31 ‘e-mail: epp@teora.kappa.ro Coperta: Gheorghe Popescu Tehnoredactare: Marius Stuparu Director Editorial: Diana Rotary Pregedinte: Teodor RADUCANU NOT 4589 CAL CREAREA PAGINILOR WEB ISBN: 973-20-0512-2 Printed in Romani Cuprins Introducere 7 PARTEAL Oa 1 Oa 2 Oa 3 Or 4 PARTEAAI-A Oa 5 Oa 6 Oa 7 Oa 8 PARTEA A IIA Oa 9 Or 10 Oa ot Oa 12 PARTEAAIV-A On 13 Or 14 Oa 15 Oa 16 PARTEAAV-A Oa 17 Ora 18 Oa 19 Oa 20 PARTEA AVA, Ora 21 Ore 22 Or 23 Ora 28 Anexa A Anexa B Anexa C ‘Anexa 0 Glosar_ 305 Index 310 Primi pai, prima paging Web Conceptul de editare a paginilor Web 11 Prezentarea unui program de editare a paginilor Web 25 ‘Crearea unel pagini Web la minut" 35 Crearea rapida a unel pagini originale cu alutorul unui gablon 52 Tillur, text si tabole Stabiirea ttllui, a culorior sia altor proprietati ale paginil 61 Inserarea si editarea toxtulul 69 Formatarea textului 86 COrganizarea textulul folosind tabele si rigle orizontale 97 Roferirea resurselor Legaturle 112 Crearea legéturilor 124 Definirea tintelor in pagina 132 Ltiizarea legaturilor la construirea unui sit Web 139 Insufietirea paginilor cu elemente multimedia CObjinerea (sau crearea) imaginlor pentru pagina Web 147 Inserarea imaginilor gia imaginii de fundal 163 Stlizarea paginilor cu olomente audio si video 176 Animarea imaginilor 188 Finisarea paginilor Exitarea codului HTML 196 Impartirea unei pagini in cadre 208 Proiectarea formularelor interactive 221 Plasarea mai multor legturi sub aceeasl imagine 232 Plasarea online Publicarea paginii 239 Cum va facet simtté prezenta pe Web 248 ‘Testarea si intretinerea paginl online 256 Dezvoltarea aptitudinilor de autor 264 Instalarea programulul Netscape Communicator 271 Ghid HTML 277 Resurse online pentru autorii de Web 298 Ce contine CD-ROM-ul? 302Dedicatie Familied mele. Despre autor Ned Snell se ocupa de popularizarea stiinfei din anul 1986, and a inceput sA scrie ma- nuale pentra incepatori la una dintre cele mai mari companil de software. Dupa ce a scris manuale si alte materiale pentru pregatire s-a reprofilat sia Inceput s& scrie arti- cole in domeniul calculatoarelor, lucrand ca ziarst, apoi ca editor la dou8 mari reviste, Eige si Art & Design News. Scriitor independent din anul 1991, Snell a seris 12 citi in domeniul calculatoarelor si sute de articole,fiind si critic la revista Inside Technology Training, Cand nu scrie, Snell Iucreaza ca actor profesionist in piese de teatru, in reclame sau in filme. Locuieste in Florida impreuna cu sotia si cei doi copii ai Introducere Aproape toate cirtile care urmarese si invefe incepatorii cum se creeazd o pagina Web Incep la fel: va explici ce este o pagina Web gi de ce ati dori si aveti o pagina Web personal’, Binuiesc c& daci ai luat aceasta carte, afi fost deja online (cat de putin), ati vizut o pagini Web si siti de ce va dori o astfel de pagina, Prin urmare, nut dorifi sa irosifi pentru asa ceva nici macar una dintre cele 24 de ore alocate pentru aceasta carte Va vol ajuta si va creati proprife pagini Web et mai simplu gi mai repede posibil. De fapt, inainte se sfarseasca primele trei ore, veti sti si va descurcati in facilul, dar puternicul pregram pentru crearea paginilor Web (Netscape Composer), inclus pe CD-ul care insofeste aceastl carte, si vel fi creat prima dumneavoastra paging Web. Ce spuneti despre tn asemenea tur de for}a? Motivul aparitiei acestei carti Pentru a infelege aceasta carte fird si v3 treaci nidugeile, nu trebuie si fiti expert in Internet sau guru in calculatoare, act sti si lucrafi cu programe simple (cum ar fi un procesor de text) in Windows 95, 98 sau NT si si navigati de la o paging la alta in Internet, aveti toate cunostintele nece- sare pentru a parcurge aceasta carte La sférsitul ci, vei sti nu numal cum si creaji pagini Web grozave, utile dumnea- vvoastri sau mancii pe care o desfigurati,ci si cum sa le publicati pe Web pentru a le vvedea toati lumea, De ce sunt necesare programele de pe CD? Fibine, nu aveti neapirati nevoie de ele, Din punct de vedere tehnic, put pagini Web utlizand un simplu program de editare a textulut si aici vei invafa cate ceva despre cum s& realizati acest lucru. {nsa, pentru aproape toati lumea, crearea paginilor Web este mai ugoars si mai rapid cand se utilizeaza un program dedicat editarit pagintlor Web. Din acest motiy, pe CD exist 0 copie -ompleta a programului Netscape Communicator Netscape Communicator este un pachet de programe destinate Internet-ului si include (ve2i figura 1.1): un editor de pagini Web grozav (Netscape Composer), un browser ‘Web (renumital Netscape Navigator), un program pentru posta electronicd si tot ceea ce vi este necesar pentru a crea pagini Web sia va bucura de Internet. (Desi navigarea pe Internet folosind Communicator este grozavi, nu este nevoie si-utilizafi. Daca doriti, puteti si creati pagini Web in Composer si s& folositi in continuare propriul dumneavoastis browser Web sau program de post electronic.)Fora Lt. Pachetul de programe Netscape Communicator existent pe CD, fnclude un editor fe pagini Web, un browser Web si alte Instrumente pentru Internet Neos : asain a ee re eeeaee os ib in Componer penta vl sta incpei Dup parcurgerea ce ene ad nceh efenp oncets Conner era Eo Co pce rs meer or ae a ee espe be eae poise cae vi vor perie Fa rs paggam dear apap Woh. Be Stee cpt a reps talent care pelle olizaen programulai Composer In ultima or a acestui indrumar, vi vor fi prezentate o serie See means pages Web give ues dade ce 8 eh sermetiee Comber Te ingh Netz Community CD-l al caine orale de programe site, imaging ale emer af ge Poco aos een eo glee Ce ee Rox Modul de folosire a carti a a nearer ee ea corer Introducero Parteaa lila, .Referirea resurselor”, vi deaviluie minunata lume a legiturilo. ef afla nu rama cur sinserailegaturi in paginile dumneavonst i cum s crea legatari ire alte resurse decit paginile Web, cum ar fl mesajele grupulul de informafii sau adresele de post electronica, Partea a 1V-a, -insufleirea paginilorcu elemente multimedia", ilustreazs modu _de adSugar: fn paginile dumneavoasted a elementeloraudiovizale:imagini,fun- F osilun, sunt, seevente video si anima '$ "Pirtea a V-a, ,Finisarea paginilor”, vi duce dincolo de posibilitstile programulti poser, 2rineditarea cocul brutal paginilor Web in scopulcrericadrelor, gnilor cu Tegsturi multiple st prin alle aspecte avansate (inst nu prea tare) ale 2 pagin Web. Pirteaa Via, .Plasarea online”, vi prezinté pas cu pas publicarea paginilor in Fokerne: mod de testare side actualizare a paginilor Web, precum si modalitatic ppublctate peginilor dumneavoastr, Tot aici vi este prezentat $i modul de '—"tbundtiire a indemanSii dumneavoastré cu ajutorul unorfenicsinstrumente nc Dupa cum putsti vedea, elementele prezentate evolueaza gradat de la cele simple la cele mai difcils, de aceea cel mai bine este si cititi sectiunile in ordine. Din loc in loc + vor fi indicate -lementele peste care puteti sh care nu sunt neapirat nece- sare intro anumit’ activitate sau tebnict Dupa 24 de ore veti descoperi patru anexe utile: Anexa A, ,Instalarea programului Netscape Communicator", prezint& modul de instalare, cnfigurare 5 actualizare a programului Netscape Communicator dupa + copierea acestuia de pe CD-ul anexat earfi HTML’, reprezinta un ghid al comenzilor de creare a paginilor Web, ghid pe care il puteti folosi cind editati codul brut al paginilor Web (ceea ce afi invatat in partea a Va), ‘Anexa C, ,Resurse online pentru autorii de Web”, confine un catalog de pagini Wel ppe care le pate vizita pentru a invita mai multe despre editarea paginilor Web, pentru a curoaste noi programe de editare a paginilo: Web sau pentru a obtine imagini, animafii si alte elemente necesare ,condimentrii” creafiilor dumneavoastré Anexa D, ,Ce confine CD-ROM-ul?", descrie toate programele 5 fsierele incluse pe CD-RON-ul care insolegte carte In fine, mat exists un glosar, desi cartea foloseste foarte pufina terminologie de specia: litate, care este explicatd amdnuntt Ia locul aparitiei. rin urmare, sar putea sé nu aveti niciodata nevoie de glosar, Totusi, aveli unul pentru orice eventualitate Lucruri pe care le veti pricepe probabil si singur Pe mésura ce parcurgeti cartea, veti intalni diferite casete cu sugestii si alte ele- mente speciale. Cand le veti vedea, va veti da seama ce va ofera ficcare - ele, intradevar, nv necesité nici o explicatie. Pentru orice eventualitate, parcurgeti ran durile urmatoare:10 De facut", sugesti si torment Pentru a indica exact cum se face un anurit cru, din loc in loc sunt foosite | nstructiuni de tipul ,pas cu pas’, denumite .De ficut”. In general textul care pre MO} cede pasi explica modu in care se foce ace facru. Prin urmare, daca don, pote ‘sari peste instructiunile respective. Totusi, atunci cand aveti senzatia ca nu afi inte- ‘yes pe deplin cum se face un anumit uer,executai pagi espectiv si probabil ‘el injelegeideeainainte de or parcurge pe tof. Uncor invajam anurnte uci humai executing, ‘Va atrag atenaasupratermenior nol important marcinducu pctograma Termerr now Acasa muse np des gio fae penta vi tas me rmorafitermeni necesaeinvatan Internetulu De asemenea, vefi ma intl rei por de sugestit prinse incase g Casta Sugesti va rath cum s faa! eva mal repede i mai usr sau cum pte conomisi imp si elo. este case sunt in ntregime optonale Caseta Observe eidentiazd un aspect important sau o hihi eae are legitrd cu ZS}, _| subectu cucen. sunt, de asemene, opine, ns ntotseauna mers fe te ZZ | atl nu vag 8 nterup, ‘aseta Aerie a previneasupra acini sau sual care a putea conduce la ceva “sf | ned, cum arf stergerea uns fiir important, Deaarece foarte pusine actu 4e pa parcursul edt gepior Web sunt In eu fl perculoes ini numa teva atl de cset ne tunel edn eit, vain seis. eo Ateliere La sfirtlfecrei or, exist um atelier usr si hazliu, concept penta consolida cele _mal importante deprinder si concepteprezentate in ora respec, Fecare atelier confine 16: Citeva intrebitscutefmpreund cu rspunsurile lr, care explichelementele interesante carer a fost inchseinlecte,deoarece nu conteibuiecitect la invatarea etait aneipagini Web (cu toate ct sunt interesante} Minitest:Ire-patra intebér cu mai mole réspansust cave va aut sa reper puictele importante, find in acelay timp wn ban pile) pentra glume, ars de care Exrtea nu arf putut fi concept [Actvitate: Cova cetrebuie fut pentru a exersa cee ce ai invtat in ora respectiv Sau cas preg petra ora urmateae. inca o precizare De fapt, nu mai sunt alte precizisi Pornificeasul si atacali Ora 1. Dupa douizeci si patru de ore de muncS, socotite din acest moment, vet sti editarea paginilor Web pe dinafard va allumese ci vi petrecetio zi cu mine. Cand Francis Ford Coppola face un film, azvarle scenariul pe fereastri si improvizeaza. In schimb, cnd Steven Spielberg face un film, inainte de a incepe filmarile intocmeste tun plan strict, pe care il respect8intocmai, Ambii regizori au fScut atat filme bune, cit sitele, prin urmare putem presupune ca ambele tipuri de abordari pot da rezultate. Dar cind suntei incepitor in editarea paginilor Web, este mai indicat s& lucrafi ca Steven Spielberg, dectt ca Francis Ford Coppola. inaintea construirii primel pagini este necesar ‘st vi facefio idee despre cum se nasc paginile Web si sa plinuifi cum si arate pagina dumneavoastri, Puteti improviza? Desiguy, ins& improvizarea la acest nivel ar putea s& ‘duct lao pagind mai pugin eficienta, a crel creare s4 dureze mai mult, s& duc la 1edepasirea bagetului cu milioane sia termenului cu siptimani" si asa mai depart. in aceasts ore va face otrecee in revista elementelor care alcituiesc pagiile Web sic enumerare a aspectelor de care trebuie s Fnei seama cid concepet propre cumente Web. La sfirsitl orei vei putea rspunde la urmatoarele itrebSt 1 Din ce eemente sunt alestuite paginile Web si cum funcfioneazd acestea? 1 Ce este HTML 4 de cetrebuie lat in sear? # Cum devin elementele de multimedia ~ imagini une, secvente video si animati = pti componente ale pagini? 1 Ce sunt ste si care sunt argumentele pro dumneavoastra? contra utilizar lor in pagina = Cum trebuie abordati organizarea mai multor pagini intrun sit Web? Structura unei pagini Web ‘Mai exista si componente optionale, ns majoritatea paginilor Web contin multe dintre clementele descrise in aceasta sectiune, Este important de stiut care sunt aceste compo- nente, deoarece operatiunea principal in editarea paginilor Web este stabilirea continu tului fiecdrei componente standard, o problema importanta fiind generat de modurile dliferte in care trateaza fiecare browser diferitele componente, (Mai multe despre acest aspect, veliafla ceva mai tarziu,)42 Part I: Primi pasl, prima pagina Web Componente vizibile In mod obisnuit, componentele care sunt vizibile vizitatorilor datorta browserului, sunt urmitoarele (vezi figura 1-1): Fsuna 1.1. CAteva dintre componentele comune paginilor Web 1 Titlul (title), pe care browserele grafice (majoritatea browserelor de Windows, Macintosh si X Window) il afiseaza de obicei in bara de ttl a feestrei in care apare ah © Subtitturile (headings), pe care in mod normal browsercle le afigeazS cu caractere 1mati aldine sa flosind in alt moc de evidentiere. O pagina Web poate avea mai multe subtithuri care pot fi imbricate pan lao adncime de sase niveluri. Aceasta Jnseamnd c& pot exista subtilis, sub-subtitlur si asa mai departe ¥ Textul normal, care reprezint text de baza, cu scop general, din pagins. De obice, line si blocurile eu text normal sunt denumite de cAtre autorit Web paragrae. Dar in limbajul programului Netscape Editor, acest termen poate desemina orice bloc distnet de cuvinte aflat in pagina, indiferent daca este subtti, text normal sau alt element dterminat de proprittile asociate paragrafului respectiv. ¥ Somnittura (signature) fisata de obice in partea de jos a pagini In mod obignuit, semnitura indick autora paginii si include adesea adresa de poy electronica a sutorului (au a Webmaster-ului) pentru ca vizitatori s& poatatrimite comentari sau inrebai referitoare la pagina. Cateodata, adresa de post electronic este sub forma tunel legaturi mailto, astfel incat vzitatort pot si execute cle pe aceasta pentr ca pro- gramul lor de pos electronics 58 se deschidd cu un mesaj preadrsat autorulu “Til eal al pagini Web nu apare fa interior pag, lu det fees in care browser figezz8 pagina. Oricum, malortatea paginio au un Wu drt, sub forma unt text sau a unetimagin d pe eoren, cat indepinst oll pe care nH asociem til unel cd sau revste ~acala dea sta evident andr in tune pag, pnt a da un Ora 1: Conceptul de edtare a paginilor Web 13 ® Riglele orizontale, care imbraca pagina si o impart in sectiuni logice. ™ Imaginile intie, care sunt incluse in aspectul paginii pentru a o inviora sau pentru a transmite niste informati, 1 Modelul de fundat (background pattern), o imagine inline care, spre deosebire de naginile obisnuite, acoperd intregul fundal al pagini, astfel incdttextul si celelalte imagini apar deasupra ei 1 Animatiite, ect sau imagini care apar in pagina Web gi se migcd intr-un fel sau altul. Imaginile pot s4 apara cu intermitenfi sau s4 se succeada intrun ciclu, iar textul poate si dlipeascé sau s8 defileze pe ecran, 1 Hipertegiturile (sau simplu, legiturile)catre diferite elemente: alte pagini Web, fisiere multimedia (Imagini externe, animati, sunete, secvente video), fisiere document, adrese de posta electronicS si fisiere sau programe de pe alte tipuri de servere (cum ar fi Telnet, FTP si Gopher). Legiturile (links) mai pot duce etre anumite Jocuri din pagine curenta. = Imaginile-harta (Imagemaps), imaginl inline in care diferite zone ale imaginii au asociate legituridiferite. 1 Listele, care pot fi numerotate, marcate cu bulet-uri (ca aceasta) sau de alt gen. = Formularele (forms), zone in care vizitatori pot completa cimpurile libere pentru a ‘rAspunde unui chestionar online, pentru a comanda bunuri sau servicii gi atele Componente invizibile Fe lings comporentele care pot fi vizute nto pagina Web, aceasta sau, mai degraba, malfien de sire care alcdtuiesc pagina mai pot confine alte elemente. Aceteele- mente de obice nt sunt vinibileviitatorlor ut I 1 Ldentificare~ Figierele-pagind Web pot contnefelurit informati de identificare, printre care numle si/sau adresa de posta electronici a autorului gi codurt Special cae ajuti mecanismele cle cittare la determinarea subiectulul si confnutalu agin. * Comentari ~Comentaile apar sub forma unui text pe care autorl il doreste s fe ‘zt numa in czul ct dnecte a codului HTML al pagina gin cazul agit agin de citre un browser In general comentarilecuprind note refertoae la struc- Fina sau organizarenfigierului BTML Fes HTML Abrevicre pentru Hyperlet Markup Language. HMI. este un for mat de fiir in care sunt stocate paginile Web. Un figier HITMAL nu este altceva dec un fier text cu coduri speciale care indica browserului cum sh aligeze fsieul: cimensinile pentra lecare bloc de text, locurile de amplasare aimaginilor i altel © Codul JavaScript — in interiorul unui fisier HTML, liniile scrise in cod JavaScript pot conferi pagiit proprietai dinamice speciale. "= MiniaplcafiieJaoa (ava applets) ~ Aflate in sire separate, modulele de program scrise in limba} Java pot imbunstat interacunea dntre viztator, browser si server 1 Codul de procesare a formulareior $i aimaginilor-harta ~ Cod de program (sri in JavaScript sau ineun alt mba, denumit CGI uilizat la procesarea rior imagine $ 2 Yormulareor interactive14 ait I: Primi pasi, prima pagina Web De facut: Identificarea componentelor unei pagini Web 1, Deschideti browserul Web, conectai-va la Internet si mergeti la orice pagina ‘Web dori. (Putet utiliza copia programului Netscape Navigator din aceasta carte sau un alt browser pe care il avels) 2. Priviti la bara cle ttl a ferestei in care apare browserul (bara situati cel mai ‘us, in care de obicei vedeti denumirea programulul utilizat) Probabil cA veth * vedea denumivea browserului pe care il utiizafi urmat8 de ttlul paginii Web pe care o vizualiza 3. Explorati pagina respectiva (si allele) si vedeti daca puteli identifica in paginile ‘iaitate toate elementele care urmeazi: ~ sublitluri de paragraf (de obicei text aldin, mare, format din cuvinte putine); ~text normal; liste (atat numerotate, cit si marcate); ~ legaturi (atasate textului sublinit sau imaginilor); —imagini; ~ sentra (0 estar cne anes program de pot ecto nd executati clic pe ea ce indcatorul mouse-tl deasupa uel egturl (tr a executa ci a ea), put vedea ‘in bara de tae acresa ta car due legaturarespectv. Pe ing arse la care duce o anumt egturd, mal put ata cite cava despre imagine pe care le veel ngagiea Web. Duce nccatorul mouse-ulu deesuora une imagin, execu clc-treapta gf alepe opisea Properties dia mania care apare. Ort renutat, va fast 0 ‘casei d ilo cu intra reetoare a denuite, mérimea su fiiruu care este soca imagine indicat de cumneavoas nliaénd acise thn va pute imbunaaiapttudinle de edtare a paginr Web studing Z esignulpepnior Web pe cae le vita, g ‘Tn majoritatea browser, a baz fret pare o bard de stare. De fecare dati cand Cum functioneaza o pagina Web? Cand creatio pagina Web, indiferent cum o facefi— cu ajutorul unui generator de paging {asa cum 0 vefi face in Ora 3, ,Crearea uni pagini Web sla minut»"),utlizind un editor ca Netscape Composer ori Mirosoft FrontPage sau, pur si simplu, tastind-o intr-un fisier text ~ceea ce obtineti este un fsier HTML care poate fi publicat pe un server Web. Un fisier HTML (vezi figura 1.2) contine tot textul care apare in pagind, plus codurile, denumite etichete (tags), care indica fiecare portiune de text ca pe un element distinct al paginit, De exemplu,etichetele HTML identifica o inie de text drept ttlul paginii, blocusile de text drept paragrafe, anumite linii sau cavinte drept legituri ga.m.d. Alte elichete HTML indica denumirile fisieelor cu imaginile inline care trebuie incluse in ppagind la afigarea pagini de citre browser. Un alt tip de cod HTML, denumit atribut, controleaza efectul etichetelor asupra ele- :mentelor cirora le sunt asociate. De exemplu, 0 etchetd poate stabili ca pagina $8 aba ‘un fundal colorat. Un atribut cuprins in eticheta respectiva precizeaz’ culoarea care va fi folositi ra 1: Conceptul de aditare a paginilor Web 15 Pe Ling identificarea elementelor pagini,etichetele HTML gi atributele lor influenteaza intr-o plaja langa formatarea paginti~ insd despre aceasta, vel alla putin mai tarziu. ‘Scopul malar edtoareor de agin Web, inclsi Netscape Composer, este dea va fen slucrafi ect cu codul HTML. In schimb, cra int-un mediy WYSIWYG (wat you see is ‘wha you get = cae ce ved este coeace objet) pute aranja format test gl gat- ade pe ecran ag cum a trebui si apard cn pagina este vazti cu browser. Tntimp ce fae acest luc, in cule, Composer cregard pentru dumneavoasta un docu: mont HTML ‘Gu toate aceste,existé motive pentru avi famiarza cu HTML. In Patea a Va, nisarea painor, ve dascoper tacit pe care fe pute tz tn page dumneavoasir Web, ‘ns peru cae edtoral furizat cu aceasta cate (asemenea ator edtoare) nv are instru- mente, Pentru a liz cele caractrstic va tobuls intra in cule gis ue cu HTML ~ cea e nu est ic, dup cum vf observa, pel Pa mrpconmmenc tyes comermmetent onees-n- 00-19 Figerul HIME SS eee ae Se a eee bootie (gon ne Same ours paginit BoP enim Lomein verte” ALE eC Mustrate — infigura 1 = | parte costa, vou te fr Lint wo fun sas tammy supe stan Un browser Veb este un program care le fa el palin dou era =i accesere documente HTML aflate pe servrele Web alate la dstana (aiizind un tee decane damit THE dene caren tenesl a snin Reet momen wo nterpetere eticheele HTML din document pene aaa pagina fn mod orespuneito pentru a rata legiurk cored aga mal depart Este importart de relinut eh tchetele HTML nu oft un control riguros al format psi aga cum af avea intra program de prelucae a textelor. Cu exceptia cazurlor end sunt utlizateexensile, HTML ni fae allcevadect st ldentifice ear element in parte, care browser sable in mod dferit cum sk afigeze pe ecran elementle respective. Estense, Extensile sunt adaosuri speciale la libajul HTML standard, Irtroduse de cbse declre creator de browee entra permite16 Partea I: Primi pas, prima pagin Web Drowserului respectiv si facd Iucruri neincluse in HTML, (Vezi sectiunea ,Extensiile: aceasté ori.) posi contra’, care urmear {In momentulelaboritiacstt citi, doud dintre cele mai populare browsere(aiferite wersiant ale programelor Neacape Navigators Internet Explorer) dejin majortatea covarsitoare a peteh, Desi exist diferent subtle inte etichetele HTML pe cael sustnefiecare, compa continatdinte ele a dus ia ealizareaa dou browser cae afgeaa identic majoritatea paginilor Web. Aceacainseamné ci, pentru mjritateavisiatoilor de pe We, Paginle dumneavoasta vor aria aptoximatv fa fel cum le ede} in Communicator Celor care utilizeaz8 alte browsere, pagina dumneavoastr le va apa ct acelasi text ceeas organizare general nsd conjnutul grafic sate elemente de estetcd ar Puttea s difere mult de la un browser Ia atl, De fapt, in nee cazar, sa putea ca Imaginile gi ceelalte ornamente grafic s8 nw apars deloe Pentru a vedea cum apare munca durmneavosstr In ciferte browse, put destéca browsereefustrate in figurie 1.35 1.4 s8vzualali papa cu el. Adresele de pe Wed ecesae obi acestrbrawsare par in Ora 23, .Testareagntefnereapagii online’ Fentru a exemplifica aceasta variaffe cae apare de la un browser la alta figuile 13 1.4 prints aceeasi pagina care est ustrat in figura 11. Figura LI prezinta pagina aligta cu Netscape Navigator in timp ce figurile 1.3 3 14 o prezntsafiatS prin inter- ‘edit altor doud browsere: Cello si DOSLynx. Comparai cle dows fguri cu figura 1.1 pentra a observa diferencle de prezentare care apat Brovsserl ilustrat in figura 14, DOSLynx, este un browser pentru DOS (v8 mai amintti de DOS, nu) care nu afigeaz’ deci textal (browser text-only), Deg ntrun proces rapid de disparifie de pe Web (dar aflate inch acolo), acestebrowsere nu pot [ig imaginil inline gaia intregul text cu acelas tip decarater rin urmare, cu ist mat putin posibleste ca elementele important, cum sunt subtiurle, si fe ev- dlengiate u tere aldne sau prin subliniere: Unit mai flosesc aces tip de browser, desi majritateno fac deoarece nat tip de cont Interne corespureator sau Mu a hardware-ul necesar unui browser grafic Fis 13, Pagina prezenta’d in figura 11, afigatt ‘acum cx Cello Pou 14, Pagina prezentait in figuile 11 $413, fists acu cu DOStynx Datorits persistentei browserelor care nu Iucreaza in mod grafic (si datoritd unor navigatori care inhiba afisarea imaginilor inline pentru a mari viteza de afisare a ppaginilor), este important ca toate informatiile esentiale pe care le prezentati grafic para siin text. Mai ales legiturile aflate sub o harti-imagine trebuie si apara ca text 51 fn ale parte a pagini. Mai multe despre aceasta veti inva in Ora 9, ,Legaturile”18 Partea k: Primi pasi, prima pagina Web De facut: Studiati codul sursd HTML al unei pagini Web 1. Deschideti browserul Web, conectat-v la Internet si mergetla orice pagina Web dont 2 Modifica modul de vizualizare al browserulu astelindts8 arate codul sursi HTML al paging: in Netscape Navigator (inclus pe CD-ROM), alegeti View, Page Source. in Internet Explorer 4,alegei View, Source. Jntr-un alt brovrser, uti o opfune de meniu care si cuprindi “Source” sau “HTML 3, Studiaficodul HTML, Nu va ingrijorati act mare parte din el pare o limba stdin; nu este nevoie 38 i in stare sf decodificai” pe loc un fisier HTML. act priviti mai atent, in difertele coduri vel observa ~textul care apae pe paginss ~ denumirile fsierelor care contin imaginile din paging; ~adrescle de pe Web indicate de legitur 4. Cind at ncheiatexaminarea coduluisurs& HTML, inchidetifereasrain care este afigat codul pentra a reveni la modul de aigare normal al browserului Pentru a v nia corect in editreapapntor Web, vi sunt necesarenofune de baz privng HTML, care va sunt prezenate a acest ord. Orcum, dup ora aceasta, pute uta cestl de mute despre HTML, col pun pind la area a Va Penta Incepitor, HTML est nk-unanumit fe ca o fos septicd Este necesar sce ‘est unde se fl, darn rst nu are de ce sv preocupe dc nu aare reo problema. { a Imaginile, sunetul si alte elemente multimedia Deoarece fgierul HTML confine numa text, componentelegrafce pe cre le vedeti in paginile Web selementele multimedia I care aveti acces din ele fac parte din Feral HTML propriv-ris. De altel, acstea pot fi legate de pagin in unal dintre surmatosrele dou’ modu 1 taginile intine sunt fsere gratice ale cor densi yi pusiie sunt srse in fiieral HTML si sunt identificate caimagin’ datoritéetichetelr Imagini inne Sunt imaginileincuse in prezentarea paginit~ toate imagine pe care le vee cind accesti pagina prin intermedi! browserul Elementele multimedia externe sunt ere care contin imagin, suncte sau secvente Viseo,isiere ale conor denumite si porte apar in sirsl HTML sub forma unor legit. Aceste fisiere me apar sin sunt redae in mod automat cao component @ pesinis In schimb, pagina prezitslegiturile care ind sunt activate, descarca Fisieral penta al red sas afisa, Interne sau extern, fisierele multimedia pe care le utiliza in paginile dumneavoastra Web impun browserulut nste cerint, Asfl, penta aafisa mainline acest tre- buie ste capabil si afigeze elemente grace. Fisierele mullimeatiaextere pot fi redate thigede ite browser sau, lucru mat des intlet, de cite o apictie ajthtoare sau program anexa) deschiss de ctre browser (Ora 1: Concoptul do editare a paginiior Web 19 Cand hotarati si includeti elemente multimedia in pagina dumneavoastra, trebuie si alegesi cu grij tipurile de fisiere pe care le utilizati. aptul ca fisierele HTML contin ‘numai text permite utilizatorilor cu diferite tipuri de calculatoare si acceseze paginile ‘Web. Este mai putin probabil ca fisierele grafice sa poata fi citite de o gamé larga de caledlatoare si, cu atat mai pufin isierele care contin sunet sau secvente video. CChiar $i in limita calculatoarelor compatible IBM sau Macintosh, trebuie sa va intrebati dacé fisierele multimedia folosite sunt recunoscute de un spectru larg de browsere si/sau aplicatiajutitoare, Veli iavita mai multe despre aceasté problema in Ora 13, "Obyinerea (sau crearea) imaginilor pentru pagina Web. Extensiile: pro si contra Limbajal HTML este standardiat, desi, terete orice browser Web poate citi orice document Web. Conform une conventi, toate browserele moderne recunosc HTML 2, nltimal set de etichete decarat egal” de ctr comittele care se ocups de standardle Internet. Standardizarea este bund finds fornizea autorlor Web siguranta c3 majoritatea browserelor var putea at ceea ce publica ei Deoarece orice Browser poate inflege i interprets toate eichetele HTML 2, pentru af sigur ct paginile Tor sunt accesible Linu nmr ef mai mare de vztator, atria deeat si se imiteze la etichetele respective Problema standardelor este of le evolueeza ince. Re Web, numat descarcarea are voie Bi fie lent evan tree fe rp, De ce? Peni cX primal browser grafic 8 pirat acarn patru ani, iar noi dalogim acum beneficiind de facia video fn timp real, Naserea si maturizaren Webcal ca medi grafic, nteratv, au avut loc dea lun: gl une singure administra prezidenfialea SUA. Asta da, rapiditate! HITML 2 confine coduri pentru toate elementele de Baza subtext normal ini ociontae, ist, legit magn inlne si alee, Ins& acum existt HTML 3, care confine toate etichetele din HTML 2s, supimenta, etichete pentru element ca a tet centrat si ext aliniat a dreapta: * tbele: 1 fanctt matematie: 1 modalitii e poritonare a text Hing’ imagine fine (in local amplasaei fcesluia deasupra sau dedesubtal magni) ‘Cd ereati pag peru orefea dip intranet, in care to uizatrlfolosese acest browser, uy ose nacesar svi pune! problema extensitor — puta foosi toate elicheele reeunascut de browse Cele mai bune browsere, printre care Navigator si Internet Explores, recunosc toate elichetele HTML 3 si chiar o parte dintre cele existente in HTML 4, apSrut de curdnd. Cu toate acestea, dezvoltarea paginilor Web a luat un astfel de avant incat atat Netscape, cit i Microsoft continua s4 includ’ in browserele lor etichete noi si facilitatt suplimentare caze nu fac parte din standardul aproba.20 Partea | Primi pasi, prima pagina Web Cnd sunt folste inten document Web efectleacestorag-numit xen ale Himba- jului HTML pot & vizute mumat prin intermediul unui browser care le recunoast- Desigur Navigator recunoapte font extenile Netscape, ar Inert Explorer pe ele Microsoft, Un cr ete lay anne cin toate browserelerecunose toate tensile Din acest moti rebut si it atent candle uizai, fn generat, ind un browse incompatiblaceseazio paging in care sunt asfel de etichet, nue lntdmpla mic grav. Formatareabazata pe extensile necanoscue mu Spare, ned grosul” paghl ext i gafca) simane bebi ‘Autor care vor i proftedeaceseextensil sunt preocupai de fap ch uni vtator na ‘id pagina in toa spendoarea el Din acest mot, vei veda fot mai des pe Internet mesale a “Best when viewed through Netscape Navigator” (lea de viut cu Netscape Navigator) ‘sau Enhanced fo itrnet Explore" (Dezvoat pentru internet Explore) Prin ee autrul va informa ca tat extens 5 8, da dois v8 bucurat de toate Caractere agin, est ina! s lati un browser compat Modalitati de alcatuire a unui document {in fine, Inainte de a trece la crearea unui document Web, trebuie s& aveli in vedere urmitoarele aspecte: ™ Cum poate fi fragmentat mesajul pentru a-l organiza pe mai multe puncte? ' Cat de mare trebuie si fie pagina sau cite pagini sunt necesare pentru a spune tot cee de spus? Dupe a deo iat rdnea puters! mesjl ete conta, ar putas escape ch al df suri nce dame =| Schitafi o lista a punctelor si subpunctelor tratate in documentul dumneavoastea. Céte sunt si de cat material aveti nevoie pentru fiecare? Dupa acest exercitiu simplu, veti trece la stabiliea dimensiunii si scopului dacumentulsi, vunctele, Se succed ints-o ordine logic, fiecare parte nowa depinzand de urnizate In parile ancerioare? Imparyirea pe subpuncte a materialulut fireascd? Cum ati putea rearanja punctele pentru a le face s8 se deruleze {ntr-o ordine logied sau sa fie grupate in functie de subiect? Pe masurd ce Iucrati la structurd, vefi obtine o conturare a documentului, Cu c8t contu- ‘ali mai bine documental inainte de 2-1 compune, cu atat mai eficientd va fi elaborarea Jui, Mai mult, documentul rezultat va prezenta mesajul dumneavoastré intr-o manera claré si sor de uemirit ‘ecie’ paint pe ofa de rt peniu a stabi informapile cin teare pagina. Prince g Scenail de coacepere a unui document cu mai mut de te pain const Tn sciarea agile pe pretest unfele cu tin sau cu banda pentru a arta legturle inte ele. In timp ce v8 structurai document, ave in vedere organizarea logic a prezentri st smodal in care mateaful sar pate incadra in una dintre urmatoarelestructuri des intaite pe Weer Ora 1: Conceptul de editare a paginlor Web 2 Avizier~O singut8 pagina, simpla, care descrie de bbicei o persoans, o mic afacen sau un produ simplu. Majoritatea paginilor personale sunt de acest tip. Ele congin deseo leituri la resurseInrudite (sa favorite) de pe Web. (Netscape Page Wizard creeaza acest tip de pagins.) Liniard moropagind ~O pagina Web, scurta sau lung, proiectaté spre a fi citita sa mult su mai putin, de sus in jos. Adesea se foloseste regula de a diviza oastfel de paging in .pagini” virtuale. Cititoni pot parcurgeintreaga pagina derulando, insd putefifolost un cuprins si marcaje pentru ai ajuta 84 sard rapid la orice sectic tune. Aceas structurd este folositi pentru documente relat scurte (mai mil de 10 crane), in care toate informatie se deruleaza Frese de la inceput pnd lassi Liniard matipagind Se pasireaz4 ideea de la structura lniar4 monopaging, ns ddocumentu’ est impirfit in mai multe pagini care se stcced logic, ca paginile uneh ppovestir,Putet indruma ciitorul amplasind in partea de jos a fiecSrei pagini 0 legiturd spre pagina urmitoare. erarhica~ Structura Web clasic, Prima pagina (denumité uneor home page — agin Ae ba cone leit ete alte paginy care pezitd fear clte9 pane prince Pala subictuls. Ficaredintre acele pagini poate avea, la rindi i legaturtedtre alte pagini, divizand mal mult subiectul i farnizand informatiispecifice, Rezultats] este ostrucurs de arbore, aseménétoare celei prezentae in figura 1.5. Bk Froura 18, O structurd irarhict - 4 Tip Web strectura tip Web (prezentata in figura 1.6) este o structuriorarhick rk lerathi. Este un document cu mai multe paginy, fiecate putind avea olepaturaeitre oricave até pagind Sar putea sexist o pagina de baza inch dela ea ctor pot hoinds prin dociment fird a urma un drtim preci, Structure de tip Web mu Sunt fixe ele sunt bere si. prn urmare cele mai potivite pentru dstracte, subiete ecreaive sau alte subiececare idea rice tructurdierrhici sau seeveral. Suagestie: inate de a recurge lao structurd tip Web asiguratiovic& mesaul dumneavoastrd are int-ades var nevoie deo astfel de structurd, ar putea sé aveli probleme privind concentvarea)o ence Ora 1: Conceptl de exitare a paginlior Web 23 Atelier Fauna 16, O structurd i tip Web va eR 1 Desi in esenti, imi spuneti ck pot include in pagina mea toate aceste err \, interesante, ns trebles folosese mai elementele simples de vreme cece < mentele de efect se bazeazi pe extensii ar nil oameni nut pot vedea componen- tele grafce: Nu este pufin cain dezanjant? a ene Pa NA Exista gi alte modalitati de structurare a informatilor; variante ale fiecirei steucturi prezentate aici, Insi una dintre aceste structuri ar trebui si semene cu forma generalé a ‘mesajului dumneavoastra, deci sicu documentul dumneavoastrd. Cu alte cuvinie, dack ru va puteti decide asupra uneia dintre structur, este necesar i incercati sil structu- raft in mai multe feluri pind cdnd descoperif este potrvita una dintre acestestructuri Rezumat Daca dori ati putea sa va creati pagina Web servind 0 cafea bund geznd comod si jucanc-va nifel cu Page Wizard (Ora 3) sau cu orice editor de pagini Web, La sfarsit ‘ett avea un fiset HTML bun de publiat(dack nu de cit). Va finsa un fster care sf tndeplincasia seopul dunuieavoastd dea avea o pagina Web de primnd mand? In cazul in care suntet in cutare de aberprieteni, i vaatage pagina umneavoastra? Dact suntet in catitare de client, vi va crea pagina dumneavoastr8 0 Imagine mai buna decit a concurent? Dac& oferifinformati ute, o facet astelincat Wizilatoris& considere cl sunt intuitive si ck este ugor de navigatprinze ele? {In mod evident, crearea paginlor Web nu fine numa de tec; mai impliciestetics, exgonomie, site sociale si multe allele. Pentru a crea 0 pagink care si ating Scopul, intatrebuie 58 clpatat nite cunostinge solide privind modu de functionare a {uni document Web, ce poate si ce na poate face, Asta am dort s invita in aceasta fra nu am intenfiona st va impun structura aspectl sau modul de comportare a documentului: acesta fin de inspiratia dumaneavoastra, Ins8 am incereat si va furnizez “cunostinfele necesare, asifel incat pe vitor 34 aleget in cunostinta de cauza R Deranjant mu. in pratis, nu este 0 problema chiar asa de mare. mu este 0 problema chiar aga de mare. inainte de tate, rebut admitem majontatea covisitoae a celor care navighened pe Web pot ‘eden leet rf sl ml dnt lizeazs un browser ae se ter reteze cea mai mare parte a extension Deci si daca exagerati eu ienaginle fore mates buat pe extn, pagina dumnenvoastt va aria bine pete majeaten ‘Totus este important si retineti acest aspect, deoarece daca scrietio pagina i neti acest aspect, deoarece dac® scriefio pagina in editorul de la Netscape nu inseamna c& o seriefi numai pentrutilizatorii de Netscape. Un autor iste face astfelincat propriile documente si fi att cu caracter informativ i ardtoase, cit siaccesibile taturon 7 Minitest Rezolvat testu. urmitor pentru a vedea cit afi reusit sf invita Intrebari 4, Adevaratul ttla al onei pagini Web apare intotdeauna: 4. Cu caractere aldine, in interioral pagin ». fn bara detitlu a ferestrei browserului. €-Atita, cit sib, 4, Nici unul dintre rSspunsurileanterioare. 2. Imai aes vi nr pagin Wn eaten fe pt din fier ere ‘eontine pagina, cl sunt stocate separa in sires inserate la abgare de ctte ‘devia su fs? amen eee omen eee! 3. Paginile Web sunt stocate intr-un format de fier denumit a. Hyper Speed Mockup Literature (HSML); b, Hypertext Markup Language (HTML «Stephen (9; 4. Hyper Auto Retro Vaiant (HARV). Rispuncur 1. (8). Autor Web repetéadesea ttl paginil sub forma unui subtitu (variant a), dar pt Inldeaun, Singural on cre apa fotdenuna il rea ste cel preci la24 2, Adevirat, Fiecare imagine se afla in propriul ¢ifisir, denumirea si pozitia acestuia fiind precizate in fisierul HTML pentru ca browsertl si stie care imagine 58 0 afigeze si unde. 3.00) Activitate La urmitoarea iesire pe Web, urmarifi in fereastra browserului zona in care apar adres gi denumirea paginii afigate (de obiced in bara de adresa situata imediat sub bara cu instrumente si deasupra paginii). Remarcati faptul ci majoritatea paginilor pe care le vizualizati sunt fisiere a chror denumire se termina cu extensia Jitm sau htm Acelea sunt fisiere HTML, asemanatoare cu cele pe care urmeaza s& le creali dumneavoasts Ora 2 Prezentarea unui program de editare a paginilor Web (Cand luca intsn editor pentru pagini Web de tip WYSIWYG (cum este Netscape Composer, furnizat impreund cu aceats carte), pagina dumneavoastra arat (cu pufine excep) exact asa cum leva apirea pe Web majoritajil viitalorlor. ‘Acest lucru este deosebit de avantajos fr el autor Web artrebu si-sinchipuie in timp cejonglesz8 cu codurile HTML, cum ar arita pagina In scopul de a-si verifca munca, a tebui 85 desehids fsierul team browser, dupa care sf revind la codul HITML pentru a face modificirile de rigoare. Cu un editor WYSIWYG, puteli si vedesi sis face toate acestea into singurd feasts, color gi pe iu {naceastt ora vé vor fi prezentate operafiunileobisnute din Netscape Composer pentru sti si le folosif{cdnd vet avea nevoie de ele in oreleurmstoare. La sfarsitul bre vei putea rispunde la urmatoaree intebark # Ince modus: se poste deschide Composer pentru difrite operafiuni? 1 Cum se cresei pagini noi? Cum se slvesz gi se redeschid paginile Web in Composer? 1 Cum se testaz4 modi in care wa arta pagina online? Se poate tipatirezultatul munci? ‘Se prsupune cai nstalat dja Netscape Communicator, conform desrii din Ane A, -lisalare programulu Netscape Communicator’. Deschiderea programului Netscape Composer Netscape Composer poate fi deschis in mai multe feluri, in functie de locul in care va aflafi cand incepeti sin functie de ce dori si faceti cu el. Deschiderea programului in Windows 95, 98 sau NT (Cand doriti sé jucrafi in Composer gi Netscape Communicator este inchis, deschideti programul Composer direct din meniul Windows Start alegind Programs, Netscape ‘Communicator, Netscape Composer (vez figura 2.1). Composer se deschide cu un fisier care confine 0 pagind Web nou, goal. Aveti posibilitatea sa incepefi Incrul la26 Partea k: Primi pas, prima pagina Web pagina Web in acest fisier now sau sd deschideti un fisier existent procedind conform, descrienifacute ceva mai tirziu in sectiunea ,Deschiderea unui fisier (uneorl impreund cu Composer)” Cn uizaio versiune pentru Macintosh a programuli Communicator ant dea putea deschide Composer, tebul s} deschde Netscape Navigte, g [Inne reste enctea nce petogana Weapon ee Sunrafafa de lucru, se deschide component cae joacd ral da browsar (Nagata), Dar aceasta pictograné poate i modlicatd pen a oascideprogramul Compose. Deschiderea programului dintr-o alt& component& Cand deschideti programul Communicator se deschice in mod austomat si bara de componente. Uiilizand bara de componente sau menial Communicator, pteti trece de Ia orice componenta a pachetului la Composer. Fura 21. Deschiderea rogranutui Composer din menial Windows Start pentru a crea fo paging Web nowa Gy raters Greretcmetae Ktewvecemeerenact Smmthentet FS sano Wionatwes | Rfmeachnee Bcsirnou FR pone auce Brecon filet Bara de componente. Este o bard afgati de Communi e or P ia sunicator si confine patra picograme ene dnc sceendeschisind al comport. Navigator (pentru navigare pe Web), Mailbox (posta electronics), Discussions (grup de stir) si Composer Bara de componente poate flotants sau ,ancorata” in coltul din reaptnjos al feresre Cand treceti pentru prima datd in Composer dintr-o altf componenta in cadrul unei sesiuni Communicator, Composer se deschide cu un document now, gol, ca in cazul deschiderii lui din meniul Start. Cénd deschideti sau creati un fisier in Composer si poi tzecet lao alté components, fisierul respectiv rimane deschis in Composer. La revenirea in Composer dintr-o alté componenta, vé putetirelua Iucrul Ia fier! respectiv va 2: Prezentarea unui program de editare a paginilor Web a7 De féicut: Trecati in Composer din ato componente 1. Deschideti program Navigator aleg’nd Programs, Netscape Communicator, Netscape Navigator din menial Start. (In cazal in core conectarea la Internet poresfe automat, anulatio) 2. Cutati tata de componente. Tebuie 58 gisii sub forma une bare flotante, cu patra pictogeame (vezi figura 22) saa a unui ind de piclograme -ancorat in colful din dreapta-jos al ferestei programului Navigator. Freuna 2.2. Bara de consponente apare ‘sub forma inci Dave flotanie sau a wi rind de piciograne fancorat in coltul din ‘dreaptajosal ferestrel ‘rept-jos al ferste, lege Commuricator, Dock Component Bar dn bara de meriurl a ‘fcr componente. Pentru elvera bara de componente (pentru ao face din nou flotant), lege Communicator, Sow Component Ba ? Pent a comuta bara de component din forma fotant Tn forma ancorat in cotl din 3, Executaf clic pe pictograma programului Composer din bara de componente, pentru al deschide. 4, Executati clic pe pictograma programului Messenger din bara de componente, pentru a troce in acest program. 5. Alegeti Communicator, Page Composer din bara de meniusi, pentru a reveni in Compose 6, Utilizatibara de componente si meniul Communicator pentru a comuta de céteva cori intre componente ca s4 vedeti cum este ete caatunc end treed aa component la Composer, remain dschise {ab componente inpreurd cy ieee org oica Seta one. De exe, dacd Tusa ening tn Navigator, aol recat la Cornpser wind una dnte metodele desorise mai eeme, Navigator i sesiunea online ramén desis a funda a " ane Crearea unei pagi In menial Files oricirei componente avi rei modalti dea ncepe o sesiune de creare a unei pagin Web 1 File, New, Blank Page ~ Deschide programul Composer cu 0 pagint nous goals sala pentru editare 1 File, New, Page from Template ~Iniiaz8o pagina noud prin intermediul casete de dialog Tempate. In easeta de dialog se introduce pozitiapaginl Web care wrmeazi28 Patea |: Primi pasi, prima pagina Web fie folosit ca sabion la inifierea noi pagin. (Veei Ora 4, ,Crearea rapid a unei pagini originale cu sjutoral unui gablon’ 1 File, New, Page from Wizard ~ Deschide programul Navigator (dacK nu vi aa cumva in els face legitura cu Page Wizard, care va ajuta si creat rapido pagina de baza simpla. (Vezi Ora 3, -Crearea a unei pagini Web «la minuto”) Dupa ce att creat in Navigator pagina de baz alegeti File, Edit Page pentru atrece in Composer shosalvait, De facut: Deschiderea unui fisier (unecr! tmpreun’ cu Composer) Pasi pentru deschiderea una fisier in vederea editarii in Composer sunt aceiagi ata pentru Navigator, cat si pentru Composer, Nu-i aga cl-ifrumos? 1. Cand va aflai in Navigator sau Composer, alegeti File, Open File. Va apirea caseta de dialog Open Page (prezentata in figura 2.3). v Fura 23. See ee eo tte Caseta de diatog Open | FaseeararamcPaTemTis ———— num. Page, accesibid att din | Qrermreun # teen : oak Navigator eats din = Eien teat || Composer 2. Introduceficalea si denumirea corespunzatoare fisierului sau executati cle pe bbutonul Choose File pentru a deschide caseta de dialog Open de tip Windows, pe care o puteti utiliza pentru a risfoi dupa fisier. Dupa cum se poate observ figura 23, mu este necesar si furnizati calea gi denumizea fgierulul in forma URL. ‘3. Dups introducerea corecta a ci si denumiri figierului in caseta de dialog Open Page, asigurati-va cd este selectat butonul de radio de langa eticheta Composer, poi executali clic pe butonul Open. Drept urmare,fisierul indicat va fi deschis Jn Composer, gata pentru editare. ‘in Composer, noc sa alge Fi, Open Page, ute executa clic pe butonul Open din bara ‘eu insrumante Composition. Acestbuton au deschidecaseta de log Open Page, i obigutacaseti de dialog Open cn Windows, pe cae o pute utiiza pentru a uta gla alge Fier, Deschiderea unui figier utilizand butonul New ‘in cazul in care doriti si creati un fisier cu o pagina nou’ sau sa deschideji unul exis- tent, dar nu vi place nici una dintre numeroasele modalitati care v-au fost prezentate {in acest scop, avefi la indemand inca una (cu sigurants, ultima), Dups cum veti vedea, utilizarea butonului New este mai putin convenabila decat metodele descrise anterior Executati clic pe butonul New din bara cu instrumente Composition a programului Composer pentru a deschide caseta de dialog Create New Page (vedi figura 2.4). in aceasta caseta de dialog, alegeti butonul care corespunde doringei dumneavoastré: 4 Primele trei butoane, Blank Page, From Template si From Page Wizard, au efect iden- tic cu cele trei optiuni avand aceleasi denumiri care se gisese in meniul File, New, Gra 2: Prezentarea unui program de editare a paginilor Web 29 ™ Open Local File are efectidentic cu executarea unui clic pe butonul Open din bara. ce instrumente a programului Composer (deschide obignuita caseta ce dialog Open in Windows, in care puteti alege un fisier). Founa 24, Caseta de dialog Create New Page din programul Composer Salvarea si denumirea fisierelor (Cd salvatiunfiser in Composer, trebuie 581 deni ~ probabil i vefi da dena- rire sub care va fi stocat pen server Web cind va fi publicat. nd vine momental publicii unei pagini Web, numele defsier poate cea probleme De exemple, sistemele ce operare Windows 95, 98, NT, chiar si cele pentru Macintosh, ‘va permit sf utilizat spas semmnee de punctuafie in denumirea fiierlor. Acest Juri na trebuie cut eind denurnitifisierele in Composer, desi Composer vi permite acest luc, deoarece ind vet incerca sl publica (eau doar si le vizualizal in Navigator) vel consttac& browseral nu le poate deschide. in general, ita veme folosiiextensile tm si nem i elimina spite si semnele de punctuate, pete da fisierelor orice denumire, Totus, denumirea fiieruiitrebuie siiseconformeze sistemului de operareutilizat de server De exempl, daci serverul Web pe care urmeazi si va publica documental (vert Ora 21, ,Publicarea paginii?) folosete sistem de operare DOS, isierele trebuie denumite respectind regula demt- rin 3: Numeleiseruel poate avea cel mult opt caractre, iar extensia cel mul rel (hex, me De asemenea, cio pagind este prima paging a une prezentiri cu mai multe pagini practica standard este dea o denim inciex. tn]. Uncle servere sunt configurate sf dleschida in mod automa fisierul index. bes) ind un viitator precizeazé un director fara a specifica sun fisier Oricum, acest lara fenctoneazA numai daciaveli pe server propria director De obict il vet aves, Dar daca impirtt un director cual este pfin probabil sf primal care plaseaz8 un figer index. itl, del serverul na vi va accepla documnenil. Jn conclure lege-v8 servers aflai care sunt convenfile de denumire pe care le ulizeaza, aint dea stabil denumirle finale ale iierlor HTML. Utilizarea optiunii AutoSave Programul Compaser confine o optiune AutoSave care salveaza toate fisierele deschise dle fiecare dati dupa ce s.a scurs un anumit numar de minute (in mod prestabi 10 minute) Salvarea se face in mod automat, far8 ca dumneavoasted sa intervenifi, ined numai dupa ce ati salvat fsierul, in mod deliberat, pentru prima dati. Pani cand fisierul nu a30 Partea I: Primi pasi, prima pagina Web fost svat petra prima dats, opianea AntoSave mi face savarea automat in schimb, ‘hinreab cach dons salva seul (vezi gra 28). Exectai cle pe ton Yes Sin caveta de dint penta salva fiir sau pe butoml No petra a nehide easta de dnt naa eect savaren, ceca ce ace ch AstSave 8 repet nrearea al tri Dupt cea salvat fier, autosavare se face n continua autora Dac evecutai clic pe butomul Cancel din costa de log AutoSave sents dows era (et mai degra na ge itl): = Fisieral mu est salva; = optiunea AutoSave este dezactvatétemporar pein feelin ca, del nt va ta incre slvrea automat a iserul, Nuveen fl ntecbat doch dort Shsalvotdamneavoastea eval Dupe sala opine se eacveszS automat $i programa reincepe a pana inirebares la fecare 1 minute, g Ac aie at sau eal pen loa stab cui ‘minute up care si intrebatl daca dort ste iat salvarea. In acest sop, ale Eat, Preferences in Compose gis ve deschide casela de cio Prelerences. Pentru @ madifea numérui ge minuto, introduce un aumar nou in cmp de gd texul ims”, sue in pate Ge sus a caste de galop Pentru a dezactvaophiunea ALtoSave, ezactval casuta de valida de LingS tentul Atomataly save page every. Fiouna 25. Sppeateon co Caseta de dialog AutoSave | “0 Rartsestinatasenutrmensarin Cedee De facut: Salvarea unui figier 1. Executat lic pe butonul Save din bara eu instramente Composition sau sleget File, Save, Se va deschide 0 caset8 de dialog standard, Save. ‘ind svt un tier cu 0 pagind We ae de a prec titl acest casta af «az dalog Page Properties, se deschiée automat o ase de dal incre pute introduce until, eocamdat. introduce oie tly dori ~ vel aia ttl cespre ‘ur alle propia paint In Oa, Stables tu, culo 2 ator propit ale pagiir. 2. Alegeti un director, dact dorit, si tastati denumireafisierului, Nu este nevoie si tastatf si extensia; se adauga in mod automat extensia -hex. A. 3, Executati clic pe butonul OK. ra 2: Prezentarea unui program de editare a paginilor Web at Testarea in Navigator a fisierelor create cu Composer ‘Dupa cum veti abserva parcurgand aceasta carte, Composer este in mare masur’ WYSIWYG; in majoritatea cazurilor, paginile dumneavoastra vor arsta la fel cind sunt vizualizate cu Composer sau Navigator. Totusi, existé cdteva elemente care nu apar in Composer la fel cur apar intr-un browser, Astfe, este indicat ca, din cAnd in cSnd, s4 ,previzualizafi" cu Navigator pagina creaté, pentru a vedea cum apare ea vizitatorilor (sau vizitatorilor care folosese Navigator) irate de eva pe san Preven, aa dn anpaser mx ot EG | snteescancepo bso een spe taed tage cgh 8 SEA | fkaivote catgut si rte Pentru a previzualiza o pagina la care lucrati in Composer, alegeti File, Browse Page din bara de meniuri a acestuia (sau executati clic pe butonul Preview din bara cu Instrumente), Daca inainte dea executa clic pe butonul Preview, Navigator este deschis i afigeaz8 un fisier diferit, pentru a afisa fisierul aflat in editare se va deschide o noua fereastra Navigator. Daci Navigator prezinta deja fisierul editat (cum ar face-o dacd afi fi execu- tat cic pe butonul Preview mai devreme, in timpul editarii), fereastra respectiv’ deschide si reincarea automat pagina pentru a ilustra eventualele modificari aparute de Ja afigarea anterioars. Pontru a reveni la sesiunea de editare dupa previzualizarea unui document, alegeti Page Composerdin bara de componente sau din meniul Communicator | uutiza Fie, et Page pena reve din Navigstorn Composer dupa prvuaizarea fos ‘isiemlul in tutu, Provedind ast, nu reveni la sesiunea de edtare anteriaré:opiunea fait age desc o nou fread Compose care can o copie a agin respective. Ast, avea deschise dou fest Campocr pant aataea aces Pantua revenn Comper cupévauleare une pag in avg, iia tara de pro- rare dn Windows, combnaa de taste Gd sau bare de component. Utilizarea barelor cu instrumente din Composer ‘Toate functile din programul Composer pot fi apelate din bara de meniur, insi, pen- tru un acces mai rapid, multe dintre funcfile utilizate frecvent sunt disponibile in una dintre cele doua bare cu instrumente (vezi figura 2.6). Fecarebuton din barelecuinstrumente este prezetat in ora Toca ete deserisa acjiviea pe care o decangze2. De exemplu,butonul Insert Link este prazena in Ora 10, Cretea legato Composition - Contine butoane pentru deschiderea si crearea fisievelor,verificarea paginilor in Navigator, tipirire, editarea textului si adugarea unor elemente in pag 1a, cum ar fi kegsturile gi imaginile.32 Partea I: Primi pasi, prima pagina Web & Formatting -Contine butoane si liste derulante pentru crearea listelor si operafiuni dde formatare a textului cum ar fi aplicarea stilurilor de paragraf, a fonturilor sia atributelor textului. ceitareastflc8 vei vedea mal pujin din pagina a care luca Gnd nu ave nevoie de una ‘ce (Gu dene una}, o pute ascunde alegind o opjune di pata de sus 2 menial View. g ‘ind se aa pe eoran ambele bare cu instrumente,aeslea meyoreazasuprataaferestel de In partea de sus a ferestre de editare prezentate in figura 2.6 se pot observa doua rin- duri de butoane. care rind eonstituie o bard cu instrument, desi cele dows bare creeazsimpresia nea singure atuncicind sunt alaturate Bara Composition Bara Formatting Figura 2.6, Barclecxitrmente It STTMT AEA Composer BSEe Reese eo ee \dentificarea butoanelor din barele cu instrumente Cet areauinventat nterfaa grafic cu itor sa iain c&butoanee aut txplctive de pe ecran vor permite wlizarea inten cae wiiztorul eet clic Pebutonulconspuncitor in od instinct datos intlegeisubcongiente = seri Gai! pctogramel de pe Bton Dupe vais cu el majorite butoaneor din bree cu nstrumente ale pro- gratmulu Comper sunt dtl ce infutv, De exp, butona Pint are imagines he impriment ic baton inset Link are imagines uni lan ink = eg Infeles Mca?) Ca toate acest ctevautoane wea putea prea cam inept. Din fei fat batoanele din bare cu instrament dnp de indent lt). Pntea tifa denamizea noi baton sah eel indeatorl mouse pret de teva ‘moment 9 denntuea va opie, PERI Indicate (oltip.Utlizate in male dine programe pent Windows, icaileSunt etchete cate apa pentru ientieabatonele din Brac es Gator mouse lu deasupa atonal timp ce o sean su dou iin urma mentinerit indie ‘eine ingcatoral mouse- lui deasupra primuluibuton dn partea sting bare co instrumente. Dupé ce apare inccatia,depasai indicator incet spre crept, deasuora buoanelr pe mésura ce vi dopastl de-alungul bate, vor apdea inal corespuna- tance tetra ton g Aceistaconsttule 0 metod8 ut dee ala por Duonull cat a bara cu Instrumente, Deplasarea barelor cu instrumente Ondinea bareor cu instrumente ale programului Composer ~ Composition 5 Formatting ~maeste fx In interiorul zone! destinatebarelor cu instrument, 2008 aflata in partea de sus a ferestre,puteti poztiona bara Formatting deasupra bare Compostion sau invers Pentru a schimba ordinea, pozifonafindcatorul mouse-ului dessupea éreptanghiviss ra 2: Prozentarea unui program de editare a paginilor Web 3a vertical din extroma sténgi a barei cu instrumente. Executati clic si mentineti apasat bbutonul mouse-ului, deplasati prin tragere bara cu instrumente in sus sau in jos (in interiorul zonei destinate barelor cu instrumente) pana in noua pozitie, apoi eliberati butonul mouse-ul ‘ene au modifica optiunea Showrhde corespunzitoare bari poi sah pagina, ef ‘Confguraatarelor cu instrumente este speci fileruu. Dack depasatio bar cu instru ‘configura respctva vai etdcut ri de cite ov daschidep pagina respect Tiparirea din Composer Pentru a tipari pagina pe care o editati,executafi clic pe butonul Print din bara cu Instrumente sau alegeti File, Print. Documentul este tiparit exact aga cum ar fi tiparit din Navigator ~ in listare sunt incluse formatarea textului si imaginile, ins sunt omise ceventualele modele de fundal, pentru a pistra textul lizibi. Pagina este divizata in Ducati dimensionate astfel incat si se incadreze pe foile de hirtic. Desis-r pute s ipa page pertrs o consular utroard, nu va apeptali ca starea 8 feo roprezentareevacé a flu in care pagiie dumneavoastraapar anne, Rezumat ‘Composer face multe ~ de fapt, prea multe pentru a putea fi mcar pomenite in aceast ‘ord. Totusi, in aceastd ord v-ati apucat de treabs si afi invatat sf inteati in Composer, 4 iesift din el gi si va invartiti prin el. Atat de normale cum vi se par aceste operat cle reprezinté beza realizari eficiente a paginilor Web, Dar, cu toate caktitile pe care le are, acestui program ii lipseste una: inteligenfa. Nu va poate spune dact pagina creat este bine organizats, bine prezentata sau bine scrisé. Sic toate cd aplick etichete HTML in documentul dumneavoastra cu constiinciozitate, ‘nu vA poate spune daca afi ales etichetele cele mai indicate pentru prezentarea cores- punzltoare a materialul Prin urmare, Composer inlocuieste numai timpul 1 munca, nu st judecata, Pentr a crea un document Web eficient, trebuie si infelegeti estetica Web. Din aceasté carte veti invata multe in aceasta privinta. Dar mai trebuie si vedeti multe alte pagini online si s4 Je catalogafi mental in functie de ceea ce va inspira aspectul si confinutul lor, si acestea pot si vi incdnte sau sa va pard anoste,plictisitoare sau incdlcite, Atelier Tar Am vézut materialul prezentat in aceastd ori cu privire In barele cu instrumente si optanite din mento programului Composer, plus o parte din material care ‘af prezentt in oreleurmétoare, cum arf cel referitor la imagini, Unde se a8 Jn opfiunile de meniw si butoancle referitoare la alte clement ale paginil pe care Jeam vizut pe Web, cam ar ft secventele video?34 artea I: Primi pas, prima pagina Web R Composer este destul de bine dotat, avind instrumente pentru 90% din elementele folosite de 99% dintre creatori de pagini Web. Dar nu este un sistem universal, atotcuprinzator in ceea ce priveste crearea paginilor Web. Nu face totul ‘Acesta este motivul pentru care va amintesc in aceasti or’, precum si in altele, ck indiferent ce faceti in Composer, in subsol construiti un document HTML, Cand ajungett la elemente pentru care Composer nu dispune de instrumente, trebuie s8 renuntati la ,pilotul automat” sisi apasatt direct ,pedalele” HTML. Vetiface acest Iucru in Ora'I7, ,.Aitarea codului HTML’, sis-ar putea si descoperiti cd nu este chiar asa de dificil. Dar pana atunci, explorat si folesitblucrurile pe care le face Composer si ‘are sunt prezentate de la Ora 3 Ia Ora I Minitest Rezolvati testul urmitor pentru a vedea cit afi reusits8 invitati. Intrebari 1. Cand bara de componente a programului Communicator este ,ancoraté* 0 puteth vedea a, Pecheiul 11. . Cu un pret mai mic ¢: Libers pe ecran 4. fn colt din dreapta-jos al ferestee 2. Executaf clic pe butonul Preview in Composer pentru a testa cum ar arta creatia ddumneavoastrs ack: 2.0 publica pe Web f b. Arfi gata A creat alteineva, 4. Ati luat-o de la tnceput. 3.Se poate flosi denumirea .Noua Mea Pagina Webs htm” pentru un figier care contine fo pagina Web, Adevarat sau fals? 4 aduce alte modificiri, Popunouri 1. (@), Cand nu este ancorats, devine adevaraté varianta (¢). 2. (a). Previzualizarea prezintS cum ar arita pagina dumneavoastrs, In starea curenti, daca ari vazut8 online cu un browser. 3. als, Nu puteti folosi spain denumirea fisirelor care contin pagini Web. (Totus, -NouaMeaPaginaWeb.htm” ar fi corect.) Activitate Incepei si explorat programul Composer a pe un editor. Deschidef un fsier now gi ‘ncepeti si ett toxin el. Vedi ach putel 58 dai seama cum se formateaz3 text (Gugeste Incercfi si flosf butoanele din bara cu instramente Forming) sed = Ora 3 =. es Crearea unei pagini Web ,,la minut“ Netscape Page Wizard este una dintre componentele . generatoarelor de pagini de baz”. Utilizat la completarea unor campuri, permite incepatorilor in editarea Web si {si compund in umat cateva minute proprille pagini gazda. Ca orice Iucru creat pentru sporirea vitezet si a simplititi, Page Wizard obliga utilizatori si fac& o serie de compromisuri comparativ cu alte variante de editare. Este asemanator unui aparat fotografic de tip Polaroid: nu se pot face prea multe cu el, rezultatele obfinute nu sunt sgrozave; sunt confuze si fd aspect profesional, Insi se obtin aproape instantaneu. Cu toate acestea, Page Wizard nu poate fi depasit ca viteza si simplitate gi ofer’ incepa- torilor o cale foarte comoda de a se obignui cu elementele Web inainte de a trece la tehniile de editare mai pretentioase (si mai eficiente) care sunt descrise mai térziu in aceasta carte. Un alt aspect important este cA sar putea s8 alegeti Page Wizard pentru a rea o pagina cere sf serveasca drept material brut (,argil’ Web"), aceasta urmand a fi editatd si dezvoitata folosind tehnicile pe care le vefi invata pe masura ce parcurgefi cartea, La sfarsitul orei veti putea raspunde la urmatoarele intrebari: 1 Ce este Page Wizard si cum se porneste? Reprezinta Page Wizard solutia potrivits pentru dumneavoasts3? © Cum se creeaz§ in Page Wizard o pagin’ nou’ cu text, imagini si toate celelalte elemente? Ces face cu pagina la sfarsitul editiil? Ce este (si unde se afla) Page Wizard? Netscape Page Wizard (wizard=vrdjtor) se aseamand cu vzijtorul din Oz: se numeste vrijtor si pretinde sa fie unic, dar in realitate nu este asa. Totusi, in final (cum se intémpla si in poveste), Page Wizard va furnizeazi cvea ce dorit Sunteti familiarzat cu astfel de module ,vrijitor”. Ele au o interfatd prietenoasd si rutine automate care va conduc de-a lungul operafiunilor complicate, cum ar ft insta- larea sistemulut de operare Windows, crearea comenzilor rapide sau instalarea pachetului de programe Netscape Communicator. Din punet de vedere tehnic, Page Wizard nu este un vrajitor de Windows, Desi serveste unui scop similar, nu aratl si nu se comport ca an astfel de vrjitor. Elvi aj et eeaio pagina de bazd simpli per- sonalizats. Page Wizard este o pagin’ Web stocatd la urmatoarea adresi: hetp:/hone.netscape.con/ome/go1d4,0_vizard. htm)36 Parta | Primi pas, prima pagina Web Este indicat sa folosesc Page Wizard? ‘Cand completa spaile goale din Page Wizaed, date furizate de dumneavoastrd sunt amplasate automat in poze corespunzatoare,intr-un sation (lemplate) al unei pagini Web. Sablonul nu este nici mai mult nici mai putin dest o pagind de baz foarte simpis si clas bon. Un gablon este o pagind Web finalizatt pe care o puteiedita st Feronalzn penta aca pop gid nin inp mal a sr decit daci ai incepe de la zero, Vezi Ora 4, .Crearea rapid a unei pagini originale ca sjutorul uni sablon Desi intioducerea altor date conduce a modificareacon¥inutuli organiarea paginit imine aceeas!indiferent de ceea ce tastal in Page Wizard. Page Wizard vi oferi posi bilitatea de a stabil nftisarea poginil prin alegerea unci textun pentru funda, a culorit textulul,precum sia marcaeor de ist sa lnilor orizontae (cu toate ch aceste opr de formatare as inconvenient, dups cur veti vedea mai tirziu in acest capitol). Insa aranjareaelementelor de text in pagins rimane neschimbat orice fi face. Tate paginile ‘create cu Page Wizard arata la el ~ diferd nurmaiconginutul (vezi figura 3.1). Sablonul uilizat de Page Wizard este proiecat pentru o pagind gazda personal si este eficient in acest sens, char dacd este cam redus ca dimensiuni sexcesiv de simplu Prin citeva aleger creative in timpul completari, urmate de o ugoara ajustare a paginit in Composer, puteti utiliza Page Wiad si la crearea unei pagini de afacen simple Foun eae pag de bce Pag pl est i Nee erorrtrsen grag ate cts | Die Wand = ome : setts ia i afer hot ick y Peaevons oman ost Putt win Page Wizard a nighabarea rapt a uel paging cre, ulterior, o pute nde fia tn Compose. (Chior daca ar trebui si utilizati Page Wizard in functie de scopul urmarit,organizarea generald a paginilsezullate este suficent de apropiati de ceea ce vreti s8 obtineti. Daca doriti ea pagina si alba un aspect cu totul diferit sau intentionati si elaborati un ra 3: Crearea unei pagini Web Ja minut 37 document Web format din mai multe pagini si figiere legate intre ele, ar i mai bine si treceti direct la ora urmatoare. Utilizarea modululul Page Wizard Modlul Page Wizard este utilizat online, Nu puteti si descarcati pagina Page Wizard 41 s8 o utiliza offline, deoarece Page Wizard va creeazA pagina preluand datele pe care le introduceti online gi prelucrandu-le cu ajutorul unui program aflat pe serverul Netscape, Remarcafi ci desi faceti editare, lcrati cu Page Wizard in Navigator, nu in Composer, Nu este necesar 58 deschiceti programul Composer pang cnd mu afi salvat pagina finalizats, aga cum se descrie mai tarziu in acest capitol ‘eemeteor pe cae le poate cone pagina: til, subtlur,paragrate gale. Datort soapuu titan mouluui Page Wizard, acest elements sunt autoexplctive si, pentru 2 ‘cata pagina, nu trebuie 8 ti prea mute despre semnifiaia denumirlor lor. (Orica, cin vf trece la pate aaa acest car, Tur, txt gl abe, vol descopert db ferare element cntro pagina Web jaca un rol speci, unis gc stablirea denumior sl utlia elamentelor pagilconsttuieo part importants a invari compunet gi edtarit Baginlor Wed. Pe misurd ce urmaf instucjiuie de crearea unl papi, vl inn dferite denarii ale ———— ‘Asemanea unui numar tot mal mare de pagin Web, si pagina prelueratscu Page Wizard este foxmata in ptr cadre Fiecerecadryapae cao mid fereasrasepaat. Vet wala cum s4 ‘cre proprilepagn Web formate dn cade In Ora 18, imps uel pagint i cadre” De facut: Pomiti modulul Page Wizard 1, Deschideti programul Navigator si conectati-va la Internet. a v at papind sau pagin goad ~ été vere Navigator este duschisg! sunt conectat g Sind cca asl, cons pe epi wut poxia do bar Nesp, 0 heen 2. In Navigator alegeti Fle, New, Page from Wizard, Aceasa i indicd browseralui vd coneceze I Poge Wizard. Ezranul care va apivea va semana cu cel din figura 32 3. in cadrulcetiv(coltul din dreapta-sus), derulaiin sus parteaintroductiva de la Netscape pentru a ajunge la butonul START, 4, Exeenaf cic pe bulonal START aflat in cadrul din dreapta-sus. Pagina va arita ca accea din figura 33. ‘Asa cum este iustrat in figura 3:3, pagina este imparft in tei cadee: ' Cadrul din stanga-sus, INSTRUCTIONS, desce fiecae element pe care il vet crea, Fiecare descrere confine legturi care, cind se executs cle pe ele afigeaza in cadrul de os un formular sat o lista de optim. * Cadrul dejos, CHOICES, constitue spatial in care vefitasa textul din formula. ze (pentru a crea continutul paginil) sau vefi alege, dintr-o list de optiuni, cum ¥ —_siarate pogina dumneavoastra38 Partea : Primi pasi, prima pagina Web ¥ ™ Cadral din dreapta-sus, PREVIEW, prezinté o previzualizare a paginii. Pe masurd ce veti completa fiecare formular sau velialege una dintre optiunile din cadrul CHOICES (de jos), previzualizarea este actualizaté pentru a ilustra rezul tatul. (Dupa completarea primelor formulare, vet fi nevoit sti derulati in sus confinutul cadrului PREVIEW pentru a vedea portiunea de pagins pe care toc ‘mai ati creat-o.) ‘Fioura 3.2. tac A Nan fin ere rancoecovronToatt eee erat iad ——— Feet = Vice NETSCAPE PAGE WIZARD Eicon iin. Fava. = ae 7 Page Wsand Becton Your Page reece Serene nome pce ea (Ora 3: Crearea unei pagini Web .ta minut 39 in stcpuniteurmitoare sunt descrise maul de completare 2 tutor formulareor gi mod de dectuar a alegsiornecasare complet agin Formarle opjunie sunt preentate in ovinea in cate nan Tm eau INSTRUCTIONS (st8ng3-us). Inteducerea tell etecuareaaeger nu trebue Heute oie. Putei sa der |coninutut carl INSTRUCTIONS si 8 completa pagina mai depart ira completa anu | mite zone. De asemenea, in rice moment pute derla nant apo conjinuulcadrulut INSTRUCTIONS pentru arevedea zonele complotate (pe care le pute modtca sau stege ate don). Rete} in tna cu tei s8 completa tot ce gst Tn Page Wiard. Dac lsati gol un formula, jitorl pur simply serge eementl respect g once text uz pentru a enum. Daca nuvi deangs& modieat oyun tat zona Looks", vor fi uiiate a tale prestabite Jn seciunes Content din cadral INSTRUCTIONS, alegeilegiturile care deschid in cadtral CHOICES formlare de introducere a texts. Parcergefi pas ermtor g 1. Dera cadesl INSTRUCTIONS pina cind vedeti legit give yor page tile 5) (dati un sla pagin dumneavoastra), cain figura 3 Y 2 Bxecuta cle pe legaturarespectv cn cela din fra 34 3, Stergeti txt descripiv care st in formuslar tata itl pagini dlurineavoastr. Page Wizard il vafolos att a ttl al documenta (el care apareinoara de tla a browseruluivzitatoilon), cit sal paginli propriu-zse, plasnd-1in partea de us a acestia cu litere mari, aldine 4. Executai clic pe butonul Apply: Nou tha va aparea in cadrol PREVIEW, cen- vrat in prtea de sus pag (ver figura 33) Page Ware nsrear leo Ire ozonil deasupra desu nroducel. Utero, Ze | vet svea ocala st personatal aspect acestul element 4. Devulai cal INSTRUCTIONS pana cand vedet!legatura type an furoduetion {tastati ointroducere), cain Figura 35 6, Executal clic pe legatura respectiva. in cadrul CHOICES va aparea un formular caacela din figura 35. 7, Stergeti textul deseriptiv care este i a De facut: Introducet! continutul pag In cadral CHOICES va aparea un formular formula si tastafi o introducere de pand la 1000-de caractere. In timp ce tastai introducerea, puteti apasa tasta Enter pentru a intrerupe linile sax pentru a crea o linie goals. in acest fel, putesi crea © introdecere formata din citeva paragrafe (avand, in total, pana Ia 1000 de caractere).40 area t Primi pasi, prima pagina Web hn fp Rae SRT Frouna 3.4. ceecene Your Page Fe gece 1 mhecwesne nate Tir para oooe Seite. seam oe a : Figura 3.5. Pee Un wit fnalisat | picts te Sam's Musie Hot Links Seen Seber sicadrul CHOICES | Ze Fatpagate ston pregitit pentru trebet ot, senanee ‘ditarenSntroduceri See amt Nes mesnitdicen out (ow trate eagle see haces Suge ounces 2 Page Wizard insereazd aceasta inroducere dp tit, sub forma unui paragrat normal, alinit Ia stinga (vezi figura 3.6), 6. Executali cic pe baton Apply. Nowa introducere va apirea in exdrul PREVIEW. 9, Derulaticadrel INSTRUCTIONS pan cind vedet legtura ad some hot ks {adiiugoti nist legitari fering a in igura 3.6 10, Executat cic pe legitura respectivs In cadral CHOICES va apérea un formar ea aela din figura 36 (ra 3: Crearea unl pagin Wab Ja minut at Y Figura 3.6. pace seeanuaz |) Sam's Music Hot Links (Gu cadrul PREVIEW) | wetetnow Se URL Cte) si cadrut CHOICES | i et ioe regatit pentra Mecraisnreoetrde || amet Sn yrhoe ft met Iegaturitefierbint | mn Ube tw dered camp Webeede He oltad agate fering iginamaacepcam re Seu, ews ewe hoe oe et Me you —S— ‘gulamenucarines Gon tonte wane nics 111, Formularul CHOICES: HOT LINKS va permite sa creatio list marcata care contine legaturi citre alte pagini sau documente. Fiecare legiturs din lista se creeaz8 astfel: "= Stergettextul descriptiv care apare pe linia Name din formular si tastatitextul Care dorfis8 apard in pagina dumneavoastra ca sursd a legaturil (textul pe care trebuie executat clic pentru a activa legatura). 1 Sterget textul descriptiv care apare pe linia URL din formular si tastati URL-ul ‘complet al locafiei in care trebuie dusi vizitatorii dacd executa clic pe textul precizat din linia Name. 1 Executaf clic pe butonul Apply. Pag in pat egitierecaieaoat area M a ] ‘es ot a pea spc nario a Page Wizard insereaztextul din linia Name ea element a istei mareate aa dupa subtitul centat Hot Links (vei cadrul PREVIEW cin figura 3.7) Incontinuare, vet posbilitatea #8 adaugati in ist inc’ otegaturafiebinte (Cepetind posal 11) sau si trecei la past urmtor (Este normal ca lista s& alba cel putin doua legtar ferbin! sa nil una; o isté marcath cu un singur element rata netire)a2 Partea I: Primi pas, prima pagina Web Ora 3: Crearea unel pagini Web la minut 43a Y Se ME cae Fura 37. A aver Legituitefierbingt | Hyovecysrcmalieness finalizate, afisate in ‘dru PREVIEW Set Wehaus o Sam's Musi essoimewt i e)| ‘Se ae Ferme Fre jouipe Rene fre | cant Sarthe rt ay ie Hot Li | es yorcmreapinhst [na rstescdee tl cera d ‘oss Dae Hor Ee isis 1 Boyar pS ok he Ree) 4 1 any inn ee, Wow Yoo) 1 esa Sew 8 Te Spent SSS g ‘Daci ati adaugat olepitrdferbinte gi witeror va hota renunat ta, derulat caéru INSTRUCTIONS pana la egtura peu introducer egturior Fein (edd sore hat inks) execute pe ea penbu a redsctide formularul CHOICES: HOT LINKS. | ao exacut ei pe Delete Hot Links. Seva ceschide an no formulas CHOICES, asemand- tor eu cel din figura 37, | Marcajele de bifare care apac in deeptulfiecreilepitur din std ara cf legatura va ramane ‘in document, Penta serge o eit, execute pe caseta sade vase, Lepatura va tiepatea instantanau ait cin Ist ct in caeul PREVIEW. 12. Derulati eadrul INSTRUCTIONS pan vedefilegitura type a paragraph of text serve tsa conlusion (stati un paragraf sa un text de inch) 13. Executat clic pe ea, fn cadrul CHOICES va apssea formularul CHOICES: CON- CLUSION! 14, Sterget tent desxiptiv cave apare in formar tsi o conchae foomats in mnosimuin 1000 de caractre. Casi in azul lst introdcer, putt apasa fasta Enter pentru a intrerupe ln sau pentru a crea o Tinie goala Page Wizard insereaza conchizia dumneavoastrs dupa setiunea Hot Links, sub forma unui paragral normal, alinat la stnga (vei figura 3.15), 15, Derulai cadrul INSTRUCTIONS pind vedetilegatura add an enait 1ink (inseraio legitura pentru posta eletronied), prezentata in figura 38. 16, Bxecutati clic pe ea. fn cadral CHOICES va apren un forma ca acela din figura 38 17, Formularul CHOICES: EMAIL LINK va permite 8 creaio seranatur care sf. apara in parte de os a paginil cumneavonstrs (vert figura 3.45. Semnatura include so Tegatura spre adresa damneavoastra de post electronica pentru a permite viziato- rior svi trimita un mesa prin posta electronics, Stergels textul descriptiv care ¥ pare in formalar 1 introducettadresa dumneavoastra de poslt electronic. < Devaeuel v Frou 3.8. Introducerea uses senuitur ald Se pee ‘nal orm on Wee Sant orton a dy ie Teer twe concen Web tet yoo ad ewsGescuatihevers Tipeyoneney tine | iritieareett Sector Shoes om as Jreeecereriee anes at 18, Executati clic pe Apply. Page Wizard va construi o semnatura in partea de jos a paginii. Semnatura include sdresa dumneavoastri de post electronica sub forma unci legaturi mailto. De facut: Stabilit! aspectul paginii dumneavoastré, In zona Looks din Page Wizard, avefi posibilitatea si personalizati aspectul paginii lamneavoastra din patru puncte de vedere: 1 alegerea culorii sau a modelului pentru fundal; 1 slegerea culorilor pentru text, legaturi gi legaturi viztate; 1 alegerea marcajelor de lists (pentru lista marcata care contine legaturile fierbinti); 1 slegerea -iglelor (lniilor) orizontale, Retinefi cd au este necesar sé faceti nici una dintre aceste alegeri. Dacd treceti peste ‘optlunile din zona Look, pagina dumneavoastra mu va folusi wuluare sau model de fundal, culcrile pentru text/legitur/legituri vizitate vor fi cele prestabilite pentru browserul vtlizat, iar marcajele de listd si xiglele orizontale vor fi simple, 1, Derulati cadrul INSTRUCTIONS pina vedeti legitura a preset color combination (o combinatie de eulori prestabliti), prezentatS in figura 39. Aceasta legatur’ va permite s8 alegeti un set complet de culori care deja se asorteaza bine, find necesae si alegeti separat fiecare culoare (pentru fundal, text, lega- tur si legitur vizitate) (Daca dorit si alegeti separatfiecare culoare, sili la pasul 4.) Estencicat ca penta loiturie vette si nu oe floseasd ocular porsonatzat. Ca care ravcheaz8 pe Web au reac condone; ise ateapt cao legtur viztata sa apard peste Tot euloare prestabit a browser a44 Parteat: Primi pasi, prima pagina Web Y Foun 39, Alegerea nnei ‘conbinafi de cutort Sam's Music Hot Links prestablite aan (Sie Srowred ony Weed york nd SCLC tnd Ihe se 2. Bxecuta cic pe lepitura respectiv in partea de jos a cada va apirea un rind de calor a in figura 39, Reeae opiune include o culore pentra test, una pent Tegaturt si una penirulegaturiwztate toate tre find suprapase pe un patrtel care are culoarea fundalulu- Cele patruculori sunt asortate in mod corespunzito. 3. Alegeli o combinafe de culor executind cic pe ea, (Aci nu exist butonal Apply) 4. Daci mu af ales o combinaie de culor prestabilit sau dack doi si modifica una dintre culorile din combinafia alas, derulicadrul INSTRUCTIONS pana la sta de Tegituri care incepe cu background color. 5, Executafi cic pe unul inte elemente (dite de fuckgrund pattern) pent a afga tin rind de culori asemindtor elu statin cadrel CHOICES din figura 310. Ficuna 3.10. —_ Allegerea culoritor tacts Witentn Sateyrhone ra sty emic Sime Siiracenedauy tava Bevo au SLRS La eyes acne nw at seat tt (ra 8: Crearea unel pagini Web Ja minut” 45 6, Pentru a alegeo culoare,exectai clic pe unl intr patrielee olorate. 7. In scopul de aalege un model pentru fundal,execatafi clic pe legitorabnckground paler (model pete fandal}- In cadral CHOICES va apaiea un rind de calor! Ssemanator celts din Figura 3.11, incitlagitune se ugor de localiza. De aserenea ft ten a slegereafundslull pentru a ‘vi asgura ci text gileturl vor ie in vided faa de aoesta, dar nu vor fi nt-un cone trast zbitor cu al. (Dad se tdmpla 4 nu perepet cul, flo! combinatia preset {ecare autoi programul, daoarece else picep mai bine) @ ‘Cindalegticuoil, increas objet un contrast inte texts cuore de funda, astel ‘Alegre unui mode pentru fndalvaanuaalegereaantoroar a unelculort pent funda S ‘nsdn va afecta culo sabe pentru test, edturiglegstur vate Fioura 3.11, Alegerea modelulsi pentru dat Sam's Music Hot Links and teem “iene Sa yo ye ‘Senteem iteulsreliew teeta fees | = Sc tnatdeetpeaeroe ated cae = ay, anc att 8. Executati lic pe modetol dort. Dup& citeva clipe, in fereastra PREVIEW se vor vedea rezaltatle 9. Derulaticadral INSTRUCTIONS pentra a gt legiturachons a bullet styl (alegei tun model de mare), prezentatan figura 3.12. Modell de marca ales de dumneavoastst va impodobi lista marcats care confine legaturleFerbinti create anterior 10, Executat clic pelegiturarespectva In cadral CHOICES va aparea un rind de rmarcaje dela cain figura 312. Prima optione, o bulin na este un marca) de lista personalzat. Ea reprezinta opfiunea prestbllit, marcajl delist standard in HTML) 11, Pentru a alege un model de marcaj de lista, executat clic pe el v¥ Fiona 3.12. Alegeren uni ‘model de marca ponte Histd Partea I: Primi pasi, prima pagina Web Pasty, hse at [acter \ be Byoreun chee hee tet toe be ou se Ba ose 12, Derulati cadrul INSTRUCTIONS pentru a gisi legatura choose a horizontal rile style (alege ti un model de rigld orizontala), prezentata in figura 3.13. Modelut de rigld orizontala ales de dumneavoastri va afeca toate riglele orizontale pe care Page Wieard le insereaza automat pentra a desparti sectiunile pagini Foun 3.13. Alegerea wrt ‘model de right orizontal. Fog mst eg yorum ge See parent ‘pee 13, ecu clic pe legiturarespeciv fn cadrul CHOICES va apres o coloank cu modele de nigltorizontala, can figura 3.13. (Prima opfiune,o nie simp, fu esto righ orzontala personalizata Ea repreintsopfiunea prestabilt, Tig orizontala standard in HTML) 14. Pentru a Jege un model de rigla orizontals, executatt clic pe Y ei) 2. Dupi ce ati verificat textul introdus (Ora 3: Createa unei pagini Web Ja minut" a7 Cnc aloge! un marca de sta sau o gl orzontl, pin cadrul PREVIEW gl evatuath | eff | Her otnke aera per tetra de tuna culo anu text aspect penta | leg igi orizomtale st marcjle de sta trebul sas in evidenfa fo fda, dat ru tebuie s iin contrast itor cu funda, txtul sau legate, mcs contastze ire | tte Cn aveti dub, ols opium pestabite (primal mar de st in area slang si prim rit onzonta in eoload), __E—E—Ee—e—ee De facut: Creati o pagina de baz& complet’ 1. Derulaticontinutul cadrului PREVIEW pentru a revedea optiunile ficute si textul tastat. Afi spus tot ce afi dorit si spunesi? Sunteti mulfumit de aspectal paginit ‘dumneavoastra? Adresa dumneavoastea de posti electronica si URL-uile intzo- , acest struc Inalobate oer sugentt cones alle salut care sav jute a stebiivea pul Contin sia mov de prezentare a acest. Detect acs fate bzezt pe rnp unani acepat pind design Cfident st pagnilor Web sau pe cbiclurile aparute ca prvire la modal de orgarizare a parr anumite scopurt page personel, anunfurile de afacer satel Aste, Ubioanele nu murat ct economies inp autorloeincepstor, Te oferdacestora si fant ch munca Tor corespundestandardelr § principitoracceptatepivind stl si Centiutul (Ora 4: Crearea rapid a une! pagin originale cu ajtorul unui sabton 55 Configurarea parametrilor pentru sabloanele aflate online Yarameti in cateporia Publishing case ce dialog Preerences stat in figura 4H tinin princpal de publiorea documenfula duraneavonteh nti pertta ce sunt puezenttstnal detalat i Ora, -Publicarea pain” nn, nine de acoeovea alin a un fer care consine un salon, tebu 8 sigue ete Wats cae de vatcane ce King textul "Keep Images with Pog”. (Ea ete bla fn med prea, dec in ara ex Si care kat modifcat anterior aren, casela de dalog Eclotenees ‘te coofigratdcotespuncitor pent accsarea sblonlah} {Un marca de b fare prezent lings textul “Keep Images with Page i precizeazd pro- _rimulsi Composer's slvezeeventneeimogint inline mpreana ee fgiral HEM Suni cind sats pagina (an salon sau pagind oarecare) pe ene eect online, Aceastagaranteazi prezenia pe PCul dumneavoastrd copier fierlor fc, inca cave ws tir st eine in documenta dumnenvensrs nee inte Etginile din sblon. Psercle gofce sunt salvate in vectorul im cove salva ger FITML) Acelasi mars de ile mai garanteazafaptol cx. ee re mitt documenta dumneavoastr nai server pentra publi, secstla set Baga imagine Frou 4.4, Categoria Publishing aeasetei de dialog Preferences eam: = } Bimmer | ES | seottinentmetnaowenaies fpr | jeter eet ete Co ee fe Unde se gisesc sabloane Pagina cu sabloane implicit a firmet Netscape contine o mare varietate de gabloane, printre care sunt reprezentate paginile destinate majoritati scopurilor (ves! fig Oricum, puteti gsi sabloane in multe locust Multimea de sabloane furnizati de Netscape oferi citeva avantaje specifice, Sabloanele sunt anume preiectate pentru a fi uilizate ca Communicates, avind incluse imbunata- tir ca Utlizarea extensiilor Netscape sia etichetelor HTML 3 pentru centrarea textulu, personalizarca culorilor, fundalur i altele,56 Partea |: Primi pai, prima pagina Web 1 Seripturi utile (vedi Ora 19, ,Proiectarea formularelor interactive") pentru scopati fobisnuite, cum ar fi afisarea timpului sia datei curente intr-o paginns Web. = Butonul Netscape Now un fisier geafic legat la serverele FIP ale fiemei Netscape, astfel incat viztatorii paginii dumneavoastr au posibilitatea sa desearce ew ugurint’ Netscape Navigator si iil instaleze, dupa care si va viziteze din now pagina pentru ‘30 vedea formatata si pentra a rula scripturile din ea. (Dac& dorit, putot sterge cu tusurini3 imaginen Netscape Now!,) Fiouna 45. Pagina Netscape Templates presentnd legiturile spre fisierele co sabloane + camper Tene "ietatecatce Retineti ca, inainte de a edita un sablon pe care il gisii online, trebuie si salvati o copie a acestuia pe hard-

S-ar putea să vă placă și

• Propozitia Subordonata Germana

  

  Document5 pagini

  Propozitia Subordonata Germana

  gabriela_nistor

  100% (1)
• Lucrari Pentru Consolidarea Falezelor in Judetul Constanta

  

  Document26 pagini

  Lucrari Pentru Consolidarea Falezelor in Judetul Constanta

  gabriela_nistor

  Încă nu există evaluări
• SA 8000 - Responsabilitate Sociala

  

  Document10 pagini

  SA 8000 - Responsabilitate Sociala

  gabriela_nistor

  Încă nu există evaluări
• • Reviste
  • Podcast-uri
  • Partitură
• 1 71

  

  Document71 pagini

  1 71

  gabriela_nistor

  Încă nu există evaluări
• Master Plan

  

  Document178 pagini

  Master Plan

  gabriela_nistor

  Încă nu există evaluări
• Master Plan PDF

  

  Document488 pagini

  Master Plan PDF

  Irina Yrn

  Încă nu există evaluări