Buscar Más buscado
Capitulos de este wiki
  1. 1 Introducción al lenguaje HTML
  2. 2 Primeros pasos con HTML
  3. 3 Parrafos en HTML
  4. 4 Cómo insertar imagenes en una pagina
  5. 5 Cómo crear enlaces hipertexto
  6. 6 PRÁCTICA 1: La pagina web de "La chistera"
  7. 7 Anclas (I)
  8. 8 Anclas (II)
  9. 9 Formato de texto
  10. 10 La etiqueta FONT
  11. 11 Texto preformateado
  12. 12 Acentos y otros caracteres especiales
  13. 13 Listas en HTML (I)
  14. 14 Listas en HTML (II)
  15. 15 Comentarios en HTML
  16. 16 Practica 2: Un sitio web completo
  17. 17 Usando color en el WWW
  18. 18 Cómo cambiar la apariencia de una pagina
  19. 19 Imagenes en las paginas Web (I)
  20. 20 Imagenes en las paginas Web (II)
  21. 21 Imagenes en las paginas Web (III)
  22. 22 Cómo cambiar la apariencia de las imagenes
  23. 23 Alternativas a las imagenes inline (I)
  24. 24 Alternativas a las imagenes inline (II)
  25. 25 Mejoras en las imagenes
  26. 26 Cómo se crea una tabla HTML (I)
  27. 27 Cómo se crea una tabla HTML (II)
  28. 28 Alineamiento de tablas
  29. 29 Alineamiento de celdas y filas
  30. 30 Ancho de tablas y celdas
  31. 31 Celdas que abarcan varias filas o columnas
  32. 32 Margenes y separación de celdas
  33. 33 Anidamiento
  34. 34 Practica 3 - Tabla de Datos
  35. 35 Practica 4 - Pagina Web con una estructura creada con tablas
  36. 36 Practica 4 - Pagina Web con una estructura creada con tablas
  37. 37 Practica 4 - Pagina Web con una estructura creada con tablas
  38. 38 Estandares y extensiones del lenguaje HTML (I)
  39. 39 Estandares y extensiones del lenguaje HTML (II)
  40. 40 Extensiones a las listas (I)
  41. 41 Extensiones a las listas (II)
  42. 42 Alineamiento
  43. 43 La etiqueta META
  44. 44 Otras etiquetas del lenguaje HTML 3.2
  45. 45 El atributo TARGET
  46. 46 La etiqueta BASE
  47. 47 Creación de paginas con frames
  48. 48 Creación del documento de definición de frames (I)
  49. 49 Creación del documento de definición de frames (II)
  50. 50 Pagina completa con frames
  51. 51 Atributos de la etiqueta FRAME
  52. 52 Compatibilidad: NOFRAME
  53. 53 Anidamiento de framesets
  54. 54 Bordes de los frames
  55. 55 Valores especiales del atributo TARGET
  56. 56 Practica 5: Web de Los Alpes con frames
  57. 57 Frames flotantes
  58. 58 Sonido vídeo y otros ficheros externos
  59. 59 Multimedia Inline (I)
  60. 60 Multimedia Inline (I)
  61. 61 Plug-ins y objetos incrustados
  62. 62 Java en las Paginas Web
  63. 63 Inserción de Applets Java (I)
  64. 64 Inserción de Applets Java (II)
  65. 65 Inserción de Applets Java (III)
  66. 66 ActiveX, la tecnología del futuro
  67. 67 Formularios en HTML
  68. 68 Controles de Formularios (I)
  69. 69 Controles de Formularios (II)
  70. 70 Controles de Formularios (III)
  71. 71 Controles de Formularios (IV)
  72. 72 Otros controles
  73. 73 Practica 6-Formulario para "Los Alpes"
  74. 74 Como usar los datos de un formulario
  75. 75 Envío De Ficheros Usando Formularios

Curso completo de HTML - PRÁCTICA 1: La pagina web de "La chistera"

6 - PRÁCTICA 1: La pagina web de "La chistera"

[editar]
Curso gratis creado por Jorge Ferrer, Víctor García y Rodrigo García. Extraido de: http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html/
23 de Febrero de 2006
< anterior | 1 ... 4 5 6 7 8 9 10 ... 75 | siguiente >

La propuesta

En esta primera práctica de la obra se propone crear un sitio Web REAL poniendo en práctica los conocimientos adquiridos hasta ahora. En él incluiremos imágenes, varios titulares párrafos de texto de distinto tipo y enlaces hipertexto a otras páginas.

En la figura 6.1 se muestra una captura de un navegador visitando la página tal y como debe quedar al final. Se propone al lector intentar imitar la apariencia de esta página usando únicamente las etiquetas HTML explicadas hasta ahora.

Figura 6.1. La práctica 1 propone realizar un página a partir de lo mostrado en esta figura.

Para empezar a realizar la página debe abrirse un editor de textos o de HTML (es indiferente). Algunos ejemplos de programas que pueden servir son notepad, emacs, vi, HomeSite, etc. Una vez abierto se puede empezar a escribir la página tal y como se ha explicado, comenzando por la cabecera y siguiendo con el resto de la página. A continuación se muestran las primeras líneas que podría contener el archivo a modo de elemplo: 

 <html>
  <head>
  <title>
  La chistera - Humor y magia
  </title>
  </head>
  <body>

Tras escribir el código debe guardarse con terminación ".html" y ya está lista para ser visualizada con cualquier navegador. Tras abrir éste hay que seleccionar la opción Archivo/Abrir...Examinar... (o similar) y elegir el archivo en el que habíamos guardado la página. En ese momento debe mostrarse en pantalla la página creada. Lo habitual es tener que realizar cambios en el código HTML, volver al navegador, volver a hacer cambios y así hasta que se obtiene el resultado deseado. ¡suerte!

La solución

En esta primera práctica se va a mostrar a continuación el código completo de la página resultado. Por supuesto, conviene intentarlo antes de mirarlo. También hay que tener en cuenta que no hay un único resultado y es posible que un código ligeramente diferente de lugar a una página prácticamente idéntica al verla con el navegador. 

 <html>
 
  <head>
  <title>
  La chistera - Humor y magia
  </title>
  </head>
 
  <body>
  <center>
  <h1>
	     <img src="imagenes/chistera.gif">
	     LA CHISTERA - Humor y magia
  </h1>
  </center>
  <h2>
  Quienes somos
  </h2>
  <p>La chistera es un grupo de artistas 
  dedicados al mundo de la magia, la comedia y el espectáculo. 
  Entre nosotros podrás encontrar humoristas, magos, showmen,
  etc.</p> 
  <p>Si usted o su empresa necesita crear 
  un espectáculo y no quiere quedar decepcionado no dude en 
  escribirnos AHORA MISMO. Nuestra dirección es:</p>
  <center>
  chistera@chistera.es
  </center>
  <h2>
  Un ejemplo de nuestro repertorio
  </h2>
  <p>Cada día le mostramos ejemplos 
  distintos de nuestro amplísimo y novedoso repertorio de chistes:
  <blockquote>
  Era un tío tan gafe, tan gafe, que se sentó en un pajar y se 
  clavó la aguja.
  </blockquote>
  <blockquote>
  Doctor, Doctor, ¿cuanto tiempo me queda de vida? 
  <br>
  5... 4... 3... 2... 
  </blockquote>
  </p>
  <h2>
  Enlaces a páginas relacionadas
  </h2>
  <p>
  <a href="http://www.ciudadfutura.com/areirse
	">¡A Reírse Toca, ¡Ja, ja, ja!
  </a>: Si te aburres, estás deprimido, 
  o simplemente quieres reír, pásate por mi página y disfrutarás 
  de los más de 110 chistes que tiene. ¡Con posibilidad de enviar 
  tú el tuyo! 
  <p>
  <a
	href="http://www.geocities.com/BourbonStreet/Delta/3543/"
	>1er Concurso de feos por 
  Internet</a>: 1er Concurso de Feos por 
  Internet participa y gana tu premio. </p>
  <p>
  <a
	href="http://www.geocities.com/Hollywood/8620">Albert
  Grau's Web</a> 
  : En esta pagina encontrarás un listado de dichos 
  populares, y las 50 cosas que se deberían cambiar para mejorar 
  la vida terrícola de nuestro querido planeta Tierra
  </p>
  <hr size="5">
  <address>
  Página creada por el equipo de programación Web de LA CHISTERA
  <br> Ultima actualización: 32-12-1997 ;-)
  </address>
  </body>
  </html>

Una vez hemos comprobado que con nuestro navegador habitual la página es mostrada correctamente conviene probarla con otros incluyendo alguno en modo texto (Lynx) y diferentes tamaños de pantalla. A veces las diferencias serán sorprendentes.

[editar]
< anterior | 1 ... 4 5 6 7 8 9 10 ... 75 | siguiente >

Opinar
180 opiniones

Ayuda

Alguien me puede ayudar a crear una seccion de comentarios de mi pagina wed
hola kamaradas

me llamo pepito y me gusta el cereal
lkk

nnnnnn
sad

asdasd
e23

df23r
1 2 3 4 5 6 7 ... 36 | siguiente >

Cursos gratis relacionados con 'Curso completo de HTML'

Curso completo de HTML
Este es un curso tremendamente completo, guiado y con ejemplos y prácticas pensadas para convertirlo... Más »
Curso de Ada
El objetivo de este curso es aprender a programar en el lenguaje Ada, desde sus... Más »
Curso de hacking
Práctico y completo curso de hacking.
Curso de Linux
Completo curso de Linux, un sistema operativo gratuito y de libre distribución inspirado en el... Más »
El fascinante mundo de los virus informáticos
Completo curso acerca de los virus informáticos, historia, clasificación, protección...

Anuncios Google

Autor y licencia de 'Curso completo de HTML'


Curso gratis de Jorge Ferrer, Víctor García y Rodrigo García. Extraido de: http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html/ CopyLeft
Licencia GNU Free Documentation License: http://www.gnu.org/copyleft/fdl.html
Este contenido ha sido recopilado por el equipo de Wikilearning. Todo el contenido recopilado se ha obtenido respetando y comunicando en nuestro site la licencia de cada fuente.
Wikilearning tiene permiso expreso por escrito de los autores para publicar los contenidos que ha extraído de otras webs, incluyendo su uso comercial.