Sesion Nº4 La Primera Pagina Web

926 views
840 views

Published on

Topicos Especiales: Sesion N° 04

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
926
On SlideShare
0
From Embeds
0
Number of Embeds
57
Actions
Shares
0
Downloads
33
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Sesion Nº4 La Primera Pagina Web

    1. 1. Sesión 04: Ing. Edgar A. Cruz Huaman INSTITUTO SUPERIOR TECNOLÓGICO “SAN PEDRO” La Primera Página Web. (<p>, <br>, <hr>, <a>, <center>, < blockquote>, <address>, atributos.)
    2. 2. I. HTML <ul><ul><li>WWW contiene información casi infinita. </li></ul></ul><ul><ul><li>La WWW es un sistema Hipermedia. </li></ul></ul><ul><li>II. Características del lenguaje HTML </li></ul><ul><ul><li>El Web tenía que ser distribuido. </li></ul></ul><ul><ul><li>El Web tenía que ser hipertexto y debía ser fácil navegar por él. </li></ul></ul><ul><ul><li>Tenía que ser compatible con todo tipo de ordenadores y con todo tipo de S.O. </li></ul></ul><ul><ul><li>Debía ser dinámico. </li></ul></ul>
    3. 3. II. Editores Html <ul><li>Asistentes: HotDog(Win), HomeSite (Win),HTML Editor(Mac), Quanta(Linux, KDE) o Bluefish, (Linux,GNOME), Notepad++. </li></ul><ul><li>Conversores: Microsoft Word, Quark XPress y PageMaker. </li></ul><ul><li>Editores WYSIWYG: Macromedia Dreamweaver, HotMetal, Microsoft Frontpage, phpDesigner 2007 Professional. </li></ul>
    4. 4. III. Algunas razones para usar HTML <ul><li>Aprovechar todas las características de este lenguaje, incluso las más nuevas. </li></ul><ul><li>Modificar el código que generan los WYSWYG, corregir errores o incluir etiquetas no soportadas por el editor. </li></ul><ul><li>No depender de la disponibilidad de una herramienta concreta para poder crear páginas web. </li></ul>
    5. 5. IV. Atributos de una Etiqueta <ul><li>Las etiquetas tienen atributos para cambiar aspectos del efecto que producen. </li></ul><ul><ul><li>Formato: <etiqueta atributo=&quot;valor&quot;> </li></ul></ul><ul><ul><li>Ejmplo: <hr size = 1> </li></ul></ul>
    6. 6. V. Párrafos en HTML
    7. 7. VI. Saltos de línea (<br>)
    8. 8. VII. Cómo se insertan párrafos (<p>)
    9. 9. VII. Mas sobre parrafos. (ii) <ul><li>Existe otra opción para el código anterior? </li></ul><ul><li>Uso incorrecto de la etiqueta <p> </li></ul><ul><li>El atributo ’align ’ en la etiqueta <p> permite especificar la alineación del párrafo. Puede tener tres valores: &quot; center &quot;, &quot; left &quot; y &quot; right &quot;, para obtener un párrafo centrado, alineado a la izquierda o alineado a la derecha respectivamente. </li></ul>
    10. 10. Ejercicio Nº 01
    11. 11. VIII. Líneas horizontales para separar párrafos (<hr>)
    12. 12. Ejercicio Nº 02
    13. 13. IX. La etiqueta <blockquote>... </blockquote> <ul><li>Ejercicio Nº 03 </li></ul>
    14. 14. X. La etiqueta <address>... </address>
    15. 15. XI. La etiqueta <center>... </center> <ul><li>Ejercicio Nº 04 </li></ul>
    16. 16. XII. Cómo insertar imágenes en una página. (<img></img>) <ul><li>Ejemplo </li></ul><ul><ul><li><img src=&quot;flecha1.gif&quot;> </li></ul></ul>
    17. 17. XIII. Cómo crear enlaces hipertexto. <ul><li>Los enlaces pueden clasificarse en dos tipos, los internos o locales y los externos: </li></ul><ul><ul><li>/hobbies/index.html </li></ul></ul><ul><ul><li>http://www.otroservidor.com/hobbies/index.html </li></ul></ul><ul><li>La etiqueta <a>... </a> </li></ul><ul><ul><li><a href=“index.html&quot;> Texto </a> </li></ul></ul><ul><li>Páginas en otros directorios. </li></ul><ul><ul><li><a href=&quot;varios/hobbies.html&quot;>hobbies</a> </li></ul></ul><ul><li>Enlaces externos. </li></ul><ul><ul><li><a href=&quot;http://www.corsiteccgmr.com&quot;>CORSITEC</a> </li></ul></ul>
    18. 18. REPASO. <ul><li>Titulares : <h1> </li></ul><ul><li>Salto de línea : <br> </li></ul><ul><li>Parrafo : <p> </p> </li></ul><ul><li>Línea horizontal : <hr> </li></ul><ul><li>Texto parafraseado : <blockquote> </blockquote> </li></ul><ul><li>Centrado : <center></center> </li></ul><ul><li>Enlaces : <a href=”url ”>enlace<a> </li></ul><ul><li>Imagen : <img src=“url”> </li></ul><ul><li>Dirección :<address>texto<address> </li></ul>
    19. 19. La Primera Página Web
    20. 20. PREGUNTAS?

    ×