Elemente de teorie

Un site web este una dintre cele mai simple modaliti de distribuire a informaiilor att pentru organizaii ct i pentru persoane fizice. Tehnologiile dezvoltate pentru World Wide Web pot s ia prin surprindere att organizaiile mici ct i pe cele mari, acestea vznd Internetul i web-ul ca i mecanisme cheie pentru gsirea clienilor, pentru distribuirea informaiilor printre acetia, printre furnizori i distribuitori. n acelai timp, organizaiile i dau seama c aceleai tehnologii utilizate n interiorul reelelor locale sau de mai mare ntindere (intraneturi, de exemplu) ofer mecanisme scalabile, flexibile i uor de utilizat att pentru partajarea informaiilor ct i pentru dezvoltarea i instalarea de unelte pentru bunul mers al organizaiei. Nu cu mult timp n urm, instalarea i managementul coninutului unui intranet era o art neagr, cunoscut i utilizat numai de webmaster-i. Dar, odat cu dezvoltarea managementului site-urilor i a uneltelor de creare de coninut pentru acestea, precum Microsoft FrontPage sau Macromedia Dreamweaver, angajaii i oamenii de rnd pot s creeze documente pregtite pentru publicare pe web i s le gestioneze n acelai mod ca i documentele de pe calculatorul local. Astfel de unelte fac posibil pentru persoane diverse crearea de site-uri web i partajarea informaiilor cu partenerii de afaceri i nu numai. Microsoft FrontPage este un editor HTML profesional pentru design-ul, codarea i dezvoltarea de siteuri web, pagini web ct i pentru aplicaii web. Fie c se dorete controlul total asupra codului HTML prin scrierea de mn a acestuia, fie c se dorete utilizarea unui mediu de editare vizual, FrontPage ofer uneltele necesare, mbuntind de asemenea experiena web. Facilitile vizuale din FrontPage permit crearea de pagini web fr scrierea nici unui rnd de cod. Se pot vizualiza toate elementele site-ului i se pot trage (drag and drop) direct n document. De asemenea, n document se pot importa i edita imagini direct n document.

Tipuri de vizualizri

Tab pagini

Bara de titlu

Bara de meniuri

Bara de unelte

Panel sarcini

Tipuri vizualizri pagin

Timp estimat de download

Figura 1 - Spaiul de lucru FrontPage

Articole Tipuri de vizualizri pentru site Tab pagini Bar titlu Bara de meniuri Bara de unelte Descriere Ceea ce se poate vedea n fereastra principal a FrontPage depinde de tipul de vizualizare aleas (Pagin, Foldere, Rapoarte, Navigare, Hyperlink-uri, Sarcini) In acest tab poate s apar numele uneia sau mai multor pagini deschise n acelai timp n FrontPage Afieaz numele paginii curente i locaia ei n site Conine meniuri precum File, Edit, View, etc., fiind punctul de plecare a sarcinilor de ndeplinit n FrontPage. Una sau mai multe bare cu butoane pentru cele mai frecvente sarcini. FrontPage afieaz n mod implicit bara Standard i bara Formatting, ca i orice alt program din pachetul Office. Un panou utilizat de toate programele din Office XP care permite ndeplinirea de sarcini rapide, n timpul lucrului. Timp estimat de download al paginii n browser-ul unui utilizator la diverse viteze de acces. Trei panouri diferite ale spaiului de lucru. In panoul

Panel sarcini Timp estimat download Tipuri de vizualizri pentru

pagin

Normal se poate edita coninutul unei pagini, n panoul HTML se poate modifica i observa codul HTML generat automat de FrontPage pentru diverse componente, iar n Preview se poate observa cum va arta pagina nainte de publicare.

FrontPage include de asemenea unelte i faciliti legate de programare (n HTML view), Cascade Style Sheets (CSS) i Active Server Pages (ASP). Utiliznd limbajul de server ASP se pot construi site-uri web dinamice, care utilizeaz accesul la baze de date.

Fluxul crerii site-urilor web. Planificarea site-ului

Exist mai multe posibiliti n ceea ce privete crearea unui site web. Utiliznd fluxul prezentat n acest capitol, utilizatorul pornete de la definirea scopurilor sau strategiei site-ului. n cazul n care se dezvolt o aplicaie web, se pornete de la setarea serverelor i a bazelor de date necesare, apoi se creeaz efectiv paginile (prin programare pentru accesul la bazele de date, etc.), se adaug coninutul i modalitile de interactivitate cu utilizatorul, mpreun cu hyperlink-urile. Pasul urmtor este testarea funcionalitii site-ului, pentru a vedea dac acesta se conformeaz cu obiectivele definite. Sfritul ciclului este marcat de publicarea site-ului pe un server. De asemenea, muli dezvoltatori planific ntreinerea periodic a site-ului pentru a asigura funcionarea n condiii optime a acestuia. Un site web este o colecie de pagini, imagini, documente, fiiere multimedia i alte fiiere, toate asociate unei pagini principale ( home page). Site-urile web sunt stocate pe un server web sau pe calculatorul local. Site-urile web bazate pe FrontPage conin i anumite fiiere i directoare care suport funcionalitile specifice ale FrontPage i permit ca site-urile web s fie deschise, copiate, editate, publicate i administrate din FrontPage. Planificarea cu grij i organizarea site-ului nc de la nceput poate salva o mulime de timp dup nceperea lucrului efectiv. Astfel, organizarea site-ului cuprinde nu numai amplasamentul fiierelor ci i examinarea necesitilor site-ului, profilul de audien, scopurile site-ului. n plus, se pot lua n considerare i necesiti tehnice, precum accesul utilizatorilor, browser-ul utilizat, plug-in-urile i restriciile de download. Dup organizarea informaiilor i determinarea structurii se poate ncepe

efectiv activitatea de creare a site-ului. De asemenea, mai trebuie luate n considerare i urmtoarele elemente: o determinarea strategiei de utilizat ct i a problemelor de luat n considerare n planificarea site-ului; o utilizarea Navigation pentru a crea structura organizaional i de navigaie a site-ului. n Folder List i Navigation se pot aduga, terge i redenumi fiiere i foldere, pe msura schimbrilor din interiorul organizaiei; o se poate ncepe cu crearea de pagini simple care mai apoi pot fi transformate n unele mai complexe. Pagini noi albe sau bazate pe un model deja existent se pot crea utiliznd FilePage of Web. o n cazul n care se lucreaz ntr-o echip de dezvoltare de pagini web se poate lua n calcul utilizarea SharePoint Team Service.

Un site web creat cu FrontPage poate fi dezvoltat n urmtoarele variante: 1. site-ul este creat pe calculatorul local, iar dup finalizarea acestuia se face publicarea. In cazul utilizrii acestui mod de lucru exist dezavantajul imposibilitii utilizrii tehnologiei Active Server Pages (accesul la baze de date la nivel de server, prelucrarea formularelor la nivel de sever, prelucrarea i utilizarea de coninut dinamic cu utilizarea de tehnologie server-side, etc.), dar exist i un avantaj: lipsa timpului de rspuns al serverului web, rezultatul fiind o dezvoltare mai rapid a site-ului; 2. site-ul este creat direct pe un server de web, n acest caz putnd fi utilizat i tehnologia Active Server Pages (acces la baze de date, coninut dinamic, etc.), dezavantajul fiind timpul de rspuns al serverului de web; 3. o combinaie ntre cele dou: nu toate paginile dintr-un site necesit coninut dinamic generat din baze de date, acestea putnd fi dezvoltate pe calculatorul local. Paginile care necesit acces la baze de date pot fi dezvoltate utiliznd un server web.

Pentru crearea unui site web n FrontPage se utilizeaz FileNewPage or Web, dup care se alege fie Empty Web (site web alb, fr nici o pagin), fie Web Site Templates, n acest caz site-ul fiind creat pe baza unui model deja existent. De asemenea, mai exist posibilitatea utilizrii unui asistent pentru importul de site-uri de web ct i crearea unui site web bazat pe SharePoint Team Service. Crearea de pagini web se poate face, la fel Figura 1 - modaliti de creare a unui site ca i pentru site-uri, din FileNewPage or Web i apoi alegerea fie a unei pagini albe, fie crearea unei pagini bazate pe un model (template). n momentul crerii unui nou site web sau la deschiderea unuia existent, FrontPage deschide n mod automat tipul de vizualizare Navigation n care se poate observa o reprezentare grafic ierarhic a site-ului. Odat cu crearea primei pagini n site (numit automat index.htm), FrontPage asigneaz acestei pagini un mic grafic de identificare (pagin este i pagina principala home page). n vederea Navigation, FrontPage deschide automat i bara de instrumente cu acelai nume care permite diverse funcii referitoare la o pagin web (adugare, includerea n bara de navigaie, etc.) Crearea unei structuri de navigaie a unui site web n vederea Navigation activeaz faciliti precum banner-e la nivel de pagin, bare de navigare bazate pe aceast structur care sunt actualizate automat la adugarea, tergerea sau modificarea (locului) unei pagini n site. In Navigation se pot crea noi pagini web fantom (nu sunt create efectiv), acestea permind experimentarea cu structura i organizarea unui site nainte de adugarea de coninut.

Figura 3 - structura unui site web

Paginile fantom create vor fi create efectiv pe disc /server prin deschiderea (dublu clic pe numele paginii) uneia dintre ele.

Adugarea de coninut
Utiliznd FrontPage, se poate aduga n orice pagin o mare varietate de coninut, precum text, imagini, culori, filme, sunete sau alte forme de elemente media. Scrierea i formatarea textului n FrontPage este similar cu utilizarea unui procesor de text standard. Astfel, pentru formatarea fonturilor se utilizeaz Format Font, opiune care cuprinde tipul fontului, stilul i mrimea, culoarea (predefinit sau definit de utilizator), efecte (subliniere, clipire, marcare, etc.) , o fereastr de previzualizare ct i un al doilea tab care cuprinde opiuni pentru spaierea fonturilor. Pentru formatarea paragrafelor se utilizeaz FormatParagraph care permite alinierea, indentarea i spaierea textului din cadrul unui paragraf. Formatarea fonturilor i a paragrafelor se poate face manual (modificarea culorilor, fonturilor, alinierii pentru textul marcat), utiliznd cele dou opiuni, folosindu-se astfel tag-uri HTML standard (b=bold, i=italic, font=tipul fontului, color=culoare in format hexazecimal, de la #000000-negru-, pn la #FFFFFF-alb-, etc.) CSS permite aplicarea formatrii textului i paginii cu avantajul actualizrii automate. Stilurile CSS pot fi stocate fie n document, fie n fiiere externe, mult mai flexibile n acest caz. Dac se ataeaz un fiier CSS extern la mai multe pagini, toate paginile vor reflecta automat modificrile aduse stilurilor din fiierul extern. Pentru accesarea stilurilor CSS se va utiliza Format Style.

Figura 4 - adaugare i modificare stiluri CSS

Pentru stilurile CSS se pot modifica tag-urile de baz ale HTML (h1=Heading 1, h2, p=Paragraf, li=list, etc.) prin crearea de clase pentru tag-uri. Pentru aceste elemente se poate modifica tipul fontului, opiunile la nivel de paragraf, tipul i culoarea bordurii i a umplerii, tipul de numerotare i tipul bulinelor (pentru liste), i poziia elementului fa de text sau n cadrul textului. Cum este i normal, se pot defini i elemente sau clase CSS noi, utiliznd butonul New i opiunea pus la dispoziie de User-defined styles. De exemplu, modificm tag-ul a (hyperlink) pentru ca toate hyperlink-urile s fie de culoare verde, fr nici un efect. Rezultatul este crearea unui stil nou, care poate fi observat att n User-defined styles ct i n fereastra HTML, seciunea Style. Adugm un nou stil CSS, prin redefinirea tag-ului a:hover (efectul obinut prin poziionarea mouse-ul deasupra unui hyperlink), iar n noul tag redefinim de exemplu, att tipul i stilul fontului ct i culoarea acestuia. Rezultatul obinut l putem vedea n fereastra Preview.

Adugarea imaginilor i a altor obiecte

Pe lng text, FrontPage permite adugarea de imagini, fie predefinite din colecia Clipart, fie importate de utilizator din diverse formate de fiiere sau de la scanner sau aparat de fotografiat digital. De asemenea, se pot crea imagini utiliznduse opiunea New Drawing, Autoshape sau WordArt direct n pagina web, acestea urmnd sa fie ulterior salvate n site ntr-un format .gif sau .jpeg. Imaginile se pot organiza i sub form de galerie fotografic, utiliznd opiunea New Photo Gallery. Astfel, primul pas const n adugarea tuturor imaginilor care vor face parte din galerie, setarea unui scurt text care s explice imaginea i setarea dimensiunii imaginilor n miniatur sub form de hyperlink care va conduce la imaginea n forma iniial. Tot aici se mai poate alege i afiare a imaginilor: afiare orizontal, montaj, afiare vertical sau slide show. Pentru imaginile adugate n pagina web se pot defini / modifica i proprietile de afiare ale acestora, printre care: modalitatea de aliniere fa de text, aliniament, grosimea bordurii imaginii, spaierea orizontal i vertical fa de alte obiecte din pagin, mrimea relativ (n procente) sau absolut (n pixeli), un hyperlink i un text (balon) care va aprea la poziionarea mouse-ului deasupra imaginii. Pe lng text i imagini, FrontPage mai permite adugarea i a altor obiecte, utilizd InsertWeb Component:

Figura 5 - alte tipuri de obiecte care se pot adauga in pagina web

Efectele dinamice din FrontPage sunt date de adugarea n pagin a obiectelor de tip Hover Button, Marquee i Banner Ad Manager. Hover Button permite adugarea unui buton cu dou stri normal i onmouseover - pentru care se poate specifica textul butonului, un hyperlink, culoarea strii normale, efectul de animaie n momentul poziionrii mouse-ului deasupra butonului i culoarea utilizat de acest efect. Pentru a putea vizualiza n mod corect acest tip de buton n interiorul unei pagini, browser-ul trebuie s aib instalat suportul pentru Java. Un alt efect dinamic este i Marquee un text care se deruleaz pe ecran, numai orizontal, pentru care se pot specifica mai multe opiuni printre care direcia, viteza, comportamentul, mrimea, numrul de repetri al derulrii, culoarea de fundal a textului, etc.

Bibliografie

Curs Microsoft FrontPage profesor Timofti A.

Reeaua Internet