Los genes son el lenguaje de la naturaleza, las instrucciones que dicen cómo se fabrica un ser humano. Las webs están escritas en HTML, un lenguaje de marcado. En HTML se puede definir el tipo de letra de la página web, el color de fondo, la inserción de imágenes y muchas más características. Si no estás muy familiarizado con el lenguaje web, te presento algunos códigos HTML para páginas web que te serán de mucha utilidad.
¿Qué es un código HTML?
HTML es un acrónimo que hace referencia a HyperText Markup Language, es decir, lenguaje marcado de hipertexto.
El HTML es un lenguaje de marcado, concretamente, un lenguaje de programación capaz de generar páginas web estáticas. Si el lenguaje HTML se puede combinar con otros lenguajes equivalentes para crear webs dinámicas.
El estándar HTML lo marca la W3C, es decir, el World Wide Web Consortium.
¿Para qué se usan los códigos HTML?
El uso principal del lenguaje HTML es estructurar de forma estática una página web completa. Gracias a este tipo de lenguaje, podemos ver de forma esquemática todo el contenido de una web y variar cada uno de los aspectos que la componen.
A la hora de preparar una web de cara al SEO es fundamental manejar este lenguaje de programación, gracias a las etiquetas y los códigos podemos adaptar por completo una página a las exigencias seo de los buscadores.
Códigos HTML para web
Los códigos HTML se generan a base de etiquetas, estas etiquetas son fragmentos de texto ubicadas entre corchetes, para determinar el comienzo y la finalización del código.
Gracias a estos códigos podemos generar, a base únicamente de texto, todos los elementos gráficos de una web.
Existen ciertos códigos muy concretos, cuyo uso permite optimizar una web, ya sea de cara al SEO o buscando otros fines. Algunos de estos códigos específicos los repasamos a continuación.
Formateo de texto
Para poner un texto en negrita:
<b>texto en negrita</b>
Para poner un texto en cursiva:
<i>texto en cursiva</i>
Para subrayar un texto:
<span style=»text-decoration: underline;»>texto</span>
Para poner un texto como cita:
<blockquote>cita</blockquote>
Para alinear párrafos:
A la izquierda
<p style=»text-align: left;»>parrafo</p>
Centrado
<p style=»text-align: center;»>parrafo</p>
A la derecha
<p style=»text-align: right;»>parrafo</p>
Justificado
<p style=»text-align: justify;»>parrafo</p>
Enlaces
Si quieres poner un enlace dentro de tu web, la línea de código es la siguiente:
<a href=»web enlazada»>Texto del enlace</a>
Ejemplo:
<a href=»https://www.yoseomarketing.com/»>Agencia de Marketing Online</a>
Y se vería así:
Imágenes
Las imágenes se insertan en una web usando este código html:
<img src=»dirección de la imagen» alt=»nombre de la imagen» width=»Xpx» height=»Ypx»>
Src es la dirección en la que está alojada la imagen, alt es el nombre de la imagen (se visualizará si la imagen no carga en el navegador del internauta), width es la anchura de la imagen y height es la altura.
Un ejemplo
<img src=»https://www.google.es/images/srpr/logo11w.png» alt=»Logo de Google» width=»400px» height=»100px»>
Comentarios
Si te lanzas a escribir tu propio código HTML, agradecerás poder hacer anotaciones comentándolo. Para ello utiliza la etiqueta de comentario
<!–
–>
<!– Este es un comentario en HTML –>
Pop up
<script type=»text/javascript»>
// Popup window code
function newPopup(url) {
popupWindow = window.open(
url,’popUpWindow’,’height=400,width=500,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes’)
}
</script>
<h2><a href=»JavaScript:newPopup(‘http://www.quackit.com/javascript/examples/sample_popup.cfm’);»>Nueva Ventana</a></h2>
Antiplagios
Qué rabia cuando te esfuerzas en crear un contenido para tu web y luego descubres que alguien te lo ha copiado vilmente. Ahora puedes ponerle las cosas más difíciles a los copiotas con este código html que impide que alguien pueda seleccionar texto de tu web:
<script>function disabletext(e){return false}function reEnable(){return true}document.onselectstart=new Function («return false»)if (window.sidebar){document.onmousedown=disabletextdocument.onclick=reEnable}</script>
Códigos de colores HTML
Para determinar los colores que forman una página web también utilizamos códigos HTML. Incluir esta serie de códigos en estructuras de programación permite determinar, de manera concreta, qué colores van a componer la web.
En el caso de los códigos de color, están compuestos por una almohadilla #, seguido de una serie de seis números y letras combinados, de esta manera, cada tono dispone de un código específico.
Paleta de colores en HTML
Algunos ejemplos de colores en la paleta de colores HTML son los siguientes:
#FF0000 Color rojo puro
#00FF00 Color verde intenso
#0000FF Color azul oscuro
#FFFF00 Color amarillo intenso
#CCEEFF Color azul claro
Como ves, esta combinación de colores y letras tras el signo # genera una etiqueta de color que la web reconoce, y la plasma como un color efectivo en la web, que queda visible para el usuario.
Los mejores códigos HTML para tu web
Otros códigos HTML que podrás utilizar en tu página web son los siguientes:
<b> negrita negrita
<i> cursiva cursiva
<u> subrayado subrayado
<s> tachado tachado
<tt> máquina de escribir máquina de escribir
<p> párrafo
<hr> quiebre temático
<li> lista numerada
<div> contenedor genérico
<a> hiperenlace
<br> salto de línea
<img> imagen
<audio> sonido
