DHTML
Contenido
¿Qué es DHTML?
DHTML (del inglés Dynamic HyperText Markup Language) es una combinación de los lenguajes de programación usados para desarrollar páginas web interactivas, a saber: HTML5, CSS, JavaScript y DOM. Aunque existen otras tecnologías que pueden sustituir a algunos de ellos.
El término DHTML se introdujo por primera vez en 1997 y generalmente se considera obsoleto en la actualidad. En su lugar, se emplean las expresiones "DOM-scripting" y "Javascript discreto".
Usos de DHTML
El DHTML se utiliza generalmente para crear efectos en las páginas, como pequeñas animaciones y botones o menús interactivos. Por ejemplo, se puede emplear para animar un menú desplegable o mover imágenes y texto en un website. Incluso, en el pasado se desarrollaron juegos aprovechando este conjunto de programas.
¿Qué elementos incluye el DHTML?
El DHTML habitualmente consta de cuatro elementos, a saber: HTML, CSS, Javascript y DOM. A continuación, se muestra un resumen de las funciones que cumple cada uno de ellos.
HTML
El término HTML deriva de las siglas de HyperText Markup Language o lenguaje de marcado de hipertexto en español. Generalmente es empleado para crear la estructura y el diseño de las páginas web. Se inventó en 1991 y la versión más actualizada HTML5.2 ha estado disponible desde el 2017.
El HTML trabaja con varios elementos, cada uno de los cuales se usa para un tipo de contenido diferente. Por ejemplo, la etiqueta <h> indica que la primera línea de una página es el encabezado, mientras que la etiqueta <p> señala que los bloques de texto forman un párrafo.
CSS
El CSS es un lenguaje que le indica al navegador cómo se debe mostrar el HTML en una página determinada, mejorando así la flexibilidad del diseño de los sitios web. El término proviene de la frase en inglés Cascading Style Sheets, que significa hojas de estilo en cascada.
Este lenguaje permite que los cambios se muestren en todo el sitio web. Por ejemplo, se puede usar un archivo externo para especificar la fuente, el color de fondo y muchos otros parámetros del sitio. Antes de su implementación, estos cambios debían realizarse página por página.
Javascript
Javascript es un lenguaje de secuencias de comandos que hace posible que las y los usuarios interactúen con una página web. Se emplea para actualizar automáticamente las fuentes de noticias y conseguir que elementos como formularios de contacto y botones funcionen en una web.
Es un lenguaje extremadamente dinámico, sin embargo, puede causar problemas a las arañas web si no está correctamente optimizado, pudiendo perjudicar el rendimiento del sitio en los buscadores.
DOM
DOM son las siglas de modelo de objeto de documento traducido en inglés, Document Object Model y describe las propiedades de todos los elementos HTML y cómo se puede acceder a ellos. Se emplea para dinamizar el HTML al permitir su cambio mediante el uso de Javascript. Igualmente, permite modificar el CSS en una página, entre otras posibles aplicaciones.
Ejemplo
En el siguiente ejemplo, JavaScript se usa para escribir el texto "Texto de ejemplo" en el cuerpo de una página HTML:[1]
<html>
<head>
<title>DHTML con JavaScript</title>
</head>
<body>
<script type="text/javascript">
document.write("Texto de ejemplo");
</script>
</body>
</html>
En este otro ejemplo de código JavaScript se emplea CSS para cambiar el estilo del encabezado h1:
<html> <head> <title>DHTML con CSS</title> </head> <body> <center> <h1 onclick="this.style.color='blue'">Este es un encabezado h1</h1> <center> </body> </html>
Diferencia entre HTML y DHTML
La principal diferencia entre el HTML y el DHTML es que el primero es un lenguaje, mientras que el segundo se trata de un término empleado para referirse a un grupo de lenguajes de programación.
Usando HTML, una desarrolladora o un desarrollador puede crear una página estática que constituye la estructura de un sitio web, sin embargo requiere del uso de otras tecnologías para hacer que dicha página sea dinámica y funcional.
DHTML se aprovecha para generar páginas web dinámicas, ya que abarca todas las tecnologías necesarias para hacerlo. Esto permite una mayor flexibilidad al crear páginas web.
Importancia del DHTML para el SEO
Al comprender los diferentes elementos, las mejores prácticas y asegurarse de que las funciones que se utilizan sean compatibles con los navegadores más importantes, el rendimiento de un sitio puede mejorarse con DHTML.
Además, el uso incorrecto de cualquiera de los elementos utilizados en los sitios DHTML también puede causar problemas con la experiencia de usabilidad. Por ejemplo, un sitio puede volverse lento o ciertos recursos pueden mostrarse de forma incorrecta.
Dado que el DHTML aprovecha al Javascript, hay que velar porque este último sea implementado de manera correcta. En caso contrario, podría afectar el funcionamiento de las arañas web, lo que atenta contra el rendimiento del website en las SERPs.
Referencias
- ↑ Tutorial DHTML JavaTpoint. Consultado el 16.07.21.
Ampliar conocimientos
- https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model/Introduction
- http://www.hipertexto.info/documentos/dhtml.htm
| Sobre las autoras y autores: |
 |