¿Cómo integramos los lenguajes HTML, CSS, y JavaScript?

En el curso (online y/0 presencial) de Creación de aplicaciones API de JavaScript y ArcGIS Server que impartimos, se enseña cómo desarrollar potentes e innovadores visores cartográficos. Uno de los puntos a tener en cuenta de esta API de ESRI es que ha desbancado a otras con un lenguaje de programación tipo Flex o Silverlight y es la que se encuentra en la actualidad en una constante evolución. Por eso, para personas que se estén planteando empezar y aprender de este tipo de tecnologías para dar un salto en el desarrollo con la programación, la recomendación es JavaScript.

Además integra otro tipo de tecnologías como HTML5 and CSS3 que permiten que el diseño de nuestra aplicación “web mapping” sea mucho más innovadora y nos ofrecen muchas más herramientas y posibilidades para mejorar la visualización de nuestros datos.

Pero estamos empezando en esto, si ya la palabra JavaScript nos asusta, ¿qué significa HTML y CSS? ¿qué funciones tiene cada uno dentro de la API? ¿cómo los utilizo?. Bien, pues antes que nada, vamos a distinguir sus características:

A principio de los años noventa, el lenguaje HTML era el único idioma disponible en la web. Ha cambiado mucho desde entonces. A continuación vamos a distinguir los tres tipos de lenguaje que describimos en este post:

1. El lenguaje HTML (HyperText Markup Language) nos aporta la estructura básica de los sitios, mejorada y modificada por otras tecnologías como CSS y JavaScript que vemos a continuación. Es el lenguaje famoso por sus etiquetas conocido por todos los que se han inmerso en el desarrollo de páginas web.

2. Por otro lado, CSS u Hojas de Estilo en Cascada (Cascading Style Sheets) se utiliza para controlar la presentación, el formato, y el diseño de nuestra aplicación. Gracias a ella podemos dar forma al estilo que queremos que se muestre.

3. JavaScript se utiliza para controlar el comportamiento de los diferentes elementos, esto es, aporta funcionalidad, dinámica, a nuestros elementos.

Muy bien, ya tenemos claro los diferentes conceptos, pero cómo integro yo los tres tipos de lenguajes en mi nuevo visor. El HTML ya vemos que es el lenguaje de etiquetas, ¿pero cómo podemos integrar los estilos CSS en nuestra aplicación?