Mostrando entradas con la etiqueta DHTML. Mostrar todas las entradas
Mostrando entradas con la etiqueta DHTML. Mostrar todas las entradas

Tecnologías del lado del cliente: Lenguaje Visual Basic Script (VBScript)

domingo, 9 de marzo de 2008

VBScript (abreviatura de Visual Basic Script) es un lenguaje interpretado por el Windows Scripting Host de Microsoft. Su sintaxis refleja su origen como variación del lenguaje de programación Visual Basic. Ha logrado un apoyo significativo por parte de los administradores de Windows como herramienta de automatización, ya que, conjunta y paralelamente a las mejoras introducidas en los sistemas operativos windows donde opera fundamentalmente, permite gran margen de actuación y flexibilidad. VBScript es interpretado por el motor de scripting vbscript.dll, que puede ser invocado por el motor ASP asp.dll en un entorno web, por wscript.exe en un entorno Windows de interfase gráfica, por cscript.exe es un entorno de línea de comandos y por iexplorer.exe cuando se trata de scripts a nivel de cliente (similar al javascript). Cuando el código fuente VBScript se guarda en ficheros independientes, éstos tienen típicamente la extensión .vbs. Cuando se emplea en Internet Explorer, VBScript funciona de forma muy similar a JavaScript, procesando código contenido en el documento HTML. VBScript también puede usarse para crear aplicaciones HTML independientes (extensión .hta), que necesitan Internet Explorer 5.0 o superior para poder ser ejecutados. Los desarrolladores de aplicaciones en web suelen preferir JavaScript debido a su mayor compatibilidad con otros navegadores de Internet, ya que VBScript sólo está disponible para el navegador de Microsoft Internet Explorer, y no en otros como Firefox o Opera. VBScript es el lenguaje usado para escribir algunos famosos gusanos de red, como I Love You. Esto se debe a varias razones. Primero, el icono parecido a un pergamino que representa a los ficheros .vbs puede llevar a pensar a los usuarios inexpertos que se trata de un fichero de texto. Segundo, es fácil escribir un gusano informático en VBScript que se propague por correo electrónico (se necesitan pocas líneas de código) aunque en la actualidad Microsoft ha solucionado los agujeros de seguridad explotados por dichos programas maliciosos. Este solucionado no significa erradicado, solo ha complicado el proceso; pues si por ejemplo el I Love You se propagaba a traves del Outlook, ahora si se utiliza el mismo método sale un mensaje de advertencia, por lo que se suele emplear métodos como el envío mediante un servidor smtp (bastante más complejo de programar que por el otro método). Las variables en VBScript no necesitan ser declaradas para usarlas, pero es una buena costumbre hacerlo, pues en todos los demás lenguajes es necesario. Option Explicit sirve para que las variables deban ser declaradas si o si. Al no declarar las variables se deja el código a libre albedrío del intérprete. Al declarar las variables se Deja de Manera Explicita la única manera de proceder. Ejemplos A continuación vamos a ver un ejemplo de script en una página web. El objetivo de este script es mostrar la fecha de la última modificación del documento.

<html> <head> <title> La última modificación del documento</title> </head> <body> <h1>Script de la última modificación de un documento</h1> <script language="VBScript"> document.write "Este documento fue actualizado por última vez en: " document.write document.lastmodified </script> </body> </html>
La sentencia document.write es un procedimiento que escribe en la página web el texto que recibe por parámetro, el texto que esta después de la sentencia. La variable document.lastmodified almacena la fecha y la hora de la última actualización. Este script dará como resultado que el documento informe de su última actualización. Continuar leyendo

Tecnologías del lado del cliente: Lenguaje Javascript

sábado, 8 de marzo de 2008

Javascript es un lenguaje de programación utilizado para crear pequeños programas encargados de realizar acciones dentro del ámbito de una página web. Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Gracias a su compatibilidad con la mayoría de los navegadores modernos, es el lenguaje de programación del lado del cliente más utilizado. Con Javascript podemos crear efectos especiales en las páginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso, y tal vez el único, con que cuenta este lenguaje es el propio navegador. Javascript es el siguiente paso, después del HTML, que puede dar un programador de la web que decida mejorar sus páginas y la potencia de sus proyectos. Es un lenguaje de programación bastante sencillo y pensado para hacer las cosas con rapidez, a veces con ligereza. Incluso las personas que no tengan una experiencia previa en la programación podrán aprender este lenguaje con facilidad y utilizarlo en toda su potencia con sólo un poco de práctica. Entre las acciones típicas que se pueden realizar en Javascript tenemos dos vertientes. Por un lado los efectos especiales sobre páginas web, para crear contenidos dinámicos y elementos de la página que tengan movimiento, cambien de color o cualquier otro dinamismo. Por el otro, javascript nos permite ejecutar instrucciones como respuesta a las acciones del usuario, con lo que podemos crear páginas interactivas con programas como calculadoras, agendas, o tablas de cálculo. Javascript es un lenguaje con muchas posibilidades, permite la programación de pequeños scripts, pero también de programas más grandes, orientados a objetos, con funciones, estructuras de datos complejas, etc. Además, Javascript pone a disposición del programador todos los elementos que forman la página web, para que éste pueda acceder a ellos y modificarlos dinámicamente. Con Javascript el programador, que se convierte en el verdadero dueño y controlador de cada cosa que ocurre en la página cuando la está visualizando el cliente. Ejempos A continuación veremos unos ejemplos que nos pueden dar una idea más clara de las capacidades y potencia del lenguaje que nos vendrán bien para tener una noción más exacta de lo que es JavaScript.

<script> window.open("http://www.google.com","","width=550,height=420,menubar=no") </script>
Con una línea de Javascript podemos hacer cosas bastante atractivas. En el ejemplo anterior podemos ver cómo abrir una ventana secundaria sin barras de menús que muestre el buscador Google.
<script> document.write(new Date()) </script>
Con el script anterior podemos mostrar la fecha de hoy. A veces es muy interesante mostrarla en las webs para dar un efecto de que la página está al "al día", es decir, está actualizada. Estas líneas deberían introducirse dentro del cuerpo de la página en el lugar donde queramos que aparezca la fecha. Otro ejemplo rápido se puede ver a continuación. Se trata de un botón para volver hacia atrás, como el que tenemos en la barra de herramientas del navegador. Ahora veremos una línea de código que mezcla HTML y Javascript para crear este botón que muestra la página anterior en el historial, si es que la hubiera.
<input type=”button” value=”Atrás” onclick="history.go(-1)">
Como diferencia con los ejemplos anteriores, hay que destacar que en este caso la instrucción Javascript se encuentra dentro de un atributo de HTML, onclick, que indica que esa instrucción se tiene que ejecutar como respuesta a la pulsación del botón. Applet vs. JavaScript
JavaScript Applet
Interpretado por el cliente (No compilado) Cargado en el servidor antes de ejecutarse en el cliente
Basado en objetos El código consiste en clases con herencia
Código integrado e incrustado en HTML Los applets son llamados desde una página HTML
Tipos de variables no declaradas Los argumentos deben ser de un tipo específico
Continuar leyendo

Tecnologías del lado del cliente: HTML Dinámico (DHTML)

viernes, 7 de marzo de 2008

A medida que vamos avanzando en la programación de páginas web nos vamos fijando nuevos objetivos para crear cada día webs más excitantes. Siguiendo este camino, llega un momento que el lenguaje HTML se nos queda corto y tenemos que servirnos de alguna tecnología superior, que nos permita realizar esos desarrollos más complejos y dinámicos. DHTML no es precisamente un lenguaje de programación. Más bien se trata de una nueva capacidad de la que disponen los navegadores modernos, por la cual se puede tener un mayor control sobre la página que antes. Cualquier página que responde a las actividades del usuario y realiza efectos y funcionalidades se puede englobar dentro del DHTML, pero en este caso nos referimos más a efectos en el navegador por los cuales se pueden mostrar y ocultar elementos de la página, se puede modificar su posición, dimensiones, color, etc. DHTML nos da más control sobre la página, gracias a que los navegadores modernos incluyen una nueva estructura para visualizar en páginas web denominada capa. Las capas se pueden ocultar, mostrar, desplazar, etc. Para realizar las acciones sobre la página, como modificar la apariencia de una capa, seguimos necesitando un lenguaje de programación del lado del cliente como Javascript o VBScript. Estos lenguajes no permiten el desarrollo de cualquier proyecto en Internet, ya que al ser ejecutados en el navegador del cliente, no tienen acceso a todos los recursos del sistema del usuario, para evitar agujeros de seguridad, ni a los recursos del servidor donde están alojadas las páginas. Esta limitación, añadida a la ya comentada de su dependencia del navegador, los hace insuficientes para desarrollos avanzados, siendo más bien un complemento de programación que el núcleo de verdaderas aplicaciones en el web. Hojas de estilo (CSS) Dentro del concepto de DHTML se engloban también las Hojas de Estilo en Cascada o CSS (Cascade Style Sheets) CSS, es una tecnología que nos permite crear páginas web de una manera más exacta. Gracias a las CSS somos mucho más dueños de los resultados finales de la página, pudiendo hacer muchas cosas que no se podía hacer utilizando solamente HTML, como incluir márgenes, tipos de letra, fondos, colores, etc. Las Hojas de Estilo en Cascada se escriben dentro del código HTML de la página web, en algunos casos avanzados se pueden escribir en un archivo a parte y enlazar la página con ese archivo. Una de las características más potentes de la programación con hojas de estilo consiste en definir los estilos de todo un sitio web. De este modo, todas las páginas comparten una misma declaración de estilos y, por tanto, si la cambiamos, cambiarán todas las páginas. Ejemplos Podemos ver un ejemplo a continuación:

P { font-size : 12pt; font-family : arial,helvetica; font-weight : normal; } H1 { font-size : 36pt; font-family : verdana,arial; text-decoration : underline; text-align : center; background-color : Teal; } BODY { background-color : #006600; font-family : arial; color : White; }
Veamos una página web entera que enlaza con la declaración de estilos anterior
<html> <head> <link rel="STYLESHEET" type="text/css" href="estilos.css"> <title>Página que lee estilos</title> </head> <body> <h1>Página que lee estilos</h1> <p> Esta página tiene en la cabecera la etiqueta necesaria para enlazar con la hoja de estilos. </p> </body> </html>
Las Hojas de Estilo en Cascada son un estándar muy amplio, con unas especificaciones y posibilidades muy grandes. Sin embargo, lo mejor para trabajar con esta tecnología es conocerla bien, gracias a ello, los resultados serán mucho más sorprendentes. No podemos hablar de DHTML sin tocar el tema de los lenguajes de script que veremos en el próximo capítulo. Continuar leyendo