Your SlideShare is downloading. ×
Práctica Informática - Archivo PDF
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Práctica Informática - Archivo PDF

1,735
views

Published on

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,735
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
15
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. 1. Introducción. El HTML (HyperText Markup Language) no es más que una aplicacióndel SGML (Standard Generalized Markup Language), un sistema para definirtipos de documentos estructurados y lenguajes de marcas para representaresos mismos documentos. El término HTML se suele referir a ambas cosas,tanto al tipo de documento como al lenguaje de marcas.2. ¿Qué se necesita para crear una página de Internet? Existen diferentes métodos para poder elaborar una página deInternet. Para tal fin puedes utilizar programas especializados en lamateria, uno de ellos es Java, o el más tradicional: el bloc de notas. a) La elaboración. Para poder crear una página de Internet seIdentificaras como primer necesita el icono del blocrequisito abrir el bloc de notas: denotas porque es una pequeña libreta (la ubicación depende de la máquina) Después de dar clic en el icono del bloc te saldrá un cuadro de diálogocomo este:
  • 2. Este cuadro te indica que ya puedes empezar a trabajar en el bloc.3. Las etiquetas principales. La creación de cualquier página de Internet tiene que contenernecesariamente las siguientes etiquetas: <HTML> Indica el inicio del documento.<HEAD> Inicio de la cabecera. <TITLE> NOMBRE DEL DOCUMENTO </TITLE></HEAD> Final de la cabecera del documento <BODY> Inicio del cuerpo del documento. </BODY> Final del cuerpo del documento. </HTML> Final del documento. Así en el bloc de notas tendrás que tener la estructura antesexplicada y te quedará de la siguiente manera:
  • 3. Sin embargo para que tu página se guarde como aplicación HTML debes de hacer lo siguiente: 1. Da clic en: Archivo/Guardar como... 2. Elije el archivo en el3. Dale un nombre a tu que vas a guardar tudocumento pero ponle documento.la terminación “.html”.Ejemplo: tallerI.html 4. Da clic en Guardar Si revisas el archivo en que guardaste tu página te tendrá que salir de la siguiente forma tu documento:
  • 4. Esto te indica que tu documento tiene formato HTML Hasta aquí, ya sabes cuáles son los elementos esenciales que debe decontener una página de Internet y cómo es que debes de guardarla con elformato HTML. En las siguientes secciones encontrarás cuáles son lasfunciones que realizan cada una de las etiquetas básicas así como tambiénencontrarás algunas aplicaciones que puedes ir agregando al contenido de tudocumento.
  • 5. 4. Cabecera. La etiqueta <HEAD> </HEAD> delimita la cabecera del documento,esto se realiza a través de la etiqueta de titulo (<TITLE></TITLE>) El título que le des a tu página es el que aparecerá en la barra detítulo cada vez que la abras. Ejemplo: <TITLE> Mi primera página </TITLE>5. Cuerpo del documento. La etiqueta <BODY> </BODY> delimita el cuerpo del documento, estaparte contendrá todo aquello que se quiera mostrar en la página: texto,gráficos, enlaces, tablas, etc. Todo lo que quieras agregar a tu documento loharás a través del bloc de notas, para poder observar lo que contiene tupágina cada vez que haces una modificación debes de guardarlo.(Archivo/Guardar) a) Título de la página. Para darle un título a tu documento se utiliza la siguiente etiqueta: <Hx> <Hx> en donde x= 1, 2, 3, 4, 5 y 6. Así H1 indica el tamaño deletra más grande y H6 el más pequeño.
  • 6. Ejemplo: Guardas (Archivo/ Guardar), después abres tu documento yaparecerá de la siguiente manera:
  • 7. Si quieres que tu texto este centrado debes de utilizar el siguienteatributo: align= center que te alineará el texto en el centro. align=rightalineará el texto a la derecha y align=left que lo alineará a la izquierda. Porfacto cada vez que escribas algo aparecerá alineado a la izquierda. Esteatributo lo utilizarás de la siguiente forma: Lo aplicarás dentro de la etiqueta del título de la siguiente manera: <h1 align=center> Después guarda el cambio, Y abre tu documento para comprobar que el título principal de tu página está centrado.
  • 8. b) El texto. Para comenzar a escribir necesitas indicarlo a través de la etiqueta:<P></P> entre párrafo y párrafo debes de abrir esta etiqueta, si no lo hacesen tu documento el texto aparecerá en un sólo párrafo. Al actualizar tu contenido (porque recuerda que después de cadacambio debes de guardarlo) tu archivo te quedará de la siguiente manera:
  • 9. Sin embargo como se ve muy opaco este archivo, se le pueden aplicaralgunas modificaciones, estas modificaciones tienen que ver con el color,tamaño y tipo de letra del contenido, esto lo realizarás de la siguientemanera: En donde tienes la etiqueta del párrafo aplicarás otra:<p align="center"><font size="5" face="arial" color="white"> -----</font></p> En esta parte es en donde indicaras el tamaño, color y tipo de letra que quieres. Aplicando características personales a tu documento se verásemejante a esto: Algunas de las características que puedes agregar al texto lo puedeshacer con las siguientes etiquetas:Negrita <b> </b>Cursiva <i> </i>Subrayado <u> </u> Si lo que quieres es cambiar el color de las letras puedes utilizar lossiguientes caracteres:
  • 10. Negro “#000000”Rojo “#FF0000”Verde “#00FF00”Azul “#0000FF”Blanco “#FFFFFF”6. Creación de enlaces. Un enlace es un elemento de la página que hace que el navegadoracceda a otra página, un archivo tec. Para incluir un en lace se necesita la etiqueta: <a></a>. El texto oimagen que se encuentre dentro de esta etiqueta será “sensible”; si pulsasel ratón sobre de ella se realzará. Si el enlace es un texto aparecerásubrayado en distinto color. Esta etiqueta tiene el parámetro “href” que indica el lugar a dondenos llevará el enlace si se pulsa.7. Utilización de imágenes. Para poder incluir una imagen en tu página debes de tomar en cuentaque existen dos tipos de formatos: “.gif” y “jpg”. Debes de revisar qué tipo
  • 11. de archivo es tu imagen. Además de que debes de tener guardada tu imagenen la misma carpeta en la que guardaste tu página. La primer etiqueta que debes de tener presente es: <img> para estaetiqueta no es necesario tener una etiqueta de fin como en las anteriores. Lo que si hay que considerar es que necesitas un parámetro muyimportante: src=”nombre del archivo” este será el que introducirá la imagen:
  • 12. Te quedará de la siguiente manera: Si quisieras realizar algunas otras modificaciones en puedes utilizarlas siguientes etiquetas:border Indica el tamaño del borde de la imagenhspace Indica el # de espacios horizontales que separan la imagen del texto que la siga y antecedavspace Indica el # de espacios verticales que separan la imagen del texto que la siga y antecedaheight Indica el alto de la imagen. (Varia el tamaño de la imagen)width Indica el ancho de la imagen.
  • 13. a) Marqee. La etiqueta <marquee></marquee> crea una marquesina con un textoen su interior que se desplaza. Ejemplo: <marquee bgcolor="#00F0FF" width=100% scrolldelay=0> Bienvenido a mi página personal en Internet. </marquee> Algunos de los parámetros que puedes aplicar aquí son:align= top/middle/ bottom Indica si el texto del interior de la marquesina se alinea en la zona alta, media o baja.direction=left/right Indica el lugar al que se desplaza el texto.bgcolor Indica el color del fondo de la marquesina.height Indica la altura de la marquesinawidth Indica la anchura de la marquesinascrolldelay Indica el # de milisegundos que tarda en reescribirse el texto, a número mayor el desplazamiento es más lento.
  • 14. 8. Creación de tablas. Para crear una tabla necesitas la etiqueta: <table></table> Las etiquetas más importantes que debes de tomar en cuenta son:<tr></tr> que indican una linea de celdas, <td></td> que indican una celdanormal y <th></th> que indican una celda “cabecera”, quiere decir que sucontenido será resaltado en negrita y en un tamaño superior al normal. Y los parámetros que se utilizan dentro de la etiqueta de <table> son:border Indica el ancho del borde de la tabla.cellspacing Indica el espacio que separa las celdas dentro de la tabla.cellpadding Indica el espacio que separa el borde de c/d celda y el contenido de ella.width Indica la anchura de la tabla.height Indica la altura de la tablabgcolor Especifica el color de fondo de la tabla. Los parámetros que se utilizan dentro de la etiqueta de <td> y <th>son:align=left/center/right/justify Alinea el contenido.valign= top/middle/ bottom Indica la alineación vertical del contenido de la celda.rowspan Indica el número de filas que ocupará la celda.colspan Indica el número de columnas que ocupará la celda.width Indica la anchura de la columna.
  • 15. Primero debes crear las celdas “cabecera”. Después crea las celdas “normales”.Te quedará de la siguiente manera: