HTML Básico #1

Hola, como les va. Mi nombre es Federico y voy a ser el que los ayude en los tutoriales de diseño y codigos. Hoy comenzaremos con un tutorial de lo más escencial dentro del HTML. Les recuerdo que todo lo que sé, lo sé por investigar en internet o cosas por el estilo, así que no crean que he realizado una carrera o algo similar porque estoy muuuy lejos de eso. Sin más vamos a comenzar


¿Qué es el HTML y para que sirve?
No quiero poner nada científico acá ni copiar la definición de wikipedia, así que lo voy a resumir. El HTML es un código creado entre otras cosas para programar páginas web. Tu explorador (Internet explorer, Mozilla Firefox, Google Chrome, Opera, Safari, etc.) recibe este código y lo traduce en la linda página que estás viendo, si no verías algo bastante raro XD. En burdas palabras, eso es el HTML.
A nosotros nos va a servir para darle formato a nuestras entradas, al blog, y otras cosas. El HTML combinado con el CSS (otro día les hablaré de eso) es básicamente lo que utiliza blogger para armar el diseño de un blog. Luego si uno se pone más quisquilloso puede agregarle Javascript o similares, pero de eso no tengo noción así que no pidan nada.

Yo no se HTML y sin embargo puedo armar un post igual.
Es verdad. Blogger nos da esa opción, y muchos HUYEN de la pestaña de HTML, pero luego de mis tutoriales espero que alguno que otro comience a utilizarla, porque sinceramente al comienzo asusta pero luego es más fácil.

¿Qué necesito?
Paciencia. El HTML no es fácil al comienzo, hasta agarrarle la mano, luego resulta más fácil.
Orden. Un HTML ordenado es mucho más fácil de leer e interpretar para un humano (a las computadoras les da un poco igual) que uno desordenado. Blogger es un poco desordenado, pero igual lo van a poder "separar".

Comencemos.

Lo primero que debes saber es que todas las etiquetas de HTML comienzan con el signos menor que, y terminan con el signo mayor que.
<soyunaetiquetainventada>
Al terminar, se vuelve a repetir la etiqueta, PERO, agregando una barra /
</soyunaetiquetainventada>

¿Qué etiquetas son las básicas?
Acá les voy a nombrar las más básicas y las que generalmente veremos en blogger:

p
La etiqueta p le señala a blogger un texto. No siempre se utiliza (más adelante lo ampliaré más, ahora solo quiero mostrarles lo básico). Si terminamos una etiqueta p e iniciamos otra, crearemos dos párrafos separados.

b
La famosa negrita. Desde que comienza esta etiqueta, todo el texto que le siga hasta que termine, estará en negrita. La b, viene por su nombre en ingles "bold"

u
Underlined en inglés. Subrayado en español (o por lo menos en el mio (?). Básicamente crea un texto así

i
Italics, o itálicas. Muestra al texto de una manera "acostada". Otra formas de llamarlo: bastardilla.

a
Utilizada para los links, hipervínculos o como quieran llamarlos. Generalmente viene precedida por la palabra href="http://soyunlinkinteresante.com">
Sirve para crear hipervínculos. Puede ser combinada con muuuuchas cosas (en otro post lo explicaré)

img
Acá son las imágenes, viene precedida por la palabra src="http://soyunlinkaunaimagen.jpg"/>
Sirve para publicar fotos, y al igual que los hipervínculos se la puede combinar con muchas cosas. Funcionan un poco diferente que las demás etiquetas ya que no tienen una de cierre, en el ejemplo se ve mejor

div
Divisores. Generalmente blogger los agrega en todas partes, hasta cuando no son necesarios. Es una manera de dividir al código en secciones más grandes, de agrupar elementos. En el diseño de un template blogger se podría hacer un div para el banner, otro para los posts y uno para el sidebar, y dentro de estos divisores habría más cosas.
En blogger no les encuentro mucho sentido, aunque a veces sirve para darle a tus posts un aspecto bastante profesional con bordes o cosas similares.

br
BR no se usa igual que otras etiquetas, se asimila un poco a la forma de usarse la etiqueta img, en caso de no usar la etiqueta p, sirve para separar textos. Al poner la etiqueta br, el texto que le sigue va a estar en la siguiente linea

1 comentario:

  1. El "div" es como un spam en mis entradas, jajaja. ¡Muy bien explicado Fede!
    ~Esperando por más lecciones~

    ResponderEliminar