Mi primera Web

1. Mi primera Web LA PANTALLA EL NAVEGADOR EL LENGUAJE EL ASISTENTE EL SERVIDOR MÁS OPCIONES

2. La Resolución de pantalla está determinada por sus dimensiones en píxeles. LA RESOLUCIÓN DE PANTALLA • La mayoría de sitios Web han sido concebidos para • 800x600 píxeles. La Pantalla y la Página .1

3. LA PANTALLA Y LA PÁGINA .1 • Para que nuestra Web sea vista correctamente en la mayoría de los ordenadores de usuarios, y al igual que hacemos en el Word en Configuración de página en cuanto a los márgenes del folio impreso y en Vista preliminar antes de imprimir: • Optamos por incluir todo el contenido dentro de una Tabla • Le damos un ancho de 780px y la vamos a situar en el centro de la Pantalla (La resolución media es de 800x600px) • Al fondo de Pantalla le daremos un color característico • Y le damos un margen superior de 5px La Pantalla y la Página .2

4. LA PANTALLA Y LA PÁGINA .2 • Los Navegadores permiten ver las Páginas Web de un contenido tan extenso en ancho y largo casi infinito, lo que no seria cómodo para el usuario. • No hacer tan ancha la página que se necesite usar la barra de desplazamiento horizontal. • Ni tampoco muy larga sin Índices o barra de navegación para ir con vínculos a los sitios o capítulos deseados y volver. • De ser posible, si la página tiene más de tres avances de páginas, se aconseja hacer nuevas páginas Web vinculadas.

5. EL LENGUAJE Y EL CÓDIGO FUENTE • El lenguaje HTML es el usado por las páginas Web y reconocido por la World Wide Web (www). • Es un código para la descripción lógica de documentos. • Los Navegadores interpretan este código para representar la página Web en pantalla. • Es bueno conocer el lenguaje HTML, siempre se necesitará entrar en el Código fuente para introducir modificaciones. Aunque se recomiende usar un Asistente editor de páginas Web. El Lenguaje y el Bloc de Notas

6. EL LENGUAJE Y EL BLOC DE NOTAS Ejemplo de una página Web desde el Bloc de Notas y archivo a guardar con extensiónhtmo html, para ser abierto por el navegador.

7. EL ASISTENTE Es la herramienta que facilita la construcción de una página Web, insertando imágenes, textos y sonidos con su lenguaje HTML o Código fuente automáticamente. • FrontPage es el asistente de microsoft.com para editar páginas Web sencillas. • Macromedia Dreamweaver es el asistente de macromedia.com para proyectos complejos. • Hay otros asistentes como Netscape Composer, Adove GoLive, StarOffice, Nvu, etc.

8. EL NAVEGADOR • El Navegador es un programa para visualizar las páginas Web. • Internet Explorer se incluye con Windows.Google Chrome, Netscape, Mozilla, etc. Son otros navegadores.

9. EL SERVIDOR • Es el que almacena las páginas Web de los clientes, a través del cual se pueden conectar con todos los usuarios del mundo que lo deseen. Algunos Servidores oProveedores de Internet: -Galeón-Blogger-Jazztel Europa Asia Oceanía África América

10. Mi primera Web Opciones Avanzadas • Estructura • Tablas • Textos • Imágenes • Sonidos • Hipervínculos Para ver Comentario final: Clic en el PC

11. ESTRUCTURAS MÁS COMUNES Desarrollo de tres opciones Cada página en nueva ventana Cada página en nueva ventana Marcos. Logo y Barra fijos Logotipo y Título Logotipo y Título Logotipo y Título Barra de Navegación Contenidode laPortada Contenidode laPortaday de lasdemás páginasdel contenido Contenidode laPortada Barra de Navegación Barra de Navegación 1 2 3 En una Página Web, la importancia la tiene su Contenido.Pero la Portada es el tema al que hay que dedicar más tiempo.....

12. Las Portadas La Portada debe resumir todo el contenido de su interior.Debe ser: Atrayente; agradable; artística; interesante y sugestiva !!!

13. Las Portadas La Portada debe resumir todo el contenido de su interior.Debe ser: Atrayente; agradable; artística; interesante y sugestiva !!!

14. 1.- Barra de navegación arriba • Por ser una Web sencilla y de pocas páginas, la estructura de la Portada lleva entre el Título y el Contenido un Índice o barra de navegación con Enlaces a las demás páginas de la Web Página decontenidoMis Enlacespreferidos Logotipo y Título Fotos - Enlaces Página decontenidoMis Fotos Contenidode laPortada Todas las Páginasse abren en una nueva Ventana

15. 2.- Barra de navegación a la izquierda • Por ser un sitio Web con más páginas, la estructura de la Portada lleva a la izquierda la barra de navegación con Hipervínculos o Enlaces a las demás páginas de la Web Logotipo y Título Página 4 Pág.1Pág.2Pág.3Pág.4Pág.5...... Contenidode laPortada Página 3 Página 2 Página 1 Todas las Páginas, incluido la Portada, se abren en una nueva Ventana

16. 3.- Marcos. Título y Barra fijos • La Portada consta de tres marcos, dos son fijos y uno que es el principal es donde aparecerán las páginas de la Web Puede constar también de dos marcos dentro de la misma ventana Logotipo y Título Pág.1Pág.2Pág.3Pág.4Pág.5...... Contenidode laPortada y detodas las páginasde la Web Todas las Páginasse abren dentro del marco principal

17. HIPERVÍNCULOS 1.- INTERNOS: Dentro de un sitio Web desde la Portada a las distintas páginas y viceversa: <a href=“poesias.htm”>Mis Poesías</a> 2.- EXTERNOS: Desde un sitio Web y para facilitar con un solo clic el acceso a sitios preferidos: <a href=“http://www.rae.es”>Real Academia Española</a> 3.- ANCLAJES: Dentro de una página, si ésta es algo larga, se ponen desde un Índice con los temas o capítulos a donde queremos ir: <a href=“#capitulo_1”>Capítulo 1- Historia</a>Y en el capítulo: <a name=“capitulo_1”></a>

18. TABLAS • Todos los contenidos de una página Web se encuentran mejor organizados y en posiciones exactas si usamos para ellos las Tablas ocultas de HTML. • El código fuente de una tabla sencilla es así: Estas etiquetas son del lenguaje HTML. En las Propiedades de la Tabla tenemos todas las opciones de tamaño, situación, color, borde, etc. <table><tr><td>Contenido</td></tr></table>

19. TEXTOS Todos los textos que se incluyen en la página Web están configurados a través de las Fuentes disponibles en el lenguaje HTML del Asistente del constructor de la página. Las fuentes del proyecto Web son interpretadas por los Navegadores instalados en los PC de los usuarios y de no disponer de las mismas, emplean fuentes predeterminadas. <font face=“Arial”>Tipo Arial</font><font color=“blue”>Color azul</font><font size=“2”>Tamaño 2</font> Lenguaje HTMLpara las fuentesde los Textos

20. IMÁGENES • Las imágenes a instalar en la página Web deben ser: • De pequeño tamaño en KB para que la descarga sea rápida. • De dimensiones adecuadas para ser vistas en pantalla sin usar barras de desplazamiento. Lenguaje HTMLde Imágenes <img src=“domino.gif” width=“135” height=“121” alt=“Seis doble” />

21. SONIDOS Se pueden insertar sonidos de fondo de una página Web. En el ejemplo y desde FrontPage, se ha puesto un corto sonido para oírse una sola vez al abrir la página. El mismo que hemos incrustado aquí. Código fuente de una página Web con sonido en el Asistente FrontPage El navegador solo podrá reproducir los formatos que reconozca.

22. CONCLUSIONES Esta Presentación tiene como objetivoorientar a los iniciados e interesadosen el tema, de forma clara y breve.Sin olvidar el apoyo necesario de la Biblioteca especializada, los cursos gratis on-line y el tiempo de prácticas. Algunos trabajos del Autor:www.centrodiamayorejido.blogspot.comwww.centrodiamayorejido.galeon.comwww.centroadultos.galeon.com www.mayoresvelez.galeon.comwww.mayoresejido024.blogspot.com jesus1056@yahoo.es