Contenido
Como ya se ha indicado, las páginas web que se visualizan en los navegadores están escritas en un código informático llamado HTML. Este código está compuesto por una serie de etiquetas con diferente funcionalidad. Nuestras escenas se podrán incluir dentro del código HTML de la web y se podrán visualizar en el navegador.
Si examinamos el código de una escena de Descartes interpretada en local e insertada en una página web, veremos que la escena se encuentra delimitada entre las etiquetas <ajs> . Otras etiquetas básicas que se pueden encontrar en páginas web son:
<html> Comprende todo el documento HTML y se cierra al final con la etiqueta </html>.
<head> Contiene el encabezado del documento. Dentro de esta etiqueta se incluye información sobre la página web que no se muestra directamente en el contenido visible de la página. Se cierra con </head>.
<body> Contiene el cuerpo del documento. Todo lo que se quiera que aparezca en la página web, incluidas las escenas de Descartes, debe estar dentro de estas etiquetas. Se cierra con </body> .
<br> Introduce un salto de línea.
<p> Introduce un párrafo de texto y se cierra con </p>
<span> Permite aplicar formato a una parte del texto dentro de una línea. Se cierra con </span>
<div> Permite crear un bloque de contenido, que puede incluir texto, imágenes o escenas, y se cierra con </div>.
<b> se utiliza para resaltar texto en negrita. Se cierra con </b>.
<i> se utiliza para mostrar texto en cursiva. Se cierra con </i>.
<table> Permite introducir una tabla, que ayuda a distribuir los distintos contenidos. Se cierra con </table>. Dentro de la tabla:
<tr> y </tr>: definen las filas de la tabla.<td> y </td>: contienen los datos de cada celda.<th> y </th>: se usan para las celdas de encabezado de la tabla.
<ul> (unordered list) se utiliza para crear listas no ordenadas, es decir, listas cuyos elementos se presentan con viñetas o bullets. Se cierra con </ul>.
<ol> (ordered list) se utiliza para crear listas ordenadas, en las que los elementos aparecen numerados de forma automática. Se cierra con </ol>.
<li> (list item) define cada elemento de la lista, ya sea dentro de una lista ordenada (<ol>) o no ordenada (<ul>). Se cierra con </li>.
Cuando se insertan escenas en páginas web, en el código se insertan dos partes:
- Código donde se indica la ubicación del intérprete descartes-min.js. Se realiza en la cabecera del mismo de la siguiente forma:
<script type="text/javascript" src="lib/descartes-min.js"></script>
- Código de programación de la escena. Se coloca dentro de las etiquetas. El código de la escena se encuentra acotado entre las etiquetas <ajs>
y </ajs>
En este curso emplearemos el editor de escenas para trabajar con las mismas, pero los usuarios avanzados pueden trabajar directamente sobre su código. Existen muchos programas y aplicaciones que permiten crear páginas web y trabajar con su código HTML correspondiente. Algunos de los más conocidos son: Notepad++, Dreamweaver, FrontPage, Amaya, WeaverSlave, Kompozer, BlueGriffon, etc.
Para introducir una escena en una página web, hay que copiar el código de la escena (empieza por <ajs... y termina por ) dentro del código de la página web, en el sitio donde la queramos colocar. La página web que contenga la escena debe ir acompañada del fichero descartes-min.js. En la escena se debe indicar la ruta relativa en la que se encuentra este fichero respecto de la escena ().
En este caso, las escenas ej1.html, ej2.html y ej3.html deben incluir la siguiente etiqueta, preferentemente situada entre las etiquetas y <head> y </head>:
Si se utiliza la opción personalizada, será necesario indicar de forma explícita la ruta en la que la escena debe localizar el intérprete descartes-min.js, ajustándola a la estructura de carpetas correspondiente.
La segunda posibilidad consiste en que el intérprete descartes-min.js se cargue directamente desde Internet, lo que requiere disponer de conexión a la red. En este caso, el código de la escena debe contener, también de forma preferente entre y , la siguiente etiqueta:
<script type='text/javascript' src='http://arquimedes.matem.unam.mx/Descartes5/lib/descartes-min.js'></script>
Es importante recordar que todas estas etiquetas son creadas e insertadas automáticamente en la página por el editor de Descartes, por lo que el usuario no necesita añadirlas manualmente, es suficiente con seleccionarla a través del menú Opciones.
Técnicamente, el intérprete es un archivo js que actúa como una librería o biblioteca informática. Su función principal es traducir el lenguaje propio del código de Descartes a lenguaje JavaScript, de modo que pueda ser interpretado correctamente por los navegadores web. Por esta razón, las escenas de Descartes no pueden visualizarse ni funcionar en un navegador si no cuentan con este intérprete.
Cada vez que el editor de Descartes se abre, permite realizar una actualización automática del intérprete. El diálogo de actualización del intérprete sólo aparece si se detecta que este está desactualizado. Se recomienda siempre aceptar la actualización para que los interactivos sean visualizados correctamente.
