Elaboracion de Paginas WEB

ELABORACION DE PÁGINAS WEB.

1. ANALIZAR LOS ELEMENTOS FUNDAMENTALES DEL DISEÑO1.1. ANALIZAR LAS TEORIAS DEL DISEÑO1.2. IDENTIFICAR EL IMPACTO Y EL ENFOQUE EN DISEÑOS EXISTENTES.1.3. DISEÑAR FORMATOS CONSIDERANDO LAS ZONAS AUREAS, DIRECCION SENTIDO Y

EQUILIBRIO.1.4. APLICAR LA TEORIA DEL COLOR CONSIDERANDO EL CIRCULO CROMATICO, CONSTRASTES,

EL RGB Y CMY.

2. MANEJAR LOS ELEMENTOS BASICOS DE UN LENGUAJE USADO EN LA CREACION DE PÁGINAS WEB.2.1. DEFINIR OBJETIVOS Y CONTENIDOS DE LA PÁGINA WEB.2.2. ESQUEMATIZAR LA ESTRUCTURA GENERAL DE UNA PAGINA WEB.2.3. UTILIZAR ETIQUETAS EN UNA PAGINA WEB.2.4. ESTABLECER VINCULOS E HIPERVINCULOS.2.5. MANIPULAR OBJETOS Y FORMULARIOS EN UNA PAGINA WEB.2.6. MANIPULAR TABLAS EN UNA PAGINA WEB.2.7. MANIPULAR IMÁGENES Y ANIMACIONES EN UNA PAGINA WEB.2.8. DEFINIR SECCIONES DE MAPEO DE IMÁGENES EN UNA PAGINA WEB.2.9. INSERTAR SONIDO Y VIDEO EN UNA PAGINA WEB.2.10. IMPLEMENTAR SERVICIOS DE CORREO EN UNA PAGINA WEB.

3. DISEÑAR UNA PAGINA WEB CON UN SOFTWARE DE APLICACIÓN.

3.1. DEFINIR OBJETIVOS Y CONDENIDOS DE LA PÁGINA WEB.3.2. ESTABLECER ETIQUETAS EN LA PÁGINA WEB.3.3. ESTABLECER LINKS DENTRO DE LA PÁGINA WEB, ENTRE PÁGINAS WEB Y ENTRE

SERVIDORES.3.4. MANIPULAR IMÁGENES DENTRO DE LA PÁGINA WEB.3.5. ESTRUCTURAR TABLAS EN UNA PAGINA WEB.3.6. INSERTAR SONIDO Y VIDEO EN UNA PAGINA WEB.3.7. ALMACENAR PÁGINAS WEB EN UN SERVIDOR DEDICADO O GRATUITO.

4. PUBLICAR PAGINAS WEB EN LOS SERVIDORES DE INTERNET4.1. IDENTIFICAR LOS SERVIDORES DE INTERNET DISPONIBLES PARA PUBLICACION DE

INFORMACION.4.2. SELECCIONAR UN SERVIDOR DE INTERNET CONSIDERANDO LAS CARACTERISTICAS DE LA

PÁGINA WEB.4.3. UTILIZAR LA PÁGINA DEL SERVIDOR DE INTERNET PARA ALOJAR UNA PAGINA WEB.4.4. VERIFICAR EL FUNCIONAMIENTO DE LA PÁGINA WEB DENTRO DEL SERVIDOR

SELECCIONADO.

ELABORACION DE PAGINAS WEB MODULO II_________________________________________________________________________________________________

5. ANALIZAR LOS ELEMENTOS FUNDAMENTALES DEL DISEÑO

¿Qué es el diseño? Proceso de creación visual con un propósito, el cual cumple con exigencias practicas. Un buen diseño es la mejor expresión visual de la esencia de `algo` cuya creación no debe ser solo estética sino también funcional.

ELEMENTOS DEL DISEÑO

Los siguientes elementos son las bases que construyen el Diseño.

Línea

Una línea es definida como una marca con longitud y dirección, creada mediante un punto que se mueve a lo largo de una superficie. Una línea puede variar en longitud, ancho, dirección, curvatura y color. La línea puede ser de dos dimensiones (una línea de lápiz sobre papel), o tres dimensiones implícitas.

Forma

Una figura plana o una forma es creada cuando líneas actuales o implícitas se encuentran alrededor de un espacio. Un cambio en el color o el sombreado puede definir una forma. Las formas pueden ser clasificadas en varios tipos: geométricas (cuadrado, triángulo, círculo) y orgánicas (irregulares en contorno).

Tamaño

INFORMATICA TERCER SEMESTRE


Este se refiere a las variaciones de las proporciones de los objetos, líneas o formas. Hay una variación de tamaño en objetos ya sean reales o imaginarios.

Espacio

Espacio es el área vacía o abierta entre, alrededor, arriba, debajo o entre objetos. Figuras y formas son realizadas en el espacio alrededor y entre él. El espacio también es llamado bidimensional o tridimensional. El espacio positivo es rellenado con formas o figuras. El espacio negativo rodea una forma o figura.

Color

El Color es el carácter percibido de una superficie de acuerdo con la longitud de onda o la luz reflejada desde esta. El Color posee tres dimensiones: TINTE (otra palabra para color, indicada por su nombre así como rojo o amarillo), VALOR (su luminosidad o oscuridad), INTENSIDAD (su brillo u opacidad).

Textura

La Textura es la forma como se siente la superficie (textura actual) o como puede ser observada (textura implícita). Las Texturas son descritas con palabras como áspero, sedoso o rugoso.

Valores

El Valor es que tan oscuro o claro se ve algo. Podemos alcanzar cambios de valores en el color por medio de la adición de blanco o negro a dicho color. Claroscuro usa valores en los dibujo mediante contrastes de claros y oscuros en una composición.

Principios de Diseño

Los principios emplean elementos del diseño para crear composiciones.

Balance



El Balance es el sentido de equidad visual en una forma, figura, valor, color, etc. El Balance se puede hacer simétrica o uniformemente en objetos, valores, colores, texturas, formas, etc.,

Contraste

El contraste es la yuxtaposición (fusión) de los elementos opuestos.

Énfasis

El Énfasis es usado para crear ciertas partes de sus trabajos artísticos a través de llamado atención de manera especial. El centro de interés o punto foco es el lugar del dibujo que le invita a enfocar su mirada.

Proporción

La Proporción describe el tamaño, ubicación o el monto de una cosa comparada con otra.

Patrones

Los Patrones son creados mediante la repetición de un elemento (línea, forma o color) una y otra vez.



Gradación

La Gradación es el tamaño y dirección producidos por una perspectiva lineal. La Gradación del color es desde gamas calidas a frías y por su parte los tonos oscuros a claros producen una perspectiva aérea. La Gradación puede agregar interés y movimiento a una forma

Composición

La combinación de distintos elementos para formar un todo.

1.1. ANALIZAR LAS TEORIAS DEL DISEÑO.

MINIMALISMO.

El minimalismo es una corriente estética derivada de la reacción al pop art. Frente al colorismo, a la importancia de los medios de comunicación de masas, frente al fenómeno de lo comercial y de un arte que se basaba en la apariencia, el minimalismo utilizó conceptos diametralmente opuestos. El sentido de la individualidad de la obra de arte, la privacidad, una conversación conceptual entre el artista, el espacio circundante y el espectador. Así como la importancia del entorno como algo esencial para la comprensión y la vida de la obra.

Los preceptos básicos del minimalismo son: a. Utilizar colores puros, b. Asignarle importancia al todo sobre las partes, c. Utilizar formas simples y geométricas realizadas con precisión mecánica, d. Trabajar con materiales industriales de la manera más neutral posible y diseñar sobre

superficies inmaculadas. e. Da gran importancia al espacio y a los materiales ecológicosf. El resultado que define este estilo en un concepto es la palabra “limpieza”.

Hay muchas variantes del minimalismo, con un toque más o menos oriental, o más o menos escandinavo. Actualmente tiene gran difusión en Europa, entre los más jóvenes, sumado a toda una corriente de muebles de diseño danés contemporáneo.



La decoración minimalista, se nutre de las formas puras, simples, y juega con sus volúmenes, su iluminación y sus superficies.

Los creadores minimalistas reducen al máximo los elementos propios del arte, los volúmenes y formas en escultura. De forma análoga proceden en la arquitectura o en la pintura. Intentan condensar en escasos elementos sus principios artísticos y reflexiones.

CONCEPTUALISMO.

El movimiento artístico surgido a finales de los años sesenta, cuyos exponentes rechazan el arte como artículo de lujo, permanente, portátil y vendible, proponiendo un tipo de arte en el que cuenta primordialmente la idea o el concepto que respalda sus realizaciones

Los artistas conceptuales utilizaron con frecuencia fotos, recortes de periódicos como parte de su creación, para documentar o para expresar ideas, como por ejemplo:

Juan Camilo Uribe

Alicia Barney

LydiaAzout

Antonio Caro (1950- )


http://www.colarte.arts.co/ConsPintores.asp?Carpeta=UribeJuanCamilo&NOMARTISTA=UribeJuanCamilo&IDARTISTA=550&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=CaroAntonioJose&NOMARTISTA=CaroAntonioJose&IDARTISTA=187&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=AzoutLydia&NOMARTISTA=AzoutLydia&IDARTISTA=1213&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=BarneyAlicia&NOMARTISTA=BarneyAlicia&IDARTISTA=1236&subdir=o


Bernardo Salcedo

Becky Mayer

Alicia Barney

Rosemberg Sandoval

Inginio Caro

Adolfo Bernal

1.2. IDENTIFICAR EL IMPACTO Y EL ENFOQUE EN DISEÑOS EXISTENTES.


http://www.colarte.arts.co/ConsPintores.asp?Carpeta=BernalAdolfo&NOMARTISTA=BernalAdolfo&IDARTISTA=552&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=CaroInginio&NOMARTISTA=CaroInginio&IDARTISTA=1268&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=SandovalRosemberg&NOMARTISTA=SandovalRosemberg&IDARTISTA=5350&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=BarneyAlicia&NOMARTISTA=BarneyAlicia&IDARTISTA=1236&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=MayerBecky&NOMARTISTA=MayerBecky&IDARTISTA=558&subdir=o

http://www.colarte.arts.co/ConsPintores.asp?Carpeta=SalcedoBernardo&NOMARTISTA=SalcedoBernardo&IDARTISTA=414&subdir=o


Si bien las definiciones no pueden ser tajantes ni excluyentes, resulta necesario asumir que creatividad e innovación, arte y diseño se parecerán en la medida que las busquemos en ámbitos cuyos modos de hacer mantengan alguna identidad y dejarán de parecerse en tanto nos alejemos de esos puntos en los que coinciden. El arte cuando se convierte en industria comercial va a tender a parecerse más al diseño que al arte callejero, del mismo modo que la creatividad empresarial puede conducir a la innovación de la misma forma que la innovación tecnológica puede inducir cierto estilo de creatividad, ejemplo claro de esto fue en los 80’s y 90’s la incorporación de los software digitales al proceso de diseño.

Queda agregar que hay descripciones definitivas en los ámbitos del diseño para evitar que comencemos a confrontar y asumir que nuestro radio de acción es permeable y sensible a sinnúmero de circunstancias. Que algunas de ellas no agotan la complejidad de la producción en serie, que unas pocas se han vuelto ajenas a las urgencias del mercado, que otras muchas se han convertido en iconos de algunos productos o servicios y que unas cuantas han aceptado jugar el juego mundial de la creación de valor, la identidad corporativa, los medios y los productos de consumo.

El sector de servicios está creciendo, tanto en número de empleados como en su importancia en la economía, mientras el sector manufacturero decae. Sin embargo, así como los sectores manufactureros, los servicios deben ser diseñados y su diseño debe ser gestionado.

El diseño de servicios puede ser tangible como intangible. Puede involucrar artefactos y otras cosas incluyendo comunicación, ambientes y conductas. Cualquier forma que adopte debe ser consistente, fácil de usar y ser aplicado estratégicamente.

Sólo recientemente los gerentes involucrados en el sector de servicios se han dado cuenta que un esfuerzo conciente por aplicar técnicas de diseño a los servicios puede resultar en un incremento en la satisfacción de clientes, mayor control sobre sus ofertas y mayores ganancias.

1.3. DISEÑAR FORMATOS CONSIDERANDO LAS ZONAS AUREAS, DIRECCION, SENTIDO Y EQUILIBRIO.

Toda obra de comunicación visual nace de la necesidad de transmitir un mensaje específico. Un diseñador gráfico no es un creador de formas, sino un creador de comunicaciones, un profesional que mediante un método específico (diseño) construye mensajes (comunicación) con medios visuales (grafismos). No es el creador del mensaje, sino su intérprete.

El principal componente de toda composición gráfica es pues el mensaje a interpretar, la información que se desea hacer llegar al destinatario a través del grafismo. Esta información se debe representar por medio de diferentes elementos gráficos, que pueden ser muchos y variados, aunque los más comunes son:

Elementos gráficos simples: puntos y líneas de todo tipo (libres, rectas, quebradas curvas, etc.)

Elementos geométricos, con contorno o sin él: polígonos, círculos, elipses, óvalos, etc. Tipos: letras de diferentes formas y estructura, utilizadas para presentar mensajes

textuales. Gráficos varios: logotipos, iconos, etc. Ilustraciones Fotografías Cualquier otro elemento visual apto para comunicar un mensaje. a. ZONAS AUREAS.



La creó Vitruvio, la autoridad romana en arquitectura. Ideó un sistema de cálculo matemático de la división pictórica, para seccionar los espacios en partes iguales y así conseguir una mejor composición. Se basa en el principio general de contemplar un espacio rectangular dividido, a grandes rasgos, en terceras partes, tanto vertical como horizontalmente.

La escala se utiliza en planos y mapas para la representación de una medición proporcional real. La medición nos permite adecuarnos a la realidad, pero más importante es lo que colocamos junto al objeto visual o el marco en el que está colocado. La medición universal es la propia medida del hombre, el tamaño medio de las proporciones humanas.

La pregunta que hacen todos los diseñadores es: ¿cómo podemos distribuir el espacio de diseño de una forma acertada? Pues bien, no hay una norma que nos indique la división perfecta, pero existe una fórmula muy conocida en el mundo del diseño, que permite dividir el espacio en partes iguales, para lograr un efecto estético agradable y que puede llegar a ser muy eficaz. Esta teoría se denomina "La regla Áurea", también conocida como "sección áurea".

b. DIRECCION Y SENTIDO.

En la comunicación visual el diseñador tendrá que tener en cuenta tanto la vertiente psicológica de la percepción humana como las significaciones culturales que pueden tener ciertos elementos.

El diseñador gráfico es una especie de arquitecto del espacio gráfico y debe distribuir los elementos en función de una estructura interna que tenga una significación, guía o intención coincidente con el mensaje que se quiera transmitir. Esta estructura será la responsable de la elección cromática y su intencionalidad expresiva, de la elección de las imágenes o de la disposición de los bloques de texto.

Algunos factores psicológicos que debemos conocer son:

a. El equilibrio: El receptor tiene necesidad de buscar el equilibrio de la composición y los ejes en los cuales descansa. El desequilibrio crea provocación e inestabilidad. Tendremos que analizar que es lo que queremos transmitir al receptor y con respecto a esto crear una composición determinada.

b. La referencia horizontal: Necesitamos ver que los objetos o partes que componen una composición están de alguna forma apoyados. La parte inferior se verá mejor que la superior, ya que será donde se constituya la base.

c. Angulo inferior izquierdo: Los hábitos de lectura occidentales han motivado propiciado que la atención se centre más en la parte izquierda y en concreto en la inferior izquierda.

d. Relajamiento-tensión: psicológicamente cuando tenemos una composición equilibrada, simétrica o predecible; sin embargo generaremos tensión en el receptor si no es capaz de encontrar una lógica visual en la composición que le presentamos.

c. EQUILIBRIO.



La utilización más eficaz de los mecanismos de la percepción visual consiste en identificar claves visuales en un sentido u en otro, en equilibrio o en desequilibrio, fuertes o débiles.

Podemos conseguir en nuestra composición ese equilibrio de formas y líneas, es decir, los pesos de los elementos deben estar compensados. La manera de medir el peso de las formas y líneas del diseño es, analizando la importancia visual de estos dentro de nuestra composición.

Existen dos tipos de equilibrio:

El equilibrio simétrico. El equilibrio asimétrico.

Si dividimos la composición en dos extremos, el equilibrio simétrico se produce cuando encontramos igualdad de peso y tono en ambos lados de nuestra composición, y el equilibrio asimétrico se produce cuando no existe las mismas dimensiones (ya sea de tamaño, color...) en ambos lados, pero aún así existe equilibrio entre los elementos.

El equilibrio que crea la simetría es un factor importante de la forma en que evaluamos el atractivo visual de un objeto. Sin embargo, el atractivo de la simetría tiene límites; un toque de asimetría puede hacer que resulte aún más atractivo, añadiendo un toque de individualidad y singularidad. La simetría, en cierta manera, da sensación de orden y alivia la tensión; la asimetría hace lo contrario, crea agitación y tensión, pero puede conseguir que una imagen no sea monótona.

Podemos hacer otra división de equilibrio:

El equilibrio formal. Y el equilibrio informal.

El equilibrio formal se basa en la bisimetría. Se busca un centro óptico dentro del diseño, que no tiene por qué coincidir con el centro geométrico de la composición. Una composición que siga este esquema compositivo reflejará estabilidad, calma y estatismo, pero no supone una composición muy audaz.

1.4. APLICAR LA TEORIA DEL COLOR CONSIDERANDO EL CIRCULO CROMATICO, CONTRASTES, EL RGB Y CMY.

Empezaremos diciendo que el color en sí no existe, no es una característica del objeto, es más bien una apreciación subjetiva nuestra. Por tanto, podemos definirlo como, una sensación que se produce en respuesta a la estimulación del ojo y de sus mecanismos nerviosos, por la energía luminosa de ciertas longitudes de onda.



El color es pues un hecho de la visión que resulta de las diferencias de percepciones del ojo a distintas longitudes de onda que componen lo que se denomina el "espectro" de luz blanca reflejada en una hoja de papel. Estas ondas visibles son aquellas cuya longitud de onda está comprendida entre los 400 y los 700 nanómetros; más allá de estos límites siguen existiendo radiaciones, pero ya no son percibidos por nuestra vista.

En las artes gráficas tenemos dos grandes categorías con respecto al color, imagen en color e imagen en blanco y negro, en éstas últimas podemos diferenciar: - imágenes a pluma. - imágenes tramadas: mediante diferentes tipos de gris. Asimismo, las imágenes en color se pueden dividir en dos categorías: - colores planos: manchas uniformes de color. - degradados, también tramadas. El color es un elemento básico a la hora de elaborar un mensaje visual. Muchas veces, el color no es un simple atributo que recubre la forma de las cosas en busca de la fidelidad reproducida. A pesar de que, sin el color la forma permanece, con frecuencia el Mensajes es, precisamente, el Color, o lo que sólo puede expresarse por el Color.

El color está presente en todos los aspectos de la identidad empresarial y de marca. En la identidad, las empresas pueden hacer que el color sea el principal elemento de su identidad utilizando un único color o una paleta de colores como parte de su identidad visual. Si el color se emplea uniformemente en una serie de elementos de la identidad, se termina convirtiendo en la rúbrica de la empresa.

d. CIRCULO CROMATICO.

El ojo humano puede distinguir entre 10.000 colores. Se pueden además emplear tres dimensiones físicas del color para relacionar experiencias de percepción con propiedades materiales: saturación, brillantez y tono.

El círculo cromático nos sirve para observar la organización básica y la interrelación de los colores. También lo podemos emplear como forma para hacer la selección de color que nos parezca adecuada a nuestro diseño. Podemos encontrar diversos círculos de color, pero el que aquí vemos está compuesto de 12 colores básicos.

Dentro encontramos el negro, que se produce gracias a la mezcla de todos ellos.En este círculo cromático podemos encontrar:

los colores primarios: rojo, azul y amarillo; los secundarios: verde, violeta y naranja; y los terciarios: rojo violáceo, rojo anaranjado, amarillo anaranjado, amarillo verdoso, azul verdoso y azul violáceo.



e. RGB (RED, GREEN, BUE) y CMY (CYAN, MAGENTA, YELLOW)

Los tonos secundarios se obtienen al mezclar partes iguales de dos primarios; los tonos terciarios se consiguen al mezclar partes iguales de un tono primario y de un secundario adyacente. Los primarios son colores que se consideran absolutos y que no pueden crearse mediante la mezcla de otros colores. Sin embargo, mezclar los primarios en diversas combinaciones crea un número infinito de colores. Dependiendo de qué ámbito, podemos encontrar tres juegos de colores primarios:

√ Los artistas y diseñadores parten de un juego formado por el rojo, el amarillo y el azul. Mezclando pigmentos de éstos colores pueden obtenerse todos los demás tonos.

√ El segundo juego de primarios es el del rojo, verde y el azul, conocidos como primarios aditivos. Son los primarios de la luz y se utilizan en el campo de la ciencia o en la formación de imágenes de monitores. Si se mezclan en distintos tantos por ciento, forman otros colores y si lo hacen en cantidades iguales producen la luz blanca.

√ El tercer juego se compone de magenta, amarillo y cyan. Se tratan de los primarios sustractivos y son los empleados por los impresores. En imprenta, la separación de colores se realiza utilizando filtros para restar luz de los primarios aditivos, con lo que se obtienen los colores de impresión por proceso sustractivo.

f. CONTRASTES.

El tono: Es el matiz del color, es decir el color en sí mismo, supone su cualidad cromática, es -simplemente- un sinónimo de color. Es la cualidad que define la mezcla de un color con blanco y negro. Está relacionado con la longitud de onda de su radiación. Según su tonalidad se puede decir que un color es rojo, amarillo, verde... Aquí podemos hacer una división entre:

tonos cálidos (rojo, amarillo y anaranjados). Aquellos que asociamos con la luz solar, el fuego...

y tonos fríos (azul y verde). Los colores fríos son aquellos que asociamos con el agua, la luz de la luna ...



Los términos "cálido" y "frío" se utilizan para calificar a aquellos tonos que connotan dichas cualidades; éstos términos se designan por lo que denominamos "temperatura de color". Las diferencias entre los colores cálidos y los fríos pueden ser muy sutiles. Por ejemplo, el papel blanco puede parecer más cálido o más frío por una leve presencia de rojo o azul. Lo mismo ocurre con el gris y el negro.

La brillantez: Tiene que ver con la intensidad o el nivel de energía. Es la luminosidad de un color (la capacidad de reflejar el blanco), es decir, el brillo. Alude a la claridad u oscuridad de un tono. Es una condición variable, que puede alterar fundamentalmente la apariencia de un color. La luminosidad puede variar añadiendo negro o blanco a un tono.

En general, con los tonos puros que tienen un valor más luminoso (amarillo, naranja, verde) se consiguen las mejores variantes claras, mientras que los tonos puros que tienen normalmente un valor normalmente menos luminoso (rojo, azul, violeta) ofrecen las mejores variantes oscuras.

La saturación: Está relacionada con la pureza cromática o falta de dilución con el blanco. Constituye la pureza del color respecto al gris, y depende de la cantidad de blanco presente. Cuanto más saturado está un color, más puro es y menos mezcla de gris posee.

6. MANEJAR LOS ELEMENTOS BASICOS DE UN LENGUAJE USADO EN LA CREACION DE PÁGINAS WEB.

Para crear una página web requerimos de un lenguaje especial de programación, el cual es un programa con un conjunto de instrucciones detalladas que le dirán a la computadora que hacer exactamente, paso a paso. Un programa puede ser tan corto como de una sola línea de código, o tan largo como de varios millones de líneas de código. Estos son algunos de ellos:

HTML.

El HTML, acrónimo inglés de Hyper Text Markup Language (lenguaje de marcación de hipertexto), es un lenguaje de marcas diseñado para estructurar textos y presentarlos en forma de hipertexto, que es el formato estándar de las páginas web. Gracias a Internet y a los navegadores del tipo Explorer o Netscape, el HTML se ha convertido en uno de los formatos más populares que existen para la construcción de documentos.

DHTML.

El HTML Dinámico o DHTML (del inglés Dynamic HTML) designa el conjunto de técnicas que permiten crear sitios web interactivos utilizando una combinación de lenguaje HTML estático, un lenguaje interpretado en el lado del cliente (como JavaScript) y el lenguaje de Hojas de estilo en cascada (CSS).

ASP.

Active Server Pages (ASP), es una tecnología propietaria de Microsoft. Se trata básicamente de un lenguaje de tratamiento de textos (scripts), basado en Basic, y que se denomina VBScript (Visual Basic Script). Se utiliza casi exclusivamente en los servidores Web de Microsoft (Internet Information Server y Personal Web Server). Los scripts ASP se ejecutan, por lo tanto, en el



servidor y puede utilizarse conjuntamente con HTML y Javascript para realizar tareas interactivas y en tiempo real con el cliente.

Con ASP se pueden realizar fácilmente páginas de consulta de bases de datos, funciones sencillas como obtener la fecha y la hora actual del sistema servidor, cálculos matemáticos simples, etc.

JAVA SCRIPT.

JavaScript es un lenguaje orientado a objetos propiamente dicho, ya que dispone de Herencia, si bien esta se realiza siguiendo el paradigma de programación basada en prototipos, ya que las nuevas clases se generan clonando las clases base (prototipos) y extendiendo su funcionalidad.

Todos los navegadores modernos interpretan el código JavaScript integrado dentro de las páginas web. Para interactuar con una página web se provee al lenguaje JavaScript de una implementación del DOM (Document Object Model, podría ser Modelo en Objetos para la representación de Documentos), abreviado DOM, es esencialmente un modelo computacional a través del cual los programas y scripts pueden acceder y modificar dinámicamente el contenido, estructura y estilo de los documentos HTML y XML.

2.1. DEFINIR OBJETIVOS Y CONTENIDOS DE LA PÁGINA WEB.

Es importante tomar una decisión para elegir qué objetivos consideramos primordiales antes del desarrollo de la página web. La elección, condiciona de manera clave la concepción y el diseño del proyecto, el cual debe ser coherente con los objetivos de la empresa. Por ejemplo:

Conseguir 250 contactos comerciales en 1 año. Ofrecer a los clientes una herramienta de selección del producto más adecuado para que se informen y comparen sin presiones

Impactar al visitante con una web espectacular que refuerce la imagen de marca. Vender software directamente desde Internet buscando el ahorro de costos de distribución.

Tu web puede ser algo más. Ya que habla por ti, por tus productos, por tus servicios, por lo que además puede: Ofrecer al visitante ocasional una motivación para contactar, Una razón para recordarte o quizás una utilidad que le ahorra tiempo, Encontrar una información que estaba buscando. Facilitar y agilizar el trabajo de colaboradores y de empleados. Apoya la imagen de marca. Vende y completa el proceso de venta. Ofrece asistencia y soporte técnico. Facilita una comunicación ágil y fluida con tus clientes y proveedores.

Cada empresa o persona debe elegir aquellos que mejor encajen con sus objetivos y las expectativas del negocio.

Piensa que la definición de objetivos te ahorrará sorpresas como diseñar una web pensando en los clientes, para después descubrir que sólo te visitan "extraños" ... O un diseño de web muy espectacular e innovador, cuando lo único que se pretende es que la persona deje sus datos de email para enviarle ofertas concretas, etc.

Un mismo sitio web puede perfectamente intentar cumplir varios objetivos simultáneamente aunque te recomiendo que lo abordes por fases. Empieza por 2 o 3 de ellos, y a medida que vayas viendo su evolución y aprendiendo de los errores y aciertos, puedes ir planificando nuevos objetivos.


http://es.wikipedia.org/wiki/DOM

http://es.wikipedia.org/wiki/Navegador


Para ilustrar estas ideas, los objetivos podemos agruparlos en:

a) Buscar leads o contactos. Ya sea para comprar, distribuir, vender, anunciarse, conseguir una visita comercial, una demostración de producto, etc ...

b) Fidelización de clientes y apoyo a la venta. Branding, amplia información, soporte técnico, ayuda on-line, actualizaciones de producto, demostraciones interactivas, promociones, juegos, utilidades, foros, etc.

c) Ahorro de tiempo y dinero. Aplicaciones y utilidades para agilizar y facilitar tareas rutinarias: ventas on-line, introducción de ofertas de trabajo, actualizaciones de producto, transferencia de archivos, buzón de sugerencias, quejas, trámites y gestiones on line, etc.

Cada uno lo puede definir como quiera, más o menos detallado, pensando en las implicaciones para la organización, buscando diferenciarse de la competencia, marcar objetivos a medio y largo plazo, etc. Es escribir con letras bien grandes LO QUE QUIERES. Otra tarea será decidir las estrategias a emprender para cumplir los objetivos.

2.2. ESQUEMATIZAR LA ESTRUCTURA GENERAL DE UNA PAGINA WEB.

PLANIFIQUE LA ESTRUCTURA ANTES DE EMPEZAR

Antes de crear un conjunto de páginas web uno ha de tener una idea clara de cómo va a ser la estructura de dichas páginas, es conveniente hacer un esquema, para la mayoría de los casos una hoja de papel y un lapicero bastará, pero si el emplazamiento va a albergar un gran número de páginas es recomendable usar algún tipo de programa que permita manejar estructuras de tipo grafo.

LA ESTRUCTURA DEPENDE DEL CONTENIDO

No es lo mismo crear una estructura de navegación para un sitio que desea publicar información al estilo de un libro cuya estructura estará formada por capítulos, este tipo de información se adapta bastante bien a una estructura lineal como jerárquica. Mientras que un sitio donde se expone un tutorial o un tour es más apropiada una estructura de tipo lineal.Para visualizar la estructura de directorios es recomendable dibujar una especie de organigrama, en el que vamos a ir colocando los directorios en función de su importancia, desde el nivel superior a otros inferiores.

Se debe listar la información que se desea incluir en la Web. Esta información debe ser significativa y útil para el público. Teniendo en cuenta lo que a ellos les interesa, no lo que a nosotros nos gustaría que nos interese.

En el caso de que existan otras formas de acceso a información disponible para esas mismas personas, el contenido de la Web deberá ser superador de esos otros materiales.

Es el momento de hacer un boceto de la página principal y de cada página que esté enlazada a ésta, sin preocuparnos demasiado por los detalles, ya que solo es un boceto. Es importante



recordar que los visitantes de una web no lo van a leer completamente, sino que lo que desean es encontrar rápidamente lo que les interesa, por lo que habrá de establecer una estructura adecuada de enlaces entre las páginas. El movimiento de un lado a otro de la web debe ser lo más intuitivo posible para facilitar el trabajo del visitante. Un sitio web en el que sea difícil encontrar lo que buscamos es abandonado rápidamente.

Cuando un internauta ingresa a una página web, quiere encontrar entre otras cosas tres características: velocidad, simplicidad y claridad. Por su parte, el sitio web visitado pretende que la persona o personas que ingresen en sus páginas se queden el mayor tiempo posible; en lenguaje comercial buscan atraer clientes. Pero, ¿cómo lograr las dos cosas?, es decir, ofrecer un producto agradable a la vista y con buenos contenidos.

Este es un ejemplo con el debemos empezar a crear nuestra página, en el cual debemos tener claro los niveles que tendrá.

ESTRUCTURA SUGERIDA DE UNA WEB

MATERIA : ELABORAR PAGINAS WEB

NIVEL 1 NIVEL 2 NIVEL 3

PRINCIPAL BIENVENIDA

UBICACIÓN CURRICULAR

FUNDAMENTACION

A QUIEN VA DIRIGIDO

INFORMACION INTRODUCCION

OBJETIVO

CONTENIDO

METODOLOGIA

EVALUACION

CALENDARIO

MATERIALES UNIDAD I CONTENIDO

RESUMEN

RECURSOS

UNIDAD II CONTENIDO

RESUMEN

RECURSOS

UNIDAD III CONTENIDO

RESUMEN

RECURSOS

ACTIVIDADESPORTAFOLIO DE APREDIZAJE PARA CADA UNIDAD RESUMEN

RECURSOS

FOROS 2 FOROS EL INICIAL

FORO FINAL

REFERENCIAS BIBLIOGRAFIA

LECTURAS COMPLEMENTARIAS POR TEMA

LIGAS DE INTERES

GLOSARIO

CREADOR DATOS PERSONALES

NIVEL ACADEMICO

EXPERIENCIA LABORAL

FOTOGRAFIA


2.3. UTILIZAR ETIQUETAS EN UNA PAGINA WEB.

Un documento HTML ha de estar delimitado por la etiqueta <html> y </html>. Dentro de este documento, podemos asimismo distinguir dos partes principales:

El encabezado, delimitado por <head> y </head> donde colocaremos etiquetas de índole informativo como por ejemplo el titulo de nuestra página.

El cuerpo, flanqueado por las etiquetas <body> y </body>, que será donde colocaremos nuestro texto e imágenes delimitados a su vez por otras etiquetas como las que hemos visto.

El resultado es un documento con la siguiente estructura:

<html>

<head> Etiquetas y contenidos del encabezado

Datos que no aparecen en nuestra página pero que son importantes para catalogarla: Titulo, palabras clave,...

</head>

<body> Etiquetas y contenidos del cuerpo Parte del documento que será mostrada por el navegador: Texto e imágenes </body>

</html>

Con todo lo que conocemos ya sobre HTML podemos construir una página web que ya tiene bastante sentido. Vemos un ejemplo a continuación.

<html>

<head> <title>Elaboración de Paginas Web</title> </head>

<body> Bienvenido, Estás en la página Elaboración de Páginas Web de Tercer Semestre. Aquí aprenderás de manera personal a realizar tu pagina web. </body>

</html>

Cómo ya hemos dicho el HTML es un lenguaje de marcas (etiquetas). Así todo nuestro texto estará encerrado entre etiquetas: Una etiqueta de inicio y una etiqueta de fin.

Funcionan de la siguiente manera:

<etiqueta> inicio de una etiqueta</etiqueta> el cierre de una etiqueta.

Algunas etiquetas, que iremos viendo a lo largo del manual, no llevan etiqueta de cierre, en ese caso se cierra, dentro de la propia etiqueta, tal y cómo vemos a continuación.

<etiqueta /> Los elementos que no llevan etiqueta de cierre, se cierran en la misma etiqueta de apertura, por ejemplo: 

Las etiquetas deben de ir siempre en minúsculas. Encontrarás muchas páginas WEB en las que las etiquetas están en mayúsculas, hasta el HTML 4.0 era indiferente la utilización de minúsculas o mayúsculas y muchos autores utilizaban las mayúsculas por claridad.

Todo lo que vaya entre dos etiquetas HTML se verá afectado por éstas, por ejemplo<h1>Esto es un encabezado</h1>Pero esto no, esto es un párrafo

Estas son algunas de las etiquetas más utilizadas:< html>marcan el inicio y el final de una pagina web< /html> < title>establece un titulo para la pagina< /title> < body bgcolor="">establece un color de fondo para la pagina < body background="">establece una imagen de fondo para la pagina < body text="">establece el color de letra en la pagina < h1>establece un encabezado en la pagina< /h1> < hr>agrega una línea separadora

Etiquetas de texto pone el texto en negrita pone el texto en cursiva cambia el color de texto cambia el tamaño del texto cambia el tipo de letra cambia el color el tamaño y el tipo de letra

Etiquetas de enlace< aref0"">texto< /a>añade un enlace utilizado la palabra texto < ahref="">< img src="">< /a>añade un enlace utilizando una imagen

Etiquetas de imagen < img src="">permite añadir una imagen ala pagina < img src=""align0"top">alinea el titulo de la imagen en la parte superior < img src=""align="middle">alinea el titulo de la imagen en la parte de en medio < img src=""align"bottom"> alinea el titulo de la imagen en la parte inferior

Etiquetas secundarias.

Algunas veces, necesitaremos añadir dos etiquetas a un texto, por ejemplo, supongamos y esto es sólo un ejemplo, que un título sea también un enlace, veamos cómo lo haríamos (utilizamos pseudo código puesto que todavía no hemos visto el código html).

<título><enlace> loquesea.com</enlace></título>

En cambio el siguiente código sería incorrecto

<título><enlace> loquesea.com</titulo></enlace>

Las etiquetas pueden a veces llevar atributos que nos permiten especificar más las etiquetas que utilizamos. Los atributos son como los adjetivos. Por ejemplo supongamos que tenemos una etiqueta <hombre> y queremos especificar que es guapo. Así que utilizaremos el atributo

"apariencia" a este atributo le daremos el valor de "guapo". Nos quedaría apariencia="guapo". Así nuestro <hombre> nos quedaría <hombre apariencia="guapo">.

Veamos la etiqueta <html> nos dice que se trata de un documento html, pero podemos utilizar el atributo lang para especificar el idioma del contenido del documento, así nos quedaría <html lang="es">. Los atributos se especifican indicando el nombre del atributo (lang) y su valor (es). En castellano estaríamos diciendo: esto es un documento html en español. Los atributos siempre se añaden en la etiqueta de inicio y los valores de un atributo siempre deben estar entre comillas.

Etiquetas de párrafo

Para esto se utiliza la etiqueta y . Este comando es muy útil debido a que si uno escribe algo (en el editor que se este utilizando) por mucho espacio que uno le de siempre al texto, siempre va a aparecer en la misma línea. Para alinear un párrafo se utiliza el comando <align> y </align>, utilizado dentro de la etiqueta . Se puede alinear de tres formas diferentes:

 Párrafo... Alinea a la izquierda. Párrafo... Realiza un centrado. Párrafo... Alinea a la derecha. indica el inicio de un párrafo nuevo cambia el texto a otra línea < pre>añade un texto preformateado < /pre> < li>sirve para listar objetos < ul>añade numeración a los objetos listados < ul>añade viñetas a los objetos listados< /ul> < blockquote>resalta una línea ubicada en un párrafo < /blockquote> indica el inicio de una definición

Cuando nosotros queremos que lo que escribimos aparezca en otra línea utilizamos el comando .

Al terminar de escribir un párrafo es conveniente y estético utilizar el comando para separar un párrafo de otro que es 

Etiquetas para darle formato al texto:

Para el tamaño y tipo de letra se usa la etiqueta y , que posee tres atributos: tamaño (size), Tipo de letra o fuente (face) y color

Formato:

 y Sirve para colocar un texto en Negrita. y sirve para subrayar un texto<strike> y </strike> sirve para tachar un texto. y cumple la misma función que y para colocar un texto en cursiva.texto con énfasis texto con énfasis<cite>citación</cite> citación<dfn>definición</dfn> definición<kbd>teclado</kbd> teclado<samp>ejemplo</samp> ejemplo

size: regula el tamaño de los caracteres.

Ejemplo: texto... .

face: es la fuente que se quiere usar, arial, times new roman, etc.

Para elegir nosotros mismos el color que queremos que tengan los links o enlaces e incluso el texto, las etiquetas que se utilizan para hacer esto son las siguientes:

text="#número" Para el color del texto. link="#número" Para el color de los enlaces. vlink="#número" El color con que aparecerán los enlaces ya visitados. alink="#número" Color del enlace cuando lo pulsamos.

Por lo tanto la etiqueta <body> puede quedar del siguiente modo:<body bgcolor="#num" text="#num" link="#num" vlink="#num" alink="#num">

Ahora veremos como poner una imagen de fondo. Es muy sencillo, basta con usar la etiqueta:

background="localización de la imagen" Esta etiqueta va dentro de la etiqueta <body>.

Ejemplo:

<body background="/documentos/html/gifs/dragonball.gif">

Las listas pueden ser: Lista desordenada, <ul> (Unordered List).

Lista ordenada, <ol> (Ordered List).

Ejemplos de diferentes tipos de listas:

Lista con números romanos:<ol><li type=I>Manzana<li type=I>Zanahoria<li type=I>Lechuga<li type=I>Tomate</ol>I Manzana II Zanahoria III LechugaIV Tomate

Lista numerada:<ol><li>Manzana<li>Zanahoria<li>Lechuga<li>Tomate</ol>1 Manzana 2 Zanahoria3 Lechuga4 Tomate

ELABORACION DE PAGINAS WEB MODULO II TEMAS 1_________________________________________________________________________________________________

Una de las formas de crear listas con Dreamweaver es activar la barra Texto, para ello pulsaremos, tal como vemos en la imagen inferior, en el botón “Común”

Y en el panel que se despliega seleccionáremos la opción Texto.

Pulsaremos el botón “ul”. Con este botón activamos la opción “Listas simples o no ordenadas”

Si seleccionamos la lista simple, la línea donde tengamos activo el cursor de texto será el comienzo de una lista. Cuando pulsemos la tecla enter, Dreamweaver convertirá el texto introducido en esa línea en una entrada de la lista y prepara la siguiente línea como otro elemento de la lista.

Para terminar de introducir elementos en la lista sólo tenemos que pulsar la tecla enter dos veces seguidas y ya podremos continuar escribiendo normalmente

2.4. ESTABLECER VINCULOS E HIPERVINCULOS.

Normalmente se les llama enlaces.- Consisten en líneas de texto o imágenes que se encuentran dentro de ciertos documentos, generalmente en páginas web, y que permiten acceder a otros documentos. Estos enlaces establecen conexiones con otras páginas en Internet para que el navegador pueda visualizarlas. Cuando se hace click sobre un enlace, el navegador abrirá automáticamente la página de información a la que hace referencia.

Formación para el trabajo. 6º Semestre

Para definir un enlace es necesario marcar con la etiqueta <a> el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href="url" para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con <a href="url">, y después cerrar con </a>. Por ejemplo, si queremos que el texto "pulse aquí para visitar la NASA" nos conduzca a la "home page" de la NASA, debemos escribir en nuestro texto HTML: <a href="http://www.nasa.gov/">Pulse aquí para visitar a la NASA</a>

Que se vería de esta forma: Pulse aquí para visitar a la NASA

Si queremos que el texto "Foto" nos lleve a una imagen tenemos que escribir:<a href="imagen.gif">Foto</a> entonces al hacer clic en el texto Foto nos abrirá la imagen.gif.

También se puede ir a otro enlace por medio de una imagen. Lo único que se debe hacer es cambiar el texto por una imagen:<a href="http://www.altavista.com"><img src="Logo.jpg"></a>

Si se quiere hacer un link para que nos manden un E-Mail se debe hacer de la siguiente manera:<a href="mailto:[email protected]">Mandame un Email</a>

Entonces cuando se haga clic sobre esta palabra Mandame un Email se abrirá (por defecto) el Microsoft Outlook Express con la dirección del destinatario ya escrita.

2.5. MANIPULAR OBJETOS Y FORMULARIOS EN UNA PAGINA WEB.

Los formularios se utilizan para recoger datos de los usuarios, nos pueden servir para realizar un pedido en una tienda virtual, crear una encuesta, conocer las opiniones de los usuarios, recibir preguntas, hacer suscripciones a un boletín o revista que editemos, etc.

Una vez el usuario rellena los datos y pulsa el botón para enviar el formulario se arrancará un programa que recibirá los datos y hará el tratamiento correspondiente (una base de datos por ejemplo).

Aquí vamos a ver cómo crear el formulario básico, (insertar campos y botones en el formulario y validarlos), pero no la parte de tratamiento de los datos, ya que para ello se necesitan nociones de programación, ya sea en SQL, en JavaScript o en otro lenguaje de programación.

Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús desplegables, y botones.

Elementos de formulario

Los elementos de formulario pueden insertarse en una página a través del menú Insertar, opción Objetos de formulario. A través de esta opción se puede acceder a la lista de todos los objetos de formulario que pueden ser insertados en la página. Vamos a ver uno por uno algunos de los distintos elementos que pueden formar parte de un formulario, así como algunas de sus propiedades.

Campo de texto y Área de texto: Permiten añadir un cuadro de texto. El Campo de texto solo permite escribir una línea al usuario, mientras que el Área de texto permite escribir varias. Se puede pasar de Campo de texto a Área de texto a través del inspector de propiedades. También es posible definirlo como Contraseña. A continuación tienes un ejemplo de cada uno de estos tres tipos.


A través del inspector de propiedades es posible asignar también el ancho del cuadro de texto, el número máximo de líneas o caracteres, y el valor inicial del cuadro.

Botón: Es el botón tradicional. El botón puede tener asignadas tres opciones: Enviar formulario, Restablecer formulario (borrar todos los campos del formulario), o Ninguna (para poder asignarle un comportamiento diferente de los dos anteriores).

También es posible cambiar el texto del botón, a través del campo Etiqueta del inspector de propiedades.

Casilla de verificación: Es un cuadrito que se puede activar o desactivar. Puede asignársele el estado inicial como Activado o como Desactivado.

Botón de opción: Es un pequeño botón redondo que puede activarse o desactivarse. Si hay varios del mismo formulario, solo puede haber uno activado. Cuando se activa uno, automáticamente se desactivan los demás.

¿Cuál es más inteligente? El niño El joven

Lista/Menú: Una lista o menú es un elemento de formulario que lleva asociada una lista de opciones. Los elementos se añaden a través de botón Valores de lista del inspector de propiedades. Cuando se trata de un menú, solo es posible elegir uno de los

elementos, pero si se trata de una lista, a través de Selecciones puede permitirse que se seleccionen varios simultáneamente.

Etiqueta: Se utiliza para ponerle nombres al resto de elementos de formulario, para que el usuario pueda saber qué datos ha de introducir en cada uno de ellos.

Crear formularios

Puedes crear formularios a través del menú Insertar, opción Formulario. Una vez creado un formulario, este aparecerá en la ventana de Dreamweaver como un recuadro formado por líneas rojas discontinuas, similar al de la imagen de siguiente.

Dentro de dicho formulario se

podrán insertar los elementos de formulario, que como ya sabes puedes insertarlos a través del menú Insertar, opción Objetos de formulario.



Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando tablas se consigue una mejor distribución de los elementos del formulario, lo que facilita su comprensión y mejora su apariencia.

Validar formularios

La validación de formularios sirve para hacer que Javascript valide el formulario antes de que se envíe el formulario, para que en el caso de que haya campos del formulario que sean obligatorios, tengan que rellenarse antes de poder enviarse.

Para validar un formulario hay que abrir el panel de Comportamientos. Este panel se puede abrir a través del menú Ventana, opción Comportamientos, o pulsando Mayús+F3.

En el este panel hay que desplegar el botón pulsando sobre él, y en Mostrar eventos para elegir una versión de las actuales de entre la lista de navegadores. Por ejemplo, puedes elegir el navegador IE 6.0. Después de esto, hay que volver a desplegar el botón, y pulsar sobre la opción Validar formulario.

Entonces se mostrará una ventana como la siguiente, donde aparecen todos los elementos del formulario.

Puede seleccionarse uno por uno cada elemento del formulario, pudiendo especificar los requisitos que

ha de cumplir. Puede establecerse como campo a rellenar obligatoriamente, y si su contenido ha de ser numérico, una dirección de correo electrónico, etc.

2.6. MANIPULAR TABLAS EN UNA PAGINA WEB.

Una tabla está formada por filas y columnas y a la intersección de estas le llamamos celdas, en las que se puede insertar texto y gráficos. Las tablas son una buena herramienta para organizar


los datos en una página web, además nos permiten estructurar las páginas de nuestro sitio separando la cabecera, el menú, el contenido...

La organización del texto en una página es posible gracias a las tablas. Muchas páginas web son como páginas de revistas, y la forma más simple de emular las funciones de maquetación son las tablas. Se pueden utilizar y personalizar las tablas de varias formas diferentes con el fin de hacerlas más atractivas y fáciles de leer.

Se debe utilizar una tabla para presentar la información en formato de cuadrícula, por ejemplo horarios, información acerca de productos, tarifas, calificaciones de alumnos, etc.

Creación de una tabla

Para crear una tabla se debe usar la instrucción Table, seguida de parámetros que indican la anchura, el color o imagen de fondo, etc.

Ejemplo:<table></table>

Estas dos instrucciones indican al explorador de Internet que en este lugar de la página se va a crear una tabla.

Uso de encabezados de tabla

Después de que se haya indicado al explorador de Internet que se va a crear una tabla, es necesario definir cuántas columnas de tabla se desean utilizar. Para ello se deben utilizar las instrucciones <TH>, las cuales indican los encabezados de tabla.

Ejemplo:<Table><TH>Columna 1</th><TH>Columna 2<TH>Columna 3</TH></table>

Este segmento de código le indica al explorador que usaremos una tabla de tres columnas. Cada identificador TH que utilice indica una columna de dato que desee representar en la tabla.

Para crear una tabla debemos hacer clic sobre el botón Insertar tabla de la paleta de Objetos.

Se abrirá un cuadro de diálogo que nos preguntará cuántas filas y cuantas columnas tendrá nuestra tabla, qué ancho tendrá y si tendrá borde.

2.7. MANIPULAR IMÁGENES Y ANIMACIONES EN UNA PAGINA WEB.

Las imágenes pueden ser de muchos formatos diferentes: bmp, gif, jpg, etc. Pero no todos estos formatos son adecuados para una web, debido a que pueden ocupar mucha memoria o a que no son compatibles con algunos navegadores.

Los formatos más utilizados son el GIF y el JPG, que a pesar de ser imágenes de menor calidad que las imágenes BMP, son más recomendables debido a que ocupan menos memoria. Vamos a ver un poco más sobre estos formatos:

Formato GIF:Utilizan un máximo de 256 colores, y son recomendables para imágenes con grandes áreas de un mismo color o de tonos no continuos. Suelen utilizarse con gran frecuencia, ya que permiten contener transparencias y animación.

Formato JPG:Las imágenes son de mayor calidad que las GIF, al poder contener millones de colores, pero el tamaño de la imagen es mayor y tarda más en descargarse.

Puedes incluir imágenes en otros formatos a través de Dreamweaver, que podrán ser visualizadas en algunos navegadores. Este es el caso de las imágenes BMP y PNG.

Si introduces una imagen BMP en Dreamweaver, te aparecerá un cuadrado gris en su lugar. La imagen solo se mostrará correctamente en el navegador.

Puedes cambiar el formato de las imágenes mediante la utilización de algún programa de tratamiento de imágenes, como pueden ser Fireworks, Photoshop, Corel Draw, etc.

Dependiendo del programa utilizado existirá una mayor o menor cantidad de opciones a la hora de modificar las imágenes. Para realizar modificaciones sencillas, como la de recortar las imágenes y cambiar los colores, puedes utilizar incluso el programa Paint de Windows.

Para insertar una imagen, debe utilizar la siguiente sintaxis:

<img src="imagen.jpg">

En ésta instrucción se da por defecto que la imagen que se inserta tiene la extensión JPG. Para insertar otro tipo de imagen sólo deberá especificar la extensión correspondiente. Las imágenes pueden ser adquiridas de la galería de imágenes de Microsoft, o de cualquier otra imagen digitalizada. Incluso se pueden crear iconos animados desde algún programa de animación, y usarlos en una página Web.

Selección del formato

Uno de los grandes dilemas a la hora de incluir gráficos en sus páginas Web es elegir el formato adecuado para cada tipo de imagen, vamos a intentar guiarle en la selección de cada formato.

Imágenes fotográficas

Imágenes obtenidas a través de fotografías de personas o lugares. Para este tipo de imágenes el formato más recomendado es el JPEG porque consigue una gran compresión con una mínima perdida de calidad.

JPEG GIF PNG


6.565 bytes24 bits

25.522 bytes256 cols

52.361 bytes24 bits

Imágenes renderizadas

Este tipo de imágenes son las obtenidas por un programa de generación de imágenes sintéticas mediante algún proceso de trazado de rayos o similar. Se caracterizan por degradados suaves y líneas muy bien definidas.

Para este tipo de imágenes es recomendable usar el formato PNG. Tenga presente que el formato PNG es el más reciente y puede no estar soportado en todos los navegadores.

JPEG GIF PNG

Imágenes sencillas

Para las imágenes sencillas con pocos colores y con formas muy delimitadas, el formato más recomendado es el GIF, ya que se puede adaptar al número de colores de una imagen. Con el paso del tiempo puede que el formato PNG desbanque al GIF ya que el primero es más avanzado, pero como su uso todavía no está muy extendido recomendamos el formato GIF.



JPEG GIF PNG

4.974 bytes 2.394 bytes 1.613 bytes

Realice pruebas

Las recomendaciones dadas anteriormente no son indiscutibles, son recomendaciones basadas en la experiencia. Puede que para según que casos, no sean del todo acertadas, así que le recomendamos que pruebe a grabar las imágenes en distintos formatos y seleccione el que le parezca más adecuado.

Formato Imágenes

JPEG24Bits

Baja compresión6028 bytes

Media compresión2761 bytes

Alta compresión1815 bytes

GIF

256 Colores12230 bytes


255 Col. + Trans.8703 bytes

PNG

24 Bits29070 bytes


255 Col. + Trans.8795 bytes

Para utilizar imágenes como hipervínculos, se debe usar la misma instrucción que para los hipervínculos de texto, a excepción de que a continuación de la instrucción se debe incluir la instrucción de inserción de imágenes.


La siguiente línea de código muestra el ejemplo de inserción de imágenes como hipervínculos.

<a href="carrera.htm"><img border=0 src="carrera.jpg" ></A>

La primera instrucción indica el nombre de la página a la que se desee acceder cuando se haga clic en el hipervínculo. La segunda instrucción inserta la imagen en la página Web.

La manera más sencilla de añadir una imagen a nuestra página es desplegando al menú insertar, de la barra menú, y buscar en él la opción imagen.

En la ventana de diálogo que Dreamweaver nos abrirá, podremos buscar la imagen que queramos insertar en nuestra página, simplemente tenemos que seleccionarla y pulsar el botón aceptar de la ventana diálogo.

Observa que imagen se ha insertado en la posición que ocupaba el cursor en el momento de añadir la imagen, también podemos escribir

texto en la misma línea que insertamos la imagen.

Podemos combinar en la misma línea texto e imágenes, sin importar el orden. Podemos escribir una línea de texto y en cualquier punto de ella insertar la imagen, o podemos insertar primero la imagen y después escribir un comentario a su lado.

Dreamweaver nos permite insertar imágenes de varias maneras, ya hemos visto como hacerlo desde la barra de menú. Ahora vamos a aprender a insertar imágenes desde el panel insertar, con la barra común activada. Podemos pulsar en la barra común en el icono imagen.


Dreamweaver nos muestra la misma ventana de diálogo de antes, podemos seleccionar el archivo como ya sabemos o podemos escribir el nombre directamente en la casilla nombre, y después pulsamos aceptar.

2.8. DEFINIR SECCIONES DE MAPEO DE IMÁGENES EN UNA PAGINA WEB.

Puede hacer que parte de la imagen sea un enlace a otra página, es decir, puede hacer un mapa sobre la imagen de manera que secciones de la imagen sean enlaces.

Debe saber que para que una imagen sea tratada como un mapa, además de el código, debe incluir en la etiqueta de imagen correspondiente a la imagen a mapear el atributo usemap="#nombre del mapa".

2.9. INSERTAR SONIDO Y VIDEO EN UNA PAGINA WEB.

La inserción de sonido y video funciona de una forma muy parecida. Los archivos de video que se admiten en las web tienen las extensiones .avi las que son de Microsoft Vídeo para Windows y .mov o .qt los de Apple.

Los archivos de sonido son de muchas más clases porque se han utilizado desde hace mucho más tiempo. Los más habituales son los siguientes:

.wav de Microsoft. .snd y .mac de sonido Macintosh. .au de audio de Sun. .mid o . midi que sólo se utilizan para música.

SONIDO

Para insertar un archivo de audio en un documento tienes que dirigirte al menú Insertar, Medía, opción Plug-in. A la derecha tienes un ejemplo de un archivo de sonido, para el que se muestran los controles de audio.

En Dreamweaver no se mostrarán los controles de audio. Todos los archivos que son insertados como plug-in aparecen representadas dentro de Dreamweaver por una imagen como la de la izquierda.

En el inspector de propiedades pueden establecerse la altura y la anchura con la que se mostrarán los controles de audio, mediante Al y An. Si lo que se desea es que se escuche el sonido en la página, pero que no se muestren los controles de audio, los campos Al y An deben valer cero.

Los sonidos se reproducen automáticamente al cargarse la página, y se reproducen solamente una vez. Estos valores no pueden cambiarse a través del inspector de propiedades, pero sí a través del código.

Por ejemplo, el archivo anterior aparecía en el código como:



cartas electrónicas) mediante sistemas de comunicación electrónicos. Principalmente se usa este nombre para denominar al sistema que provee este servicio en Internet, mediante el protocolo SMTP, aunque por extensión también puede verse aplicado a sistemas análogos que usen otras tecnologías. Por medio de mensajes de correo electrónico se puede enviar, no solamente texto, sino todo tipo de documentos digitales. Su eficiencia, conveniencia y bajo costo están logrando que el correo electrónico desplace al correo ordinario para muchos usos habituales.

Para poder usar enviar y recibir correo electrónico, generalmente hay que estar registrado en alguna empresa que ofrezca este servicio (gratuita o de pago). El registro permite tener una dirección de correo personal única y duradera, a la que se puede acceder mediante un nombre de usuario y una Contraseña.

Hay varios tipos de proveedores de correo, que se diferencian sobre todo por la calidad del servicio que ofrecen. Básicamente, se pueden dividir en dos tipos: los correos gratuitos y los de pago.

Una dirección de correo electrónico es un conjunto de palabras que identifican a una persona que puede enviar y recibir correo. Cada dirección es única y pertenece siempre a la misma persona.

Un ejemplo es [email protected], que se lee persona arroba servicio punto com. El signo @ (llamado arroba) siempre está en cada dirección de correo, y la divide en dos partes: el nombre de usuario (a la izquierda de la arroba; en este caso, persona), y el dominio en el que está (lo de la derecha de la arroba; en este caso, servicio.com). La arroba también se puede leer "en", ya que [email protected] identifica al usuario persona que está en el servidor servicio.com (indica una relación de pertenencia).

Una dirección de correo se reconoce fácilmente porque siempre tiene la @, donde la @ significa "pertenece a..."; en cambio, una dirección de página web no. Por ejemplo, mientras que http://www.servicio.com/ puede ser una página web en donde hay información (como en un libro), [email protected] es la dirección de un correo: un buzón a donde se puede escribir.

Pulsa sobre el enlace y se abre una ventana para "escribir mensaje" con lo siguientes campos:

subject: El asunto del mensaje.cc: Enviar una copia del mensaje a la dirección indicada.body: El texto del mensaje.

3. PUBLICAR PAGINAS WEB EN LOS SERVIDORES DE INTERNET

Que es publicar una pagina web y como hacerlo? Después de hacernos nuestra página en nuestra computadora (incluyendo textos, imágenes, videos y otros archivos) ésta solamente la vemos nosotros ya que esta almacenada en nuestra maquina. Para que todo el mundo pueda verla la tenemos que publicar (subir) a un servidor. (Que no es más que una computadora central que siempre esta conectada). El servidor, hosting (lugar donde subiremos nuestra página) normalmente todos los proveedores de acceso a Internet ofrecen hosting. (Al que pagamos por conectarnos a internet). El Hosting es un espacio (Ofrecido en Megabites) para almacenar nuestra web en su servidor. Existen infinidad de proveedores de hosting gratuitos, que con solo rellenando un formulario desde su web podemos conseguir de manera rápida y gratuitamente espacio para nuestra web.

Cuando solicitamos los servicios de una conexión a internet (el servidor) al que pagamos la factura por navegar, ofrecen una serie de recursos gratuitos por utilizar sus redes y servicios como pueden ser: Cuentas de correo, discos duros virtuales donde alojar tus archivos y un sinfín de promociones, pero también un ESPACIO WEB, o cuenta FTP.



3.1. IDENTIFICAR LOS SERVIDORES DE INTERNET DISPONIBLES PARA PUBLICACION DE INFORMACION.

Publicación de la página web.

Tendremos que elegir un servidor y claro esta registrarnos, por lo general nos notificarán vía e-mail nuestra alta en su espacio web. Para subir la página web. Existen varias formas: desde la propia web de proveedor, o mediante programas de envío FTP.

Desde la propia web del servidor. Después de obtener nuestra cuenta y confirmarnos todos los datos, nuestro login, password, nombre de usuario, etc. con estos datos entra en la página web de tu proveedor e identifícate. Por lo general tienen formularios y otras herramientas para poder subir tus archivos indicándote los pasos a seguir. Recuerda que además de subir tu página también tienes que subir las imágenes, videos, archivos, etc. que utilizaste en tu página. Te recomiendo que leas los apartados de ayuda, y faqs (preguntas frecuentes) que suelen tener estos sitios. Desde un programa para enviar por FTP. Que es una manera de transmitir archivos por la red, tanto para mandar como para descargar, existen en internet montones de programas (gratuitos y de pago) para poder enviar archivos a un servidor. Estos son algunos de los mas conocidos, Cuteftp , ws_ftp , NicoFTP .

Otro estupendo FTP

WS_FTP 95 El inmejorable cliente de transmisión de archivos. Descárgalo junto con el parche para ponerlo en español. Podrás mandar tus paginas web a tu servidor, borrar, cambiar, descargar desde sitios FTP, etc. Y es gratuito totalmente.

Lo demás déjalo como esta, esta seria la ventana antes de conectar con tu servidor FTP.

Esta seria la configuración normal del programa para subir tus paginas Nombre o perfil, (es el nombre que quieras ponerte) Nombre dirección, es la dirección de tu servidor FTP. (si por ejemplo fuese iespana seria : ftp.iespana.es) Tipo host (no cambiar) ID Usuario (tu identificación como usuario del servicio, este dato te lo facilitará tu servidor) Contraseña (la contraseña que te permitirá entrar en tu servidor, también te la facilitaran

ellos).

Por lo general una vez dado de alta en algún servicio te suelen mandar un e-mail con todos tus datos.

Después de lo anterior presiona Aceptar y aparecerá la siguiente ventana:



Como puedes ver en un lado tu computadora y en otro el servidor, simplemente tenemos que ir seleccionando y mandarlo o bien presionando dos veces sobre el archivo, página, imagen o una vez seleccionado y presionando en la flecha entre las dos ventanas, podemos a su vez hacer selecciones múltiples si mantenemos pulsado Alt Gr en nuestro teclado, mientras vamos eligiendo lo que queremos subir y luego la flecha así subimos de una vez varios contenidos, el documento, las imágenes, RECORDAR que por lo general tu primera página tienes que denominarla index.html y las demás son las que irán enlazadas a esta.

Recuerda tener tu web bien estructurada

Dentro de Windows tenemos el asistente para la publicación en web. Lo primero es conocer estos 3 datos necesarios: el login (o nombre de usuario), el password (tu contraseña) y la dirección TFP (nuestro servidor) Todos estos datos siempre nos los proporcionan ellos mismos,

donde hemos abierto la cuenta. Por ejemplo el ftp de www.iespana.es el que nos dan es: ftp.iespana.es, el de tripod: ftp.tripod.es, etc. Comencemos, abrimos el programa y veremos que habrá una sección donde podamos poner todos nuestros datos (el login, password y dirección FTP) Rellenamos nuestros datos y le damos a conectar.

Una vez conectados se nos abrirá otra ventana la cual estará



dividida en 2 partes. El lado de la izquierda nuestra computadora y el de la derecha el del servidor. El de la derecha es nuestro "disco duro virtual" es decir nuestro espacio web en el servidor. En el lado izquierdo, ahí tenemos que buscar la carpeta donde tenemos guardada nuestra página web con todas sus páginas, imágenes y archivos utilizados. Seleccionamos todos los componentes y le damos a " enviar " normalmente es una flechita hacia la derecha. Verás una barra de progreso según vaya el envío de datos al servidor. Cuando finalice el envío de nuestra pagina web, en el lado derecho veras los archivos enviados. (En nuestra computadora, continuará estando nuestra página web). Recuerda siempre desconectar tras finalizar tu sesión. Importante: Recuerda siempre llamar a tu página principal index.

3.2. ALMACENAR PÁGINAS WEB EN UN SERVIDOR DEDICADO O GRATUITO.

¿Qué es el servicio de hospedaje de páginas?

El hospedaje de páginas es ofrecer espacio dentro de un servidor para que publique su propia página, con opciones específicas de almacenamiento en disco y características adaptables a sus necesidades sin tener que comprar costosos servidores; sólo paga lo que necesita.

Estas son imágenes de algunas de las herramientas y servicios incluidos en el servidor.

Página Principal. Publicación de la página principal del sitio, una página con una cuartilla de texto y una imagen. Puedes dejarla como tu página principal, corregirla con las herramientas que se proporcionan o sustituirla con las páginas que tú diseñes y subas al servidor.

Estadísticas. Desde esta sección puedes conocer un reporte detallado de los visitantes que recibes cada mes y cada día. Reportes específicos como: Hits, vistas por día y por hora, página de procedencia de tus visitantes, páginas más consultadas, páginas de entrada y de salida, términos buscados en los principales buscadores, IPs, dominios, etc.Panel de Control Personal. Desde este panel, los usuarios autorizados del sitio pueden administrar las configuraciones de la cuenta personal: Pueden cambiar la clave de acceso, redireccionar su correo a otra cuenta, respaldar y restaurar sus archivos personales y conocer el espacio que ocupan en su servidor

Webmail. Tienen acceso al correo a través del explorador web, con un sistema como el de hotmail. Desde tu correo web puedes: Enviar y recibir correo html, exportar o importar tu libreta de direcciones, filtrar correo no deseado, corrector de ortografía (ingles) crear carpetas, recibir correo desde otras cuentas de correo POP3 (como prodigy), y administrar tu propia agenda de actividades.Administrador de Archivos. Desde este sistema puedes administrar fácilmente todos los archivos del sitio. Puedes realizar funciones básicas como: editar, copiar, eliminar, mover archivos: o funciones avanzadas de Telnet y FTP como: perl, chmode, cd, find, etc. Incluye su propio editor HTML como el de FrontPage.

Panel de Control. Desde esta sección del sitio, puedes administrar todas las funciones del servidor para controlar tu página. Puedes configurar a tus usuarios autorizados (empleados de tu empresa, amigos, clientes, etc) y sus correos electrónicos, respaldar y restaurar toda su información, conocer el uso de tu servidor (espacio disponible, web, correo, ftp), crear listas de correo, etc.

El Servicio de Hospedaje Dedicado brinda un servidor exclusivo para el sitio Web o las aplicaciones de la empresa. Las ventajas de contar con un servidor dedicado es que permite



instalar las aplicaciones de software que se requiera, hospedar el número de sitios Web de acuerdo a la capacidad de almacenamiento y configurar el servidor de acuerdo a sus necesidades.

Además de contar con un acceso dedicado a Internet, suministro ininterrumpido de energía eléctrica, monitoreo del servidor y mantenimiento preventivo de toda la infraestructura 24 x 7 (24 horas al día los y días de la semana), los planes de Hospedaje Dedicado incluyen servicios de gran valor para las empresas como el almacenamiento de alto desempeño, respaldo diario de la información y cuentas de Correo Negocios con el nombre de su empresa:

El servicio de correo electrónico que le brinda:

Direcciones de correo con el nombre del negocio.

Puede enviar documentos adjuntos de hasta 25

MB.

Enviar y recibir mensajes de correo de forma

rápida y segura.

Hospedaje Gratis.

Hay compañías que ofrecen hospedaje gratis. A cambio de que en tu página aparezcan anuncios de esa compañía y de algunas otras. El hospedaje gratuito es una buena idea, si tu página es personal, por ejemplo, una página dedicada a tus pasatiempo, amigos, a tu mascota, a tus viajes, etc.

Para los sitios de internet de empresas, negocios, compañías, asociaciones, etc, tener anuncios de otras empresas en tu sitio da mala imagen. El visitante podría pensar "esta empresa no tiene para comprar su propio hospedaje". Otra desventaja es que el hospedaje gratis no es seguro. Si esa compañía de repente se sale del negocio, tu página se quedaría sin hospedaje.

Ventajas:

Gasto cero: No pagamos ni la transferencia, ni el registro de dominio, es todo gratis.

Respaldo: Por ejemplo si estamos en blogger todo el sistema se encuentra respaldado por Google, en este caso muy difícilmente tendremos problemas de backups, servers caídos, etc.

Desventajas:

Poca identidad: Los dominios que utilizan estos sistemas que realmente son subdominios del dominio principal muchas veces dan una sensación aparente de poca seriedad.

Falta de Flexibilidad: No poder hacer modificaciones de nuestra plantilla al 100%, la imposibilidad de instalar plugins y cosas de ese estilo en un principio pueden no molestar pero en cuento pasan los meses empieza a pesar este aspecto.

Una dependencia peligrosa: En un principio olvidarnos de los gastos de alojamiento es atractivo, pero a la vez es un poco peligroso, ya que puede desaparecer el sitio y los clientes quedan en el aire.



Problemas para migrar: Si empezamos nuestro blog en blogger y luego queremos pasarnos a otro sitio es bastante engorroso. Actualmente no todos los servicios nos permiten hacer una redirección por lo tanto también estaremos perdiendo todo el posicionamiento y antigüedad que logramos.

3.3. SELECCIONAR UN SERVIDOR DE INTERNET CONSIDERANDO LAS CARACTERISTICAS DE LA PÁGINA WEB.

Antes de decidir donde alojaremos nuestra página, es necesario conocer los tipos de servidores y de servicios que proporcionan cada uno de ellos:

Tipos de servidores

En las siguientes listas, hay algunos tipos comunes de servidores y de su propósito.

Servidor de archivo: almacena varios tipos de archivos y los distribuye a otros clientes en la red. ←Servidor de impresiones: controla y maneja una o más impresoras y acepta trabajos de impresión de otros clientes de la red, poniendo en cola los trabajos de impresión (Aunque también puede cambiar la prioridad de las diferentes impresiones), y realizando la mayoría o todas las otras funciones que un sitio de trabajo se realizaría para lograr una tarea de impresión si la impresora fue conectada directamente con el puerto de impresora del sitio de trabajo.

Servidor de correo: almacenan, envían, reciben, enrutan, y realizan otras operaciones relacionadas con e-mail para otros clientes en la red.

Servidor de fax: almacenan, envían, reciben, enrutan, y realizan otras funciones necesarias para la transmisión, la recepción, y la distribución apropiadas de los fax.

Servidor de la telefonía: realiza funciones relacionadas con la telefonía, tales como contestador automático, realizando las funciones de un sistema interactivo de la respuesta de la voz, almacenando los mensajes de voz, encaminando las llamadas, también controla la red o el Internet (Ej. entrada excesiva del IP de la voz (VoIP)), etc.

Proxy server: realiza un cierto tipo de función a nombre de otros clientes en la red para aumentar el funcionamiento de ciertas operaciones (Ej., prefetching y depositar documentos u otros datos que se soliciten muy frecuentemente), también sirve seguridad, esto es, tiene un Firewall. Permite administrar el acceso a internet en una Red de computadoras permitiendo o negando el acceso a diferentes Web sites. ←Servidor del acceso remoto (RAS): controla las líneas de módem de los monitores u otros canales de comunicación de la red para que las peticiones conecten con la red de una posición remota, respuestas la llamada telefónica entrante o reconocen la petición de la red, y realizan los chequeos necesarios de la seguridad y otros procedimientos necesarios para registrar a un usuario sobre la red. Servidor del uso: realiza la parte de la lógica de la informática o del negocio de un uso del cliente, aceptando las instrucciones para que las operaciones se realicen de un sitio de trabajo y sirviendo los resultados de nuevo al sitio de trabajo, mientras que el sitio de trabajo realiza el interfaz operador o la porción del GUI del proceso (es decir, la lógica de la presentación) que se requiere para trabajar correctamente.



Servidor web: almacena documentos HTML, imágenes, archivos de texto, escrituras, y demás material Web compuesto por datos (conocidos colectivamente como contenido), y distribuye este contenido a clientes que la piden en la red.

Servidor de reserva: tiene el software de reserva de la red instalado y tiene cantidades grandes de almacenamiento de la red en discos duros u otras formas del almacenamiento (cinta, etc.) disponibles para que se utilice con el fin de asegurarse de que la pérdida de un servidor principal no afecte a la red. Esta técnica también es denominada clustering.

3.4. UTILIZAR LA PÁGINA DEL SERVIDOR DE INTERNET PARA ALOJAR UNA PAGINA WEB.

Depende del tipo de sitio web vayas a tener. Por ejemplo, si solo quieres anunciar tu empresa, poner fotos, videos, un catálogo y que te manden correos, necesitas un hospedaje básico, que te permita guardar tus archivos y recibir decenas o cientos de visitas diarias.

Para la mayoría de las pequeñas empresas que inician en Internet, el hospedaje básico es suficiente.

Si tu empresa es Transnacional con franquicias en varios países, y quieres aceptar tarjetas de crédito y realizar envíos a todo el mundo, además planeas recibir miles de visitas diarias, procesar compras con total seguridad y guardar grandes archivos en la memoria, entonces necesitarás un hospedaje mayor y más especializado.

Recuerda que los vendedores siempre tratan de venderte más y más cosas que no necesitas. Lo mismo ocurre con el hospedaje. Las compañías de hospedaje van a tratar de venderte muchísima memoria y ancho de banda y muchas características que no necesitarás.

Es recomendable a la mayoría de quienes inician en Internet el Hospedaje básico. Si después necesitas mayor capacidad, solo aumentas tu cuenta.

¿Qué incluye un servicio de hospedaje en Internet?

La mayoría de los servicios de hospedaje te incluyen los siguientes servicios:

Un Panel de Control para configurar el Hospedaje. Memoria para almacenar tus archivos, como fotos, videos, música, páginas web,

animaciones flash, etc. Creación de cuentas de correo de tu página web. Estadísticas detalladas de la actividad y visitas a tu sitio en internet. Programas listos para instalar como chats, galerías de fotos, contadores de visitas, etc. Varios Gigas de tráfico, para recibir desde una hasta miles de visitas diarias. Programas FTP para cargar archivos de manera más rápida



3.5. VERIFICAR EL FUNCIONAMIENTO DE LA PÁGINA WEB DENTRO DEL SERVIDOR SELECCIONADO.

Para verificar la presentación

Para revisar cómo se vera su página en distintos tipos de navegador y tamaños de pantalla es muy útil el "Screen Size Tester".

Para revisar cómo se verá la página según la versión de html soportada por los navegadores e incluyendo Webtv: Web Site Viewer

Para verificar cómo verán nuestras páginas las personas con distintos tipos de deficiencias de percepción del color, una muy útil herramienta de revisión en línea es: Servicio Newman de evaluación del diseño.

Para verificar la sintaxis

El Servicio de verificación del W3C, inspecciona los documentos para revisar su conformidad con las recomendaciones de HTML Y XHTML.

El Servicio de Verificación de CSS facilita revisar la corrección de los estilos en cascada utilizados. Puede descargarse un programa o utilizarse a través de la Web en: http://jigsaw.w3.org/css-validator/

BIBLIOGRAFIA

- http://cevug.ugr.es/downloads/public/curso_DreamWeaver04.pdf 30 de julio de 2007- http://eyd142009pc13.tripod.com/adm_titulares.htm- http://www.colarte.com/clasificacion/Textos/Conceptualismo.htm 20 de Junio de 2007- http://www.monografias.com/trabajos11/disegraf/disegraf.shtml 20 de Junio de 2007- http://www.monografias.com/trabajos13/hisdisgr/hisdisgr.shtml#PRINCIP 20 de Junio de

2007- http://www.newsartesvisuales.com/funda/color3.htm 25 de junio de 2007- http://www.villegaseditores.com/loslibros/9589084060/10-3.html 20 de junio de 2007

- Maldonado Daniel (2001), Diseño & Comunicación Visual, Ñ Ediciones, Buenos Aires. www.adecorar.com/estilos/moderno/index.cfm?pagina=estilos_moderno_009_009 20 de junio de 2007

- www.decoesfera.com/categoria/minimalismo 20 de junio de 2007- www.terra.com/casa/articulo/html/cas123.htm 20 de junio de 2007

- Kettel, Jennifer A.- Manual de Referencias Dreamweaver 4.- McGraw-Hill.- España.- 2001

- Pascual, Francisco.- Navegar en Internet, Macromedia, Dreamweaver 3.- AlfaOmega.- México.- 2000


http://jigsaw.w3.org/css-validator/

http://newmanservices.com/colorblind/default.asp

http://newmanservices.com/colorblind/default.asp

http://www.anybrowser.com/siteviewer.html

http://www.anybrowser.com/ScreenSizeTest.html

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

Elaboracion de Paginas WEB

Documents

Transcript of Elaboracion de Paginas WEB