silabo ticsarquitectura

23
P-04 SDF-04.1 FACULTAD DE ARQUITECTURA Y ARTES APLICADAS ESCUELA DE ARQUITECTURA PROYECTO FORMATIVO: TIC’s DOCENTE: Ing. Ligia Jácome A. CONTENIDOS AMBATO – ECUADOR Marzo, 2013 MARCO TEORICO

Upload: janeth-zambrano

Post on 18-Nov-2014

253 views

Category:

Documents


3 download

DESCRIPTION

tics arquitectura taller 3

TRANSCRIPT

Page 1: Silabo ticsarquitectura

P-04 SDF-04.1

FACULTAD DE ARQUITECTURA Y ARTES APLICADAS

ESCUELA DE ARQUITECTURA

PROYECTO FORMATIVO:

TIC’s

DOCENTE:

Ing. Ligia Jácome A.

CONTENIDOS

AMBATO – ECUADOR

Marzo, 2013

MARCO TEORICO

Page 2: Silabo ticsarquitectura

PRESENTACION DEL PROYECTO FORMATIVO

Actualmente todas las empresas, industrias e instituciones educativas requieren agilitar

sus procesos, obtener recursos rápidamente y dar a conocer la información institucional

mediante una página web y darse a conocer mediante ella. Con el website institucional

(página web) se podrá tener a la empresa o negocio online, las 24 horas. del día, los 365

días del año. Las ofertas de sus productos o servicios podrán ser vistas por millones de

personas, en todo el mundo, de una forma efectiva, dinámica y muy económica.

Estos importantes beneficios pueden obtenerse de manera inmediata, diseñando la

página web adecuada y para ello se deberá aplicar las estrategias de diseño necesarias;

luego de realizar un apropiado análisis de los requerimientos del usuario plasmado en

un diseño pertinente e implementado con herramientas de actualizadas y publicarlas en

la web.

En la actualidad el sector productivo demandan de profesionales que sepan manejar

herramientas, crear recursos y sitios web interactivos y dinámicos aplicando métodos y

herramientas así como los principios técnicos y metodológicos de cada herramienta de

la web 2.0; por tal motivo en este proyecto formativo se permitirá al alumno aprender a

manejar herramientas ofimáticas, obtener y manejar recursos de la web 2.0 que facilite

el trabajo institucional y cotidiano.

Page 3: Silabo ticsarquitectura

INDICE DE CONTENIDOS

MARCO TEORICO ......................................................................................................... 1

PRESENTACION DEL PROYECTO FORMATIVO ................................................. 2

CONTENIDOS DEL SABER SER .............................................................................. 4

DESARROLLO DE CONTENIDOS............................................................................ 4

FUNDAMENTOS DE LAS TIC`S ........................................................................... 4

HERRAMIENTAS OFIMATICAS ........................................................................... 6

Que es la Ofimática?. .................................................................................................... 6

Herramientas y procedimientos ofimáticos ................................................................... 7

LA WEB 1.0 ............................................................................................................ 11

EVOLUCIÓN DEL INTERNET ................................................................................ 11

¿Qué es la Web 1.0? ....................................................................................................... 13

CARACTERISTICAS DE LA WEB 1.0 ....................................................................... 13

HERRAMIENTAS DELA WEB 1.0 ............................................................................. 14

LA WEB 2.0 ............................................................................................................ 14

¿Qué es la Web 2.0? .................................................................................................... 14

Origenes de HTML ..................................................................................................... 16

BIBLIOGRAFIA ............................................................................................................ 22

Page 4: Silabo ticsarquitectura

CONTENIDOS DEL SABER SER

Actitud creativa frente al reto del proceso de enseñanza-aprendizaje combinando

con la responsabilidad, ética en el estudio y cumplimiento de tareas ayudan en la

construcción del conocimiento en el proyecto formativo; además contribuyen al

dicente de alguna manera a su realización personal, respondiendo de alguna manera

a sus necesidades: vitales, intelectuales, afectivas, estéticas, etc.

La responsabilidad, puntualidad y voluntad por trabajar en equipo son los valores

fundamentales y básicos que el alumno debe adoptar en este proyecto formativo

para la elaboración de los trabajos y tareas intra -extra curriculares; actitudes que

también le servirán en el futuro para que el estudiante pueda desempeñar sus

funciones y competencias en el campo profesional.

DESARROLLO DE CONTENIDOS

Nombre del taller: FUNDAMENTOS DE LAS TIC`S

Propósito del taller.- Enseñar al estudiante toda la fundamentación teórica y

generalidades de las tecnologías de la información.

Es un concepto muy asociado al de informática, entendiendo a esta última como

recursos, procedimientos y técnicas usadas en el procesamiento, almacenamiento y

transmisión de información, definición que, por su parte, viene sufriendo cambios de la

mano de las TIC pues hoy, no basta con hablar de una computadora cuando se hace

referencia al procesamiento de la información. Internet puede formar parte de ese

procesamiento que, quizás, se realice de manera distribuida y remota. Y al hablar de

procesamiento remoto, además de incorporar el concepto de telecomunicación, se puede

estar haciendo referencia a un dispositivo muy distinto a lo que tradicionalmente se

entiende por computadora pues podría llevarse a cabo, por ejemplo, con un teléfono

Page 5: Silabo ticsarquitectura

móvil o una computadora ultra-portátil, con capacidad de operar en red mediante

Comunicación inalámbrica y con cada vez más prestaciones, facilidades y rendimiento.1

«Las tecnologías de la información y la comunicación no son ninguna panacea ni

fórmula mágica, pero pueden mejorar la vida de todos los habitantes del planeta. Se

dispone de herramientas para llegar a los Objetivos de Desarrollo del Milenio, de

instrumentos que harán avanzar la causa de la libertad y la democracia y de los medios

necesarios para propagar los conocimientos y facilitar la comprensión mutua» (Kofi

Annan, Secretario general de la Organización de las Naciones Unidas.

La asociación de la informática y las telecomunicaciones en la última década del siglo

XX se ha beneficiado de la miniaturización de los componentes, permitiendo producir

aparatos «multifunciones» a precios accesibles desde el año 2000.

El uso de las TIC no para de crecer y de extenderse, sobre todo en los países ricos, con

el riesgo de acentuar localmente la brecha digital y social y la diferencia entre

generaciones. Desde la agricultura de precisión y la gestión del bosque a la

monitorización global del medio ambiente planetario o de la biodiversidad, a la

democracia participativa (TIC al servicio del desarrollo sostenible) pasando por el

comercio, la telemedicina, la información, la gestión de múltiples bases de datos, la

bolsa, la robótica y los usos militares, sin olvidar la ayuda a los discapacitados (por

ejemplo, ciegos que usan sintetizadores vocales avanzados), las TIC tienden a ocupar un

lugar creciente en la vida humana y el funcionamiento de las sociedades.

Algunos temen también una pérdida de libertad individual (efecto «Gran Hermano»,

intrusismo creciente de la publicidad no deseada...). Los prospectivistas7 piensan que las

TIC tendrían que tener un lugar creciente y podrían ser el origen de un nuevo paradigma

de civilización.

Page 6: Silabo ticsarquitectura

Nombre del taller: HERRAMIENTAS OFIMATICAS

Propósito del taller.- Enseñar al estudiante el manejo de las herramientas

ofimáticas para crear documentos, hojas de cálculo y presentaciones, en función de

las necesidades de la profesión

Que es la Ofimática?.

Es una recopilación de programas, los cuales son utilizados en oficinas y sirve para

diferentes funciones como crear, modificar, organizar, escanear, imprimir etc. archivos

y documentos. Son amplia mente usados en varios lugares, ya que al ser eso (una

recopilación), hace que sea asequible adquirir toda la suite, que programa por programa,

lo cual es más complejo, al tener que conseguir programa por programa, y en caso del

software pagado, más caro.

Generalmente las suites ofimáticas,(de oficina).De estas suites, al incluir los programas

en estas, no hay un estándar sobre los programas a incluir; pero la gran mayoría

incluyen al menos un procesador de textos y una hoja de cálculo. Adicionalmente, la

suite puede contener un Programa de presentación, un sistema de gestión de base de

datos, herramientas menores de gráficos y comunicaciones, un gestor de información

personal (agenda y cliente de correo electrónico) y un navegador web.

En la actualidad las suites ofimáticas dominantes en el mercado son, por parte del

software pagado, Microsoft Office, la cual posee sus propios formatos cerrados de

documentos para cada uno de sus programas. Respecto al software libre, está

OpenOffice, desarrollado por Sun Microsystems, también con un formato para cada

programa, pero de código abierto. Debido a esto y a la pobre compatibilidad entre las

suites de Microsoft con otros formatos abiertos (como OpenDocument), en cada suite

ofimática se hacen desarrollos que, generalmente, son poco adaptables a los cambios

Page 7: Silabo ticsarquitectura

que hace una y otra suite

Definición de Ofimática

La ofimática es el conjunto de técnicas, aplicaciones y herramientas informáticas que se

utilizan en funciones de oficina para optimizar, automatizar y mejorar los

procedimientos o tareas relacionados.

Las herramientas ofimáticas permiten idear, crear, manipular, transmitir y almacenar

información necesaria en una oficina. Actualmente es fundamental que estas estén

conectadas a una red local y/o a internet.

Herramientas y procedimientos ofimáticos

* Procesamiento de textos: Ver Procesador de texto.

* Hoja de cálculo

* Herramientas de presentación multimedia.

* Base de datos.

* Utilidades: agendas, calculadoras, etc.

* Programas de e-mail, correo de voz, mensajeros.

* Herramientas de reconocimiento de voz.

* Suite o paquete ofimático: paquete de múltiples herramientas ofimáticas como

Microsoft Office, OpenOffice, etc.

Word.

Aunque sus posibilidades van mucho más allá, es un PROCESADOR DE TEXTOS. Si

lo que usted desea es redactar una carta, un fax, un currículum, llevar a cabo un informe

o memorando, incluso si quiere hacer un folleto, un manual, una tesis, monografía o

resumen, crear una agenda o un calendario; ésta es su aplicación soñada.

También puede, claro está, utilizar toda su potencia, crear páginas web, realizar

Page 8: Silabo ticsarquitectura

gráficos, organigramas, diseños con terminación profesional, introducirle imágenes,

animaciones, sonidos, etc.

Excel.

Su función principal es la de una HOJA DE CALCULO o PLANILLA

ELECTRONICA. Advertencia: Su utilización puede causarle un suspiro de alivio.

Puede crear facturas, hojas de balance, control de gastos, llevar estados de cuenta,

incluso puede manejar toda la economía de su hogar y empresa, incluyendo el manejo

de sueldos, y el control de su tarjeta de crédito.

Por suerte, la fiabilidad de sus funciones permiten innumerables posibilidades... también

podemos confiarle estadísticas y complicados cálculos, compartir los datos de manera

sencilla e incluso ponerlos en la web. Además podemos insertarle todo tipos de objetos

al igual que en Word, sonidos, imágenes, etc… y los tan bienvenidos comentarios, que

pueden ser introducidos en cada celda. Como beneficio adicional, maneja en forma muy

útil los datos, filtrando los contenidos para darnos solo la información que nos interesa.

Access.

Una BASE DE DATOS por excelencia. Se ha ganado por si misma un reconocimiento

del usuario a cualquier nivel. Los diferentes niveles de manejo de Access harán la

diferencia del resultando de su creación. Puede llevar la administración de contactos y

llamadas, controlar el inventario y los pedidos, llevar un registro de libros, revistas,

música, etc. Las aplicaciones son innumerables.

Su potencia le permitirá crear su propio programa para manejar todos los datos que

desee, relacionarlos a su gusto, mostrarlos actualizados en todo momento, imprimir

informes completos y crear una interfaz que permita a otros usuarios ingresar, dar de

baja y modificar datos con simpleza.

PowerPoint.

Utilidad ideal para realizar PRESENTACIONES.

Una forma amena para presentar a los demás sus proyectos, ideas, resultados o

Page 9: Silabo ticsarquitectura

cometidos de una empresa, cualidades de su producto, explicaciones de sus clases, etc.

Es el formato ideal para acompañarlo en sus discursos o presentaciones con público, o

bien, enviar el archivo y dejar que se explique por si mismo.

Puede realizar diferentes animaciones, insertarle imágenes, gráficos, películas, música o

sus propias palabras, si lo desea. También permite, si usted posee una cámara web y un

micrófono, hacer difusiones en directo a grupos pequeños, y mostrarles además su

presentación.

Outlook.

Administra su CORREO electrónico. Pero va mucho más allá…si es una persona

ocupada, con muchas actividades, o se contacta con mucha gente, dará las gracias a esta

aplicación en más de una ocasión.

Permite hacer un seguimiento de los mensajes y contactos que usted tenga, reciba o

envíe. También puede organizar los mensajes en carpetas, por colores o vistas, puede

seleccionar el correo no deseado y mucho más.

Incluye además la posibilidad de llevar su agenda con calendario, puede recordarle sus

tareas a realizar y le permite escribir notas, que puede ordenar según diferentes colores

si es que necesita hacer un apunte.

Page 10: Silabo ticsarquitectura

Negocios, Hogar y Ocio.

Ventajas competitivas, inversión inteligente, estrategias de mercado, marketing, gestión

de clientes, controles de stock, eficiencia de procesos, evalúo de productividad,

administración, contabilidad… la lista es interminable. Todas preocupaciones de

empresarios y funcionarios.

Ofimática, Word, Excel, Access, PowerPoint, Outlook… cambiando términos por

términos?

El mundo de la ofimática solo parece agregar más preocupaciones con tantos

términos…

Pero no, al contrario de esto ha brindado la posibilidad de llevar una gestión positiva y

Page 11: Silabo ticsarquitectura

de manera sumamente sencilla. Tanto así que estas herramientas cruzaron el portal de la

oficina, para afirmarse de igual forma en el hogar, en los estudios y en el ocio. Ya sea

una ama de casa, un empresario, un escolar o universitario, una secretaria, un

comerciante, o se encuentre retirado; las múltiples funciones de estas pocas

herramientas conseguirán atraparlo.

De manejo sencillo y una adaptabilidad sorprendente, solo resta ponerse delante de

ellas.

Una recomendación... un manejo fluído de cada una, le abrirán un mundo de

posibilidades.

Un consejo… utilice el poder de cada herramienta al máximo.

Una colaboración… ideas y más ideas de cómo aplicar cada Utilidad.

Un secreto… esté atento a nuestras novedades, le ayudaremos en el proceso.

Nombre del taller: LA WEB 1.0

Propósito del taller.- Enseñar al estudiante las generalidades de las tecnologías del

internet y la utilización de las herramientas de la web1.0.

EVOLUCIÓN DEL INTERNET

Page 12: Silabo ticsarquitectura

A finales de los años sesenta (1969), en plena guerra fría, el Departamento de Defensa

Americano. Departamento de Defensa, a través de su Agencia de Proyectos de

Investigación Avanzados, decidió crear una red experimental de cuatro nodos, que se

denominó ARPAnet.

ARPA desarrolló una nueva tecnología denominada conmutación de paquetes, cuya

principal característica reside en fragmentar la información, dividirla en porciones de

una determinada longitud a las que se llama paquetes. Cada paquete lleva asociada una

cabecera con datos referentes al destino, origen, códigos de comprobación, etc.

En 1972 se introdujo un sistema de correo electrónico y el control de transferencia de

ficheros.

En 1974, se presentó el protocolo “Transmission Control Protocol / Internet Protocol”

(TCP/IP). Este protocolo proporcionaba un sistema independiente de intercambio de

datos entre ordenadores y redes locales de distinto origen, eso sí, conservando las

ventajas relativas a la técnica de conmutación de paquetes.

Esta nuevainnovación hace que la nueva red que crecia cada vez se empiece a llamarse

INTERNET. En gran parte, este espectacular crecimiento se debe a la notable mejora en

la facilidad de uso de los servicios ofrecidos, dado que, aún manteniéndose los servicios

originales de transferencia de ficheros, correo electrónico o acceso remoto, la irrupción

de la ‘TELARAÑA MUNDIAL’, World Wide Web (www), un servicio de consulta de

documentos hipertextuales, ha sido el paso definitivo hacia la popularidad de la que

actualmente goza. En la actualidad se habla de que hay más de dos millones de usuarios

ARPANET(1972)

DARPA(1973)

INTERNET(1989) (TCP/IP)

Page 13: Silabo ticsarquitectura

conectados a esta gran autopista de la información y se ha hido introduciendo un sin

número de aplicaciones, protocolos y servicios que hacen que cada vez más crezca y se

difunda este maravilloso mundo del internet.

¿Qué es la Web 1.0?

Es un tipo de web estática con documentos que jamás se actualizaban y los contenidos

dirigidos a la navegación (HTML y GIF).

a 'Web 1.0 (1991-2003) es la forma más básica que existe, con navegadores de sólo

texto bastante rápidos. Después surgió el HTML que hizo las páginas web más

agradables a la vista, así como los primeros navegadores visuales tales como IE,

Netscape,explorer (en versiones antiguas), etc

EVOLUCION DE LA WEB 1.0

CARACTERISTICAS DE LA WEB 1.0

Páginas estáticas en vez de dinámicas por el usuario que la visita

La web 1.0 dio sus inicios en 1989

La web 1.0 que básicamente se refiere a un sitio web

En el 2001, que es visto por muchos como el momento en que el dio un giro.1

Page 14: Silabo ticsarquitectura

El uso o Marcos.

Extensiones propias deL como bilnk y marque, etiquetas introducidas durante la

guerra de navegadores web.

Libros de visitas online o guestbooks

botones , casi siempre a una resolución típica de 88x31 en tamaño promocionando

navegadores web u otros productos

HERRAMIENTAS DELA WEB 1.0

Mozilla Firefox: (Redirige desde firefox 1.0)Mozilla firefox un navegador web libre y

de código abierto descendiente de incrementándose desde que firefox1.0 fuera

publicado

Nombre del taller: LA WEB 2.0

Propósito del taller.- Enseñar al estudiante la utilización de las herramientas de la

web 2.0.

¿Qué es la Web 2.0?

Es una evolución de Web 1.0. Es un “ecosistema” de la información: Google,

Wikipedia, Ebay, Youtube, SkypeSkype, Writely, Blogger, RSS, Flickr, Emule, Todas

estas aplicaciones y sitios tienen en común que su principal activo es el usuario. A

mayor número de usuarios aumenta el valor del sitio y su contenido. No hay versiones,

siempre está cambiando. la Web 2.0 esta destinada a la navegación. Tiene innovaciones

(tecnologías) Sitios representativos de Web 2.0:

Google : es más que un buscador, es una marca que abarca desde un sistema de

correo electrónico (Gmail) hasta un mapa mundial con callejeros y

ortofotografías (Google maps).

Emule es una aplicación que permite el intercambio de archivos entre usuarios

de forma descentralizada.

Wikipedia es un proyecto de encipledia libre donde son los usuarios los que

escriben los artículos.

Page 15: Silabo ticsarquitectura

Ebay es un sitio que permite a millones de usuarios en todo el mundo comprar y

vender cualquier cosa en cualquier sitio.

Youtube es el sitio favoritos de miles de usuarios para ver vídeos que los mismo

usuarios aportan y comparten.

Skype es una aplicación que permite hablar gratuitamente con otros usuarios que

se encuentran en cualquier parte del mundo, usando tecnología de voz sobre IP.

Skype permite incluso hablar por teléfono con todo el mundo a un precio muy

competitivo.

Writely Ofrece un procesador de texto en línea que permite compartir los

documento con otros usuarios e incluso publicar automáticamente en Blogger.

Blogger , es la aplicación más popular para crear un weblog de forma fácil. Los

weblogs están revolucionando Internet y blogger es la forma más fácil de crear

un diario en Internet.

Flick es un sitio que facilita que los internautas compartan fotografías. Permite

de forma gratuita la creación de álbumes que luego se presentan como

diapositivas.

En conclusión WEB 2.0 es más actitud y modelo de negocio antes que tecnología:

centrado en COMUNICACIÓN, centrado en EL USUARIO, la tecnología debe soportar

los conceptos y en el constante cambio.

¿Qué significa "web semántica"?

La Web semántica es la idea de añadir metadatos semánticos a la World Wide Web.

Esas informaciones adicionales (describiendo el contenido, el significado y la relación

de los datos)deben ser dado en forma formal, así que es posible evaluarlas

automáticamente por máquinas. El destino es mejorar la World Wide Web por ampliar

la interoperabilidad entre los sistemas informáticos y reducir la mediación de

operadores humanos necesaria. El precursor de la idea, Tim Berners-Lee, intentó desde

el principio incluir informaciones semánticas en su creación, la World Wide Web, pero

por «causas diferentes» no fue posible. Introdujo la Web semántica para recuperar esta

omisión.

Page 16: Silabo ticsarquitectura

Origenes de HTML

HTML, siglas de HyperText Markup Language (Lenguaje de Marcas de Hipertexto),

es el lenguaje de marcado predominante para la construcción de páginas web. Es usado

para describir la estructura y el contenido en forma de texto, así como para

complementar el texto con objetos tales como imágenes. HTML se escribe en forma de

"etiquetas", rodeadas por corchetes angulares (<,>). HTML también puede describir,

hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por

ejemplo Javascript), el cual puede afectar el comportamiento de navegadores web y

otros procesadores de HTML.

Elementos

Los elementos son la estructura básica de HTML. Los elementos tienen dos propiedades

básicas: atributos y contenido. Cada atributo y contenido tiene ciertas restricciones para

que se considere válido al documento HTML. Un elemento generalmente tiene una

etiqueta de inicio (p.ej. <nombre-de-elemento>) y una etiqueta de cierre (p.ej.

</nombre-de-elemento>). Los atributos del elemento están contenidos en la etiqueta de

inicio y el contenido está ubicado entre las dos etiquetas (p.ej. <nombre-de-

elemento atributo="valor">Contenido</nombre-de-elemento>). Algunos elementos,

tales como <br>, no tienen contenido ni llevan una etiqueta de cierre. Debajo se listan

varios tipos de elementos de marcado usados en HTML.

Page 17: Silabo ticsarquitectura

Estructura general de una línea de código en el lenguaje de etiquetas HTML

El marcado estructural describe el propósito del texto. Por ejemplo, <h2>Golf</h2>

establece a "Golf" como un encabezamiento de segundo nivel, el cual se mostraría en un

navegador de una manera similar al título "Marcado HTML" al principio de esta

sección.

El marcado presentacional describe la apariencia del texto, sin importar su función. Por

ejemplo, <b>negrita</b> indica que los navegadores web visuales deben mostrar el

texto en negrita, pero no indica qué deben hacer los navegadores web que muestran el

contenido de otra manera (por ejemplo, los que leen el texto en voz alta). En el caso de

<b>negrita</b> e <i>itálica</i>, existen elementos que se ven de la misma manera pero

tienen una naturaleza más semántica: <strong>enfásis fuerte</strong> y

<em>énfasis</em>.

El marcado hipertextual se utiliza para enlazar partes del documento con otros

documentos o con otras partes del mismo documento. Para crear un enlace es necesario

utilizar la etiqueta de ancla <a> junto con el atributo href, que establecerá la dirección

URL a la que apunta el enlace. Por ejemplo, un enlace a la Wikipedia sería de la forma

<a href=”es.wikipedia.org”>Wikipedia</a>. También se pueden crear enlaces sobre

otros objetos, tales como imágenes <a href=”enlace”><img src=”imagen” /></a>.

Ejemplo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html lang="es">

<head>

<title>Ejemplo</title>

</head>

<body>

<p>ejemplo</p>

</body>

</html>

Page 18: Silabo ticsarquitectura

Elementos multimedia en HTML

Para insertar imagen usamos <IMG SRC="dibujo.gif">

Para insertar video y sonido usamos <EMBED SRC="dibujo.gif">

Para insertar sonido de fondo usamos <BGSOUND SRC="dibujo.gif">

Tablas.

Las tablas son definidas por las etiquetas <table> y </table>.

Dentro de estas dos etiquetas colocaremos todas las otras etiquetas, textos e imágenes

que darán forma y contenido a la tabla.

Las tablas son descritas por líneas de izquierda a derecha. Cada una de estas líneas es

definida por otra etiqueta y su cierre: <tr> y </tr>

Asimismo, dentro de cada línea, habrá diferentes celdas. Cada una de estas celdas será

definida por otro par de etiquetas: <td> y </td>. Dentro de estas etiquetas será donde

coloquemos nuestro contenido.

Aquí tenéis un ejemplo de estructura de tabla:

<table>

<tr>

<td>Celda 1, linea 1</td>

<td> Celda 2, linea 1</td>

</tr>

<tr>

<td> Celda 1, linea 2</td>

Page 19: Silabo ticsarquitectura

<td> Celda 2, linea 2</td>

</tr>

</table>

Formularios

El código de un formulario viene definido por las etiquetas <FORM> y </FORM>.

Puede tener las siguientes propiedades:

El cuerpo del formulario esta compuesto por las etiquetas <input>, <select> y

<textarea> que pueden tener diversas propiedades. La etiqueta <INPUT...> es el campo

básico de entrada y según su tipo cambia bastante su comportamiento, sus propiedades

son:

name: Como podemos suponer, es el nombre de la variable que le asignaremos al dato

que se escriba.

value: representa el valor por defecto que tomará la variable.

size: es el tamaño en caracteres de la ventana de visualización.

maxlength: tamaño máximo de caracteres que se pueden introducir en el campo.

name: nombre del campo.

id: (identificador), nombre que utilizado para acceder al campo desde javascript.

type: determina el tipo:

text: es el valor por defecto de este atributo, e indica que se trata de una entrada de datos

formada por una línea de texto.

submit: muestra el botón de envío del contenido del formulario. Si no hay un campo de

este tipo, el formulario no se puede enviar (sin javascript).

reset: muestra el botón que elimina el contenido del formulario.

password: es una entrada de tipo texto en la que se enmascaran los datos, sustituyéndose

por asteriscos. Tiene los mismos atributos que el tipo text.

checkbox: se trata de una casilla de selección. Si el usuario marca la casilla, su valor

(por defecto la palabra on) se envía. Si no la marca no se envía nada (a diferencia de lo

que pudiera pensarse). Si queremos que en principio aparezca como marcado, por lo que

el usuario no necesitará marcarlo, añadimos el atributo checked.

Page 20: Silabo ticsarquitectura

radio: se utiliza para que el usuario pueda elegir una opción entre varias. En este caso,

para todas las opciones el atributo name será el mismo y lo único que cambiará será el

atributo value, que almacenará el nombre de cada opción y será el valor que reciba la

variable y que nosotros recibiremos. Si el usuario no marca ninguna, no se envía nada.

En cuanto al <TEXTAREA>, es un campo de texto para introducir varias líneas, hay

que destacar dos propiedades que le diferencian del <INPUT>, rows que indica el

número de filas y cols que indica el número de caracteres o columnas por línea.

La lista despegable, <SELECT> tiene prácticamente las mismas propiedades que el tipo

<INPUT>, pero además dentro se deben definir las etiquetas <OPTION> donde se

mostrarán los elementos a mostrar. Con el atributo selected se muestra por defecto un

elemento de la lista seleccionado. Si no se especifica el atributo value se interpreta que

el valor es el texto a mostrar. EL campo <SELECT> admite la propiedad multiple, que

permite devolver varios valores, su usao lo veremos más adelente, con PHP.

Ejemplo:

<form method=post action=mailto:[email protected] name=pr7 enctype="application/x-www-

form-urlencoded">

Texto corto<input name=texto_corto>

Texto oculto<input type= password name=texto_oculto> <br>

<input name=sexo type=radio value=hombre checked> Hombre <br>

<input name=sexo type=radio value=mujer> Mujer <br>

<input name=check type=checkbox checked> Por favor contestar <br>

<input name=valor_oculto type=hidden value="123">

<textarea name=area_texto rows=4 cols=20>Escribe tu comentario</textarea>

<select name=seleccion size=3>

<option>Primero</option>

<option selected>Segundo</option>

<option value=3o>Tercero</option>

</select>

<input type=submit value=Enviar>

<input type=reset value=Borrar>

</form>

Page 21: Silabo ticsarquitectura

Texto corto Texto oculto

Hombre

Mujer

Por favor contestar

Escribe tu comentario

Primero

Segundo

TerceroEnviar Borrar

Frames.

Un frame es una especie de marco o recuadro independiente en el que podemos cargar

una página web.

Podemos así dividir una página web en diferentes partes o ventanas, cada una con sus

propios bordes y barras de desplazamiento, pudiendo cargar dentro de cada una de ellas

una página externa independiente.

Las etiquetas <FRAMESET>...</FRAMESET> son las que van a decirle al navegador

dónde empiezan y dónde acaban los marcos.

Sus principales atributos o parámetros son:

* COLS= " x,y,z,..." , para definir el nº de columnas o marcos verticales que va a tener

la ventana, y donde las variables x,y,z... van a definir el tamaño de cada marco vertical.

*ROWS=" x,y,z,..." , para definir el nº de filas o marcos horizontales que va a tener la

ventana, y donde las variables x,y,z... van a definir el tamaño de cada marco horizontal.

* BORDER= " n " , con n = nº entero = nº de píxeles. En el caso de que se haya

establecido FRAMEBORDER=" 1 " o no se haya especificado, este atributo nos

permite definir el grosor del borde. Sólo funciona con Nestcape.

* FRAMESPACING= " n " , con n = nº entero = nº de píxeles. Nos permite definir el

espacio entre los marcos, y en el caso de que se haya establecido FRAMEBORDER=" 1

" o no se haya especificado, este atributo nos permite definir el grosor del borde. Sólo

funciona con Explorer.

Page 22: Silabo ticsarquitectura

* BORDERCOLOR= " color " , donde color puede venir especificado mediante su

nombre web en inglés o mediante su código hexadecimal. Nos permite establecer el

color de los bordes de los marcos.

Ejemplo.

<html>

<head>

<title>Mi página</title>

</head>

<frameset rows="20%,*" >

<frame name="" src="a.html" marginwidth="10" marginheight="10"

scrolling="auto" >

<frame name="" src="b.html" marginwidth="10" marginheight="10"

scrolling="auto" >

</frameset>

</html>

VII BIBLIOGRAFIA

Tecnologías del la web.

Piattini Velthuis

Editorial ra-ma (2ª ed.)

Diseño digital en Macromedia.

Thomas Berners.

Piattini Velthuis

Editorial ra-ma (1ª ed.)

Fundamento de bases de datos

H. Korth.

Manuales de Dream Weaver y Flash

Page 23: Silabo ticsarquitectura

Internet

Folleto preparado por el profesor.

_______________________

FIRMA DEL DOCENTE

FECHA: