Dreamweaver de la A la Z

| October 17th, 2008

Dreamweaver  este un generator HTML de tip WYSIWYG (What You See Is What You Get). Aceasta inseamna ca, daca efectuati o modificare pe ecran in interiorul programului, rezultatele acestora vor fi afisate instantaneu. Prin contrast, daca ar fi fost necesar sa scrieti manual liniile de program HTML, ar fi trebuit sa examinati programul in interiorul unui browser Web pentru a vedea rezultatele. Raspunsul imediat al unui mediu de proiectare mobil, precum Dreamweaver, mareste considerabil fluxul activitatii, deoarece puteti vedea imediat, in timpul lucrului, daca va plac sau nu rezultatele obtinute.

HTML cu dus-intors

Dreamweaver a castigat o multime de aprecieri si de clienti loiali, datorita inventiei numite HTML cu dus-intors (in original, round HTML). Acesta va permite sa modificati liniile de program pe care Dreamweaver le scrie in mod automat. Majoritatea celorlalte editoare editoare HTML de tip WYSIWYG actuale nu permit modificarea liniilor de program generate de acestea, deoarece editoarele respective trebuie sa lucreze cu programe scrise  intr-un anumit mod, pentru a putea oferi toate caracteristicile WYSIWYG. Cu alte cuvinte, liniile de cod se deservesc pe ele insele pentru a ajuta programul, nu pentru a crea HTML.
.

Interfata

Alte editoare HTML pe care le-am folosit impun deschiderea a mai multor ferestre si panouri de diferite dimensiuni pentru a obtine accesul la toate caracteristicile. In schimb Dreamweaver foloseste un sistemde panouri si ferstre fixe, care nu-si schimba pozitia, si modifica optiunile de configurare in functie de contextul actiunii intreprinse. Astfel se realizeaza o economie de spatiu pe ecran si se faciliteaza foarte mult procesul de invatare a interfatei.
.

Un tur al interfatei

Caracteristicile oferite de Dreamweaver sunt foarte complexe, dar interfata sa este, in realitate, foarte simpla. Acest program are sase componente principale: bara cu instrumente (Toolbar), bara de lansare a aplicatiilor (Launcher), panoul Objects, fereastra Document, bara Mini Launcher si inspectorul Property.
.

Panoul Objects

Panoul Objects contine randuri cu pictograme de obiecte si este  folosit ca punct de oprire  (cu un clic) pentru numeroase operatii. Daca deplasatti mouse-ul deasupra panoului Objects si luati o scurta pauza, veti vedea ce anume simbolizeaza fiecare pictograma. Puteti modifica aspectul acestui panou din meniul Dreamweaver Preferences, daca doriti sa vedeti si numele abiectelor, in afara pictogramelor sau in locul lor.

Multe articole care se gasesc sub forma de obiecte exista de asemenea sub meniul Insert, situat in bara superioara cu meniuri. Panoul Objects ofera posibilitatea utilizarii unui singur clic de mouse in locul barei cu meniuri respective. In general unii se simnt mai bine cand executa clic pe pictograme, in timp ce altii prefera accesul prin intermediul meniurilor.
.

Tipuri ale panoului Objects

Panou Descriere
Characters Panoul Characters contine entitati de tip caracter frecvent folosite, precum si simboluri, pentru a nu se mai folosi comenzile de la tastatura.
Common Panoul Common contine obiecte folosite cel mai des in Dreamweaver, inclusiv imagini (Images), tabele (Tables), imagini derulante (Rollovers) simple, Insert Fireworks HTML si altele.
Forms Panoul Forms contine toate obiectele esentiale pentru crearea de formulare in pagina Web. Intre aceste obiecte se numara casete de text, butoane, meniuri.
Frames Panoul Frames contine numeroase seturi de cadre predefinite. Cu ajutorul unui clic de mouse puteti adauga oricate seturi de cadre diferite.
Head Panoul Head contine obiecte inserate in eticheta Head a paginii Web. Chiar daca nu sunt vizibile in pagina, pot reprezenta o componenta importanta a paginii respective, deoarece includ etichete META, precum Keywords (cuvinte cheie) si description (descrieri). Multe dintre acestte etichete se folosesc pentru operatii de cautare.
Invisibles Invisibles contine obiecte precum ancorele denumite (Named Anchors), includeri pe parte de server (Server-Side Includes ), spatii indivizibile (Non-Breaking Spaces).
Categoria Special Categoria Special este probabil cea mai rar folosita, dar contine unele obiecte importante, precum manipulantii Java, module plug-in si obiecte ActiveX.

.
Tipuri de obiecte

Similar cu numeroase bare cu instrumente folosite in Dreamweaver, panoul Objects este sensibil la context. In mod prestabilit, acesta afiseaza ceea ce Dreamweaver numeste obiecte de tip Common. Puteti modifica panoul Objects astfel incat acesta sa afiseze si alte categorii de obiecte, atunci cand aveti nevoie de acestea.

Cand mentineti indicatorul mouse-ului deasupra sagetii amplasate in partea de sus a panoului Objects, veti obseva ca aceasta are mentiunea Common, ceea ce inseamna ca in acest moment  vedeti elementele de tip Common din aceasta bara cu instrumente. Pentru ca programul sa afiseze celelalte tipuri de obiecte, executati clic si mentineti apasat butonul mouse-lui pe sageata meniului pop-up. Veti vedea o lista a celorlalte panouri, denumite Characters (caractere), Forms (formulare), Frames (cadre), Head, Invisibles (invizibile) si Special.

.

Inspectorul Property

Similar panoului Objects, inspectorul Property este sensibil la context, ceea ce inseamna ca isi modifica in mod constant continutul in functie de tipul elementului selectat.

Inspectorul Property controleaza numerosi parametri, inclusiv cei pentru text, tabele, aliniere, imagini. Deoarece Dreamweaver insereaza in mod prestabilit o pagina fara continut, unde se gaseste un simbol clipitor pentru inserare de text, inspectorul Property afiseaza in mod prestabilit proprietatile unui text.

Continutul Inspectorului Property se modifica in functie de ceea ce este editat pe ecran. Deoarece aceste elemente se modifica in functie de context.

.

Bara Launcher si Mini-Launcher

Bara Launcher va permite sa obtineti acces la diferite aspecte ale programului Dreamweaver prin intermediul unui singur clic. In esenta de aici sunt lansate regiunile Site (sit), Assets (active), HTML Styles (stiluri HTML), CSS Styles (stiluri CSS), Behaviors (comportari), History (istoric) si Code Inspector (inspector de program) ale interfatei.
.

Amplasare bara Mini-Launcher

Bara Mini-Launcher, situata in partea inferioara a ecranului, functioneaza la fel ca bara Launcher .

Caracteristici ale barelor Launcher si Mini-Launcher

Site Deschide panoul Site, de unde veti controla puternicele caracteristici ale programului Dreamweaver de gestiune a siturilor.
Assets Acest panou va permite sa gestionti activele sitului, precum imaginile, culorile, culorile externe, filmele, scripturile, bibliotecile, sabloanele.
HTML Styles Stilurile HTML sunt similar functional cu foile de stil in cascada (CSS), cu exceptia faptului ca pot fi utilizate cu orice browser, chiar si cu cele vechi.
CSS Styles Stilurile CSS reprezinta o caracteritica avansata a programului Dreamweaver. Acestea permit automat aplicarea unei machete si a unor stiluri de text in mai multe pagini ale sitului.
Behaviors Aceasta caracteristica permite adaugarea de linii de program JavaSript in paginile sitului.
History Panoul History este utilizat pentru coordonarea animatiilor folosind Dynamic HTML.
Cod inspector Inspectorul de cod prezinta locul unde se pot vizualiza liniile de program generate efectiv de Dreamweaver. Se pot vedea programele HTML generate in timp ce se creaza obiecte in pagina.

.
Personalizare barei Launcher

La deschiderea programului Dreamweaver, bara Launcher va contine optiunile prestabilite. Daca descoperti ca nu utilizati frecvent unele optiuni sau ca alte optiuni lipsesc, puteti modifica optiunile ce apara in bara Launcher, cat si in Mini-Launcher, selectand Edit >  Preferences… >  Panels > Show in Lancher. Puteti elimina optiunile existente prin evidentierea lor si executare unui clic pe semnul minus (-). Prin executarea unui clic pe plus (+), va fi afisata o lista cu optiuni care pot fi atasate la ambele bare de lansare.

Ordinea optiunilor selectate poate fi modificata cu usurinta prin evidentierea unei optiuni si executarea unui clic pe sagetile orientate in sus, respectiv in jos.
.

Scurtaturi pentru barele Launcher

Toate caracteristicile barelor Launcher sunt disponibile ca articole sub meniul Window.

De asemenea, scurtaturile cu taste functionale prezentate in continuare sunt valabile atat utilizatorilor de sisteme Mac, cat si pentru cei care folosesc Windows.
.

Bara de instrumente

In acest moment puteti optine acces la numeroase optiuni de care aveti nevoie direct din bara de instrumente, o caracteristica noua in Dreamweaver 4. Bara cu instrumente cotine o serie de butoane si meniuri derulante care va permit executarea unor operatii percum schimbarea modului de vizualizare a documentului, stabilirea titlului paginii, previzualizarea paginii intr-un browser si accesul la noul panou Reference.

Caracteristici ale barei de instrumente
Code view Code view va afisa programul care creeaza pagina noastra. Il putem folosi pentru a edita codul in mod direct si pentru a efectua modificari fara a fi necesara utilizarea unui editor de texte separat, precum BBEdit sau HomeSite. Acest mod de vizualizere este util daca preferam sa scriem programele aferente paginilor sau daca trebuie sa creem sau sa modificam programe personalizate, precum JavaSript, ASP etc.
Code and Design Code and Design va diviza programul in doua parti, unde vor fi afisate atat programul, cat si macheta efectiva a paginii. Acest mod de vizualizare este util daca dorim sa efectuam unele modificari minore si sa vedem imediat efectul acestora asupra paginii.
Design Design este modul prestabilit pentru fereastra document. Acest mod de vizualizare va afisa pagina in modul WYSIWYG, ceea ce inseamna ca veti vedea imaginile, textul si alte componente pe masura ce le inseram in pagina. Acest mod de vizualizare este util daca nu sunteti familiarizat cu HTML sau nu dorim sa tastam toate liniile de program; de asemenea, ne ofera o previzualizare destul de exacta a aspectului paginii intr-un browser, chiar in momentul proiectarii acesteia.
Titlul paginii
Title field Acest camp de text ne permite sa specificam titlul paginii. Textul respectiva aparea in partea superioara a ferestrei browser si este folosit de unele motoare de cautare pentru a descrie listingul sitului. De asemenea, este numele care identifica pagina atunci cand o salvam intr-o lista browser, sub forma unui semn de carte sau a unui sit preferat. Titlul mai poate fi stabilit si in caseta de dialog Page Properties.
Gestiunea fisierelor
File management Acest meniu derulant ne permite sa gestinam fisierele din situl nostru, inclusiv sa incarcam si sa descarcam fisiere, sa le blocam, sa le inseram sau sa le extragem din site si sa lucram cu note de proiectare. Astfel, accesul la aceste optiuni este posibil direct din fereastra document.
Previzualizarea / depanarea in browser
Preview / Debug Acest meniu derulant ne permite sa alegem un browser pentru vizualizarea paginii sau pentru depanarea liniilor de program JavaScript. De asemenea, putem obtine acces la caseta de dialog Define Browsers, care ne permite sa definim browserele noi si sa modificam referintele la browserele existente, care au fost deja definite.
Reimprospatarea modului de vizualizare Design
Refresh Acest buton ne permite sa reimprospatam continutul modului de vizualizare Design. Acest lucru poate fi util daca operam modificari in pagina folosind modul de vizualizare Code si nu vedem imediat efectul acestora.
Referinta
Reference Acest buton ne permite un acces rapid la noul panou Reference din Dreamweaver 4. Butonul este util mai ales in modul de vizualizare Code, unde putem sa evidentiem o portiune de program, sa executam clic pe acest buton si sa facem referire la panoul Reference pentru a primii o explicatie completa a textului selectat. Aceasta constitue o excelenta modalitate de a invata  HTML, CSS si chiar JavaScript.
Navigare in program
Code navigation Aceasta optiune este utilizata realizarii in mod de vizualizare Code si ne permite sa selectam cu rapiditate liniile de program pentru adaugarea de functii JavaScript.
Optiuni de vizualizare
View options Acest meniu derulant ne permite sa controlam mai multe optiuni, care modifica spectul modului de vizualizare Code. Putem impune utilizarea in modul de vizualizare Code a facilitatii de trecere automata pe randul urmator (word wrap), a afisarii numerelor de linii, a colorarii elementelor de sintaxa. Mai putem de asemenea, configura modul de vizualizare Design astfel incat sa se gaseasca deasupra modului de vizualizare Code and Design.
Fereastra Document Fereastra Document este teatrul de desfasurare a tuturor operatiunilor . Aici se asambleaza elementele unei pagini si tot aici se proiecteaza paginile. Fereastra Document este similara, din punct de vedere al aspectului, cu fereastra browserului, atunci cand este vizualizata in Netscape Navigator sau Internet Explorer. La deschiderea aplicatiei, atat pe sistemele Mac cat si in Windows, Dreamweaver va crea un document fara continut si fara titlu (Untitled Document) la fiecare deschidere a aplicatiei. In mod prestabilit, fereastra Document se va afla in modulul de vizualizare Design.
Caracteristicile ferestrei document
Bara de titlu Contine numle paginii Web (De exemplu “Pagina mea Web „) si numele fisierului care contine documentul.
Bara cu instrumente Este o noutate in programul Dreamweaver 4. Aceasta portine a ferestrei document va permite sa modificati rapid titlul paginii si contine butoane si meniuri derulante pentru cateva optini frecvent folosite.
Rigle Puteti selecta sau ascunde riglele selectand View > Rules si activand sau dezactivand optiunea Show.
Selector de etichete Daca selectati elementele vizuale pe ecran, selectorul de etichete evidentiaza liniile de cod HTML corespunzatoare. Este o modalitate rapida si simpla de a selecta diferite articole din pagina.
Dimensiunea ferestrei Acest meniu derulant va permite sa redimensionati fereastra pana la diferite dimensiuni (exprimate in pixeli) predefinite sau personalizate.
Timp de descarcare Aceast meniu indica dimensiunea aproximativa (exprimata in kiloocteti) si timpul de descarcare pentru pagina curenta.
Mini-Launcher Este o versiuni in  miniatura a barei Launcher, care ne ofera acces la diferite caracteristici cheie din cadrul programului Dreamweaver.

.

Modurile de vizualizare in fereastra document

Dreamweaver 4  ofera un nivel superior de control si flexibilitate, exprimat prin posibilitatea de vizualizare a paginilor dumneavoastra intr-unul din cele trei moduride vizualizare diferite, respectiv Code, Code and Design si Design. In mod prestabilit, toate documentele noi se vor deschide in modul de vizualizare Design. Cele trei butoane situate in coltul din stanga-sus al ferestrei document va permit sa comunicati in cele trei moduri de vizualizare diferite.

  • Mod de vizualizare Code
  • Mod de vizualizare Code and Design
  • Mod de Design vizualizare

.

Preferinte

Exista numeroase preferinte (Preferences) pe care le puteti modifica, pentru a transforma Dreamweaver in propriul dumneavoastra editor HTML personalizat. Acesti parametri pot fi modificati in orice moment. Pentru a obtine accesul la caseta de dialog Prefernces selectati Edit > Preferences… Sub categoria General exista parametri care determina  aspectul si modul de functionare a programului Dreamweaver in asamblu.

.

Meniu Preferinte – Editoare externe

Puteti specifica editoarele HTML externe (External HTML Editors). Aceasta inseamna ca se poate specifica un alt editor HTML,precum BBEdit sau HomeSite, pentru editarea codului generat de Dreamweaver. Dreamweaver 4 este livrat cu BBEdit (pentru Mac), repectiv cu HomeSite (Windows), deci aceste doua programe vor fi predefinite ca editoare HTML externe implicite.
.

Dimensiuni predefinite ale ferestrelor

Unul din dezavantajele proiectarii in Web este acela ca aspectul paginii se va modifica in functie de dimensiunile monitorului care o afiseaza. Dreamweaver dispune de o caracteristica utila – si anume optinea Window Sizes (dimensiuni ale ferestrelor) – care contribuie la o proiectere mai precisa pentru o anumita dimensiune a monitorului.
.

Meniu dimensiuni ferestre

Meniul Windows Size ofera o diversitate de dimensiuni predefinite pentru fereastra Document. De exemplu, daca dorim sa proiectam pentru un ecran cu dimensiunile 740 x 420 pixeli, putem selecta aceasta dimemsiune, iar Dreamweaver va modifica automat fereastra Document pentru a reflecta o noua configuratie. Astfel, vom putea vizualiza mai usor paginile in fereastra browser de diferite dimensiuni, dar nu vom modifica fizic dimensiunea ferestrei HTML pentru utilizatorul final, in cazul in care alege aceasta optiune.

536 x 196 (640 x 480, Default)

600 x 300 (640 x 480, Maximized)

760 x 420 (800 x 600, Maximized)

795 x 470 (832 x 624, Maximized)

955 x 600 (1024 x 768, Maximized)

544 x 378 (WebTV)

.

Controlul siturilor

Cei care au mai construit situri Web vor fi de acord ca gestiunea fisierelor este una dintre cele mai mari probleme ale acestui mediu. Gestiunea fisierelor consta din organizarea , structura dosarelor si conventiile de denumire pentru toate paginile si obiectele din site-ul Web.

Putine alte discipline necesita crearea simultana a unui numar atat de mare de documente, deoarece paginile Web sunt alcatuite , de obicei, din numeroase fisiere de text si imagine.

Pentru a reduce dificultatea de a gestiona un numar foarte mare de fisiere, majoritatea dezvoltatorilor isi construiesc siturile Web pe hard-disc, iar dupa ce au terminat incarca aceste fisiere pe un server Web, astfel incat fisierele sa poata fi vizualizate din Internet.

.

Fereastra unui site

Ce este un dosar radacina local?

Dreamweaver foloseste o schema de gestionare a siturilor care impune pastrarea tuturor fisierelor in interiorul unui dosar radacina local principal, pentru a putea reproduce cu usurinta ierarhia de dosare de pe hard – disc atunci cand incarcam fisierele intr-un server Web. Un dosar radacina local este asemanator cu oricare alt dosar de pe hard-disc, cu exceptia faptului ca i-am indicat programului Dreamweaver ca in acest dosar se gasesc toate fisierele HTML si fisierele media aferente sitului.

Un dosar radacina local poate contine multe sub-dosare, dar Dreamweaver nu poate pastra evidenta elementelor daca acestea nu sunt stocate in dosarul radacina local.

.

Definirea unui site

Caracteristica programului Dreamweaver de gestiune ale siturilor va cataloga toate fisierele din cadrul acestui dosar prin construirea unui fisier cache de sit – un mic fisier care contine informatii despre locatia si numele tuturor fisierelor si dosarelor din sit.

Deschidem Dreamweaver si apasam tasta F8 pentru a deschide fereastra Site. Din meniul pop – up, selectam Define Sites… (definire situri). Astfel, se va deschide fereastra Definition.

.

Fereastra Site Definition

In campul Site Name (numele sitului) tastam numele sitului.

.
Gestiunea fisierelor si dosarelor

Din interiorul ferestrei Site a programului Dreamweaver, putem crea dosare si fisiere noi, respectiv le putem muta dintr-un catalog in altul. La executarea acestei operatii, de fapt adaugam dosare si fisiere pe hard – disc. Accesul din interiorul programului Dreamweaver la unitatea de disc este esential pentru operatiile de gestiune a siturilui, deoarece in acest mod Dreamweaver va putea pastra evidenta locatiei unde au fost mutate fisierele sau unde au fost adaugate fisiere noi.

.
Crearea hartii unui sit

Crearea unei harti de sit reprezinta o excelenta modalitate de a examina structura sitului Web, deoarece va permite sa vizualizati diferite niveluri ale sitului Web, precum si elementele componente ale acestor niveluri. Dreamweaver poate crea cu usurinta harti de sit si le poate transforma in fitiere PICT sau JPEG (Mac), respectiv BMP sau PNG (Windows).
.
Harta unui sit in Windows

Din fereastra Site, selectam File > Save Site Map..

.
Legaturi

O caracteristica importanta este Point to File, care va permite sa indicati un fisier in cadrul ferestrei Site si sa creati legaturi pe baza selectiei. Aceasta caracteristica este utila deoarece va obliga sa selectati fisiere plasate numai in interiorul dosarului radacina localal sitului, ceea ce asigura integritatea legaturilor. Pe langa crearea legaturilor cu fisierele HTML , mai puteti folosi Point to File si pentru a selecta noi fisiere imagine si pentru a le inlocui pe cele deja existente.

Un alt tip de lagaturi este legatura de tip posta electronica. Acest tip special de legatura lanseaza programul de e-mail al utilizatorului final si introduce in mod automat adresa destinatarului.

.
Aplicarea stilurilor HTML

Stilurile HTML reprezinta o excelenta modalitate de formatare rapida a textelor dintr-un document. Putem salva atributele specifice de formatare a textelor, pe care le puteti aplica apoi unui text dintr-o pagina sau tuturor textelor dintr-un sit.

Folosind inspectorul Property, putem modifica tipul de litera in Verdana, Arial, Helvetica, sans – serif, dimensiunea (Size) in 4 si culoarea.

.
Stiluri HTML

Name Acesta este numele stilului, care apare in panoul HTML Styles.
Apply to: Selection Daca aceasta optiune este selectata, formatarea va fi aplicata numai textului selectat.

Apply to: Paragraph     Daca aceasta optiune este selectata, formatarea va fi aplicata intregului text delimitat prin etichetele de paragraf  <p>

When applying: Add to Existing Style Daca aceasta optiune este selectata, formatarea va fi adaugata la toate elementele de formatare aplicate in prealabil textului selectat.
When applying: Clear Existing Style Daca aceasta optiune este selectata, formatarea va inlocui toate elementele de formatare aplicate in prealabil textului selectat.
Font Attributes: Font: Aceasta optiune va permite sa specificati tipul de litera folosit in cadrul stilului.
Font Attributes: Size: Aceasta optiune va permite sa specificati dimensiunea tipului de litera folosita in cadrul stilului.
Font Attributes: Color: Aceasta optiune va permite sa specificati culoarea tipului de litera folosita in cadrul stilului. Puteti alege o culoare din paleta sau puteti introduce o valoare hexazecimala.
Font Attributes: Style: Aceasta optiune va permite sa specificati stilurile pentru tipuri de litera (aldin, cusiv, etc).
Paragraph Attributes: Format Disponibila numai daca este selectata optiunea Apply To: Paragraph, aceasta optiune va permite sa alegeti tipuri de formatare precum heading1, Paragraph.
Paragraph Attributes: Alignment Disponibila numai daca este selectata optiunea Apply To: Paragraph, aceasta optiune va permite sa alegeti tipuri de aliniere aferente stilului.

.
Tabele

Tabele HTML au fost introduse in versiunea 1.2 a browserului Netscape Navigator ca modalitate de a afisa si organiza diagrame si date. Tabelele erau folosite in programe de calcul financiar sau in foi de calcul tabelar pentru baze de date, deoarece furnizau coloane si randuri definite. Inginerii HTML care au creat tabelele pentru Web nu au anticipat faptul ca toti dezvoltatorii vor folosii tabele pentru alinierea imaginilor, nu numai pentru afisarea textelor si a valorilor numerice.

Acest capitol prezinta modul de creare a tabelelor personalizate, de inserare a randurilor si a coloanelor, de creare a propriilor scheme de culori, precum si de executare a operatiilor de formatare si sortare. Tabelele reprezinta un element esential in „caseta” cu instrumente de proiectare in Web, iar Dreamweaver asigura un control strict asupra acestora si pune la dispozitie tehnici de manipulare avansata.


Ce este un tabel?

Un tabel este o caracteristica extrem de flexibila a mediului HTML. Tabelele pot fi utilizate pentru organizarea datelor sau pozitionarea imaginilor. Un tabel este compus dintr-o combinatie de etichete HTML.

.
Sortarea tabelelor

In versiunea 2.0 a programului Dreamweaver, firma Macromedia a introdus caracteristica de sortare numerica si alfabetica a tabelelor. Anterior implementarii acestei caracteristici , era necesara copierea  si lipirea manuala a fiecarui tabel. In prezent sortarea tabelelor in Dreamweaver se realizeaza folosind o simpla caseta de dialog.

.
Meniu sortare tabele

Caseta de dialog Sort Table

Caseta de dialog Sort Table dispune de o diversitate de optiuni care va ajuta sa modificti aspectul tabelelor. O explicatie a tuturor caracteristicilor acestei casete de dialog este data in tabelul urmator:

.
Caracteristici de sortare

Sort By (criteriu de sortare) Aceasta optiune se foloseste pentru a selecta coloana pe care doriti sa o folositi pentru sortarea tabelului.
Order (ordine) Aceste doua meniuri derulante se folosesc pentru a alege intre optiunile Alphabetically (in ordine alfabetica) si Numerically (in ordine numerica), respectiv intre Ascending (in ordine crescatoare) sau Descending (in ordine descrescatoare).
Then By (urmatorul criteriu de sortare) Folosim aceasta optiune pentru a sorta mai multe coloane in tabel.
Options: Sort Includes

(optiuni: sortarea include )

Daca aceasta caseta este validata, va fi sortat primul rand al tabelului. In mod prestabilit, optiunea este deselectata, deoarece primul rand este aproape intotdeuna folosit ca antet al tabelului.
Options: Keep TR Attributes

(optiuni: pastrarea atributelor randurilor din tabel)

Daca aceasta caseta este validata si un rand isi schimba pozitia in urma procesului de sortare, toate atributele randului isi vor modifica pozitia. In HTML, < tr > este abrevierea de la Table Row (rand de tabel).

.
Modificarea schemei de culori

In lista operatiilor necesare construirii unui tabel, urmatoarea este aplicarea culorilor ca element de formatare .

Daca din meniul derulant se alege o optine se va observa ca tabelul din mijloc isi va schimba culorile atunci cand se executa clic pe diferite scheme de formatare.
Crearea si modificarea unui tabel

Aceasta optiune ne va ajuta sa descoperim numeroasele optiuni aferente lucrului cu tabelele. Pentru a crea un tabel vom avea nevoie de o combinatie intre obiectul Insert Table, meniul Modify > Table si inspectorul Property.

Cu ajutorul lui Insert Table se pot controla cu precizie alinierea tabelelor. Se utilizeaza tabele cu dimensiune fixa, care pot fi exprimate in doua feluri in pixeli si in procente.

.
Cadre

Un cadru este o pagina HTML situata an cadrul altei pagini HTML. Sa presupunem ca am creat o imagine care se afla in partea inferioara a unei pagini HTML.Daca situl nostru contine o suta de pagini si am vrea sa plasam aceeasi imagine la baza fiecareia dintre aceste pagini, ar fi necesar sa intersectam imaginea respectiva de o suta de ori, in fiecare din cele o suta de pagini individuale.

Cadrele permit reutilizarea unei singure pagini HTML prin imbricarea sa intr-un alt document HTML (cunoscut si sub numele de set de cadre). Astfel, este posibila crearea imaginii respective la baza unei pagini HTML o singura data, dar si incarcarea imaginii in alte o suta de pagini HTML.

Dreamweaver Tutorial:

.

Sursa de informare: www.documentareonline.com

.

Comments are closed.