16 sept 2010

Aprendiendo HTML: Primeros Pasos

Antes de empezar esta entrada, me gustaría hacer una advertencia, esto no es una guía para aprender HTML, es simplemente una recopilación de las cosas que poco a poco voy aprendiendo a hacer, así que nadie se espere aprender nada con esto que pongo aquí. Metámonos en materia.



En la última entrada os puse una pequeña introducción de lo que es el HTML, si lo leíste seguramente os suene a chino, no os preocupéis, a mi también , hoy voy a entrar directamente en materia explicándoos como poner una imagen en vuestra web, y como poner un enlace en ella, exactamente igual que tengo yo con las banderas de los idiomas.

Lo primero que tenemos que decidir es que nombre le vamos a poner al elemento que vamos a añadir, este nombre no se va a ver, así que le podemos poner cualquier cosa, por ejemplo "a".

<a> </a>

Ya tenemos lo que en la entrada anterior llamamos etiqueta, ahora debemos introducir información sobre la etiqueta. Lo primero que vamos a hacer es añadirle información a la etiqueta "a". Mediante la orden reservada "href=", incluimos la URL que queremos que se abra cuando pinchemos.

<a href="URL"> </a>

Actualmente el código que tenemos está incompleto, no haría nada, tenemos un enlace, pero nos falta un lugar donde "pinchar" con el ratón para ir a ese enlace, eso se pone entre "><". Ente este caso lo haremos con la órden reservada "img src=" que indica que vamos a intruducir una imagen(img) y la url de origen de esta(src=)

<a href="URL"><img src="IMAGEN" /> </a>

Por último, yo personalmente he añadido, una nueva orden reservada "target=", con el parámetro "_blank" para que el enlace se habrá en una pestaña nueva. Con esto ya habremos terminado:

<a target="_blank" href="URL"><img src="IMAGEN" /> </a>

Otras opciones para taget son:
 _self = misma pestaña, no es necesario pornerla, es la opción por defecto.
_parent=ventana padre.
_top=ventana padre de todas las extensiones.

4 comentarios:

  1. Todo clarísimo... pero creo que te falta explicar algo básico. Tal vez sea obvio para quien sepa algo de informática, pero no para dummies como yo (a mi me lo enseñó un compi de instituto): las páginas html se crean escribiendo todos esos chorizos de caracteres en un archivo .txt; después, no tienes más que cambiar la extensión a .html y ¡voilá!

    Yo ya he probado tu ejemplo y he hecho una chorrada que no puedo pegar aquí porque tu blog no me deja XD

    Tampoco entiendo lo de la ventana padre y padre de todas las extensiones.¿Qué cojones son esas ventanas?

    Espero que sigas con estos minitutoriales.

    ResponderEliminar
  2. Efectivamente lo que dices es cierto, se puede y se suele hacer todo directamente en un fichero .txt y luego cambiarlo a uno .html, pero yo lo he puesto todo partiendo del propio editor de blogger, que en verdad no es más que un txt en blanco.

    Sobre lo de los target, lo cierto es que no lo tengo yo tampoco muy claro, pero volveré sobre eso cuando explique los marcos, así que paciencia,

    ResponderEliminar
  3. javier lopez27/10/10, 19:33

    Gracias por despertar en mi este gusanillo me esta gustando y todo

    Se pueden hacer muchas cosas con Html, por cierto el bloger es un cabron y no permite usar ni Dfn, ni acronym ni muchos parametros

    ResponderEliminar
  4. Gracias! A ver si lo retomo yo, que lo tengo abandonado xDD

    ResponderEliminar