Disseny d’una eina interactiva de suport a l’assignatura d...

Disseny d’una eina interactiva de suport a l’assignaturad’Introducció als Sistemes Digitals

AUTOR: Sergio Fernández Capdevila . DIRECTOR: Xavier Correig Blanchar.

DATA: setembre / 2001.

Universitat Rovira i Virgili Índex

Memòria Descriptiva

Pàg.

1.- Introducció 1

2.- Memòria Descriptiva 2

2.1.- Objecte del projecte 2

2.2.- Titular 2

2.3.- Destinataris 2

2.4.- Antecedents 3

3.- Temari d’Introducció als Sistemes Digitals 4

3.1.- Objectius de l’assignatura 4

3.2.- Programa de l’assignatura 4

4.- Aplicació Web 6

4.1.- Introducció 6

4.2.- Requeriments mínims 6

4.3.- Manual d’aplicació 7

4.3.1.- Introducció 7

4.3.2.- Navegar per l’eina 7

5.- Consideracions finals 27


Memòria de Càlcul

Pàg.

1.- Introducció 29

2.- Pàgina Web 30

2.1.- Elements Pàgina Web 30

2.2.- Interactivitat 30

2.3.- Disseny eficient 30

2.3.1.- Definir objectius del lloc 31

2.3.2.- Definir l’estructura de les pàgines 31

2.3.3.- Definir la interacció de l’usuari 31

2.3.4.- Dissenyar l’interface gràfica 31

2.4.- Conclusió 32

3.- Hardware i materials utilitzats 33

4.- Software utilitzat 34

5.- Estructuració i disseny de les pàgines 37

6.- Esquema de la Web (Mapa Web) 45

Pressupost

1.- Consideracions inicials 46

2.- Pressupost 47

2.1.- Preus unitaris 47

2.2.- Descomposició de partides 48

2.3.- Amidaments 54

2.4.- Aplicació de preus 55

2.5.- Resum del pressupost 57


Plec de condicions

Pàg.

1.- Introducció 58

2.- Condicions Generals 58

3.- Condicions Econòmiques 58

4.- Condicions Tècniques 59

5.- Condicions Facultatives 59

Bibliografia 64

Universitat Rovira i Virgili Memòria Descriptiva

1

1. Introducció

La utilització de tecnologies de la informació i de la

comunicació en l’educació permet l’emergència de nous models

educatius en coexistència amb els clàssics.

És imprescindible introduir les noves tecnologies dins el marc

de l’ensenyament, i més en el cas de tractar-se d’una carrera tècnica

com és la nostra.

Aquest projecte permet complementar a l’assignatura

Introducció als Sistemes Digitals, la qual s’imparteix al primer curs

d’Enginyeria Tècnica Industrial: Electrònica Industrial de l’Escola

Tècnica Superior d’Enginyeria de la Universitat Rovira i Virgili, amb

l’aportació de l’ordinador com a eina operativa dintre del binomi

ensenyament-aprenentatge. Es pretén introduir un nou enfocament

tecnològic en la formació acadèmica. Es tracta d’una eina interactiva

que no pretén reemplaçar al professor si no assistir-lo i complementar-

lo en la seva pràctica docent.

Aquesta eina s’ha dissenyat amb l’objectiu de motivar a

l’alumne i provocar el seu interès i curiositat, així com millorar el

rendiment acadèmic i ajudar-los a construir els seus propis

coneixements i relacionar estretament teoria i pràctica., en definitiva,

donar als alumnes una eina de treball complementària a les classes i al

material escrit.


2

2. Memòria Descriptiva

2.1 Objecte del projecte

El projecte és una aplicació web composta pels apunts de

l’assignatura d’Introducció als Sistemes Digitals més un conjunt

d’exemples resolts i d’informació complementària, a més de la

possibilitat d’autoavaluar els coneixements adquirits a partir de la

realització d’un test compost per exercicis teòrico-pràctics de

l’assignatura. Amb tot això és pretén donar una ajuda addicional als

estudiants de primer curs en el moment de cursar l’assignatura.

L’aplicació estarà disponible en CD-ROM però en un futur formarà

part d’un portal interactiu basat en la mateixa assignatura, per tant

formarà part de la World Wide Web.

2.2 Titular

El titular del projecte és la URV (Universitat Rovira i Virgili),

assessorat pel DEEEA (Departament d’Enginyeria Electrònica,

Elèctrica i Automàtica). Amb adreça:

Escola Tècnica Superior d’EnginyeriaAutovia de Salou, s/n (Complex Educatiu)

43006- TARRAGONA

2.3 Destinataris

Aquest projecte va adreçat principalment als estudiants de

primer curs de l’assignatura d’Introducció als Sistemes Digitals, a més

de qualsevol persona de l’ETSE que vulgui adquirir nous coneixements


3

sobre aquesta assignatura o a qualsevol persona que necessiti assimilar

coneixements sobre ella.

2.4 Antecedents

El que es pretén amb aquest treball és el d’oferir una informació

necessària per al seguiment de l’assignatura d’Introducció als Sistemes

Digitals mitjançant una eina interactiva i versàtil com és aquesta

aplicació Web. Hem d’entendre aquest treball com un suport més a

l’assignatura que no pretén substituir la seva formació acadèmica ni

eliminar la figura del professor, si no complementar-la, utilitzant un

medi que permeti la seva consulta des de qualsevol lloc i a qualsevol

hora, intentant donar una sèrie d’exemples que aclareixen els punts més

conflictius de l’assignatura.


4

3. Temari Introducció als Sistemes Digitals

3.1 Objectius de l’assignatura

- Analitzar i dissenyar circuits lògics combinacionals i

seqüencials.

- Conèixer les alternatives de disseny en circuits digitals.

- Conèixer les eines emprades en disseny digital.

3.2 Programa de l’assignatura

I- Introducció als Sistemes Digitals. Sistemes Electrònics Digital.

Definicions. Sistemes combinacionals vs. seqüencials. Fites

històriques.

II- Sistemes de numeració i codis binaris. Sistemes de numeració:

binari, octal i hexadecimal. Canvi entre sistemes de numeració.

Codificació. Concepte de codi. Codificació de nombres enters. Codis

alfanumèrics. Detecció d’errors. Codificació de nombres decimals.

Aritmètica binària. Suma i resta en binari. Aritmètica complementària.

BCD. Suma en coma flotant.

III- Lògica combinacional. L’interruptor. Funcions lògiques.

Formes de representació (taula de veritat, Karnauhg). Funcions d’una

variable. Portes lògiques. Funcions de n variables. Funcions

incompletament especificades. Àlgebra de Boole. Representació

algebraica de funcions. Simplificació. Formes canòniques. Maxterms i

minterms. Formes conjuntiva i disjuntiva. Teorema de Shannon. Grup

complet d’operacions. Minimització de funcions. Mètode de


5

Karnaugh. Minimització de funcions incompletament especificades.

Altres mètodes. Síntesi combinacional. Disseny amb AND, OR, NOT,

NAND o NOR. Disseny amb xarxes modulars. Atzars en circuits

combinacionals.

IV- Blocs combinacionals. Codificadors i decodificadors.

Multiplexors i desmultiplexors. Blocs aritmètics. Dispositius lògics

programables. Disseny amb ROM. Disseny amb PAL i PLA.

V- Sistemes seqüencials. Introducció. Concepte d’estat. Màquina

d’estats finits. Especificació basada en l’estat: formes de representació.

Forma canònica d’un sistema seqüencial (Mealy, Moore). Sistemes

sincrons. Comportament temporal d’un SSS. Elements de memòria.

Definició i caracterització de biestables. Biestables SR, JK, D i T.

Sistemes seqüencials sincrons i asincrons.

VI- Disseny de sistemes seqüencials sincrons. Disseny canònic.

Mètodes generals d’anàlisi i síntesi de SSS. Minimització d’estats.

Equivalència. Mètodes de minimització. Codificació d’estats.

VII- Mòduls seqüencials. Registres: d’estat, de desplaçament.

Disseny d’un SS amb registres de desplaçament. Comptadors.

Aplicacions. Disseny amb estructures programades

Nota: Dins el marc d’aquest projecte s’implementen els temes I II III i IVcorresponents a la part combinacional de l’assignatura. La part seqüencialcomposta pels temes V VI i VII s’estan implementant en un altre projecte.


6

4. Aplicació Web

4.1. Introducció

Aquesta aplicació Web ha estat pensada per poder ser una ajuda

per assolir els coneixements que s’imparteixen a l’assignatura

d’Introducció als Sistemes Digitals. Podríem considerar-ho com una

classe virtual, en la que per una banda tenim els apunts de l’assignatura

més una sèrie d’exemples resolts i materials i conceptes

complementaris i per una altra tenim un mètode d’autoavaluació on

l’alumne pot veure si realment ha assolit els coneixements de

l’assignatura que consta d’un conjunt de preguntes tipus test que es

resolen directament a la pantalla.

4.2. Requeriments mínims

És necessari el següent equip hardware i software per executar

l’eina interactiva:

PC compatible amb 32 Mb. de RAMLector de CD-ROMSistema operatiu Windows 95 o superiorA més de 20 Mb. d’espai en disc disponibleMonitor en color.

Com en un futur l’eina estarà albergada al servidor de la

universitat seria necessari un modem de 56Kb. o superior, a més d’un

navegador i una connexió a Internet per a poder activar la pàgina

directament des d‘Internet.

La configuració recomanada per veure tots els recursos que

ofereix l’aplicació és d’un monitor en color de 17” amb una resolució


7

de pantalla de 1024 x 768 píxels i utilitzar com a navegador l’Internet

Explorer 5.0 o superior. Sota aquesta configuració els resultats

obtinguts arriben al 100% dels recursos de l’aplicació.

4.3. Manual d’Aplicació

4.3.1. Introducció

Aquest projecte és una eina interactiva de suport a l’assignatura

d’Introducció als Sistemes Digitals, creada en format de pàgines Web.

Es pretén que de forma dinàmica i interactiva l’alumne assoleixi els

coneixements necessaris sobre l’assignatura. La seva finalitat és poder

consultar i ampliar els coneixements que es donen a classe amb altres

recursos.

4.3.2. Navegar per l’eina

Un cop hem introduït el CD-ROM al nostre ordinador, ens

apareix una pàgina com la següent:


8

Figura 1. Pàgina d’Inici

Es tractar de la pàgina d’inici , on s’ens indica que la resolució

òptima per a veure la pàgina es de 1024 x 768 i que si volem veure la

pantalla completa hem de polsar F11. Si fem click a sobre del xip on

posar ‘Entrar’ accedirem a l’Índex.

Un cop hem entrat, veiem una pàgina on se’ns presenta el

programa de l’assignatura, com veurem a continuació:


9

Figura 2. Programa de l’assignatura

A partir d’aquesta pàgina podem accedir a qualsevol altra de la

Web. Si passem el ratolí per a sobre d’algun dels títols dels capítols,

veurem com la lletra augmenta de tamany, això ens indica que ens

trobem damunt d’un hipervincle, i si cliquem al damunt, accedirem al

Tema seleccionat. Al final de la pàgina, ens trobem amb dos botons, un

per a veure la bibliografia recomanada per l’assignatura i un altre per a

comunicar-nos amb el professor de la mateixa, via correu electrònic,

omplin un petit formulari.


10

Figura 3. Botons Bibliografia i Contactes

Figura 4. Pàgina de contactes


11

Si hem pres un dels títols dels temes de l’Índex anirem a la

pàgina principal del Tema que haguem pitjat. Qualsevol dels temes que

s’escullin per a visitar un format idèntic, trobarem la pàgina dividida en

dos marcs, un més petit a la part de dalt amb un menú i tota la resta de

la pàgina que ens mostrarà els apunts, l’informació complementaria i

els test de l’assignatura, si es per exemple el Tema I apareixerà la

següent pantalla:

Figura 5. Vista completa pàgina principal del Tema I

On ens apareix un menú principal a la part de dalt de la pantalla,

amb el títol del Tema i a sota, tots els temes que formen l’assignatura,

que ens permeten moure’ns per tota la Web. S’observa com els temes

van canviant de color a mesura que desplacem el ratolí per sobre d’ells.

Si pitgem amb el ratolí qualsevol dels temes anirem al seleccionat.


12

Figura 6: Vista amb detall del marc superior (Menú)

A la part inferior de la pantalla, tenim un Índex amb els

diferents subapartats que formen el Tema, si fem click a sobre d’algun

d’ells, ens portaran al lloc que haguem seleccionat després se’ns

mostren els coneixements a assolir.

Si anem baixant podem trobar una figura amb un requadre blau,

el que ens indica que estem al damunt d’un Mapa sensible, al passar el

ratolí per sobre veurem que hi ha certes parts que fan que el ratolí

canvií de forma, això ens indicarà que si fem click entrarem en un altra

pàgina amb coneixements complementaris.

Figura 7. Mapa sensible


13

Figura 8. Conversió (A/D) Figura 9. Conversió (D/A)

Com podem veure a les Figures 8 i 9 si fem clic a sobre del

Mapa sensible, accedim a una pàgina on se’ns expliquen uns conceptes

bàsics sobre la conversió Analògica/Digital i Digital/Analògica. Per a

tornar al punt on ho havíem deixat, només hem de prémer el boto de

pàgina enrera del Navegador.

Figura 10. Barra del Navegador

També ens podem trobar amb el cas que al seleccionar un

hipervincle ens aparegui una pantalla com la següent que ens digui que

estem apunt de descarregar un arxiu, ens faran la següent pregunta,

¿que desea hacer con este archivo? tenim dos opcions:


14

Figura 11. Descarrega d’arxius executables

1- Ejecutar este programa desde Internet

2- Guardar este programa en disco

Si escollim l’opció 1,el programa s’executarà dins del

navegador, ens apareixerà un altre quadre d’avís, que ens preguntarà

¿Desea instalar y ejecutar “ascii.exe de D:\Tema_2”? hem de dir-l’hi

que Sí. En canvi si escollim l’opció 2, el programa el tindrem al nostre

disc dur, apareixerà una pantalla on podrem escollir el lloc on guardar

l’arxiu, i el podrem executar sempre que ho desitgem.

En el transcurs dels temes, ens trobem amb una sèrie de botons,

que ens serveixen, per ampliar els coneixements sobre parts importants

de l’assignatura, així com per accedir al resum del tema o als test

d’autoavaluació. A continuació veurem un exemple de cadascun

d’aquests botons activables.


15

Figura 12. Boto activable ‘Voleu saber més?’

En el cas de prémer aquest botó, saltarem a un altra pàgina on

se’ns parlarà més àmpliament del tema al qual està fent referència el

botó. Normalment, a part de tenir una explicació més exhaustiva,

també i trobarem algun exemple resolt, que ens ajudarà a comprendre

millor l’apartat en qüestió.


16

Figura 13. Aritmètica binària

En aquest cas veiem com l’exemple el tenim a la dreta de la

pantalla, per poder-lo visualitzar només hem de clicar a sobre d’ell, i

veurem com apareix, a continuació es mostra la mateixa pàgina una

vegada accedit a l’exemple.


17

Figura 14. Exemple d’aritmètica binària

Per a tornar a la part del Tema, on ho havíem deixat, només

hem de prémer el botó de pàgina enrera del Navegador com ja havíem

comentat abans.

Figura 15. Barra del Navegador

Un altre tipus de botó activable és el següent:


18

Figura 16. Boto activable ‘Exemples’

Si fem clic damunt del botó passarem a un altra pantalla, amb els

corresponents exemples que a continuació mostrem.

Figura 17. Exemples

Podem veure la pantalla d’exemples, que en aquest cas concret,

formen part del Tema III a l’apartat de l’àlgebra de Boole, es tracta de


19

simplificar l’equació fins al mínim terme possible, es dóna

l’oportunitat a l’alumne per a que abans de veure la solució, provi de

resoldre per ell mateix l’exercici, i desprès comprovi si la solució a la

qual ha arribat es correcta o no. Per fer-ho simplement haurà de fer clic

sobre la solució i veurà el resultat amb els passos a seguir com

seguidament veurem.

Figura 18. Solució exemples

Per a tornar a la part del Tema, on ho havíem deixat, només

hem de prémer el boto de pàgina enrera del Navegador, en aquest cas

per tornar a la pàgina anterior farem un clic, i per tornar a la part del

Tema on ens havíem quedat farem 2 clics.

Per fer encara més visual aquesta aplicació, s’han introduït una

sèrie de pel·lícules flash on de forma més amplia, s’intenta aprofundir


20

sobre la minimització de funcions a partir dels diagrames de Karnaugh.

En concret consta de quatre pel·lícules, com es mostra a continuació:

Figura 19. Botons per accedir a les pel·lícules flash

Si per exemple volem accedir a la primera de les pel·lícules,

simplement hem de fer un clic a sobre del botó on posa Karnaugh 1 i

accedirem a l’instant. Ens donarem compte que la part inferior de la

pantalla canvia d’aspecte com seguidament veurem i comença una

extensa explicació sobre els Mapes de Karnaugh com a mètode

sistemàtic de simplificació de funcions, com es formen els mapes de 3 i

4 variables, l’adjacència de cel·les, etc.


21

Figura 20. Karnaugh 1 en format flash.

Per a tornar a la part del Tema, on ho havíem deixat, i poder

veure qualsevol de les pel·lícules simplement hem de prémer el botó de

pàgina enrera del Navegador com ja havíem comentat abans.

El boto Karnaugh 2 ens mostra com es realitza la minimització en

forma de suma de productes, mitjançant un mapa de tres variables, amb

un exemple resolt.

El boto Karnaugh 3 també ens mostra com es realitza la

minimització de funcions en forma de suma de productes, mitjançant

un exemple resolt amb un mapa de quatre variables.

Per últim el botó Karnaugh 4 ens dóna accés a l’última de les

pel·lícules on s’explica el procés de simplificació mitjançant el mapa

de Karnaugh en forma de producte de sumes, amb un exemple resolt de

d’un mapa de quatre variables.


22

Un altre tipus de botons que apareixen a l’aplicació són els que

ens donen accés als resums dels temes o als diferents test

d’autoavaluació, que poden trobar al final de cada tema i que

apareixem a continuació.

Figura 21. Botó de Resum i botó de TEST d'Avaluació

Si el que volem és accedir al Resum del Tema, el que farem és

picar amb el ratolí a sobre del botó de Resum, i al moment apareixerà

una pantalla on breument, es comenten els punts més importants del

Tema, i a partir de paraules clau, podem accedir directament a la part

d’aquest que no tinguem gaire clar. Seguidament veurem com ens

quedaria la pantalla.


23

Figura 22. Pantalla Resum Tema IV

Com podem observar, les paraules clau apareixem amb color blau

i subratllades, la qual cosa ens indica que si fem un clic a sobre

d’alguna d’elles, ens portarà directament a través d’un hipervincle a la

part del Tema que nosaltres haguem seleccionat.

En el cas que vulguem accedir al TEST d’Avaluació,

seleccionarem el botó de TEST d’Avaluació, ens apareixerà una

pantalla amb les diferents preguntes de Test com es mostra a

continuació.


24

Figura 23. Test d’avaluació

Com podem veure tenim la pregunta amb les diferents respostes,

i a més a més, tenim 2 botons un d’Ajuda i un altre de Solució.

Aquests test estan pensats per a que l’alumne pugui veure el nivell de

coneixements que ha assolit a mesura que ha anat estudiant el tema.

Per la qual cosa primer de tot hauria de llegir la pregunta i en el cas de

no saber la resposta polsar el botó d’ajuda que el portarà als apunts de

l’assignatura corresponents a aquella pregunta en concret. Una vegada

ja pensa que té clar quina pot ser la resposta, pot fer clic damunt de la

possible resposta, i aquesta ens informarà si la seleccionada és correcta

o no.


25

Figura 24. Selecció de la resposta equivocada.

Si seleccionem la resposta equivocada el botó canviarà i es ficarà

amb un fons vermell amb una mà que ens indica que aquella no és la

resposta correcta, en canvi si seleccionem la resposta correcta

apareixerà el botó amb un fons verd i una mà que ens indica que hem

encertat la pregunta, com veiem seguidament.

Figura 25. Selecció de la resposta correcta.


26

Per a veure la Solució de la pregunta, farem clic damunt del botó

de solució i ens apareixerà una pantalla amb la solució de la pregunta

amb els passos a seguir per arribar al resultat final.

Figura 26. Solució a la pregunta test

Per tornar a la pàgina anterior i continuant resolent el test,

només hem de pitjar el botó de pàgina enrera del Navegador com ja

hem comentat en diverses ocasions. Com es pot observar als Test

d’avaluació, tenim la possibilitat d’accedir a qualsevol tema de

l’assignatura, ja que a la part superior de la pantalla sempre apareix un

menú amb els diferents temes que formen l’assignatura.


27

5. Consideracions finals

La utilització d’aquesta aplicació informàtica permet comprovar

que les noves tecnologies aplicades a la docència en l’àmbit universitari

suposen noves opcions en el procés de l’ensenyament i l’aprenentatge.

L’aplicació consta del conjunt dels apunts de l’assignatura

d’Introducció als Sistemes Digitals i ha estat pensada i elaborada com

una eina que faciliti a l’alumne el seguiment i la comprensió de

l’assignatura.

En tot procés d’aprenentatge és important poder realitzar

exercicis de comprovació dels coneixements adquirits. Per això s’han

incorporat al final de cada tema una sèrie de tests d’autoavaluació

interactius que es componen de preguntes amb respostes immediates

que són de gran eficàcia didàctica. Aquestes preguntes ens plantegen

diversos problemes on tenim també la possibilitat d’accedir a una ajuda

per tal de resoldre’ls.

El mètode de navegació és molt intuïtiu i permet que no faci

falta tenir grans coneixements de com funciona un navegador per veure

perfectament com funciona l’aplicació.

Gràcies a l’ampli ventall de possibilitats que ens ofereix el

disseny gràfic hem elaborat un projecte molt atractiu basat en fons de

pantalla amb dibuixos relacionats amb l’assignatura, colors, imatges

interactives, pel·lícules flash, que intenten motivar a l’alumne a l’hora

d’estudiar l’assignatura.


28

Aquest projecte queda obert a qualsevol mena d’ampliació,

modificació, canvi o revisió que es necessiti dur a terme. També queda

obert a tota mena d’opinions, i serà molt important que l’alumne o

l’usuari doni la seva opinió respecte al disseny, presentació,

desenvolupament dels continguts, comprensió dels textos, etc.

Sergio Fernández Capdevila

Enginyer Tècnic Industrial

Tarragona, setembre 2001

Universitat Rovira i Virgili Memòria de Càlcul

29

1. Introducció

En aquest apartat mostrarem els processos i les eines que hem fet

servir per al desenvolupament d’aquest projecte i donarem una breu

explicació de perquè s’ha escollit el format Web per dur a terme aquest

projecte.

Un dels motius fonamentals, per al qual s’ha escollit el format

Web, és que dóna una facilitat de creació de llocs interactius i la

possibilitat de posar-ho a internet en un futur pròxim, ja que permet

obtenir informació dels més variats temes i sense moure’s de casa, la

informació disponible a internet és gairebé il·limitada i augmenta cada

dia. Al tenir un format Web ens permet accedir de forma simple i

intuïtiva a tota aquesta informació.

El format Web és un sistema que facilita l’accés a diferents

recursos que ofereix internet a través d’una interface comuna basada en

l’hipertext, que a través d’un navegador ens permet accedir a qualsevol

part del document.


30

2. Pàgina Web

L’element bàsic de la Web és la pàgina Web, un document que

conté enllaços d’hipertext a altres documents relacionats. El protocol de

la Web especifica un format per escriure els documents que formen part

d’ella: el Hypertext Markup Language (HTML).

2.1 Elements de la Pàgina Web

Dins d’una pàgina Web podem col·locar diferents tipus

d’elements, els més habituals són:

• Text• Imatge• Animacions• Àudio i Vídeo• Mapes sensibles• Programes• Enllaços

2.2 Interactivitat

La interactivitat és un aspecte fonamental en el disseny de pàgines

Web. L’anomenat HTML dinàmic basat en l’ús de petits programes

anomenats scripts (guions) ens proporciona la possibilitat d’interactuar

amb l’aplicació. Un script executa una acció sobre un element de la

pàgina quan es produeix un determinat fet sobre aquest element.

2.3 Disseny eficient

És molt important realitzar una bona planificació abans de

començar a crear una pàgina Web. Crear una pàgina Web no consisteix

simplement en recopilar una sèrie de textos, imatges, sons, etc., i anant-


31

los inserint a la pàgina si no que comporta la realització d’activitats

prèvies.

Fases del disseny:

2.3.1 Definir objectius del lloc

És a dir, respondre a les següents preguntes “a qui va dirigida

aquesta Web?”, “què volem oferir als nostres visitants?” hem de

determinar els continguts del lloc, tant en el fons (en el nostre cas els

apunts de l’assignatura més una sèrie d’informacions complementàries

i uns tests d’autoavaluació) com en la forma (text interactiu, pel·lícules

flash, etc.)

2.3.2 Definir l’estructura de les pàgines

La informació que es va publicar en el lloc s’estructura en pàgines

independents connectades entres sí. Nosaltres comencem amb una

pàgina d’inici a partir de la qual entrem a l’índex que el podríem

anomenar com a pàgina arrel del nostre lloc, a partir de la qual podem

accedir als diferents temes de l’assignatura.

2.3.3 Definir la interacció amb l’usuari

Es tracta de dissenyar un mecanisme de navegació que permeti al

visitant desplaçar-se còmodament per les pàgines. Per això en tot

moment l’usuari de l’aplicació té la possibilitat d’accedir a l’índex com

a cada un dels temes de l’assignatura des de qualsevol de les pàgines

que conformen la nostra eina interactiva.

2.3.4 Dissenyar l’interface gràfica

Dissenyar l’aspecte visual del nostre lloc triant un estil global de

disseny i utilitzant estratègies visuals sutils per crear imatges que

comuniquin informació sobre el nostre lloc. Hem optat per un codi de


32

colors per diferenciar cada un del temes, i nombrosos fons de pantalla

relacionats amb el tema de l’assignatura, així com un marc general

continu que ens dóna la sensació d’estar llegint un llibre.

2.4 Conclusió

Per a poder dur a terme la creació d’una Website (lloc Web)

s’utilitzen una sèrie d’eines auxiliars com són els programes de disseny

gràfic, esmentats a la memòria descriptiva, per a la creació i tractament

digital d’imatges i fotografies. Programes d’animació per a crear

pel·lícules animades com el Macromedia Flash. I per a realitzar

l’estructura bàsica i les diferents pàgines que la formen s’utilitza el

programa FrontPage 2000.


33

3. Hardware i materials utilitzats

Ordinador:PC compatibleCPU Intel Pentium III 800 MHz.Placa mare ASUSMemòria SDRAM 128 Mb.Disc dur de 20 Gb.Tarja de vídeo SVGA RIVA TNT2 32 Mb.Disquetera 3,5” 1,44MbDVD-ROM 12x LGMonitor color KDS 19”

Gravadora:HP cd-writer 9350iVelocitat 10x 4x 32x

Modem:3 Com U.S. Robotics 56K Faxmodem

Escaner:Tipus pla DIN-A 4Resolució 400 d.p.i.Qualitat de color de 30 bits i blanc i negre

Impressora:

Materials:Disquets de 1,44 Mb.CD-ROM gravables i reprovablesFungibles (paper, cartutxos de tinta, etc.)


34

4. Software utilitzat

•• Microsoft Windows Millenium Edition

Sistema operatiu

• Microsoft FrontPage 2000

MS Frontpage 2000 és l’eina de creació i administració de llocs

Web a Internet o Intranet, que s’ha triat per l’aplicació. Ens permetrà

desenvolupar totes les fases del procés, des de la creació inicial fins la

publicació final de la Web, amb un sistema relativament fàcil d’utilitzar

i molt còmode, sense haver de canviar d’aplicació.

Frontpage inclou l’Explorador de FrontPage que permet crear,

dissenyar i administrar el conjunt d’un lloc Web, i l’Editor de

FrontPage, on es pot crear i modificar planes Web.

• Microsoft Internet Explorer

Navegador molt potent que permet veure informació en Internet o

en una Intranet d’una empresa. Amb Internet Explorer també es pot

veure els documents que s’hagin creat per utilitzar els entorns Web,

així com arxius HTML (HyperText Markup Language, és a dir,

Llenguatge de Marques de HiperText).

• Microsoft Word 2000

Processador de textos avançat que permet escriure, editar i

imprimir documents d’una manera professional. L’apariència del text

es pot controlar canviant la font, l’estil i tamany dels caràcters.

Posseeix eines d’ortografia i gramàtica, a més es poden incorporar

elements gràfics als textos.


35

•• Macromedia Flash 5

Flash es el software de creació més avançat per a crear animació

interactiva escalable per a la Web, tant per crear logotips animats,

controls de navegació de llocs Web, animacions de gran format o

Website complets de flash.

•• Corel Draw 9

Programa de disseny gràfic per a dibuix, il·lustracions, text,

vectorització, separació de colors i efectes especials.

•• Adobe Photoshop 5

És un programa d’edició d’imatges que permet crear i produir

imatges digitals d’alta qualitat. Permet manipular fotografies i

diapositives capturades amb l’escaner. El programa combina un

complet rang d’eines per a corregir el color i capacitats d’efecte

especials que permeten modificar imatges .

•• Microsoft Paintbrush(Millenium Edition)

Aquest programa ens permet crear i modificar fitxers en format

bitmap (mapa de bits) i permet convertir aquests fitxers a format .gif o

.jpeg. És una eina estandar en Windows Millenium Edition per a la

gestió d’imatges gràfiques.

•• MGI PhotoSuite 8.05

Un altre programa de creació i manipulació d’imatges que permet

manipular i millorar fotografies i la possibilitat de crear collage. Dóna

la possibilitat de treballar amb capes, permet alterar, restaurar, ajustar el

tamany i utilitzar efectes especials de modificació de color, contrast i

il·luminació.


36

•• HP CD Writer

Un software de gravació d’arxius en CD-ROM, a partir del qual

s’ha pogut crear el CD interactiu per a l’assignatura d’Introducció als

Sistemes Digitals


37

5. Estructuració i disseny de les pàgines.

Per tal de fer una aplicació que fos fàcil d’utilitzar, intuïtiva,

agradable i que a més a més ens servís per adquirir o millorar els

coneixements sobre l’assignatura d’ Introducció als Sistemes Digitals,

hem hagut de dedicar moltes hores a l’estructuració i disseny de les

pàgines.

L’assignatura es divideix en diferents temes, per arribar a ells

hem d’entrar primer a la pàgina principal.

Com es pot observar el fons de la pàgina principal és un collage

d’imatges relacionades amb l’electrònica digital, en la que apareix

també el títol de l’assignatura, i després a sota veiem com es desplaça

per la pantalla un xip on serigrafiat al seu encapsulat apareix la paraula

“Entrar” i una mica més a baix tenim el logotip de l’ETSE a una banda,

i a l’altra el de la URV. També s’indica quina és la resolució òptima per

a visualitzar l’aplicació.

Donat que el mercat de PC avança a un ritme vertiginós hem

optat per donar una resolució de pantalla òptima de 1024 x 768, ja que

avui en dia les pantalles més comunes que formen part d’un ordinador

personal són de 17” i sostenen bé aquesta resolució.

El navegador predeterminat per l’aplicació és el Microsoft

Internet Explorer ja que el fet que el programa de disseny de pàgines

fos de la companyia Microsoft feia que, amb diferència, els millors

resultats es donessin amb el navegador de Microsoft anomenat Internet

Explorer. De totes maneres s’ha tingut la màxima cura per obtenir bons

resultats amb altres tipus de navegadors. Desgraciadament hi ha efectes


38

i moviments que no es poden observar en navegadors que no siguin de

Microsoft.

Una vegada hem polsat el xip per entrar ens apareix el programa

de l’assignatura hem donat un fons de pantalla que recorda una llibreta

per aconseguir l’efecte de llibre interactiu. Fàcilment es pot seleccionar

el tema que ens interessa, simplement passant el ratolí per sobre del

títol del capítol veiem com aquest canvia de tamany, si el pitgem ens

porta directament al tema en qüestió. Per fer-ho hem utilitzat els

recursos que ens proporciona l’eina FRONTPAGE2000, com és en aquest

cas l’HTML dinàmic.

A l’annex II es descriu el funcionament del programa Microsoft

FRONTPAGE2000 i s’explica amb detall quines són les instruccions per a

realitzar cada funció. Cal afegir que ens ha estat de gran ajuda el

coneixement del codi de programació HTML ja que el programa no

arriba de per sí sol a tot el que nosaltres volíem aconseguir.

L’estructura dels temes és molt visual, les pàgines estan dividides

en dos marcs, un superior i un altre inferior. La pàgina de marcs permet

dividir la finestra de l’Explorador Web en diferents parts, d’aquesta

manera ens possibilita mostra més d’un document HTML (pàgina Web)

al mateix temps.


39

Figura1. Estructura pantalla, marc superior i inferior

En el nostre cas al marc superior ens apareix el títol del capítol i a

sota un menú on tenim l’índex i els diferents temes que formen

l’assignatura. Això ens permet que en qualsevol moment puguem anar

al tema que nosaltres desitgem.

A part de la barra que diferencia el marc superior de l’inferior

també tenim un fons de pantalla diferent.

S’ha utilitzat un codi de color per a cada tema:

Tema I: Introducció als Sistemes Digitals

Tema II: Sistemes de numeració i codis binaris

Tema III: Lògica Combinacional

Tema IV: Blocs combinacionals

Marc superior

Marc inferior


40

Tots els temes estan estructurats de la mateixa manera. Al marc

inferior s’exposa la teoria dels diferents capítols de la següent manera.

Figura2. Estructura tema, marc inferior

Primer de tot com es pot observar apareixen els diferents

subapartats del capítol, si passem el ratolí per sobre canviem de tamany

la qual cosa ens indica que si fem click a sobre ens portarà allà on

indica. Hem cregut necessari afegir a sota dels subapartats un punt on

se’ns indica els coneixements a assoli, perquè l’alumne vegi que es el

que es pretén aconseguir una vegada s’ha estudiat el tema.

De vegades s’utilitzen imatges dinàmiques per donar encara més

una sensació de l’aplicació viva i canviant que fa que sigui més atractiu

el fet d’estudiar l’assignatura.


41

Un altre recurs que hem utilitzat ha estat la inclusió de pel·lícules

flash, és a dir, una animació amb flash que no és més que el

procediment de dissenyar els moviments de diferents objectes a la

pantalla, ja siguin d’imatges o de text. S’utilitza el programa

Macromedia Flash 5. Per a la realització de la pel·lícula necessitem el

que s’anomena “Timeline” o línia de temps. Cada fotograma està

representat per una columna, com es pot veure a la següent figura. Per a

configurar la velocitat de la pel·lícula s’utilitza la següent regla: 12

fotogrames equivalen a 1 segon de temps real, d’aquesta manera podem

calcular el temps de duració de la nostra pel·lícula i programar els

diferents events a un moment determinat.

Cada vegada que volem que la pel·lícula canviï de fotograma clau

ens caldrà incertar un KeyFrame.

Figura 3. Macromedia Flash 5

Línia de temps

Escenari on escol·loquen elsdiferentsfotogrames quecomponen lapel·lícula.


42

Amb aquesta tècnica s’han creat les diferents pel·lícules que

apareixen a l’aplicació, per representar amb claredat el procés de

simplificació de funcions mitjançant el mètode sistemàtic de Karnaugh.

Tots els temes acaben amb un resum del capítol i un test

d’avaluació:

El resum serveix per a que l’alumne pugui repassar de forma

ràpida i senzilla cada un dels temes de l’assignatura. Aquests resums

tenen certes paraules claus (marcades amb color blau) que si passem el

ratolí per sobre canvien al color del tema en particular i si les pitgem

ens porten a la part del temari que correspon.

Alhora de dissenyar el test s’ha tingut en compte que havia de ser

una forma senzilla d’autoavaluació per a que l’alumne obtingués una

resposta ràpida.

Figura4.Test d’avaluació


43

Per tal de realitzar uns tests molts interactius i visuals s’han

utilitzat totes les eines que ens oferia el Microsoft FRONTPAGE2000

alhora que s’han implementat una sèrie de botons activables que donen

la sensació de ser pitjats.

Tots els dibuixos i fons de pantalla han estat creats i dissenyats

amb els diferents programes de disseny i retoc fotogràfic esmentats a

l’apartat anterior.

Cal anar molt amb compte la mida dels arxius gràfics d’una

pàgina ja que d’aquests depèn en gran mesura l’optimització del temps

de descàrrega. Els gràfics Web d’avui en dia són quasi tots arxius amb

extensió .gif o .jpeg. Els jpeg funcionen millor si l’ imatge té un

nombre elevat de colors, amb gràfics de qualitat fotogràfica. El format

d’arxiu .gif funciona millor amb gràfics que contenen un nombre

limitat de colors i contenen línies o text.

Alhora d’enfrontar-nos a un projecte d’aquestes característiques

cal tenir en comte que es crearà un volum molt elevat d’arxius i per tant

serà molt important dur a terme una organització estricta d’aquests

arxius per la qual cosa és interessant distribuir-los en diferents carpetes.


44

Figura 4. Distribució en carpetes de l’aplicació

Com es pot observar en la figura anterior, tenim per a cada tema

una carpeta, un altra per a les imatges on s’emmagatzemen les diferents

imatges utilitzades al a Web, a la carpeta de Flash5 tenim les diferents

pel·lícules flash que apareixen a l’aplicació. I així amb cadascuna

d’elles.


45

6. Esquema de la Web

Cal destacar la importància de crear una estructura o jerarquia perdissenyar l’aplicació, ja que permetrà tenir una organització i saber entot moment on estan les diverses pàgines i elements que composen elprojecte. També serà important crear una estructura d’aquest tipusalhora d’establir els hipervincles de cada pàgina. L’estructura que escrearà serà en forma d’arbre, i es partirà d’una pàgina principal, que esdividirà en els diversos temes que formin part del projecte. Cada tema ala vegada es dividirà en apartats i aquestos en subaparts, i aixísuccessivament fins arribar al nivell més baix possible.

Tot aquest procés es realitzarà des de l’Explorador de FrontPage,utilitzant la Vista Exploración . Cada pàgina s’afegirà a l’estructura fentdoble clic, a sobre de la pàgina que neix, per últim li donarem nom.

A continuació es mostren les pàgines web que formen l’aplicació.




Mapa web:

Universitat Rovira i Virgili Pressupost

46

1. Consideracions Inicials

Alhora de fer el pressupost, s’ha de tenir en compte que els preus

que hi figuren són orientatius, com per exemple el preu de l’hora de

l’Enginyer, del Dissenyador Gràfic, etc.. Moltes vegades el pressupost

pot variar degut al nombre de persones que treballin per la realització

d’aquest projecte, dels programes que s’utilitzin en la creació de

l’aplicació, de la facilitat de poder fer treballs simultanis, etc..

El factor potser més decisiu quan s’hagi de presentar un

pressupost serà la demanda del mercat i la competència, que seran en

realitat les que marcaran el preu de sortida del projecte.

Si l’empresa que fa el projecte, és ja una empresa que es dedica

professionalment a fer pàgines Web, es suposarà que la maquinària

inicial com és el cas de l’ordinador i tots els seus complements ja els té,

i que per tant s’hauran d’incorporar al pressupost però no en les

mateixes proporcions com si s’haguessin hagut de comprar

expressament per la creació de la Web.

També es tindrà en compte, que l’empresa ja disposarà del

software necessari per elaborar-les i que per tant, com en el cas

d’abans, les llicències del software i tots els programes que s’utilitzaran

també s’hauran d’incloure en el pressupost, però no amb la mateixa

proporció com si s’haguessin de comprar exclusivament per al disseny

de la Web.


47

2. Pressupost

2.1 Preus Unitaris

Material

Codi Unitat Designació Preu(Ptes)

101 un Disc Compacte CD-ROM 250102 un Disquet 50103 h Amortització Equipament Hardware 50104 h Amortització Equipament Software 100

Mà d’obra

Codi Unitat Designació Preu(Ptes)

M1 h Dissenyador Gràfic 2.600,00M2 h Redactor pàgines Webs (Web Master) 3.000,00M3 h Càlculs Tècnics i Enginyeria 4.000,00M4 h Investigació i recopilació d’informació 1.500,00


48

2.2 Descomposició de Partides

Disseny aplicació Web

CodiPartida

Designació Unitat

P-001 Creació de pàgina amb Menú gràfic ienllaçament dels hipervincles existents.

un.

Unitat Quantitat Preuunitari

Total(Ptes)

Material:103-Amortitzacióequipament Hardware

H 3,00 50,00 150,00

104-Amortitzacióequipament Software

H 3,00 100,00 300,00

Subtotal Material: 450,00Mà d’obra:M1-Dissenyador Gràfic h 1,50 2.600,00 3.900,00M2-Redactor pagines Webs h 1,50 3.000,00 4.500,00

Subtotal Mà d’obra: 8.400,00Cost Directe: 8.850,00

Despeses Indirectes 2,00%: 177,00Cost Execució: 9.027,00

Són NOU MIL VINT-I-SET Ptes/un.Equivalent a 54,25 Euros.


49

CodiPartida

Designació Unitat

P-002 Creació, modificació, de Temes del’assignatura Introducció als SistemesDigitals. Creació e incorporació de botons,fons pantalla, enllaçament d’hipervincles, etc.

un.


Total


h 3,00 50,00 150,00


h 3,00 100,00 300,00

Subtotal Material: 450,00Mà d’obra:M1-Dissenyador Gràfic h 1,50 2.600,00 3.900,00M2-Redactor paginesWebs

h 1,50 3.000,00 4.500.00

M3- Càlculs Tècnics iEnginyeria

h 1,00 4.000,00 4.000,00

M4-Recopilaciód’informació

h 2,00 1.500,00 3.000,00



Són SETZE MIL CENT SEIXANTA-SET Ptes/un.Equivalent a 97,16 Euros.


50

CodiPartida

Designació Unitat

P-003 Creació, modificació, resolució e inclusió deTest d’autoevaluació. Creació e incorporacióde botons interactius a les respostes.

un.


Total


h 3,00 50,00 150,00


h 3,00 100,00 300,00

Subtotal Material: 450,00Mà d’obra:M1-Dissenyador Gràfic h 1,00 2.600,00 2.600,00M2-Redactor paginesWebs

h 2,00 3.000,00 6.000,00


h 1,00 3.000,00 3.000,00

M4-Recopilaciód’informació

h 1,00 1.500,00 1.500,00



Són TRETZE MIL VUIT-CENTES VINT-I-UNA Ptes/un.Equivalent a 83,06 Euros.


51

CodiPartida

Designació Unitat

P-004 Creació i Resolució d’exemples, recopilacióde problemes i ampliació de temari. Inclusiódel mateix a l’aplicació Web i estructuraciód’enllaços i pàgines.

Un.


Total


h 1,00 50,00 50,00

104-Amortitzacióequipament Software.

h 1,00 100,00 100,00

Subtotal Material: 150,00Mà d’obra:M2-Redactor paginesWebs.

h 1,00 3.000,00 3.000,00


h 1,00 4.000,00 4.000,00

M4-Recopilaciód’informació.

h 2,00 1.500,00 3.000,00



Són DEU MIL TRES-CENTES CINQUANTA-TRES Ptes/un.Equivalent a 62,22 Euros.


52

CodiPartida

Designació Unitat

P-005 Procés de gravació i presentació de l’aplicacióen disc compacte CD-ROM.

un.


Total

Material:101-Disc Compacte CD-ROM

un. 1,00 250,00 250,00

103-Amortitzacióequipament Hardware

h 0,50 50,00 25,00


h 0,50 100,00 50,00

Subtotal Material: 325,00Mà d’obra:M3- Càlculs Tècnics iEnginyeria

h 0,20 4.000,00 800,00

Subtotal Mà d’obra: 800,00Cost Directe: 1.125,00


Són MIL CENT QUARANTA-SET Ptes/un.Equivalent a 6,89 Euros.


53

Documentació

CodiPartida

Designació Unitat

P-006 Realització de tota la documentació(manualsd’usuari,...)

un.


Total

Material:101-Disc Compacte CD-ROM

un. 1,00 250,00 250,00

103-Amortitzacióequipament Hardware

h 15,00 50,00 750,00


h 15,00 100,00 1500,00

Subtotal Material: 2500,00Mà d’obra:M3- Càlculs Tècnics iEnginyeria

h 15,00 3000,00 45000,00

Subtotal Mà d’obra: 12000,00Cost Directe: 47.500,00


Són QUARANTA-VUIT MIL QUATRE-CENTES CINQUANTAPtes/un.

Equivalent a 291,19 Euros.


54

2.3 Amidaments

Disseny aplicació Web

Codi Partida Unitat Designació TotalP-001 un. Creació de pàgina amb Menú gràfic i enllaçament

dels hipervincles existents4

P-002 un. Creació, modificació, de Temes de l’assignaturaIntroducció als Sistemes Digitals. Creació eincorporació de botons, fons pantalla,enllaçament d’hipervincles, etc.

27

P-003 un. Creació, modificació, resolució e inclusió de Testd’autoavaluació. Creació e incorporació debotons interactius a les respostes.

36

P-004 un. Creació i Resolució d’exemples, recopilació deproblemes i ampliació de temari. Inclusió delmateix a l’aplicació Web i estructuraciód’enllaços i pàgines.

36

P-005 un. Procés de gravació i presentació de l’aplicació endisc compacte CD-ROM.

6

Documentació

Codi Partida Unitat Designació TotalP-006 un. Realització de tota la documentació(manuals

d’usuari,memòries,...)1


55

2.4 Aplicació de Preus. Pressupost

Capítol 1. Disseny aplicació Web

Codi Un. Designació Quantitat PreuUnitari

Total(Ptes)

P-001 un. Creació de pàgina amb Menúgràfic i enllaçament delshipervincles existents.

4,00 9.027,00 36.108,00

P-002 un. Creació, modificació, de Temesde l’assignatura Introducció alsSistemes Digitals. Creació eincorporació de botons, fonspantalla, enllaçamentd’hipervincles, etc.

27,00 16.167,00 436.509,00

P-003 un. Creació, modificació, resoluciói inclusió de Testd’autoevaluació. Creació eincorporació de botonsinteractius a les respostes.

36,00 13.821,00 497.556,00

P-004 un. Creació i Resolució d’exemples,recopilació de problemes iampliació de temari. Inclusiódel mateix a l’aplicació Web iestructuració d’enllaços ipàgines.

36,00 10.353,00 372.708,00

P-005 un. Procés de gravació i presentacióde l’aplicació en disc compacteCD-ROM.

6,00 1.147,00 6.882,00

Total Capítol 1: 1.349.763,0

Són UN MILIÓ TRES-CENTES QUARANTA-NOU MIL SET-CENTES SEIXANTA-TRES Ptes/un.

Equivalent a 8.112,24 Euros.


56

Capítol 2. Documentació

Codi Un. Designació Quantitat PreuUnitari

Total(Ptes)

P-001 un. Realització de tota ladocumentació(manuals d’usuari,memòries,...)

1,00 48.450,00 48.450,00

Són QUARANTA-VUIT MIL QUATRE-CENTES CINQUANTAPtes/un.

Equivalent a 291,19 Euros.


57

2.5 Resum del Pressupost

Capítols ImportCapítol 1: Disseny aplicació Web 1.349.763,00Capítol 2: Documentació 48.450,00

TOTAL PRESSUPOST D’EXECUCIÓMATERIAL en Ptes

1.398.213,00

TOTAL PRESSUPOST D’EXECUCIÓMATERIAL en Euros

8.403,43

Despeses generals 13% 181.767,69Benefici industrial 6% 83.892,78TOTAL PRESSUPOST PER CONTRACTA en

Ptes1.663.873,47

TOTAL PRESSUPOST PER CONTRACTA enEuros

10.000,08

IVA 16% 266.219,75TOTAL PRESSUPOST D’EXECUCIÓ en Ptes 1.930.093,23

TOTAL PRESSUPOST D’EXECUCIÓ enEuros

11.600,09

EL PRESSUPOST ASCENDEIX A LA QUANTITAT DE UNMILIÓ NOU-CENTES TRENTA MIL NORANTA-TRES

PESSETES.

EL PRESSUPOST ASCENDEIX A LA QUANTITAT DE ONZEMIL SIS-CENTS EUROS, AMB NOU CENTIMS D’EURO




Universiat Rovira i Virgili Plec de Condicions

58

Introducció

L’objectiu d’aquest apartat és especificar les condicions generals,

econòmiques, tècniques per la correcta execució del projecte.

En aquest Plec de Condicions es presenten 4 parts, que són les

següents:

1.- Condicions Generals

2.- Condicions Econòmiques

3.- Condicions Tècniques

4.- Condicions Facultatives

1. Condicions Generals

El DEEEA de l’ETSE de la URV és propietària i titular dels drets

d’explotació del programa d’ordinador, així com de la documentació

tècnica necessària per al seu funcionament.

Pel present contracte, el DEEEA pot concedir a qualsevol

estudiant de l’ETSE una llicència, intransferible i no exclusiva, per l’ús

d’aquest Programa en un sistema informàtic que compleixi les

especificacions que es descriuen en la memòria descriptiva, destinant-lo

únicament el beneficiari (en aquest cas l’estudiant de l’ETSE) a la

satisfacció de les seves necessitats informàtiques.


59

2. Condicions Econòmiques

No existeix cap mena de compensació econòmica per tal

d’establir el lliurament de l’Aplicació Web i de la corresponent

documentació, així com dels drets d’explotació, per part del

dissenyador i programador de l’Aplicació Web. El DEEEA, per la seva

part, es reservarà el dret de demanar contraprestació econòmica per l’ús

del programa si el beneficiari no pertany a l’ETSE de la URV. De la

mateixa manera, el DEEEA tindrà total llibertat per establir les normes

que cregui oportunes per al control i utilització del programa.

3. Condicions Tècniques

El present Software, amb el seu suport magnètic i manual de

usuari, està garantitzat contra qualsevol defecte de fabricació durant un

període de dos mesos a partir de la data de lliurament per part del

dissenyador i programador de l’Aplicació informàtica. Aquesta

garantia inclou la modificació, per part del dissenyador, dels errors de

fabricació en el programa que beneficiari o propietari pogués detectar

durant aquest temps. La correcció de qualsevol error o defecte en el

suport magnètic serà lliure de càrrec durant aquest període.


60

El DEEEA no quedarà vinculada pels compromisos o promeses

realitzades per persones alienes al Departament o equip projectista, ni

per expectatives errònies respecte al funcionament del Programa.

En qualsevol cas, el beneficiari accepta que aquest programa

constitueix una eina de treball destinada a complementar, però no a

substituir la tasca humana, per tant la responsabilitat del DEEEA pels

danys imputables directament al Programa, es limitaran als indicats

prèviament pel coordinador i director de l’assignatura.

El beneficiari haurà d’utilitzar el Programa exclusivament en un

sistema informàtic que compleixi totes les especificacions tècniques

descrites a l’apartat de característiques mínimes del Hardware de la

memòria descriptiva. El DEEA no es fa responsable del mal

funcionament del Programa en cas que s’utilitzi en qualsevol tipus de

configuració diferent a la requerida, sense haver demanat

assessorament previ.

El DEEEA no serà responsable pels retards, interrupcions o falta

de prestació dels serveis previstos, quan això succeeixi per causa major

o aliena a la seva voluntat.


61

4. Condicions Facultatives

El beneficiari reconeix els drets de Propietat Intel·lectual del

DEEEA sobre el Programa, comprometent-se a no suprimir cap

indicació sobre aquests drets en el Software. Aquests drets protegeixen

el Programa, els manuals d’aplicació, el disseny de les pantalles, els

menús i tot el material que es proporcioni amb el Programa.

El beneficiari està autoritzat a efectuar una sola còpia de seguretat

del Software, que en cap cas podrà ser utilitzada i que quedarà sota la

custòdia del beneficiari, amb l’única finalitat de guardar i conservar la

informació. El beneficiari s’abstindrà de copiar total o parcialment la

documentació subministrada pel DEEEA per l’ús del Software, així

com qualsevol material imprès lliurat pel mateix. Si el beneficiari

necessités còpies addicionals d’aquest material, haurà de demanar

permís al DEEEA o al director de l’assignatura, acceptant les mesures

que es creguin oportunes per cada cas.

El beneficiari reconeix que aquesta aplicació Web li és cedida per

al seu ús i no per a la seva reproducció, modificació, cessió, venda,

lloguer o préstec, i es compromet a no cedir el seu ús total o parcial de

cap forma i a no transmetre cap dret que tingui sobre ell, així com no

divulgar-lo, publicar-lo, ni posar-lo de cap altre manera a disposició

d’altres persones.


62

El DEEEA tindrà dret a la obertura d’expedient si el beneficiari

incomplís qualsevol de les estipulacions pactades; en aquest cas ho

hauria de notificar al beneficiari, procedint-se a la immediata devolució

del Programa ( en cas de cessió en dics compacte), o a la denegació de

l’accés ( en cas de consulta per internet).

El beneficiari estarà obligat a donar les seves dades personals per

aprofitar-se d’aquesta aplicació Web. En cas que el DEEEA observés

qualsevol irregularitat en les dades del beneficiari, tindrà la capacitat

per desestimar la petició si així ho cregués oportú.

En cas de sorgir qualsevol divergència de la interpretació o

aplicació d’aquests punts, serà la Universitat Rovira i Virgili la que, a

través dels seus òrgans competents, resolgui el cas que es doni a

confusió o disputa.

En cas que algun o alguns punts anteriors fossin invalidats,

il·legals o inexecutables en virtut d’alguna norma jurídica, es

consideraran ineficaços en la mesura que correspongui, però en la resta

es conservarà la seva validesa.

No s’han efectuat acords verbals i el present document, amb totes

les seves estipulacions, conforma la totalitat del conveni inter-parts,

substituint qualsevol altra comunicació anterior verbal o escrita.


63




Universitat Rovira i Virgili Bibliografia

Bibliografia

Alcubilla, R; Pons, J; Bardes, D;. - Diseño digital: unapespectiva VLSI-CMOS. Barcelona: Ediciones UPC.

Álvarez García, A. -HTML Creación de páginas Web. AnayaMultimedia. (1997).

Areny T.- Flash 5 Practico Macromedia España (2000).

Baena, C. et alt. -Problemas de circuitos y sistemas digitales.Madrid: Mc-Graw Hill, (1997).

Floyd. T.L. - Fundamentos de Sistemas Digitales. Madrid:Prentice Hall, (1998).

Gajski Daniel, D. –Principles of digitals design. Prentice Hall.(1997).

Hayes, John P. - Digital Logic Design. Madrid: Ed. Addison-Wesley, (1993).

Lopez Rodríguez, P; Martínez Rubio, J.M. – SistemasDigitales Problemas. Universidad Politécnica de Valencia.(1987).

Lloris, A. i Prieto, A. Diseño Lógico. Madrid: Mc Graw Hill,(1996).

Richard S. Sandige. - Modern Digital Design. Madrid: McGraw Hill, (1990).

Tauber Daniel, A.; Briedad Kienan.- MicrosoftFRONTPAGE2000. Anaya Multimedia (1999).

Universitat Rovira i Virgili Bibliografia

Tokheim Roger, L.- Principios Digitales Schaum McGrawHill(1995).

Wakerly John F.- Digital Design Priniples and PracticesSecond Edition. Prentice Hall (1994).

Universitat Rovira i Virgili Annex I: MANUAL DE FRONTPAGE.

1

MANUAL DE FRONTPAGE

1. Introducció

1.1. Generalitats.

MS FrontPage 98 és una eina de creació i administració de llocs Web a internet o Intranet.FrontPage inclou l’Explorador de FrontPage que permet crear, dissenyar i administrar elconjunt d’un lloc Web, i l’Editor de FrontPage, on es pot crear i modificar planes Websense necessitat de conèixer el llenguatge HTML (Hyper Text Markup Language).

1.2. Iniciar/Sortir de FrontPage

Per a començar a treballar amb FrontPage:Faci clic al botó Inicio de la barra de taques de Windows.Arrossegui el ratolí fins l’opció Programas.Faci clic a Microsoft FrontPage.

Figura 1. Finestra introducció.

Una vegada tenim en pantalla la finestra anterior, podem triar:Obrir un lloc Web existentCrear un nou lloc WebTancar la finestra de la IntroduccióPer a sortir de FrontPage:Menú Archivo, opció Salir.Clic al botó X de la finestra de l’exploradorPrémer la combinació de tecles ALT+F4


2

1.3. L’Explorador Generalitats

L’Explorador de FrontPage és una eina de creació, organització, administració i publicacióde llocs Web de FrontPage. L’Explorador s’utilitza principalment per a crear el disseny il’estructura d’un lloc Web, organitzar arxius i carpetes, importar i exportar pàgines idocuments, provar i reparar hipervincles, administrar privilegis d’accés, fer un seguimentde tasques o iniciar l’Editor de FrontPage per a crear i modificar el contingut de les pàginesWeb.

1.3.1. Canviar la Vista

L’Explorador de FrontPage proposa 7 vistes per a descobrir i utilitzar el contingut del llocWeb actual, es pot accedir a elles a partir de la barra Vistas, a l’esquerra de la finestra.Per a mostrar el contingut del lloc en forma de carpetes i arxius. Aquesta vista permetcrear, eliminar, copiar y moure carpetes i arxius.Per a mostrar els noms de tots el arxius del lloc, així com la mida, el tipus, la data demodificació... de cadascú d’ells.Per a mostrar l’estructura del lloc. Aquesta vista permet crear, imprimir i modificarl’estructura.Per a mostrar gràficament els hipervincles existents entre les planes o amb altre lloc.Aquesta vista permet crear o modificar els hipervincles.Per a mostrar l’estat dels hipervincles: desconegut o erroni.Per a mostrar el quadre de diàleg on es pot seleccionar un tema.Per a mostrar la llista de tasques assignades a cada autor. Aquesta vista permet crear iadministrar les tasques.

Figura 2. Vistes.


3

1.3.2. Veure el Contingut de les Carpetes

Figura 3. Carpetes i arxius.

Aquesta operació afecta únicament a la vista Carpetas.

Al pannell esquerre, faci clic al nom de la carpeta que vol consultar. Al pannell de la dretas’actualitza automàticament per a mostrar el contingut.Per expandir una carpeta, al pannell de la esquerra faci doble clic al nom o un clic al signe+.Per contraure una carpeta, al pannell de la esquerra faci doble clic al nom o un clic al signe-.

1.4. L’Administració de Llocs Web.

Un Lloc Web és un conjunt de pàgines HTML, imatges, documents i altres arxius.Un Lloc Web conté també una sèrie d’arxius auxiliars que proporcionen continguts méssofisticats, com les barres d’exploració, la actualització y la reparació d’hipervincles, lageneració de un índex de text, la creació d’elements de disseny a partir de temes, lageneració automàtica de taules de contingut y el control integrat de formularis.Per a poder utilitzar alguns components de FrontPage, haurà de crear i mantenir llocs Weba un servidor Web que tingui instal·lades les extensions de servidor FrontPage.


4

1.4.1. Crear un Nou Lloc Web.

Per a crear un nou Lloc de FrontPage, hem de fer clic a l’opció Nuevo/Web de FrontPagedel menú Archivo

Figura 4. Finestra Nuevo Web.

Triï el tipus de Lloc que desitja crear:Un Web d’una pàgina.Un Web amb arxius importatsUn Web mitjançant una plantilla.

Escrigui el nom del Web.Pitgi el botó Aceptar.El nom i la ubicació del nou Lloc apareixen a la barra de títol i la vista Exploración és lavista activa.Qualsevol nou lloc posseeix almenys tres carpetes: la principal, que porta el nom del lloc ien la que per defecte s’emmagatzemen totes les noves pàgines o arxius, la carpeta images,és on es guarden els arxius d’imatges i la carpeta _private, que està reservada perFrontPage.Per a crear un nou Lloc Web, ha de ser un Administrador autoritzat. Si encara no haintroduït el seu nom i la seva contrasenya, al quadre de diàleg corresponent.Si vol crear un Lloc Web mitjançant l’assistent, respongui a les preguntes que li formularà.

1.4.2. Eliminar un Lloc Web

Ha de disposar del permís administrador al Lloc Web.Obri el lloc Web que desitja eliminar


5

Triï l’opció Eliminar Web de FrontPage del menú Archivo.Confirmi l’eliminació.

Figura 5. Finestra Confirmar eliminació.

1.4.3. Canviar el Nom d’un Lloc

Obri el Lloc al que vol canviar el nom.Triï l’opció Configuración del Web del menú Herramientas

Figura 6. Finestra Configuració del Web..

Activi la fitxa ConfiguraciónEscrigui el nom del Lloc WebEscrigui el nou títol del Lloc WebFaci clic al botó Aceptar

1.4.4. Obrir un Lloc Web

Per obrir un Lloc Web:Faci clic al menú Archivo i triï l’opció Abrir Web de FrontPage.


6

Seleccioni el Lloc que vol obrir i faci clic en Aceptar.Si cal, FrontPage li demanarà un nom i una contrasenya per obrir el Lloc.Per a tancar un Lloc faci clic a l’opció Cerrar Web de FrontPage del menú Archivo.

Figura 7. Obrir arxius.

1.4.4. Importar un Lloc Web

No obri cap Lloc Web, si escau, tanqui el Lloc actual i faci clic al botó Cancelar delquadre de diàleg Introducción.Triï l’opció Importar del menú Archivo.Conservi activa l’opció Importar un Web existente i segueixi les mateixes instruccionsper a CREAR UN LLOC WEB. Faci clic al botó Aceptar.

DES D’UN DIRECTORIQuan li proporcionen una copia d’un Lloc Web per fer-la servir al seu equip, no n’hi haprou amb copiar els directoris i arxius del Web als llocs adequats. Per que FrontPage puguireconèixer i mostrar el lloc Web, s’haurà d’importar.Seleccioni l’opció Desde un directorio de origen de archivos a un equipo local o de lared.

Seleccioni la carpeta a importar. Podem fer clic al botó Examinar per trobar-la.Activi l’opció Incluir Subcarpetas.Faci clic al botó Siguiente.


7

Figura 8. Assistent per importar Web.


Faci clic al botó Siguiente i desprès en Finalizar.

DES D’UN LLOC WORLD WIDE WEB.

Activi l’opció Desde un sitio del Wold Wide WebIntrodueixi l’adreça del Lloc a importar.


8

Faci clic al botó Siguiente.


Faci servir les opcions de temps de descàrrega i espai de disc.Polsi el botó Siguiente i desprès Finalizar.

1.4.5. Seguretat a un lloc Web.

Obri el Lloc Web corresponentTriï l’opció Permisos del menú Herramientas.Activi la fitxa Usuarios.Faci clic al botó Agregar...Seleccioni el nom de l’usuariFaci clic a AgregarSeleccioni autorització per l’usuari: Exploració, Modificació o Administració

1.4.6. Publicar a un lloc Web.

Publicar un Lloc Web permet fer-lo funcionar a Internet o a una Intranet.

Figura 11. Publicar lloc Web.


9

Seleccionar l’opció Publicar Web de FrontPage del menú Archivo.Indiqui la ubicació del Lloc WebFaci clic al botó Aceptar.

1.4.7. Esstructura d’un lloc Web.

Per estructurar un Lloc Web, hem de triar l’opció Exploración del menú Ver.Fent doble clic, es mostra el contingut de la carpeta.

Figura 12. Exploració.

Amb el botó ↑, podem veure el contingut de la carpeta anterior.Arrossegant des del pannell Contenido fins al pannell de l’Explorador permet afegirpàgines a l’estructura.Per esborrar una pàgina polsi la tecla DEL.Fent doble clic a una pàgina accedim a l’Editor de FrontPage.

1.5. Els Arxius i les Carpetes.

Sempre hem de fer l’administració dels arxius i de les carpetes d’un Web de FrontPage desde l’Editor de FrontPage, des de la vista Carpetas o Todos los archivos.

1.5.1. Seleccionar arxius.

Faci clic al nom del arxiu que vulgui seleccionar.Per a seleccionar varis documents no adjacents, seleccioni el primer i a continuació mentrepitja la tecla CRTL, vagi fent clics als altres arxius.Per a seleccionar varis arxius adjacents, selecciona el primer i a continuació mentre pitja latecla MAYUSC, faci clic a l’últim arxiu.Per a seleccionar tots els arxius, triï l’opció Seleccionar todo del menú Edición.

1.5.2. Administrador d’arxius.

Un cop seleccionats els arxius, podem:ELIMINARSeleccionar l’opció Eliminar del menú Edición.


10

Fent clic al botó XCANVIAR EL NOMSeleccionar l’opció Cambiar nombre del menú EdiciónFent doble clic al nom del arxiuPolsant la tecla F2.

MOURE/COPIAR ARROSSEGANTA la vista Carpetas, arrossegui l’arxiu fins a la carpeta destí al pannell de l’esquerraSi vol moure l’arxiu, deixi anar el botó del ratolí.Si vol copiar-lo polsi la tecla CRTL, deixi anar el botó del ratolí, deixi anar la tecla CRTL.

MOURE/COPIAR MITJANÇANT EL PORTAPAPERSSeleccioni l’arxiu a copiar o moure.Si vol copiar, seleccioni l’opció Copiar del menú Edición.Si vol moure, seleccioni l’opció Cortar del menú Edición.Faci clic a la carpeta de destíSeleccioni l’opció Pegar del menú Edición.

Figura 13. Menú Edició.

1.5.3. Crear una Carpeta.

Al pannell de la esquerra, seleccioni la carpeta a la que desitja crear la nova. Per a crearuna nova carpeta de primer nivell, faci un clic a la carpeta arrel.Seleccioni l’opció Nuevo/Carpeta del menú Archivo.Escrigui el nom de la carpeta i polsi INTRO

1.5.4. Importar un Arxiu.

Obri el Lloc Web a on vol importar els arxius.Triï l’opció Importar del menú Archivo


11

Figura 14. Importar arxius.

En funció del que volem fer, farem clic a l’opció Agregar Archivo... o AgregarCarpeta...Un cop definit, farem clic al botó Aceptar.

1.5.5. Cercar Pàgines amb un Text Concret.

Triarem l’opció Buscar del menú Herramientas.

Figura 14. Buscar en Web.

Escriurem a Buscar el text que volem cercarTriarem, si escau, Sólo palabras completas i/o Coincidir mayúsculas y minúsculas.Farem clic al botó Aceptar.Apareixerà una finestra amb el resultat de la cerca.


12

Figura 14. Buscar text.

2. L’editor.

2.1. Generalitats.

L’Editor de FrontPage és l’aplicació utilitzada per a editar i, en alguns casos, per a crear lespàgines Web. L’Editor li permet introduir text, donar-li format, dissenyar la pàgina, inseririmatges, crear vincles, inserir taules,.... No és necessari que aprengui el llenguatge HTMLper a utilitzar l’Editor, ja que genera tot el codi HTML per vostè.

2.1.1 Iniciar/Sortir de l’Editor.

Per a iniciar l’Editor hem de fer doble clic a la pàgina que volem editar o dins del menúHerramientas triem l’opció Mostrar Editor de FrontPage.Per a sortir de l’editor hem de fer clic al botó X, o triem l’opció Salir del menú Archivo.


13

Figura 14. Finestra de l’Editor.

2.2. Opcions de Visualització a l’Editor de FrontPage.

2.2.1. Mostrar/Ocultar les Barres d’Eines.

Obri el menú Ver, apareixerà una llista de les possibles barres a mostrar, si a l’esquerra delnom apareix un símbol √, indica que la barra està visible, per veure/ocultar hem de fer clical nom.Per poder moure una barra, senyali un espai en blanc i arrossegui fins un lloc lliure.

Figura 16.Mení Veure.


14

2.2.2. Triar una Font Predeterminada.

Hem de seleccionar l’opció Opciones del menú Herramientas. Un cop fet això,apareixerà el següent quadre de diàleg:

Figura 17..Opcions.

Activarem la fitxa Fuente predeterminada i triarem la font desitjada.

3. Pàgines.

3.1. Gestió de Pàgines.

Les pàgines constitueixen els documents bàsics del WWW. Les pàgines estan escrites enun llenguatge evolutiu denominat HTML. L’Editor de FrontPage li permet crear imodificar les seves pàgines mitjançant de una pantalla de procés de text familiar mentrecrea el codi HTML sense que l’usuari s’assabenti.

3.1.1. Crear una Pàgina des de l’Explorador:

Accedeixi a la carpeta on es troba la pàginaTriï l’opció Nuevo/Página del menú Archivo., o faci clic al botó NUEVA PÁGINAIntrodueixi el nom de la pàgina amb l’extensió .htm i polsi INTRO.Per editar la pàgina faci doble clic al nomDES DE L’EDITORHem de triar l’opció Nuevo del menú Archivo. Apareixerà una finestra on triarem el tipusde pàgina a crear.


15

Figura 18. Menú Arxiu.

La primera pàgina del Lloc Web és la principal i ha de complir tres condicions, presentar alpropietari del Lloc, proporcionar informació referent al contingut i accessibilitat a lesdemés pàgines del Lloc.

3.1.2. Tancar una Pàgina.

Per tancar una pàgina, hem de triar l’opció Cerrar del menú Archivo o farem clic al botóX per tancar la finestra.

Figura 19. Menú Arxiu.


16

3.1.3. Guardar una Pàgina.

Triar l’opció Guardar del menú Archivo, o fer clic al botó Guardar.Si es la primera vegada que guardem la pàgina, apareixerà la següent finestra de diàleg:

Figura 20.Guardar com.

En aquesta finestra hem d’especificar, la carpeta on volem guardar el document, el nom i eltítol de la pàgina.Si la pàgina ja estava guardada, al fer clic a la opció Guardar, automàticament es guardaràamb el nom que tenia especificat.

3.1.4. Guardar una Pàgina amb Sons,Iimatges i Vídeos

Quan guardem una pàgina que contingui sons imatges i vídeos, apareixerà una novafinestra que ens demanarà on volem deixar els arxius vinculats, solament hem de fer clic albotó Aceptar.

3.1.5. Canviar el Títol a una Pàgina.

Obri la pàgina que vol canviar el nom, triï l’opció Propiedades de página del menúArchivo, a al fitxa General introdueixi el nou títol i faci clic al botó Aceptar.


17

Figura 21.Canviar Títol Pàgina.

3.1.6. Obrir una Pàgina.

Per obrir una pàgina des de l’editor, hem de:Fer clic al botó Abrir, o triar l’opció Abrir del menú Archivo.Apareixerà la següent finestra de diàleg on podrem dir el nom i la ubicació de l’arxiu aobrir, solament fent clic al nom i polsant el botó Aceptar.

3.1.7. Veure les Pàgines.

En funció del resultat desitjat, utilitzi una de les fitxes següents de la part inferior esquerrade la finestra.

Normal per a editar la pàginaHTML per a mostrar i editar el codi HTMLVista Previa per a mostrar la pàgina com en un explorador

Figura 22.Obrir.


18

3.2 La Presentació de Pàgines.

3.2.1. Triar un Tema.

Un tema de FrontPage es composa d’elements de disseny y combinacions de colors,unificats per vinyetes, fonts, barres d’exploració y altres elements de la pàgina.

PER A TOTES LES PÀGINES DEL WEB ACTUAL.

Activi l’Explorador de FrontPage, farem un clic al botó Temas, apareixerà una finestracom la següent.

Figura 24. Triar tema totes les pàgines.

A aquesta finestra podem triar, si el nostre Web tindrà o no Temes, triar el Temaespecificat, i si volem colors intensos, un conjunt de gràfics animats i una imatge de fonscom es pot veure a la mostra de la dreta.Un cop hem triat les opcions que més ens interessen, farem clic al botó Aplicar.El tema triat, s’aplicarà a totes les pàgines existents al Web i a les noves.

PER A LA PÀGINA ACTUAL

Editi la pàgina a la que desitja mostrar un tema en concret.Triï l’opció Tema del menú Format. Apareixerà la mateixa finestra d’abans, on podem triarles mateixes opcions.

3.2.2. Definir el Fons i els Colors.

Aquesta funció no estarà disponible si la pàgina està utilitzant un tema.Per definir el fons i els colors, editi la pàgina corresponent, triï l’opció Fondo del menúFormato, si es necessari, activi l’opció Especificar fondo y colores.Apareixerà la següent finestra on pot triar el fons i els colors de la pàgina.


19

Figura 25. Propietats Pàgines.

3.2.3. Especificar els marges.

Per especificar els marges que ens interessin en una pàgina hem de:Editar la pàgina que volem canviar el marges, triar l’opció Propiedades de pàgina delmenú Archivo.

Un cop fet això, apareixerà una nova finestra com la següent:

Figura 26.Propietats de Pàgines.

Activarem la fitxa Márgenes i establirem els marges superior i esquerre, un cop fet aixòpitjarem el botó Aceptar.


20

3.2.4. Triar un efecte de transició.

Un efecte de transició és un efecte que farà la pàgina quan canviï d’una a altra, per podercanviar o establir un efecte de transició ha de:Triar l’opció Transición de pàgina del menú Formato, apareixerà una finestra de diàlegon podrem especificar l’event, l’efecte de transició i la durada ens segons del efecte.

Figura 27.Transició de Pàgines.

3.2.5. Utilitzar les vores compartides.

Les vores compartides són regions de pàgina generalment reservades al contingut i que hand’aparèixer de forma coherent en totes les pàgines del Lloc Web. Generalment contenenbarres d’exploració quan administra pàgines de l’estructura del Web.Per establir vores compartides, hem de seleccionar l’opció Bordes compartidos del menúHerramientas.I apareixerà una finestra on pot triar les diferents vores i si s’aplicaran a tot el Lloc Web oen aquesta pàgina.

Figura 28. Bordes de pàgines.


21

4. Marcs.

Els marcs divideixen la finestra de l’explorador en diferents parts, cadascuna d’elles potmostrar una pàgina independent.Un grup de marcs rep el nom de “pàgina de marcs”. Una pàgina de marcs és una pàginaWeb especial que defineix la mida y la posició de cada marc que conté.Una pàgina de marcs no conté realment pàgines sinó hipervincles a pàgines ja existents quees mostren als marcs.A les pàgines de marcs més senzilles hi ha dos marcs: el primer mostra una pàgina amb unconjunt de hipervincles i el segon les pàgines a les que es referencien els vincles. Cadavegada que un usuari fa clic a un hipervincle del primer marc, la pàgina corresponent aaquest vincle apareix al segon marc.

4.1. Crear unaPàgina de Marcs.

Un cop som a l’Editor, farem un nou full, tal com hem vist en apartats anterior i triarem lafitxa Marcos, on podrem triar el tipus de marc que ens interessa.

Un cop hem fet això apareix una pàgina nova de marcs on hem de especificar la pàginainicial, si volem posar una pàgina que ja estigui creada, o una nova pàgina per poder-la ferde nou.

Figura 29. Nou Marc.


22

4.1.1. Afegir/Eliminar Marcs.

Per a eliminar un marc, faci clic en ell per activar-lo i després seleccioni l’opció Eliminarmarco del menú Marco.Per a afegir un marc, triï l’opció Dividir marco del menú Marco, on apareixerà la següentfinestra per poder especificar si volem una divisió horitzontal o vertical.

Figura 30. Buscar text.

4.1.2. Administrar la mida i els Marges d’un Nou Marc.

Hem de triar l’opció Propiedades de Marco del menú Marco, apareixerà la següentfinestra on podrem triar si es de mida ajustable o fixa, si volem o no barres dedesplaçament, la mida del marc i els marges.

5. Impressió de Pàgines.

5.1. Veure una pàgina tal com s’imprimirà.

Figura 31. Propietats de Marcs..

Per poder veure una presentació preliminar de la pàgina, hem de seleccionar del menúArchivo l’opció Vista preliminar, on podem veure tal com s’imprimirà la nostra pàgina(en aquest cas, full de paper).Podem veure les pàgines anteriors i següents, o dues a l’hora, o més gran fent clic alsbotons adients.Per sortir de la vista preliminar farem clic al botó Salir.


23

5.1.1. Canviar la Configuració de la Pàgina.

Si selecciona l’opció Configurar pàgina del menú Archivo, podrà especificar els marges icapçalera/peu de la impressió tal com apareix en el següent quadre.

IMPRIMIR UNA PÀGINA

Figura 32. Configurar Pàgina.

Per poder imprimir una pàgina, hem de triar l’opció Imprimir del menú Archivo, onapareixerà el següent quadre de diàleg.

Aquí pot especificar per quina impressora vol imprimir, i les seves propietats.Quantes copies volSi vol imprimir totes les pàgines o solament algunes.Un cop seleccionades les opcions que ens interessen, farem clic al botó Aceptar perimprimir el treball.

Figura 33. Aceptar aplicació.


24

6. Vincles.

6.1. Creació de Vincles.

Un hipervincle connecta una pàgina del Lloc on vostè es troba amb altra pàgina del Lloc,com una imatge, una adreça de e-mail, un arxiu multimèdia,... Els hipervincles s’incrustendirectament al text o a les imatges d’una pàgina. La majoria dels exploradors Web subratllaels hipervincles de text i els mostra amb uns colors determinats. En el cas de les imatges,no s’aprecia si són o no hipervincle, per determinar si són o no, l’usuari ha de situar-se asobre de la imatge i si el ratolí agafa forma de mà te vincle sinó no té.

6.1.1. Crear un Hipervincle de Text/Imatge.

Per crear un hipervincle, seleccioni el text o la imatge, triï l’opció Hipervínculo del menúInsertar o faci clic al botó Hipervínculo. Apareixerà una finestra com la següent:

Figura 32.Crear Hipervincle..

Aquí podem triar la pàgina a la que volem fer el vincle, o si volem vincular a una adreçaexterna de internet, o a un e-mail, o una nova pàgina web.Un cop triades les opcions que ens interessen faci clic al botó Aceptar.No oblidi guardar la pàgina un cop fets els vincles.

6.1.2. Crear un Marcador.

Els marcadors permeten crear un vincle amb altre Lloc concret d’una pàgina de destí. Per acrear un marcador:Situïs al lloc on vol inserir el marcador.Seleccioni l’opció Marcador del menú Edición


25

Introdueixi el nom del marcador i faci clic al botó Aceptar.Mitjançant aquesta opció del menú també pot anar directament a un marcador o eliminar-lo.

Figura 33. Marcador.

6.1.3. Crear una Zona Activa en una Imatge.

Una zona activa és un l’àrea de la imatge que té un hipervincle, per realitzar una zonaactiva en una imatge:Faci clic a la imatge seleccionada, faci clic a un dels botons de la barra d’eines Imagen pera crear una zona rectangular, circular o poligonal.Al quadre de diàleg Crear hipervínculo, actuï de la mateixa forma que amb el text o lesimatges.

Figura 34. Zona activa.

6.1.4. Crear un botó Activable.

Per a crear un botó activable:Editi la pàgina i situï’s a la posició on vol inserir el botó.Seleccioni l’opció Elementos Activos/Botón activable del menú Insertar. Apareixerà elsegüent quadre de diàleg:


26

Figura 35. Botó Activable.

Aquí pot introduir el text del botó, el vincle, i el format del botó: colors, efecte,...Un cop triades les opcions corresponents, faci clic al botó Aceptar.

6.1.5. Inserir una Taula de Contingut del Lloc Web.

La taula de contingut crea l’esquema del Web amb hipervincles a cada pàgina, per crearuna taula de contingut:Editi la pàgina on vol crear la taula de contingutTriï l’opció Tabla de contenido de menú Insertar. Apareixerà el següent quadre dediàleg:

Figura 36. Propietats de component de taula..

Aquí pot especificar la pàgina inicial de la taula de contingut, l’estil del títol, mostrar una omés vegades (segons el vincles) pàgines, mostrar pàgines sense vincles directes des de laprimera pàgina i si la taula s’actualitza automàticament si fem qualsevol canvi al LlocWeb.


27

6.1.6. Crear una Barra d’Exploració.

Una barra d’exploració és un element de pàgina que permet crear automàticamenthipervincles a altres pàgines existents a l’estructura del Web de FrontPage. Per crear unabarra d’exploració:Editi la pàgina on vol inserir la barra d’exploració i triï l’opció Barra de exploración delmenú Insertar. Apareixerà la següent finestra de diàleg.

Figura 37. Propietats de Barra d’Exploració..

En aquesta barra podem triar els hipervincles a les pàgines que ens interessin i la sevaposició i format.

6.2 El Seguiment i Visualització de Vincles.

6.2.1. Administrar els Hipervincles.

Per poder modificar un hipervincle seleccioni el text o la imatge amb hipervincle i triïl’opció Hipervinculo del menú Edición.Per eliminar un hipervincle, seleccioni l’opció Desvincular del menú Edición.

6.2.2. Seguir un Vincle a un Editor.

Per poder seguir un vincle mitjançant l’editor, seleccioni el text o la imatge ambhipervincle i triï l’opció Seguir hipervínculo del menú Ir a.

6.2.3. Comprovar l’Estat dels Hipervincles.

Abans de res, activi l’explorador.


28

MOSTRAR L’ESTAT DELS HIPERVINCLESPer poder veure l’estat dels hipervincles, seleccioni l’opció Estado de los hipervínculosdel menú Ver.Apareixerà una finestra amb tots el hipervincles erronis i desconeguts. Si no unhipervincle és correcte.

COMPROVAR ELS HIPERVINCLESSeleccioni el vincles que vol comprovar i triï l’opció Comprobar hipervínculos del menúHerramientas. Apareixerà una finestra que podem triar que hipervincles volemcomprovar.

Solament hem de fer un clic al botó Iniciar.

Figura 38. Comprovar Hipervincle.

6.2.4. Reparar un Vincle Erroni.

Per reparar un vincle erroni:Seleccioni el vincle a modificarFaci clic amb el botó dret del ratolí i triï l’opció Modificar Hipervínculo. Apareixerà unafinestra on es podrà canviar l’hipervincle seleccionat.Solament hem de canviar-lo i fer clic al botó Reemplazar.

Figura 39. Modificar Hipervincle..


29

6.2.5. Actualitzar els Vincles.

Per poder actualitzar els vincles, solament ha de triar l’opció Actualizar hipervínculos delmenú Herramientas i fer clic al botó Sí.

6.2.6. Veure la Jerarquia de les Pàgines.

Per poder veure la jerarquia de les pàgines, solament ha de triar l’opció Hipervínculos delmenú Ver.Per a seleccionar la vista , dins del menú Ver, podem triar entre hipervincles a imatges,hipervincles repetits o hipervincles dintre de la pàgina, solament fent un clic a l’opciódesitjada.Podem veure una imatge com aquesta:

Figura 40. Pàgina Nova.

7. Gestió del Text.

El text dintre de l’editor funciona de la mateixa forma que al Word, es a dir, podemcomençar a escriure el nostre text sense preocupacions de canvi de línia,....

7.1. Els Desplaçaments i Seleccions.

7.1.1. Moure el Punt D’inserció.

Per moure el punt d’inserció podem fer servir el ratolí (fent un clic al lloc on volem deixarel punter) o utilitzar el teclat:

←,↑,→,↓: esquerra, a dalt, dreta i a baix.


30

INICIO/FIN: principi/final de la filaCRTL+INICIO/CRTL+FIN: principi/final de la pàginaCRTL+↑/CRTL+↓: paràgraf anterior/següentCRTL+←/CRTL+→: paraula anterior/següent

7.1.2. Seleccionar un Text.

En funció de l’element que desitgi seleccionar, utilitzi una de les següents tècniques:Una paraula faci doble clicUna línia situï el ratolí a l’esquerra de la línia i faci clicUn paràgraf situï el ratolí a l’esquerra de la línia i faci doble clicUn conjunt de caràcters faci clic al principi de la selecció, arrossegui i deixi

anar el ratolí al final de la seleccióTota la pàgina Triï del menú Edición l’opció Seleccionar todo.

7.1.3. Moure/Copiar un Text.

MOURE/COPIAR ARROSSEGANTSeleccioni el text i arrossegui el text fins a la posició de destíSi vol moure el text, deixi anar el botó del ratolí.Si vol copiar-lo polsi la tecla CRTL, deixi anar el botó del ratolí, deixi anar la teclaCRTL.

MOURE/COPIAR MITJANÇANT EL PORTAPAPERSSeleccioni el text a copiar o moure.Si vol copiar, seleccioni l’opció Copiar del menú Edición.Si vol moure, seleccioni l’opció Cortar del menú Edición.Faci clic a la posició de destíSeleccioni l’opció Pegar del menú Edición.

7.2. Les Revisions de Text.

7.2.1. Revisar l’Ortografia.

Per revisar l’ortografia, editi la pàgina a la que vol revisar, seleccioni l’opció Ortografíadel menú Herramientas. Apareixerà un quadre de diàleg com el següent quan el correctorortogràfic trobi una paraula que no sigui al seu diccionari:

Figura 41. Ortografia..

En aquesta finestra podem fer el següent:Omitir Per a ignorar la paraula


31

Omitir todas Per a ignorar la paraula en tot el text

Cambiar Canviar aquesta paraula per una de la llista Sugerencias

Cambiar todas Canviar aquesta paraula en tot el text per una de la llista SugerenciasAgregar Incloure aquesta paraula al diccionari del corrector.

7.2.2. Buscar un Sinònim.

Per posar un sinònim a una paraula, seleccioni-la i triï l’opció Sinónimos del menúHerramientas. Apareixerà una finestra com la següent:En aquesta finestra podrà triar el significat del sinònim, el sinònim i si ho vol canviarmitjançant el botó Reemplazar.

Figura 41a. Sinònims..

Figura 42. Buscar.

7.2.3. Buscar Text a una pàgina.

Per buscar un text determinat a una pàgina, editi la pàgina i triï l’opció Buscar del menúEdición, apareixerà el següent quadre de diàleg:

En aquesta finestra, pot establir, el text a buscar, l’ordre, i si vol que sigui una paraulacomplerta i si coincideixin també les majúscules i les minúscules.Un cop triades les opcions, faci clic al botó Buscar siguiente per poder veure la següentparaula que coincideixi amb aquestes opcions.


32

7.2.4. Canviar un Text per un Altre.

Per canviar un text determinat a una pàgina, editi la pàgina i triï l’opció Reemplazar delmenú Edición, apareixerà el següent quadre de diàleg:

Figura 43. Substituir.

En aquesta finestra, pot establir, el text a buscar i el text a canviar, l’ordre, i si vol que siguiuna paraula complerta i si coincideixin també les majúscules i les minúscules.Un cop triades les opcions, faci clic al botó Buscar siguiente per poder veure la següentparaula que coincideixi amb aquestes opcions sense fer cap canvi.Faci clic al botó Reemplazar per canviar la paraula seleccionada en aquest moment al textper l’altre i buscar la següent paraula.Faci clic al botó Reemplazar todo, per canviar totes les paraules del text.

7.3. Els Caràcters.

7.3.1. Canviar el Fprmat dels Caràcters.

Per canviar el format del caràcters, seleccioni el text per canviar el format, triï l'opcióFuente del menú Formato. Apareixerà la següent finestra:

Figura 44. Font.


33

Aquí podem especificar, el tipus de font, l'estil, la mida, els efectes i el color.Un cop triades les opcions especificades, farem clic al botó Aceptar.També podem fer servir la barra d'eines per canviar el format dels caràcters.

7.3.2. Aplicar Estils Especials.

Els estils són formats amb nom, es a dir, un format de caràcter ja definit amb un nom, detal forma que triant aquest estil, podem tenir una presentació homogènia del nostre LlocWeb.Per poder establir estils al nostre text ha de:Seleccionar el text per canviar l'estil, triï l'opció Fuente del menú Formato i activi la fitxaEstilos especiales. Apareixerà la següent finestra:

Figura 45. Font..

Solament ha de triar l'estil que l'interessi i fer clic al botó Aceptar.

7.4. Els Paràgrafs.

7.4.1. Sangrar Paràgrafs.

Per poder sagnar els paràgrafs, primer ha de fer clic al paràgraf especificat, seleccionil’opció Párrafo del menú Formato, faci clic al botó Estilo i activi la fitxa Alineación,introdueixi el valor del marge esquerre i dret. Faci clic al botó Aceptar.


34

7.4.2. Canviar la Alineació.

Per poder canviar l’alineació d’un paràgraf, seleccioni el paràgrafs a canviar l’alineació isegons la alineació desitjada, triï l’opció Párrafo/Alineación de párrafo del menúFormato.

7.4.3. Crear una Lllista Numerada o amb Vinyetas.

Per crear una llista numerada, o amb vinyetes, solament ha de seleccionar el paràgraf peraplicar les vinyetes i fer clic a l’opció Viñetas y numeración del menú Formato.Apareixerà una finestra com la següent:

Figura 46.Viñetas i Numeració.

Mitjançant les tres fitxes, podem aplicar imatges, vinyetes i números, segons el quel’interessi en cada moment.Amb l’opció Activar esquemas contraibles, podem crear el que es diu una llistadinàmica, es a dir, una llista que podem contraure i expandir amb l’explorador.Per crear una llista amb diferents nivells, seleccioni el segon nivell i amb els botonsDisminuir nivel i Aumentar nivel pot crear una estructura multinivell.Si vol modificar una llista numerada o amb vinyetes, seleccioni la llista i triï l’opcióViñetas y numeración del menú Fomato.


35

7.4.4. Vores i _Fons de Paràgrafs.

Amb l’opció Párrafo del menú Formato, pot establir colors de fons i vores als paràgrafs,per posar colors activi la fitxa Colores i per posar vores activi la fitxa Bordes.On pot triar colors, estils, amplades, imatges de fons,....

8. Taules.

8.1. Gestió de Taules.

Una taula es composa de files i columnes. Cada intersecció entre fila i columna rep el nomde cel·la. La cel·la en la que es troba el punt d’inserció es diu cel·la activa. Les cel·lespoden contenir tot el que pot inserir a una pàgina (text, imatges, hipervincles, ....). Unataula permet mostrar un paràgraf al costat d’un altre i posar un text al costat d’un gràfic.

8.1.1. Inserir una Taula.

Per inserir una taula, situïs al punt on vol la taula i triï l’opció Insertar tabla del menúTabla. Apareixerà una finestra com la següent:

Figura 47. Inserir Taula.

En aquesta finestra, podem especificar, el número de files i columnes, l’alineació de lataula, l’estil de cel·les i vores i l’amplada. Simplement triant l’opció desitjada i fer clic albotó Aceptar.En lloc de inserir una taula, també la pot dibuixar, simplement triï l’opció Dibujar tabladel menú Tabla. El cursor agafarà forma de llapis i arrossegant el ratolí podrà dibuixar lataula, per deixar de dibuixar pitgi la tecla ESC.

8.1.2. Moure el punt d’Inserció i Seleccionar.

Un cop es troba dins de la taula, per poder moure el punt d’inserció a qualsevol cel·la, polsiles fletxes del teclat o la tecla TAB.Un cop esta situat a la cel·la desitjada, escrigui text com si fos en qualsevol altra pàgina.Per seleccionar:

• Una cel·la: porti el cursor a la esquerra de la cel·la quan tingui forma de fletxa faciclic.


36

• Una columna: porti el cursor a damunt de la columna, quan tingui forma de fletxanegra faci clic.

• Una fila: porti el cursor a l’esquerra de la fila a seleccionar quan tingui forma defletxa a la dreta faci clic.

• Tota la taula: seleccioni l’opció Seleccionar tabla del menú Tabla.

8.1.3. Inserir Files/Columnes/Cel-les i Titols.

Per inserir un títol, seleccioni l’opció Insertar título del menú Tabla, indicant el text i elformat desitjat.Per inserir cel·les, faci clic a la cel·la precedent i triï l’opció Insertar celda del menúTabla.Per inserir files o columnes, faci clic a la fila o columna precedent i triï l’opció Insertarfilas o columnas del menú Tabla. Apareixerà el següent quadre de diàleg:

Figura 48. Insertar Files..

On pot especificar el número de files o columnes a inserir i per sobre o sota de la selecció.

8.1.4. Eliminar Cel·les.

Per esborrar una sèrie de cel·les, ha de seleccionar el conjunt de cel·les a eliminar i triarl’opció Eliminar celdas del menú Tabla.Si el que volem es eliminat tota la taula, ha de seleccionar tota la taula i triar l’opcióBorrar del menú Edición.8.2. El Format de les Taules.

8.2.1. Canviar la Mida.

Per poder canviar la mida de la taula, ha de seleccionar l’opció Propiedades de tabla delmenú Tabla. Apareixerà una finestra que ens demanarà l’amplada i l’alçada de la taula,simplement posant la mida i fent clic al botó Aceptar, canviarà la mida.

8.2.2. Vores i Fons de la Taula.

Per canviar les vores i el fons de la taula, solament ha de seleccionar la taula i triar l’opcióPropiedades de Tabla del menú Tabla. Apareixerà la finestra anterior.Aquí pot establir el color de fons i les vores de la taula. Simplement triant el color i elformat desitjat i fent clic al botó Aceptar.


37

Figura 49. Propietats de Taula..

9. Elements Visuals i Sonors.

9.1. La Gestió d’Imatges i Sons.

9.1.1. Inserir una Imatge de la Galeria.

Per inserir una imatge de la galeria d’imatges, ha de situar-se a la posició on vol posar laimatge, i triar l’opció Imágenes del menú Insertar. Apareixerà una finestra amb lesimatges de la galeria, solament ha de triar la imatge desitjada i fer clic al botó Insertar.

Figura 50. Galeria d’Imatges.


38

9.1.2. Inserir una imatge de fora de la Galeria.

Per inserir una imatge de fora de la galeria d’imatges, ha de situar-se a la posició on volposar la imatge, i triar l’opció Imágen del menú Insertar. Aquí apareixerà una altrafinestra per poder triar l’arxiu d’imatge que vol inserir. Ha de triar l’arxiu i fer clic al botóAceptar.

Figura 51. Imatges.

9.1.3. Propietats de l’Imatge.

Amb l’opció Propiedades de la imagen del menú Edición, podem canviar la imatge,posar-li un vincle i convertir a format GIF o JPEG. Simplement triant les opcionsdesitjadesi fent clic al botó Aceptar per guardar els canvis.

Figura 52. Propietats d’imatge.


39

9.1.4. Assignar un so a una Pàgina.

Solament ha de fer clic a l’opció Propiedades de página del menú Archivo i a l’apartatSonido de fondo triar l’arxiu de so i establir quantes vegades es repetirà. Un cop triades lesopcions desitjades, faci clic al botó Aceptar.

Figura 53. Propietats de Pàgina.

9.2. Altres Elements Visuals.

9.2.1. L’Administrador de Titulars.

Els titulars, són una sèrie d’imatges que van canviant en forma de titulars, es a dir, unobjecte actiu que ressalta de la resta de la pàgina anunciant qualsevol cosa.Per poder fer un titular ha de:Seleccionar l’opció Elementos Activos / Administrador de titulares del menú Insertar,apareixerà una finestra com la següent:


40

Figura 54. Administrador de Titulars..

Amb el botó Agregar, afegeixi imatges a la llista, que pot canviar l’ordre amb els botonsSubir i Bajar, o esborrar-la amb el botó Quitar.També pot definir l’amplada i alçada del titular, l’efecte i el temps de canvi d’una imatge auna altra i pot establir un vincle.

9.2.2. Inserir una Línia Horitzontal.

Per inserir una línia horitzontal, solament ha de situar-se a la posició on vol posar la línia, itriar l’opció Línea horizontal del menú Insertar.Per esborrar una línia horitzontal, solament ha de seleccionar-la i polsar la tecla SUPR.Per canviar el format d’una línia solament ha de seleccionar-la i triar l’opció Propiedadesde la línea horizontal del menú Edición. Apareixerà una finestra en la que pot establirl’amplada i alçada, l’alineació i el color, simplement canviant les opcions desitjades i fentclic al botó Aceptar.


41

Figura 54. Propietats de línia Horitzontal.

9.2.3. Inserir un Text Animat.

Per inserir un text animat, solament ha de seleccionar l’opció ElementosActivos/Marquesina del menú Insertar. Apareixerà una finestra com la següent:

Figura 55. Propietats de Marquesina.

Aquí pot establir el text, la direcció, la velocitat, el comportament, l’aliniació la mida, lesvegades que es repetirà i el color del fons, simplement triant les opcions desitjades i fentclic al botó Aceptar.

9.2.4. Animar un Element.

Per animar un element, es a dir, que aparegui fent un efecte de transició solament ha deseleccionar l’element i fer clic al botó Animación del menú Formato, i fent clic a l’efecteque vol posar.


42

10. VÍDEO

10.1. Inserir un Vídeo.

Per inserir un vídeo, situïs a la posició on vol inserir el vídeo i seleccionar l’opcióElementos Activos / Vídeo del menú Insertar.Aquí ha de triar l’arxiu del vídeo que vol inserir i fer clic al botó Aceptar.

10.2. Propietats del Video.

Per canviar les propietats del vídeo, faci clic al vídeo i seleccioni l’opció Propiedades dela imagen del menú Edición.Activi la fitxa Video. Apareixerà una finestra on podrà establir quantes vegades vol repetirel vídeo, si vol veure els controls de PLAY i PAUSE, i si vol executar el vídeo al carregarla pàgina o al situar el cursor a sobre d’ell.

Figura 56. Propietats d’imatge.

11. Altres Elements de FrontPage.

11.1 Els Elements actius i els Components.

11.1.1. Inserir un Comptador de Visites.

Per inserir un comptador de visites, situï’s al punt on el vol inserir, triï l’opció Elementosactivos/Contador de visitas del menú Insertar. Apareixerà una finestra com la següent:


43

Figura 57. Comptador..

Solament ha d’indicar el format del comptador, el número de dígits i si el vol posar altrecop a 0.

11.1.2. Inserir un Element Temporal.

Pot establir un element temporal a la seva pàgina, un element temporal tindrà una datad’inici i una data de final, durant aquest temps la imatge apareixerà i quan passi el temps,podrà fer que aparegui una altra.Per inserir un element temporal ha de triar l’opció Componente de FrontPage/Imagentemporal del menú Insertar. Apareixerà una finestra com la següent on podrà especificarles opcions comentades anteriorment.


44

Figura 58. Propietats d’Imatge Temporal.

11.2. Els Formularis.

11.2.1. Formulari de Cerca.

Aquest tipus de formulari, permet fer una cerca de totes les pàgines del Lloc Web quecontinguin una paraula clau que l’usuari escriu.Per inserir un formulari de cerca, solament ha de situar-se a la posició on vol inserir elformulari i triar l’opció Elementos Activos/Formulario de búsqueda del menú Insertar.Apareixerà una finestra com la següent:

Figura 59. Propietats de formulari de recerca..


45

Aquí pot especificar l’etiqueta del text a buscar, la de començar a fer la cerca i la deesborrar la paraula del formulari. A l’opció Ancho de caracteres, pot configurar finsquantes posicions pot tenir la paraula o paraules a buscar. Simplement triant les opcionsque l’interessin i fent clic al botó Aceptar.

11.2.2. Formulari de Dades.

Un formulari és un conjunt de camps inclosos a una pàgina. Un formulari proporcionaiteractivitat a un Lloc Web: els usuaris podran donar la seva opinió, demanarinformació,....Els camps inclosos a un formulari, podran ser de tipus:Quadre de text d'una línia: per posar per exemple un nom, cognom,...Quadre de text amb desplaçament: per posar comentaris, observacions,....Casella de verificació: per introduir d'una sèrie d'opcions TOTES les que

vol l'usuari: idioma, estudis,...Botó d'opció: l'usuari solament podrà agafar UNA de les opcions

llistades: sexe, edat,....Menú desplegable: apareixerà una llista desplegable amb opcions per

poder triar una.

Per inserir un formulari, solament ha de triar l'opció Campo de Formulario del menúInsertar i seleccionar el tipus de camp que vol inserir.Els camps del formulari sempre han d'estar dins del quadrat amb línia discontinua quedibuixa FrontPage quan inserim el primer camp.Les propietats de cada camp variaran segons el tipus de camp que triï, es a dir, no seràigual veure les propietats d'un menú desplegable que d'una casella de verificació.A les propietats dels camps es poden determinar des del tipus de dades que vol queintrodueixin al camp fins si un valor ha de ser més gran a X i mes petit a Y.

Figura 60. Formulari.


46

Fent un clic amb el botó dret del ratolí a qualsevol camp i triant l'opció Propiedades delCampo de Formulario, podrà establir les propietats de cada camp.Fent un clic amb el botó dret del ratolí al formulari i triant l'opció Propiedades delFormulario, podrà establir com vol rebre les respostes del formulari, a un arxiu de text o auna adreça de correu electrònic. Simplement establint la opció determinada i fent clic albotó Aceptar.

Figura 61. Propietats de Formulari.

Fent un clic al botó Opciones dins de la finestra anterior i activant la fitxa Página deconfirmación, podrem establir una adreça d'una pàgina per indicar-li a l'usuari que lesseves dades ja han arribat al destí.

Figura 62. Opcions de Formularis.

Disseny d’una eina interactiva de suport a l’assignatura d...

Documents

Transcript of Disseny d’una eina interactiva de suport a l’assignatura d...