Realizado por:- Rubén Zambrana- Viviana Winkler- Carmen Sánchez- Álvaro Sánchez

Índice

• ¿Qué es?• ¿Para qué sirve?• ¿Qué se necesita para hacerla? • Elementos fundamentales.• ¿Qué es un editor Web?• Usabilidad Web.• Consejos.

¿Qué es?¿Qué es?Una página web es una Una página web es una fuente de información fuente de información adaptada para la Word adaptada para la Word Wide Web (WWW) y Wide Web (WWW) y accesible mediante un accesible mediante un navegador de Internet. Esta de Internet. Esta información se presenta información se presenta generalmente en formato generalmente en formato HTML y puede contener y puede contener enlaces a otras páginas enlaces a otras páginas web, constituyendo la red web, constituyendo la red enlazada de la World Wide enlazada de la World Wide Web.Web.

Índice

Los buscadores exploradores o navegadores son programas (software) generalmente gratuitos, que instalados en el ordenador permiten ver

documentos almacenados en el disco duro, disquete, etc, o a través de Internet, acceder a documentos alojados en servidores web.

Siglas de Siglas de Hyper Text Markup LanguageHyper Text Markup Language, es el lenguaje que se emplea para , es el lenguaje que se emplea para crear páginas Web, es decir, los códigos con los que se definen las crear páginas Web, es decir, los códigos con los que se definen las

propiedades del texto, la posición y todo lo relativo al aspecto de la página. propiedades del texto, la posición y todo lo relativo al aspecto de la página. Se distingue porque todas sus instrucciones se incluyen entre los signos "<" y Se distingue porque todas sus instrucciones se incluyen entre los signos "<" y

">".">".

Diccionario HTML

¿Para qué sirve?¿Para qué sirve?

Una Web, hoy en día es una herramienta poderosa para Una Web, hoy en día es una herramienta poderosa para tener una presencia las 24 horas del día los 365 días del tener una presencia las 24 horas del día los 365 días del año. Es un servicio muy completo que sirve año. Es un servicio muy completo que sirve fundamentalmente como medio de comunicación e fundamentalmente como medio de comunicación e información valedero en los mas diferentes campos. información valedero en los mas diferentes campos.

Pero para empezar…

Para empezar…

• Domina las herramientas de diseño y programación más importantes (Flash, Dreamweaver, HTML)

• Aprende todo lo necesario sobre servidores y dominios, para poder gestionar una Web.

• Adquiere los conocimientos de diseño necesarios para plasmar conceptos en páginas Web .

• Conoce el funcionamiento de Internet y aprende a usar todas sus utilidades.

Índice

¿Qué se necesita?¿Qué se necesita?1- Planear la finalidad y el aspecto del sitio. 2- Hacer un boceto de tu sitio.

3- Registrar un nombre de dominio.

4- Buscar alojamiento para tu sitio.

5- Crear y comprobarlo.

6- Publicarlo y realizar el mantenimiento necesario. 7- Conectarte a Internet, escribir tu nombre de dominio y esperar a que tu sitio aparezca en línea.

Índice

Texto: puede proceder de un procesador de

textos.

Películas interactivas

flash.

Imágenes: gif, jpg, png. Programas de gráficos.

Programa de edición de

html y gestión del sitio Otros componentes

multimedia: sonidos, animaciones …

Componentes que añaden más funciones e

interactividad.

Programación:

Javascript,VBScript.

Applets de Java

Otros

Página Web – visualización en el navegador.

• Se puede utilizar tanto para la producción de elementos animados e interactivos como para generar sitios completos.

• Las películas hechas con Flash son multiplataforma, se ven de la misma forma independientemente del navegador.

• Se descargan rápidamente, ya que, conservan unos tamaños relativamente modestos.

• La creación de animaciones resulta sencilla y divertida. Objetos que cambian de posición, de color, de forma o, incluso, que se convierten en otros objetos.

• Dispone de un sistema de bibliotecas que permite reutilizar los elementos.

Índice

Es un software especialmente útil para crear animaciones. La evolución de Flash está vinculada con la evolución de la Web.

Usabilidad Web

Usabilidad se refiere a la experiencia del usuario al interactuar con un un sitio Web.Un sitio Web con usabilidad es aquél que muestra todo de una forma clara y sencilla de entender por el usuario. Aunque es imposible crear un sitio que sea claro y eficiente para cada usuario, el diseñador debe esforzarse para mostrar las cosas tan claramente como sea posible, de tal modo que reduzca al mínimo cualquier aspecto que pueda ser confuso

Normas que debemos seguir

1. Problemas de Legibilidad.

2. Links mal utilizados.

3. Formato Flash.

4. Contenidos escritos para la Web.

5. Búsquedas.

6. Incompatibilidad de Navegadores.

7. Formularios extensos.

8. Información de la Empresa.

9. Interfaces, resoluciones.

10. Agrandado de fotos. Índice

¿Qué es un editor web?

Es una aplicación diseñada con el fin de facilitar la creación de documentos HTML. Su complejidad puede variar desde la de un simple editor de texto con coloreado de sintaxis, hasta entornos WYSIWYG en los que de manera visual se pueden colocar distintos elementos sobre una vista previa de la página, encargándose el programa de generar el documento HTML.

Ejemplos claros de editores de páginas Web son:

– KompoZer.

– Mozilla Composer.

– Amaya.

– Dreamweaver.

– Microsoft FrontPage.

Índice

• Introducción

• Características

• Ventajas e inconvenientes

Dreamweaver

Es un editor visual Es un editor visual profesional de Macromedia profesional de Macromedia para la creación de sitios y para la creación de sitios y páginas Web que páginas Web que contienen gráficos y contienen gráficos y elementos multimedia. elementos multimedia. Con Dreamweaver resulta Con Dreamweaver resulta fácil crear y editar páginas fácil crear y editar páginas compatibles con cualquier compatibles con cualquier explorador y plataforma.explorador y plataforma.

Índice

Consta de unas capacidades propias: WYSIWYG, y además tiene las funciones típicas de un editor Web:

– Un administrador de sitios, para agrupar los archivos según el proyecto al que pertenezcan.

– Un cliente FTP integrado, que permite subir los archivos editados inmediatamente al sitio en Internet.

– Función de auto completar y resaltado de la sintaxis para instrucciones en HTML y lenguajes de programación como PHP, JSP o ASP.

Índice

Es el acrónimo de What You See Is What You Get (en inglés, "lo que ves es lo que obtienes"). Se aplica a los procesadores de texto y otros editores de texto con formato (como los editores de HTML) que permiten escribir un documento viendo directamente el resultado final.

Se dice en contraposición a otros procesadores de

texto, hoy en día poco frecuentes, en los que se escribía sobre una vista que no mostraba el formato del texto, hasta la impresión del documento. En el caso de editores de HTML este concepto se aplica a los que permiten escribir la página sobre una vista preliminar similar a la de un procesador de textos, ocupándose en este caso el programa de generar el código fuente en HTML.

• Cumple perfectamente el objetivo de diseñar páginas con aspecto profesional.

• Soporta gran cantidad de tecnologías muy fáciles de usar:

-Hojas de estilo y capas.- Javascript para crear efectos e interactividades.-Inserción de archivos multimedia...

• Se puede actualizar con componentes, que fabrica tanto Macromedia como otras compañias.

• El código generado es de buena calidad.

• Dispone de muy buena documentación.

• Puede resultar un poco difícil su manejo para personas menos experimentadas.

PROGRAMAS

FrontPage

Aplicación creada por Microsoft para la edición de Aplicación creada por Microsoft para la edición de páginas Web, ideal para aquellos que desconocen cómo páginas Web, ideal para aquellos que desconocen cómo trabajar con HTML; está especialmente diseñado para trabajar con HTML; está especialmente diseñado para trabajar óptimamente con el navegador de Microsoft trabajar óptimamente con el navegador de Microsoft Internet Explorer, por lo que limita la visualización Internet Explorer, por lo que limita la visualización perfecta de las páginas. perfecta de las páginas.

• La interfaz para generar estas páginas es muy similar a Word. • Se puede:

- Escribir contenido - Importar imágenes - Crear ligas a otras páginas de Internet.

• Está orientado a personas inexpertas y sin conocimientos de HTML.

• Al ser un producto Microsoft, construye páginas optimizadas para Internet Explorer. • Es recomendable que el servidor donde se va a colocar tenga las Extensiones de Frontpage.

• Incluye muy a menudo imágenes a las que no le asigna una ruta relativa sin avisar al usuario.

• En ocasiones crea barras de navegación que luego no funcionan

PROGRAMAS

Cuando uno usa una herramienta, o accede e interactúa con un sistema informático, suele haber "algo" entre uno mismo y el objeto de interacción. Ese algo, que es a la vez un límite y un espacio común entre ambas partes, es la interfaz.En el caso de la Red, la interfaz no es sólo el programa que se ve en la pantalla.

Homesite• Es uno de los más completos y sencillos de usar.

• Está pensado para editar tus páginas programando directamente el HTLM sin necesidad de tener grandes conocimientos sobre este.

• Tiene la posibilidad de diseñar WYSIWYG lo que simplifica y ofrece más velocidad en el diseño de Webs simples.

• Contiene un editor de estilos CSS.

• Posee tratamiento muy bueno de los archivos del sitio, con panel de archivos.

• Este se puede convertir en un inspector de etiquetas.

• Tiene una barra de herramientas muy completa.

Actualmente sólo está disponible en Inglés.

Es un producto de Allaire empresa comprada por Macromedia.

PROGRAMAS

• Es muy potente, y totalmente gratuito. • Es totalmente configurable y permite la edición de sitios directamente desde Internet.

• Todas sus opciones son ampliable debido al soporte de plug-ins que ofrece este programa.

• El soporte técnico es sorprendente.

• Reconoce casi todos los lenguajes de creación de sitios Web.

• Está orientada más a los programadores que a los diseñadores.

• Sólo tiene dos vistas: la vista de código y la de previsualización.

PROGRAMAS

• Es bastante completo.

• Ayuda más que nada a usuarios inexpertos en temas de Internet, que quieran hacer una página Web desde la vista diseño.

• Permite al usuario desconocer prácticamente todos los procesos, lenguajes y programas que participan en el ciclo de desarrollo y mantenimiento de una Web. • Posee un amplio número de plantillas prediseñadas.

• No ofrece ninguna ayuda para los usuarios que saben sobre HTML y les gusta tener un control total de todos los aspectos de la página.

• Es un programa muy particular y con una interfaz bastante exclusiva.

Índice

Plantilla Web

Es una página Web "pre-fabricada", con todo el código HTML e imágenes ya listos, que puedes modificar a tu gusto:

• Introduciendo tus textos e información.• Cambiando los colores.• Sustituyendo o añadiendo imágenes.• Agregando tu logotipo También puedes comprarlas y usarlas como punto de partida para diseños Web más complejos.

Consejos Consejos Consejos Consejos - Hay que tener cuidado con el aspecto de la web, la velocidad de carga y todos los factores que hacen la visita más agradable a la web, para captar la atención del lector en un breve espacio de tiempo.- Colocar un título corto, descriptivo y preciso. - Proporcionar pistas sobre el contenido en la parte superior de la página. - Si la página ocupa más de tres "pantallas", dividirla en más de una página; equilibrar el espacio en blanco, las imágenes grandes y pequeñas y los bloques de texto para dotar a la página de interés y variedad. - Usar un color para el texto y enlaces que complemente al del fondo. - No crear dos enlaces con el mismo nombre que lleven a sitios diferentes o dos enlaces con diferentes nombres que lleven al mismo sitio.- Ofrecer siempre una forma de retornar a través de un enlace a la página principal.- Crear un enlace con la dirección de correo del webmaster.