Qué Es Cada Tecnolgía PDF

Qué es cada tecnología
http://desarrolloweb.com/manuales/15.php Página 1 de 172

Introducción: Qué es cada tecnología
El manual Qué es cada tecnología aborda una variedad de temas relacionados con el desarrollo
en general. En cada uno de sus artículos se introduce una tecnología distinta.
Es una lectura rápida para obtener un conocimiento general sobre las tecnologías, lenguajes y
frameworks sobre programación en general, en la mayoría de casos orientados a la web.
Encuentras este manual online en:

http://desarrolloweb.com/manuales/15.php

Autores del manual
Las siguientes personas han participado como autores escribiendo artículos de este manual.
Miguel Angel Alvarez
Miguel es fundador de DesarrolloWeb.com y la plataforma de

formación online EscuelaIT. Comenzó en el mundo del desarrollo web
en el año 1997, transformando su hobby en su trabajo.
Guillermo Aedo Contreras
José Antonio González Seco
Sara Alvarez
Equipo DesarrolloWeb.com
Erick Ruiz de Chavez
Desarrollador web, Geek "de hueso colorado", Marido feliz.

Juliana Monteiro Lazaro
Directora de CriarWeb.com
Rubén Alvarez
Rubén es doctor en química y programador aficionado con experiencia

en PHP.
David Masip
Eduardo Manchón
Luciano Salvino
Luis Villa
Serviweb
Diseño web Murcia
Gisela Torres Buitrago
Desarrolladora en tecnologías .NET y Windows Azure MVP

Mario Cortés Flores
SharePoint Lead en Plain Concepts
Jorge ATGU
Diseñador gráfico y Web
OldMith
Desarrollador Web. jQuery. Responsive Design. Wordpress. Friki por

naturaleza.
Eduard Tomàs
Apasionado de la informática, los videojuegos, rol y... la cerveza. Key

Consultant en Pasiona y MVP en #aspnet
Ana Alvarez Sanchez
Directora de contenidos de EstiloyModa.com
Enrique Fernandez Guerra

Desarrollador web Frontend, especializado en Javascript y TypeScript.

Trabaja actualmente en PlainConcepts. Colaborador de
DesarrolloWeb es impulsor de los #jsIO

Qué es HTML
Llegó el momento de hablar sobre HTML, el lenguaje con el que crean las páginas
web.
HTML es el lenguaje con el que se define el contenido de las páginas web. Básicamente se trata
de un conjunto de etiquetas que sirven para definir el texto y otros elementos que compondrán
una página web, como imágenes, listas, vídeos, etc.
El HTML se creó en un principio con objetivos divulgativos de información con texto y algunas
imágenes. No se pensó que llegara a ser utilizado para crear área de ocio y consulta con
carácter multimedia (lo que es actualmente la web), de modo que, el HTML se creó sin dar
respuesta a todos los posibles usos que se le iba a dar y a todos los colectivos de gente que lo
utilizarían en un futuro. Sin embargo, pese a esta deficiente planificación, si que se han ido
incorporando modificaciones con el tiempo, estos son los estándares del HTML. Numerosos
estándares se han presentado ya. El HTML 4.01 es el último estándar a febrero de 2001.
Actualización a mayo de 2005, en estos momentos está apunto de presentarse la versión 5 de
HTML, de la que ya se tiene un borrador casi definitivo.
El HTML es un lenguaje de marcación de elementos para la creación de documentos

hipertexto, muy fácil de aprender, lo que permite que cualquier persona, aunque no haya
programado en la vida, pueda enfrentarse a la tarea de crear una web. HTML es fácil y pronto
podremos dominar el lenguaje. Más adelante se conseguirán los resultados profesionales
gracias a nuestras capacidades para el diseño y nuestra vena artista, así como a la
incorporación de otros lenguajes para definir el formato con el que se tienen que presentar las
webs, como CSS.
Una vez conocemos el concepto de HTML os vamos a adelantar algunas cosas más. Este
lenguaje se escribe en un documento de texto, por eso necesitamos un editor de textos para
escribir una página web. Así pues, el archivo donde está contenido el código HTML es un
archivo de texto, con una peculiaridad, que tiene extensión .html o .htm (es indiferente cuál
utilizar). De modo que cuando programemos en HTML lo haremos con un editor de textos, lo
más sencillo posible y guardaremos nuestros trabajos con extensión .html, por ejemplo
mipagina.html
Por adelantar un poco cómo se utiliza el HTML os diremos que el lenguaje consta de etiquetas
que tienen esta forma <B> o <P>. Cada etiqueta significa una cosa, por ejemplo <B> significa que
se escriba en negrita (bold) o <P> significa un párrafo, <A> es un enlace, etc. Casi todas las
etiquetas tienen su correspondiente etiqueta de cierre, que indica que a partir de ese punto no
debe de afectar la etiqueta. Por ejemplo </B> se utiliza para indicar que se deje de escribir en
negrita. Así que el HTML no es más que una serie de etiquetas que se utilizan para definir el
contenido del documento y algún estilo básico. <B>Esto está en negrita</B>.

Nota: El HTML no distingue entre mayúsculas y minúsculas, por lo que <B> sería
equivalente a <b>. Lo común es que los desarrolladores escriban las etiquetas en minúscula.
Para aprender HTML en profundidad tenemos un manual en DesarrolloWeb.com. Además se

pueden consultar los enlaces a distintos manuales que tenemos en nuestra Sección HTML a
Fondo.
Vídeo qué es HTML

Este vídeo que verás a continuación te aclarará muy bien en lo que consiste el lenguaje HTML
y verás rápidamente una serie de ejemplos interesantes, junto con una síntesis de los asuntos
más importantes que debes conocer cuando te acercas por primera vez al lenguaje de
marcación.
Para ver este vídeo es necesario visitar el artículo original en:

http://desarrolloweb.com/articulos/que-es-html.html
Si lo que deseamos es tener una idea global de lo que es la publicación en Internet y los pasos a
seguir para colocar nuestras páginas en la web lo más adecuado será consultar el manual de
Publicar en Internet.
Este artículo es obra de Miguel Angel Alvarez

Fue publicado por primera vez en 01/01/2001
Disponible online en http://desarrolloweb.com/articulos/que-es-html.html

Qué es CSS
Comentamos brevemente que son las hojas de estilo en cascada y explicamos una
serie de efectos rápidos e interesantes que se pueden hacer con ellas.
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...
CSS son las siglas de Cascading Style Sheets, en español Hojas de estilo en Cascada. En este
reportaje vamos a ver algunos de los efectos que se pueden crear con las CSS sin necesidad de
conocer la tecnología entera.
Para empezar
Las Hojas de Estilo en Cascada se escriben dentro del código HTML de la página web, solo en
casos avanzados se pueden escribir en un archivo a parte y enlazar la página con ese archivo.
En un principio vamos a utilizar la manera más directa de aplicar estilos a los elementos de la
página, mas adelante veremos la declaración en archivos externos. Para ello, y esto es la
primera lección de este artículo, vamos a conocer un nuevo atributo que se puede utilizar en
casi todas las etiquetas HTML: style.
Ejemplo:
Dentro del atributo style se deben indicar los atributos de estilos CSS separados por punto y
coma (;). Durante este artículo vamos a conocer muchos atributos de CSS, los dos primeros
que hemos visto aquí son:
color: indica el color del contenido la etiqueta donde estemos utilizándolo,

generalmente indica el color del texto.

font-weight: indica el grosor del texto. Bold sirve para poner en negrita.
Color en los enlaces

Con HTML definimos el color de los enlaces en la etiqueta <body>, con lo atributos link, vlink y
alink. Esto nos permite cambiar el color de los enlaces para todo el documento, pero ¿Y si
queremos cambiar el color de un enlace en concreto, para que tenga otro color que el definido
en la etiqueta <body>?
Para hacer esto utilizaremos el atributo style dentro del enlace:
<a href="mienlace.html" style="color:red">
Así saldrá el enlace en color rojo, independientemente de lo definido para todo el documento.
Espaciado entre líneas

Con CSS podemos definir el espacio que hay entre cada línea del documento, utilizando el
atributo line-height. Por ejemplo, podemos definir que para todo un párrafo el espacio entre
cada una de sus líneas sea 25 pixels:
<p style="line-height: 25px;">
Un párrafo normal en el que cada una de las líneas está separada 25 pixels de la otra. Hay que poner suficiente texto como para que se vean 2
líneas, así saldrán separadas
</p>
Espaciado entre caracteres

Se puede definir también el espacio entre cada carácter. Esto se hace con el atributo de CSS
letter-spacing. Veamos un ejemplo:
<p style="letter-spacing:12cm">
Este párrafo tiene las letras espaciadas por 1 centímetro.
</p>
Este atributo, al igual que ocurre con muchos otros de CSS, no está soportado por todos los
navegadores. En concreto Netscape, en su versión 4 todavía no lo incluye.
Enlaces sin subrayado

Uno de los efectos más significativos y fáciles de realizar con CSS es eliminar el subrayado de
los enlaces de una página web. Existe un atributo que sirve para definir la decoración de un
texto, si está subrayado, tachado, o si no tiene ninguna de estas "decoraciones". Es el atributo
text-decoration, en este caso indicaremos en un enlace que no queremos decoración:

<a href="mipagina.html" style="text-decoration:none">
Incluir estilos para todo un sitio web

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. Esto se consigue creando un archivo donde tan sólo
colocamos las declaraciones de estilos de la página y enlazando todas las páginas del sitio con
ese archivo. 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.
Veamos ahora todo el proceso para incluir estilos con un fichero externo.
1- Creamos el fichero con la declaración de estilos
Es un fichero de texto normal, que puede tener cualquier extensión, aunque le podemos
asignar la extensión .css para aclararnos qué tipo de archivo es. El texto que debemos incluir
debe ser escrito exclusivamente en sintaxis CSS, es un poco distinta que la sintaxis que
utilizamos dentro del atributo style. Sería erróneo incluir código HTML en este archivo:
etiquetas y demás. 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;
2- Enlazamos la página web con la hoja de estilos
Para ello vamos a colocar la etiqueta <LINK> con los atributos:
rel="STYLESHEET" indicando que el enlace es con una hoja de estilo.

type="text/css" porque el archivo es de texto, en sintaxis CSS.
href="estilos.css" indica el nombre del fichero fuente de los estilos.
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. Es muy fácil.
</p>
</body>
</html>
Las CSS tienen mucho más jugo

Las Hojas de Estilo en Cascada son un estándar muy amplio, con unas especificaciones y
posibilidades muy grandes. En este artículo hemos visto unos cuantos efectos interesantes que
realizar aunque no tengamos ningún conocimiento previo. Sin embargo, lo mejor para trabajar
con esta tecnología es conocerla bien, gracias a ello, los resultados serán mucho más
sorprendentes.
Amplía esta información y conoce más sobre CSS.
Este artículo es obra de Juliana Monteiro Lazaro

Disponible online en http://desarrolloweb.com/articulos/15.php

Qué es Javascript
Una introducción meramente conceptual al potente lenguaje de script del lado

del cliente.
Contenidos
Qué es Javascript
Javascript básico
Librerías básicas generalistas, jQuery y demás
Javascript y HTML5
Web Components
MVC en Javascript
NodeJS
Aplicaciones prácticas
Otras librerías específicas
Compartir
Qué es Javascript
Javascript es un lenguaje de programación que surgió con el objetivo inicial de
programar ciertos comportamientos sobre las páginas web, respondiendo a la
interacción del usuario y la realización de automatismos sencillos. En ese contexto
podríamos decir que nació como un "lenguaje de scripting" del lado del cliente, sin embargo,
hoy Javascript es mucho más. Las necesidades de las aplicaciones web modernas y el HTML5
ha provocado que el uso de Javascript que encontramos hoy haya llegado a unos niveles de
complejidad y prestaciones tan grandes como otros lenguajes de primer nivel.
Pero además, en los últimos años Javascript se está convirtiendo también en el lenguaje
"integrador". Lo encontramos en muchos ámbitos, ya no solo en Internet y la Web,
también es nativo en sistemas operativos para ordenadores y dispositivos, del
lado del servidor y del cliente. Aquella visión de Javascript "utilizado para crear
pequeños programitas encargados de realizar acciones dentro del ámbito de una página
web" se ha quedado muy pequeña.
En el contexto de un sitio web, con Javascript puedes hacer todo tipo de acciones e interacción.
Antes se utilizaba para validar formularios, mostrar cajas de diálogo y poco más. Hoy es el
motor de las aplicaciones más conocidas en el ámbito de Internet: Google, Facebook, Twitter,
Outlook... absolutamente todas las aplicaciones que disfrutas en tu día a día en la Web tienen
su núcleo realizado en toneladas de Javascript. La Web 2.0 se basa en el uso de Javascript para

implementar aplicaciones enriquecidas que son capaces de realizar todo tipo de efectos,
interfaces de usuario y comunicación asíncrona con el servidor por medio de Ajax.
Nota: Quizás algunas de esas palabras te suenen todavía a chino, pero en

DesarrolloWeb.com podrás encontrar manuales para aprender no solo los conceptos, sino
cómo implementar esos comportamientos en páginas web. No te preocupes, iremos poco a
poco.
Observarás que casi siempre nos referimos a Javascript como el "lenguaje de

programación de páginas del lado del cliente", pero como ya hemos mencionado,
Javascript es mucho más. Esto es porque hemos vivido Javascript desde sus inicios,
cuando el navegador (inicialmente Netscape) era el único contexto en el que podías
ejecutarlo. También, ese es el Javascript que debes conocer si estas comenzando y el que
querrás aprender en la mayoría de las ocasiones.
Entender Javascript en el contexto de los lenguajes de la web
Para entender bien lo que es Javascript y en qué situaciones se utiliza debes conocer los
distintos lenguajes que se utilizan en la web. No es necesario que domines todos los lenguajes
de la web para hacer un buen uso de Javascript, tan solo será necesario que conozcas el HTML
y tengas algunas nociones de CSS. En ese manual podrás también conocer algunos de los
conceptos clave para entender qué es Javascript, como la programación del lado del cliente y la
programación del lado del servidor.
Manual de los lenguajes del web En esta compilación de artículos podrás dar un
repaso general a lenguajes y tecnologías que están presentes en el día a día del
desarrollo de sitios web.
Javascript básico (como lenguaje de scripting del lado del cliente)

A Javascript se le denomina "del lado del cliente" porque donde se ejecuta es en el
navegador (cliente web), en contraposición a lenguajes como PHP que se ejecutan del
"lado del servidor". En el lado que nos ocupa con Javascript, el cliente, es el navegador el que
soporta la carga de procesamiento. Gracias a su compatibilidad con todos los navegadores
modernos se ha convertido en un estándar como lenguaje de programación del lado del cliente.
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, con
que cuenta este lenguaje es el propio navegador y todos los elementos que hay dentro de una
página (que no es poco). Pero ahora, gracias a las API Javascript del HTML5, que están
disponibles en los navegadores actuales de ordenadores y dispositivos, podemos acceder a todo
tipo de recursos adicionales, como la cámara, espacio para almacenamiento de datos, creación
de gráficos basados en vectores y mapas de bits, flujos de datos con servidores, etc. Con todo
ello se han multiplicado las posibilidades.
Cómo y cuando aprender Javascript

En la secuencia del aprendizaje de las tecnologías y lenguajes del web, Javascript sería el
lenguaje más adecuado para aprender después de conocer perfectamente HTML
y algo de CSS. Es ideal para cualquier persona con conocimientos de programación o incluso
para aquellos profesionales que no los tienen pero que no quieren dejar de lado las grandes
posibilidades de Javascript para mejorar la experiencia de usuario en 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.
Cuando empiezas a aprender Javascript, ejecutando tus programas en el navegador, los

primeros ejemplos que realizarás tendrán 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 (eventos), con lo que podemos
crear páginas interactivas con programas como calculadoras, agendas, o hojas de cálculo,
interfaces de usuario diversas, etc.
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 es capaz de alterar cualquier cosa que se muestra en una
página, cambiando, insertando o eliminando todo tipo de contenido. Si lo deseas, puedes
controlar de cada cosa que ocurre en la página cuando la está visualizando el usuario y
comunicar con él con todo tipo de interfaces especiales. Todo eso es lo que permitirá crear
aplicaciones web realmente impactantes. Aprender todo eso no se consigue en dos días, pero
con ganas todo se acaba consiguiendo.
En DesarrolloWeb.com podrás aprender el Javascript básico en dos manuales distintos:
Manual de Javascript Este manual trata todos los temas más básicos de Javascript,
desde la creación de tus primeros scripts. Nos enseña los diferentes lugares donde
podemos integrar el código Javascript dentro de una página web, pero lo más
importante que verás en este manual es todo lo relacionado con la sintaxis del lenguaje,
estructuras de control (bucles, condicionales), funciones, objetos, etc. Este manual está
explicado paso por paso, de modo que lo podrán entender incluso aquellas personas que
no tienen conocimientos de programación.
Desarrollo del lado del cliente con Javascript En este segundo manual podrás
entender Javascript dentro del contexto del navegador. Aprenderás que con Javascript
tienes a tu disposición cualquier elemento de la página, que podrás alterar para
implementar las necesidades de tus aplicaciones y responder a la interacción del
usuario.
Videotutorial de Javascript Si prefieres aprender por medio de vídeo tenemos
también una serie de videotutoriales de Javascript ideales para iniciarse en el lenguaje.
Cubren la parte de la sintaxis de Javascript, variables, arrays, estructuras de control,

funciones, etc.
Librerías Javascript
Una vez conozcas el Javascript esencial y hayas podido explorar diversos ejemplos y utilidades
querrás dedicarte a aprender algunas librerías extremadamente útiles para un desarrollo más
cómodo y rápido. Aprender el lenguaje con los manuales básicos es esencial para cualquier
desarrollador, pero ya luego la librería que escojas depende de lo que quieras hacer y tu pericia
como desarrollador. Quizás la opción más sencilla para comenzar sea jQuery, pero hay
muchas otras que son mucho más potentes y permiten crear aplicaciones mayores, como
AngularJS, Angular 2, Polymer, React....
Comenzaremos enseguida a dar un repaso a estas librerías, pero antes debemos explicar un
concepto fundamental en el desarrollo Javascript del lado del cliente que llamamos Cross
Browser.
Aprendiendo Javascript llegarás a un nivel en el que percibirás que cada navegador interpreta
de una manera distinta el lenguaje. Lo que puede estar correcto en un cliente web puede que
no se vea bien en otro y viceversa. Por ese motivo los programadores han tenido que realizar
tradicionalmente mucho código Javascript para distinguir qué navegador está usando nuestro
visitante y luego para ejecutar aquel código Javascript que es capaz de interpretar bien el
navegador del usuario. A este código capaz de ejecutarse sin errores en distintos navegadores
se le llamó "Cross Browser", pero no era práctico para los desarrolladores, pues surgían
programas con código muy complejo, que requería constante mantenimiento para
adecuarse a los nuevos navegadores y las nuevas versiones.
Afortunadamente Javascript se ha vuelto un estándar y los navegadores modernos son capaces

de interpretarlo de manera muy similar, pero todavía quedan muchos navegadores antiguos
que ejecutan Javacript muy particular y nos toca lidiar con ellos en el día a día. Para ello
contamos con diversas librerías que nos ayudan mucho. Pero el objetivo de estas librerías no es
solamente hacer código compatible con cualquier sistema, también se trata de hacer más
simples las cosas que se suelen necesitar en el día a día. Osea, realizar efectos con pocas líneas
de código, comunicaciones asíncronas con el servidor (Ajax) fáciles de implementar, gestión de
eventos, etc.
jQuery
La librería más conocida de Javascript se llama jQuery y se ha convertido en un complemento

en la mayoría de las webs que usamos en nuestro día a día, por su facilidad de uso y por su
potencia. Con jQuery puedes escribir código Javascript que es capaz de ejecutarse sin errores
en cualquier navegador, incluso los antiguos y te implementa muchas funcionalidades que
puedes requerir repetidamente en cualquier sitio web.
jQuery te permite además programar nuevas funcionalidades por medio de plugins para hacer
cosas tan variadas como validación de formularios, sistemas de plantillas, pases de
diapositivas, interfaces de usuario avanzadas y un largo etc. Por donde quiera que vayas en la
web encontrarás funcionalidades dinámicas programadas por medio de plugins jQuery.

Aprender jQuery está al alcance de todos y ese es el principal motivo de que sea tan usada. De
hecho, incluso diseñadores sin grandes conocimientos de programación son capaces de usar la
librería para cubrir sus necesidades, aunque a veces sea solo un ejercicio de "copia-pega". Pero
ojo, no conviene engañarse, si quieres sacarle partido a jQuery primero debes aprender
Javascript.
Manual de jQuery Es el manual completo de la librería Javascript jQuery, el

complemento más popular para los desarrolladores en Javascript. Hace un recorrido
con absoluta profundidad de cada uno de los componentes de la librería, enseñando a
manejarla con muchos ejemplos prácticos.
Videotutorial de jQuery Vídeos para aprender a programar con jQuery, con
lecciones teóricas y que exploran las funcionalidades principales de la librería, así como
casos prácticos desarrollados desde cero con la intención de facilitar al estudiante casos
de uso que le sirvan para entender los mecanismos habituales para el desarrollo con
jQuery.
Manual de jQueryUI jQueryUI es una extensión de jQuery por medio de una serie de
plugins para implementar interfaces de usuario avanzadas. Dispone desde sistemas
para facilitar la interaccion, como componentes para implementar drag & drop,
elementos capaces de ordenarse, redimensionarse, etc. hasta interfaces como campos
de autocompletado, sistemas de selección de fechas, menús dinámicos, tooltips, cajas de
diálogo, etc.
Manual de jQuery Mobile jQuery Mobile es el más nuevo de los productos de la
familia jQuery. Si jQuery sirve para hacer cualquier tipo de Javascript para cualquier
tipo de página, ejecutable en cualquier entorno, jQuery Mobile es una librería que nos
permite el desarrollo rápido de sitios web para móviles. Tiene una serie de componentes
de interfaz de usuario y una serie de utilidades para crear páginas orientadas para
móvil, responder a interacción en pantallas táctiles, etc. Con muy poco código
Javascript en jQuery Mobile puedes crear sitios dinámicos que se comportan muy bien
cuando los usas en la mayoría de los fabricantes de dispositivos.
Otras librerías de Javascript
jQuery es la librería más popular, pero existen otra serie de librerías que nos sirven para
realizar cosas similares y que tienen diversos modos de resolver los mismos problemas. En
DesarrolloWeb.com explicamos diversas librerías alternativas, entre las que podemos destacar
Mootools o YUI. Para la mayoría de los desarrolladores jQuery será la librería más adecuada,
por ser en muchos casos más fácil de entender, tener la mayor comunidad y con ello resultar
más sencillo encontrar documentación, ejemplos y plugins listos para usar. Salvo esas ventajas,
que no son pocas, algunos programadores experimentados podrán preferir otras librerías. Por
ejemplo, si sabes programar con orientación a objetos probablemente te gustará más cómo se
desarrollan los componentes reusables en Mootools.
Manual de Mootools Es una librería muy conocida para Javascript, competidor de

jQuery por realizar cosas muy similares. Con Mootools puedes realizar todo tipo de
efectos visuales, Ajax, alterar elementos de la página, etc. Su curva de aprendizaje es un
poco pesada, pero con este manual te lo facilitamos bastante. Podrás entender bien
cómo realizar ejemplos sencillos y también componentes avanzados que podrás
reutilizar fácilmente.

Manual de YUI Es la librería Javascript construida por el equipo de desarrolladores

de Yahoo!, implementada en su portal y en sus aplicaciones. Este manual es
simplemente una rápida lista de artículos para dar los primeros pasos.
Javascript y HTML5
La revolución de Javascript ha llegado con la incorporación del HTML5. A pesar de su nombre,
HTML5 incuye varios estándares aparte de ser una revisión del propio lenguaje HTML. De
hecho más del 60% de lo que se conoce como HTML5 en realidad son APIs Javascript. Un API
es un conjunto de funciones que sirven para llevar a cabo una o muchas tareas. Pues el HTML5
incluye diversas API para trabajar ya no solo con el navegador, sino también con los periféricos
o los elementos del dispositivo, como cámara, pantalla, espacio de almacenamiento, GPS, etc.
HTML5, en definitiva, ha llegado para estandarizar aun más Javascript y crear una serie de
especificaciones que siguen todos los fabricantes de navegadores para ordenadores y
dispositivos y que aseguran que el Javascript es igual en todos ellos. HTML5 sirve por tanto
para ordenadores de escritorio, pero también para todo tipo de dispositivos que nos
encontramos actualmente, desde móviles a tablets, smartTV, etc.
APIs del HTML5
Si queremos aprovechar HTML5 tendremos que aprender a manejar una serie de

características nuevas de Javascript, con una serie de API que nos sirven para trabajar con los
más diversos recursos del navegador y del ordenador/dispositivo del usuario. Las API del
HTML5 nos permiten extender todavía más las posibilidades de Javascript, llegando a situarlo
en condiciones similares a las de otros lenguajes de programación.
Llegado a este punto es inevitable hablar del concepto de "Webapp", que son aplicaciones para
móviles y tablets que están basadas en HTML5 (HTML + CSS + Javascript) y que pueden
controlar el dispositivo, por medio de las API, de igual modo que los lenguajes de
programación nativos. Aunque en 2014 todavía las webapp no son capaces de funcionar tan
bien como las aplicaciones nativas, tienen un futuro muy prometedor.
Para aprender sobre las API de HTML5 no tenemos un manual que las recorra una por una,
sino un compendio de artículos que llamamos "taller".
Taller de HTML5 Es un manual en el que encontrarás multitud de artículos sobre

Javascript que usan las características que nos trae el HTML5. Hay diversos artículos
que te aproximan desde un enfoque muy práctico las distintas APIs de Javascript y que
te enseñan a usarlas para la resolución de diversos tipos de problemas.
Manual de Canvas del HTML 5 Un completo manual del API de Canvas del HTML5
que nos permite dibujar en un "lienzo" cualquier cosa por medio de funciones
Javascript. El canvas se situa en un elemento CANVAS de la página y por medio de
código fuente podemos pintar todo tipo de formas, líneas, puntos, poligonos, imágenes
traídas desde ficheros gráficos, etc. El canvas es uno de los elementos fundamentales
para implementar juegos en HTML5.
HTML5 y compatibilidad

El problema de HTML5 es que no todos los navegadores implementan todas las características
del estándar, por ello si usas HTML5 debes tener en cuenta una serie de pasos adicionales para
gestionar aquellas incompatibilidades que puedan encontrar los usuarios que visitan tu web. A
día de hoy podemos usar HTML5 con total confianza. La mayoría de las cosas que querrás
implementar en cualquier proyecto están ya completamente adoptadas por los navegadores
modernos. Pero la realidad es que muchas personas navegan todavía con navegadores
anticuados, como pueden ser versiones de Internet Explorer anteriores a la 10 o la 11.
Existen diversas técnicas para aplicar compatibilidad a los navegadores antiguos. En la

mayoría de los casos los desarrolladores se decantan por lo que se denomina "graceful
degradation", que consiste en aplicar técnicas que permitan una "degradación amigable" de las
aplicaciones web, de modo que se minimicen los efectos indeseables por la falta de
compatibilidad. Estas técnicas incluyen la carga de librerías adicionales para suplir las
carencias que tienen los navegadores antiguos o la ejecución de estilos o scripts alternativos.
En este caso el aliado indispensable es Modernizr
Manual de Modernizr Es un manual que te enseña a manejar los aspectos

fundamentales de la librería Javascript Modernizr que permite la detección de
características del navegador y la carga condicional de estilos CSS o de scripts en
función de lo compatible, o no, que sea un navegador. Con Modernizr fácilmente puedes
hacer que clientes web obsoletos entiendan perfectamente las nuevas etiquetas del
HTML5, que se les apliquen CSS diferentes dependiendo de los navegadores que ven la
página y cargar condicionalmente librerías denominadas "polyfills" que sirven para
implementar de manera no nativa características del HTML5 que son nativas en los
navegadores modernos.
Web Components
Después de hablar de HTML5 tenemos que detenernos en eplicar otro de los estándares con
los que contamos en los navegadores, los Web Components. Esta tecnología sirve para
extender el HTML creando nuevos componentes que son como si fueran etiquetas nuevas en el
lenguaje, que permiten hacer cosas para las que HTML no está preparado. Componentes
puedes encontrar de todo tipo, para implementar las más variadas necesidades y además como
desarrollador puedes crear tus propios componentes.
Manual de Web Components En este manual explicamos el estándar de Web

Components y sus especificaciones, con numerosos ejemplos prácticos en los que
crearemos diversos tipos de componentes con Javascript nativo.
En lo que respecta a Web Components tenemos varias librerías, que nos permiten un
desarrollo mucho más acelerado y sencillo de componentes web. Existe una que destaca sobre
todas ellas y que hemos tratado con mucho detalle en DesarrolloWeb.com:
Manual de Polymer Es una librería creada por Google que nos permite la creación de
componentes web de una manera muy sencilla y con enormes utilidades para el
desarrollo mucho más rápido. Polymer además incluye un catálogo de componentes ya
listo para usar, que implementan la más variada gama de necesidades de las webs
modernas. Desarrollar con Polymer es ideal tanto para sitios web básicos como para

aplicaciones extremadamente avanzadas.
MVC en Javascript
Siguiendo con la secuencia lógica de tu aprendizaje de Javascript, llegamos al MVC. MVC en sí
son las siglas de Modelo, Vista y Controlador y se trata de un paradigma de programación que
se usa en lenguajes donde se tiene que trabajar con interfaces gráficas, como es el caso de la
Web. Propone la separación del código de las aplicaciones por responsabilidades. Los modelos
se encargan de trabajar con los datos de la aplicación, las vistas con la presentación y los
controladores hacen de conexión entre vistas y modelos. MVC no es algo específico de
Javascript, sino que lo encontramos en lenguajes del lado del servidor como PHP o incluso en
lenguajes de propósito general como es Java.
En Javascript existen varias librerías que podríamos catalogar en este apartado del MVC, pero
que realmente no tienen por qué ser MVC puro. A veces nos referimos a ellas como MV*,
porque cada una adapta el patrón con diversas aproximaciones y diversas "capas". Realmente
sea o no MVC puro, lo importante es que estas librerías son capaces de separar el código por
responsabilidades, lógica de presentación, de negocio, etc. Esa separación de
responsabilidades es fundamental para crear código fácil de entender, fácil de escribir y sobre
todo, de fácil mantenimiento y gran escalabilidad.
Trabajar con paradigmas como MVC es fundamental en el mundo de las aplicaciones web,
porque nos permite organizar mejor nuestro código, facilitando el mantenimiento de las
aplicaciones. Sin esa organización es habitual que los desarrollos tiendan al caos cuando son
muy complejos de realizar y se aumentan considerablemente los costos de mantenimiento. Es
por ello que el MVC en Javascript, aunque ha tardado algo más en establecerse que en otros
lenguajes, ha llegado para quedarse. O bien los mencionados MV*, donde la figura del
Controlador se ha llevado a diversas interpretaciones e implementaciones. A veces
encontramos sistemas MVR, MVVM... en realidad es todo lo mismo, con distintos matices.
Existen diversas librerías para realizar MVC en Javascript, entre las más populares están
BackboneJS, EmberJS, AngularJS, Angular 2, React, etc. Todas tienen interesantes ventajas
para los desarrolladores y hacen "magia" para que no necesitemos preocuparnos por diversos
detalles a la hora de programar en Javascript.
Manual de BackboneJS Este manual te ofrece una bonita introducción a los

sistemas MVC de Javascript, de la mano de BackboneJS que es sin duda la librería MVC
más sencilla de entender. Si estás pensando en dar los primeros pasos en el mundo del
MVC del lado del cliente y deseas que esta primera aproximación te facilite tu
aprendizaje, merece la pena comenzar por BackboneJS. Este manual no tiene
demasiada profundidad pero se preocupa mucho por explicar aquellos conceptos que se
encuentran en los sistemas MVC y que debemos dominar para poder asimilarlos con
garantías.
Manual de AngularJS AngularJS es la librería MVC más destacada para Javascript,
que nos permite un desarrollo rápido y promueve las mejores prácticas. Es
especialmente adecuada para el desarrollo de aplicaciones web en general incluso
aplicaciones de una sola página que se parecen a las aplicaciones de escritorio. Apoyada
por Google y una gran comunidad va camino de convertirse en el estándar en cuanto a

MVC se refiere. Comenzar con AngularJS es tan sencillo que te sorprenderá.

Manual de Angular 2 Angular 2 es la evolución de AngularJS, que ha revolucionado
el desarrollo del lado del cliente, llegando a límites mucho más elevados que su
predecesor en organización del código, desempeño, funcionalidades, etc. Se ha reescrito
desde cero el framework para dar salida a todas las necesidades de la versión
precedente, que nos aseguran una base extraordinaria para el desarrollo de aplicaciones
con vistas en el futuro.
Manual de React React, o ReactJS, es la librería de Javascript creada por Facebook,
usada por ellos mismos en el desarrollo de su red social. Permite como todas la
separación del código y el desarrollo acelerado. React está más enfocada al desarrollo de
interfaces de usuario, aunque con diversos complementos puede llegar a abarcar tanto
como Angular 2. Su característica fundamental es que las aplicaciones desarrolladas
tienen un gran rendimiento.
NodeJS
No podemos dejar de hablar de Javascript sin mencionar NodeJS. Se trata de un lenguaje de
propósito general pero que tiene como particularidad usar el motor de Javascript V8 (el motor
de Javascript implementado en el Google Chrome) para la ejecución de los programas. Que sea
de propósito general indica que puedes realizar cualquier tipo de aplicación, por lo tanto
NodeJS no es un lenguaje web propiamente dicho. Es capaz de servir para el desarrollo web,
igual que es también capaz de servir para muchas otras cosas que no tienen nada que ver. Por
ese motivo, aunque a veces se denomina a NodeJS como el Javascript del lado del servidor, la
realidad es que es mucho más que eso.
NodeJS es un lenguaje que tiene unas características diferentes a otros lenguajes, como su
característica más peculiar encontramos lo que se llama programación "asíncrona" que no es
más que la capacidad de realizar acciones que lleven un tiempo para la ejecución sin necesidad
de mantener procesos en estado de espera. Esto provoca que su ejecución sea bastante ligera,
aunque también complica algo las cosas para las personas que están acostumbradas a que los
programas siempre se ejecutan siguiendo un flujo fijo de instrucciones, tal como están escritos.
Si dominas Javascript habrás podido usar la programación asíncrona en parcelas como el Ajax,
por lo que no te resultará muy complicado entender cómo se programa en NodeJS.
A pesar que sirve para muchas cosas, NodeJS se ha convertido en un lenguaje muy usado por
los desarrolladores web. Muchas herramientas del día a día de los desarrolladores están
programadas con NodeJS como los gestores de paquetes "npm" o "bower". También muchas
herramientas para desarrollo frontend están programadas en NodeJS. Además existen
diversos frameworks como SailsJS o ExpressJS que se pueden usar para aplicar NodeJS en el
desarrollo web.
Manual de NodeJS Hemos comenzado un manual para tratar de llevar el mundo

NodeJS a tu día a día. Es un manual que da por sabidas ciertas cosas de la
programación en Javacript en general y trata de explicar las características de este
lenguaje en particular, el flujo de trabajo para la programación de aplicaciones, los
gestores de paquetes, librerías más comunes, etc.
Aplicaciones prácticas

A lo largo de todo DesarrolloWeb.com disponemos de muchos otros manuales que nos

explican diversos aspectos prácticos de Javascript. Son manuales que denominamos talleres
porque no explican nada teórico, sino que dan paso a paso todas las guías para acometer
diversos proyectos, unos simples y otros complejos. Estos manuales son más adecuados para
practicar, mientras que los manuales mencionados anteriormente son más adecuados para
conocer el lenguaje, librerías y tecnologías complementarias.
Los encontrarás de diversas dificultades y aplicaciones. Simplemente mostramos un listado

con los títulos de los principales manuales prácticos que podrás encontrar en este sitio.
Talleres de Javascript
Control de ventanas secundarias
Tratamiento de imágenes
Control de frames
Formularios y Javascript
Taller de Programación DOM Javascript
Taller de jQuery
Taller de Mootools
Otras librerías más específicas o frameworks de interés

Completamos esta lista de manuales disponibles en DesarrolloWeb.com con algunas otras
librerías, frameworks o complementos que te pueden servir en el día a día como desarrollador,
como es el caso del debug en Javascript con Firebug o el trabajo con templates Javascript que
nos facilita Handlebars. Son librerías que sirven para cosas más específicas como processing,
que permite el dibujo e interacción con canvas de alto nivel. Seguramente podrás "jugar" con
alguna de estas librerías y mejorar tus proyectos o tu flujo de trabajo como desarrollador.
Manual de Firebug para debug en Javascript

Manual del sistema de plantillas Javascript Handlebars
Manual de Procesing.js
Librería php.js: las funciones PHP en Javascript
Aprender Javascript te abrirá muchas puertas profesionales

Javascript es el lenguaje que en estos momentos tiene mayor potencial de crecimiento. Como
hemos dicho, Javascript te sirve para hacer web, pero también para trabajo con dispositivos
por medio de las API HTML5 para crear las webapps. Incluso es un lenguaje nativo en
Windows 10 o sistemas operativos como FirefoxOS o Blackberry 10.
Existe una gran demanda de profesionales con conocimientos avanzados de Javascript,

necesarios para acometer cualquier proyecto en la web de última generación, así que todo el
tiempo que inviertas en aprender este lenguaje te resultará de mucha utilidad.
También queremos recomendarte mantenerte atento a los eventos #jsIO que realizamos
periódicamente y a los que ya encuentras grabados en el canal de Youtube de
DesarrolloWeb.com.



Qué es Java
Descripción y características de este potente y moderno lenguaje de

programación.
Java es un lenguaje de programación con el que podemos realizar cualquier tipo de programa.
En la actualidad es un lenguaje muy extendido y cada vez cobra más importancia tanto en el
ámbito de Internet como en la informática en general. Está desarrollado por la compañía Sun
Microsystems con gran dedicación y siempre enfocado a cubrir las necesidades tecnológicas
más punteras.
Una de las principales características por las que Java se ha hecho muy famoso es que es un
lenguaje independiente de la plataforma. Eso quiere decir que si hacemos un programa en
Java podrá funcionar en cualquier ordenador del mercado. Es una ventaja significativa para los
desarrolladores de software, pues antes tenían que hacer un programa para cada sistema
operativo, por ejemplo Windows, Linux, Apple, etc. Esto lo consigue porque se ha creado una
Máquina de Java para cada sistema que hace de puente entre el sistema operativo y el
programa de Java y posibilita que este último se entienda perfectamente.
La independencia de plataforma es una de las razones por las que Java es interesante para
Internet, ya que muchas personas deben tener acceso con ordenadores distintos. Pero no se
queda ahí, Java está desarrollándose incluso para distintos tipos de dispositivos además del
ordenador como móviles, agendas y en general para cualquier cosa que se le ocurra a la
industria.
Pasado y presente
Java fue pensado originalmente para utilizarse en cualquier tipo de electrodoméstico pero la
idea fracasó. Uno de los fundadores de Sun rescató la idea para utilizarla en el ámbito de
Internet y convirtieron a Java en un lenguaje potente, seguro y universal gracias a que lo puede
utilizar todo el mundo y es gratuito. Una de los primeros triunfos de Java fue que se integró en
el navegador Netscape y permitía ejecutar programas dentro de una página web, hasta
entonces impensable con el HTML.
Actualmente Java se utiliza en un amplio abanico de posibilidades y casi cualquier cosa que se
puede hacer en cualquier lenguaje se puede hacer también en Java y muchas veces con grandes
ventajas. Para lo que nos interesa a nosotros, con Java podemos programar páginas web
dinámicas, con accesos a bases de datos, utilizando XML, con cualquier tipo de conexión de
red entre cualquier sistema. En general, cualquier aplicación que deseemos hacer con acceso a
través web se puede hacer utilizando Java.
Conclusión

En nuestro buscador en la sección de Java podemos encontrar muchas páginas con algunos
tutoriales y fuentes de referencia muy útiles. Java es tan grande que si queremos hacer cosas
complicadas no podremos aprenderlo todo a través de los tuturiales online y nos harán falta
libros o cursos. La página de Java de Sun es sin duda la mejor referencia, aunque un poco
avanzada para los que empiezan, es la referencia más útil para los que necesitan documentarse
para algo en concreto.


Qué es ASP
Es el lenguaje de scripting del lado del servidor creado por Microsoft.
ASP (Active Server Pages) es la tecnología desarrollada por Microsoft para la creación de
páginas dinámicas del servidor. ASP se escribe en la misma página web, utilizando el lenguaje
Visual Basic Script o Jscript (Javascript de Microsoft).
Un lenguaje del lado del servidor es aquel que se ejecuta en el servidor web, justo antes de
que se envíe la página a través de Internet al cliente. Las páginas que se ejecutan en el servidor
pueden realizar accesos a bases de datos, conexiones en red, y otras tareas para crear la página
final que verá el cliente. El cliente solamente recibe una página con el código HTML resultante
de la ejecución de la página ASP. Como la página resultante contiene únicamente código
HTML, es compatible con todos los navegadores. Podemos saber algo más sobre la
programación del servidor y del cliente en el artículo qué es DHTML.
El tipo de servidores que emplean este lenguaje son, evidentemente, todos aquellos que
funcionan con sistema Windows NT, aunque también se puede utilizar en un PC con windows
98 si instalamos un servidor denominado Personal Web Server. Incluso en sistemas Linux
podemos utilizar las ASP si intalamos un componente denominado Chilisoft, aunque parece
claro que será mejor trabajar sobre el servidor web para el que está pensado: Internet
Information Server.
Con las ASP podemos realizar muchos tipos de aplicaciones distintas. Nos permite acceso a
bases de datos, al sistema de archivos del servidor y en general a todos los recursos que tenga
el propio servidor. También tenemos la posibilidad de comprar componentes ActiveX
fabricados por distintas empresas de desarrollo de software que sirven para realizar múltiples
usos, como el envio de correo, generar gráficas dinámicamente, y un largo etc.
Actualmente se ha presentado ya la segunda versión de ASP, el ASP.NET, que comprende

algunas mejoras en cuanto a posibilidades del lenguaje y rapidez con la que funciona. ASP.NET
tiene algunas diferencias en cuanto a sintaxis con el ASP, de modo que se ha de tratar de
distinta manera uno de otro.
Para enterarnos bien de lo que es ASP y aprender a programar en el lenguaje disponemos de

una sección en DesarrolloWeb dedicada por entero a tratar ASP a fondo.


Qué es PHP
Es un lenguaje para programar scripts del lado del servidor, que se incrustan
dentro del código HTML. Este lenguaje es gratuito y multiplataforma.
PHP es el acrónimo de Hipertext Preprocesor. Es un lenguaje de programación del lado

del servidor gratuito e independiente de plataforma, rápido, con una gran librería de
funciones y mucha documentación.
Un lenguaje del lado del servidor es aquel que se ejecuta en el servidor web, justo antes de
que se envíe la página a través de Internet al cliente. Las páginas que se ejecutan en el servidor
pueden realizar accesos a bases de datos, conexiones en red, y otras tareas para crear la página
final que verá el cliente. El cliente solamente recibe una página con el código HTML resultante
de la ejecución de la PHP. Como la página resultante contiene únicamente código HTML, es
compatible con todos los navegadores. Podemos saber algo más sobre la programación del
servidor y del cliente en el artículo qué es DHTML.

Una vez que ya conocemos el concepto de lenguaje de programación de scripts del lado del
servidor podemos hablar de PHP. PHP se escribe dentro del código HTML, lo que lo
hace realmente fácil de utilizar, al igual que ocurre con el popular ASP de Microsoft, pero con
algunas ventajas como su gratuidad, independencia de plataforma, rapidez y seguridad.
Cualquiera puede descargar a través de la página principal de PHP www.php.net y de manera
gratuita, un módulo que hace que nuestro servidor web comprenda los scripts realizados en
este lenguaje. Es independiente de plataforma, puesto que existe un módulo de PHP para casi
cualquier servidor web. Esto hace que cualquier sistema pueda ser compatible con el lenguaje y
significa una ventaja importante, ya que permite portar el sitio desarrollado en PHP de un
sistema a otro sin prácticamente ningún trabajo.
PHP, en el caso de estar montado sobre un servidor Linux u Unix, es más rápido que ASP,
dado que se ejecuta en un único espacio de memoria y esto evita las comunicaciones entre
componentes COM que se realizan entre todas las tecnologías implicadas en una página ASP.
Por último señalábamos la seguridad, en este punto también es importante el hecho de que en
muchas ocasiones PHP se encuentra instalado sobre servidores Unix o Linux, que son de sobra
conocidos como más veloces y seguros que el sistema operativo donde se ejecuta las ASP,

Windows NT o 2000. Además, PHP permite configurar el servidor de modo que se permita o
rechacen diferentes usos, lo que puede hacer al lenguaje más o menos seguro dependiendo de
las necesidades de cada cual.
Fue creado originalmente en 1994 por Rasmus Lerdorf, pero como PHP está desarrollado
en política de código abierto, a lo largo de su historia ha tenido muchas contribuciones de
otros desarrolladores. Actualmente PHP se encuentra en su versión 4, que utiliza el motor
Zend, desarrollado con mayor meditación para cubrir las necesidades de las aplicaciones web
actuales.
Este lenguaje de programación está preparado para realizar muchos tipos de aplicaciones web
gracias a la extensa librería de funciones con la que está dotado. La librería de funciones cubre
desde cálculos matemáticos complejos hasta tratamiento de conexiones de red, por poner dos
ejemplos.
Algunas de las más importantes capacidades de PHP son: compatibilidad con las bases de
datos más comunes, como MySQL, mSQL, Oracle, Informix, y ODBC, por ejemplo. Incluye
funciones para el envío de correo electrónico, upload de archivos, crear
dinámicamente en el servidor imágenes en formato GIF, incluso animadas y una lista
interminable de utilidades adicionales.
Se puede obtener mucha más información de PHP en los diversos manuales de PHP que
hemos publicado en desarrolloweb. Manuales que atienden a los diversos niveles de cada
programdor:
Programación en PHP: Aprende PHP desde el principio con este manual que toca las
prestaciones más imprescindibles.
Programación en PHP II: Aprende a hacer una aplicación práctica en PHP. Un sistema
de postales.
Taller de PHP: otros artículos prácticos más avanzados con el lenguaje.


Qué es XML
Vemos muy rápidamente lo que es el mundo XML y algunos destellos de sus

posibilidades.
XML es una tecnología en realidad muy sencilla que tiene a su alrededor otras tecnologías que
la complementan y la hacen mucho más grande y con unas posibilidades enormes y básicas
para la sociedad de la información. Vamos a ver a lo largo de varios capítulos una introducción
al mundo XML, es decir, al lenguaje así como a las tecnologías que trabajan con él, sus usos,
ventajas y modos de llevar a cabo las tareas.
XML, con todas las tecnologías relacionadas, representa una manera distinta de hacer las
cosas, más avanzada, cuya principal novedad consiste en permitir compartir los datos con los
que se trabaja a todos los niveles, por todas las aplicaciones y soportes. Así pues, el XML juega
un papel importantísimo en este mundo actual, que tiende a la globalización y la
compatibilidad entre los sistemas, ya que es la tecnología que permitirá compartir la
información de una manera segura, fiable, fácil. Además, XML permite al programador y los
soportes dedicar sus esfuerzos a las tareas importantes cuando trabaja con los datos, ya que
algunas tareas tediosas como la validación de estos o el recorrido de las estructuras corre a
cargo del lenguaje y está especificado por el estándar, de modo que el programador no tiene
que preocuparse por ello.
Vemos que XML no está sólo, sino que hay un mundo de tecnologías alrededor de él, de
posibilidades, maneras más fáciles e interesantes de trabajar con los datos y, en definitiva, un
avance a la hora de tratar la información, que es en realidad el objetivo de la informática en
general. XML, o mejor dicho, el mundo XML no es un lenguaje, sino varios lenguajes, no es
una sintaxis, sino varias y no es una manera totalmente nueva de trabajar, sino una manera
más refinada que permitirá que todas las anteriores se puedan comunicar entre si sin
problemas, ya que los datos cobran sentido. Todo esto lo veremos con calma en la Introducción
a XML.
XML es interesante en el mundo de Internet y el e-bussiness, ya que existen muchos sistemas

distintos que tienen que comunicarse entre si, pero como se ha podido imaginar, interesa por
igual a todas las ramas de la informática y el tratamiento de datos, ya que permite muchos
avances a la hora de trabajar con ellos.
Así pues, os recomendamos seguir esta lectura en la introducción a XML. A lo largo de los
siguientes capítulos, vamos a ver algunas características importantes de la tecnología que nos
permitirán comprender mejor el mundo XML y cómo soluciona nuestros problemas a la hora
de trabajar con los datos.



Qué es VRML
VRML es un lenguaje para modelar mundos en virtuales en 3D. Conoce el

lenguaje, un poco de su historia, los materiales necesarios y algunos ejemplos.
El Virtual Reality Modeling Language es un lenguaje de modelado de mundos virtuales

en tres dimensiones. Igual que el HTML nos sirve para maquetar páginas web, VRML sirve
para crear mundos en tres dimensiones a los que accedemos utilizando nuestro navegador,
igual que si visitasemos una página web cualquiera, con la salvedad que nuestras visitas no se
limitan a ver un simple texto y fotografías, sino que nos permite ver todo tipo de objetos y
construcciones en 3D por los que podemos pasear o interactuar.
Este modo de visitar sitios en Internet es mucho más avanzado y posee grandes ventajas. Para
empezar la navegación se desarrolla de una manera mucho más intuitiva, dado que
la forma de actuar dentro del mundo virtual es similar a la de la vida real. Podemos movernos
en todas las direcciones, no solo izquierda y derecha sino también adelante, atrás, arriba y
abajo. Podemos tratar con los objetos como en la vida misma, tocarlos, arrastrarlos, etc. y en
general todo lo que podais imaginar. También los escenarios son mucho más reales,
pensemos en un ejemplo como podría ser una biblioteca virtual. En élla podríamos andar por
cada una de las salas, tomar determinados libros y leerlos.
A la larga, el acceso a Internet se ha de convertir en una experiencia mucho más cercana a la

que realizamos en la vida y las visitas a los lugares retratados en la Red serán mucho más
reales. Sin embargo, en la actualidad VRML presenta muchas limitaciones con respecto a sus
potencialidades, que se irán cubriendo con la llegada de máquinas más potentes y periféricos
avanzados para la realidad virtual como pueden ser guantes o cascos.

Un poco de historia
El VRML surgió en la primavera de 1994, durante una reunión convocada por Tim Berners-Lee
y Dave Ragget para tratar de acercar los desarrollos de realidad virtual a Internet. En esta
reunión los asistentes llegaron a la conclusión que se tenía que desarrollar un lenguaje común
para la descripción de los mundos en 3D.
De este modo, en la Primera Conferencia Mundial de la WWW en Ginebra se

aprobó el desarrollo de un nuevo lenguaje que permitiese crear mundos en tres
dimensiones a los que se pudiera acceder por la World Wide Web.
Con el tiempo se desarrolló el lenguaje dentro de varios requisitos: que fuese adaptable a la
red, que no requiriese una línea de alta velicidad (anchos de banda elevados), que fuese
multiplataforma, etc.
Materiales necesarios
Los materiales necesarios para comenzar con VRML son pocos, y posiblemente ya tengamos,
sin saberlo, todos los ingredientes para introducirnos en el desarrollo y edición de mundos
virtuales. Estos son:
Un editor de textos sencillo. El Block de notas es ideal. También valdrá cualquier

otro editor en modo ASCII. También podemos utilizar editores especializados como el
VRML PAD.
Un visualizador VRML para ver los resultados, que se instala en el navegador como
cualquier otro plug-in. Posiblemente tu navegador ya esté preparado para ver los
mundos en VRML, si no es así, tienes que instalarlo. Un visualizador muy conocido es el
Cosmo Player.
Ejemplo de VRML
El archivo que contiene el código VRML es un fichero de texto. Este deberá ser guardado con
extensión .wrl para ser reconocido por el navegador como archivo fuente de un mundo virtual.
Para su posterior visualización simplemente habrá de abrirse con el navegador. Si nuestro

visualizador se encuentra correctamente instalado se encargará de mostrar el mundo y
podremos interaccionar con el.
Podemos visitar este enlace para ver un mundo en VRML, si es que tenemos instalado el visor.
Si no es así no podremos ver el mundo virtual hasta que no lo hayamos instalado.
Ver un mundo virtual que construido para la ocasión.
Enlaces interesantes
1. Directorio VRML de nuestro buscador
2. Descripción del Cosmo Player y enlace para la descarga
3. Descripción y descarga de un editor de VRML



Qué son las cookies
Veamos que son esas pequeñas galletitas, algunos de sus usos y más cosas.
En nuestros viajes por la Red visitamos gran cantidad de páginas, muchas de ellas bastante
complicadas que implementan distintos servicios de Internet. Estas páginas tienen que
guardar distintas informaciones acerca de un usuario, por ejemplo su nombre, su edad o su
color preferido. Para ello cuentan con una serie de mecanismos en el servidor como bases de
datos u otro tipo de contenedores, pero hay un mecanismo mucho más interesante de guardar
esa información que los propios recursos del servidor, que es el propio ordenador del usuario.
En nuestros ordenadores se guardan muchos datos que necesitan conocer las páginas web cada
vez que entramos en la página, estas pequeñas informaciones son las cookies: estados de
variables que se conservan de una visita a otra en el ordenador del cliente.
Como es un poco peligroso que las páginas web a las que accedemos se dediquen a introducir
cosas en nuestro ordenador, las cookies están altamente restringidas. Para empezar,
solamente podemos guardar en ellas textos, nunca programas, imágenes, etc. Además,
los textos nunca podrán ocupar más de 1 K, de modo que nadie podría inundarnos el
ordenador a base de cookies. Estas restricciones, unidas a la necesidad de poner una fecha
de caducidad a las cookies para que estas se guarden, hacen que el aceptar cookies no
signifique un verdadero problema para la integridad de nuestros sistemas.
Ejemplos de uso de las cookies

Un ejemplo típico de las cookies podría ser un contador de las veces que accede un
usuario a una página. Podríamos poner una cookie en el ordenador del cliente donde
tendríamos una variable que lleva la cuenta de las veces que ha accedido a la página y cada vez
que se accede se incrementa en uno.
En desarrolloweb, igual que muchos otros sitios, utilizamos las cookies para guardar la
personalización de un usuario de la página. En el momento de escribir este reportaje se
puede ver en el diseño de desarrolloweb un botón que pone personalización y donde hay varios
colores. Pulsando cada color la página cambia, para verse con ese color. Para que el color
elegido se conserve de visita en visita se utilizan las cookies.
Otro ejemplo típico es el que guarda el perfil del usuario. Si el usuario accede a contenidos
determinados podemos enviarle una cookie que le marca como interesado en un tema. A
medida que va accediendo a distintos sitios le vamos encasillando como joven, adulto, hombre,
mujer, o lo que proceda. Conociendo el perfil de un usuario se le pueden ofrecer un tipo de
productos o servicios orientados a sus gustos o necesidades.
Cómo se utilizan las cookies

Para trabajar con cookies tenemos que utilizar un lenguaje de programación avanzado
como Javascript o ASP, PHP, etc. No podemos entonces trabajar con cookies si solamente
nos dedicamos a utilizar el HTML, que ya sabemos que es un poco limitado para cosas que se
salgan de mostrar contenido en páginas estáticas.
En desarrolloweb tenemos las secciones de ASP y PHP, donde puedes encontrar algunos
artículos que explican el uso de las cookies en estos lenguajes.
Polémica de las cookies

Existe un problema con estas galletitas y es que nos cortan nuestra intimidad. Lo que
señalábamos anteriormente acerca de guardar el perfil de un usuario puede llegar a ser un
problema para nosotros, por que nos están vigilando y apuntando cada uno de nuestros
movimientos, lo que puede convertirse en un abuso de información que no tiene por qué
pertenecer a nadie más que nosotros. Las empresas que más utilizan esta clasificación del
personal son los AD-Servers (servidores de banners) como el de Doubleclick. No queremos
entrar aquí más en esta polémica, pero si despertar la inquietud de que posiblemente estén
entrando en nuestra intimidad.


Qué es SQL
Qué es y para qué sirve el SQL
Las aplicaciones en red son cada día más numerosas y versátiles. En muchos casos, el esquema
básico de operación es una serie de scripts que rigen el comportamiento de una base de datos.
Debido a la diversidad de lenguajes y de bases de datos existentes, la manera de comunicar

entre unos y otras sería realmente complicada a gestionar de no ser por la existencia de
estándares que nos permiten el realizar las operaciones básicas de una forma universal.
Es de eso de lo que trata el Structured Query Language que no es mas que un lenguaje estándar
de comunicación con bases de datos. Hablamos por tanto de un lenguaje normalizado que nos
permite trabajar con cualquier tipo de lenguaje (ASP o PHP) en combinación con cualquier
tipo de base de datos (MS Access, SQL Server, MySQL...).
El hecho de que sea estándar no quiere decir que sea idéntico para cada base de datos. En
efecto, determinadas bases de datos implementan funciones específicas que no tienen
necesariamente que funcionar en otras.
Aparte de esta universalidad, el SQL posee otras dos características muy apreciadas. Por una
parte, presenta una potencia y versatilidad notables que contrasta, por otra, con su
accesibilidad de aprendizaje.
El manual de SQL de desarrolloweb pretende dar a conocer las operaciones básicas que se
pueden realizar con SQL y que tienen una aplicación directa con la creación de aplicaciones en
red sin profundizar más de lo estrictamente necesario. Buscamos con ello ofrecer al webmaster
un manual de referencia práctico y aplicado.
Este artículo es obra de Rubén Alvarez


Qué es Streaming
Descubre la tecnología que nos acerca hacia una Internet de radio y televisión.
La tecnología de streaming se utiliza para aligerar la descarga y ejecución de audio y vídeo en

la web, ya que permite escuchar y visualizar los archivos mientras se están descargando.
Si no utilizamos streaming, para mostrar un contenido multimedia en la Red, tenemos que

descargar primero el archivo entero en nuestro ordenador y más tarde ejecutarlo, para
finalmente ver y oir lo que el archivo contenía. Sin embargo, el streaming permite que esta
tarea se realice de una manera más rápida y que podamos ver y escuchar su contenido durante
la descarga.
El streaming funciona de la siguiente manera. Primero nuestro ordenador (el cliente) conecta
con el servidor y éste le empieza a mandar el fichero. El cliente comienza a recibir el fichero y
construye un buffer donde empieza a guardar la información. Cuando se ha llenado el buffer
con una pequeña parte del archivo, el cliente lo empieza a mostrar y a la vez continúa con la
descarga. El sistema está sincronizado para que el archivo se pueda ver mientras que el archivo
se descarga, de modo que cuando el archivo acaba de descargarse el fichero también ha
acabado de visualizarse. Si en algún momento la conexión sufre descensos de velocidad se
utiliza la información que hay en el buffer, de modo que se puede aguantar un poco ese
descenso. Si la comunicación se corta demasiado tiempo, el buffer se vacía y la ejecución el
archivo se cortaría también hasta que se restaurase la señal.
Programas de Streaming
En realidad, este proceso de streaming lo podemos haber visto en muchas ocasiones en
nuestros ordenadores. Es lo que hacen programas como el Real Player o el Windows Media
Player, programas que se instalan como plug-ins en los navegadores para recibir y mostrar
contenidos multimedia por streaming.
Cuando pretendemos incluir audio o video en las páginas lo mejor pues, es utilizar la
tecnología de streaming. Para ello simplemente tenemos que guardar los archivos multimedia
con el formato de uno de los programas de streaming y seguir unas pequeñas normas a la hora
de subirlos a Internet y colocarlos en la página. Las normas que seguir son propias de cada
sistema y no las veremos aquí. Lo mejor para enterarse de cómo funcionan es visitar las
correspondientes páginas web, señaladas más abajo.
Para convertir los archivos de audio y vídeo al formato de cada programa de streaming se
utilizan unos programas especiales que se pueden descargar de las páginas de cada tecnología.
Por ejemplo, el programa para convertir al formato que lee el Real Player se llama Real
Producer.

A la hora de desarrollar el web con contenidos multimedia será necesario que nos decidamos a
utilizar una tecnología de streaming en concreto y no las utilicemos todas para no obligar a
nuestros usuarios a descargarse todos los plug-ins del mercado. A continuación vemos las tres
posibles tecnologías de streaming del momento.
Real Media es posiblemente la más popular. También es la empresa con más experiencia en el
sector y desarrolla muchos productos orientados a la distribución de archivos multimedia Su
web: www.real.com
Windows Media es la apuesta de Microsoft. Ya posee una cuota de usuarios muy importante y
seguramente aumentará con rapidez ya que Microsoft incluye el plug-in en la instalación típica
de los sistemas operativos que está fabricando.
Quick Time es la tercera en discordia. Con menor cuota de mercado.
Servidores de Streaming
En principio no es necesario contar con un servidor especial para colocar archivos de audio o
vídeo con descarga streaming en nuestras webs. Cualquier servidor normal puede mandar la
información y es el cliente el que se encarga de procesarla para poder mostrarla a medida que
la va recibiendo.
Sin embargo, existen servidores especiales preparados para transmitir streaming. Aunque en
muchas ocasiones no es necesario utilizarlos nos pueden ofrecer importantes prestaciones
como mandar un archivo de mayor o menor calidad dependiendo de la velocidad de nuestra
línea.
En determinados casos, como la puesta en marcha de una radio o la transmisión de un evento

en directo, si que será imprescindible contar con un servidor de streaming al que mandaremos
la señal y con ella, la enviará a todos los clientes a medida que la va recibiendo.
Conclusión
No cabe duda que la transmisión de contenido multimedia a través de la web será cada vez más
importante. La tecnología de streaming es un mercado con futuro y grandes compañías ya
están luchando por el mercado. La velocidad de Internet aumentará con el tiempo y con ella
aumentará la calidad de las transmisiones, para hacer posible tanto la radio como la televisión
en Internet.


Que es un firewall
Un firewall es un dispositivo de seguridad, veamos exactamente lo que hace y en

que se basa su funcionamiento.
Un firewall es un dispositivo que funciona como cortafuegos entre redes, permitiendo o

denegando las transmisiones de una red a la otra. Un uso típico es situarlo entre una red local
y la red Internet, como dispositivo de seguridad para evitar que los intrusos puedan acceder a
información confidencial.
Un firewal es simplemente un filtro que controla todas las comunicaciones que pasan de una
red a la otra y en función de lo que sean permite o deniega su paso. Para permitir o denegar
una comunicación el firewal examina el tipo de servicio al que corresponde, como pueden ser
el web, el correo o el IRC. Dependiendo del servicio el firewall decide si lo permite o no.
Además, el firewall examina si la comunicación es entrante o saliente y dependiendo de su
dirección puede permitirla o no.
De este modo un firewall puede permitir desde una red local hacia Internet servicios de web,
correo y ftp, pero no a IRC que puede ser innecesario para nuestro trabajo. También podemos
configurar los accesos que se hagan desde Internet hacia la red local y podemos denegarlos
todos o permitir algunos servicios como el de la web, (si es que poseemos un servidor web y
queremos que accesible desde Internet). Dependiendo del firewall que tengamos también
podremos permitir algunos accesos a la red local desde Internet si el usuario se ha
autentificado como usuario de la red local.
Un firewall puede ser un dispositivo software o hardware, es decir, un aparatito que se conecta
entre la red y el cable de la conexión a Internet, o bien un programa que se instala en la
máquina que tiene el modem que conecta con Internet. Incluso podemos encontrar
ordenadores computadores muy potentes y con softwares específicos que lo único que hacen es
monitorizar las comunicaciones entre redes.
Si se quiere saber algo más sobre firewalls podemos examinar los enlaces que tenemos en el
área de seguridad. Es especialmente interesante este enlace:
http://www.ciudadfutura.com/mundopc/cursos/firewalls/fire1.htm


Qué es Perl
Documento introductorio al lenguaje Perl.
Perl es un lenguaje de programación muy utilizado para construir aplicaciones CGI para el
web. Perl es un acrónimo de Practical Extracting and Reporting Languaje, que viene a indicar
que se trata de un lenguaje de programación muy práctico para extraer información de
archivos de texto y generar informes a partir del contendido de los ficheros.
Es un lenguaje libre de uso, eso quiere decir que es gratuito. Antes estaba muy asociado a la
plataforma Uníx, pero en la actualidad está disponible en otros sistemas operativos como
Windows.
Perl es un lenguaje de programación interpretado, al igual que muchos otros lenguajes de

Internet como Javascript o ASP. Esto quiere decir que el código de los scripts en Perl no se
compila sino que cada vez que se quiere ejecutar se lee el código y se pone en marcha
interpretando lo que hay escrito. Además es extensible a partir de otros lenguajes, ya que desde
Perl podremos hacer llamadas a subprogramas escritos en otros lenguajes. También desde
otros lenguajes podremos ejecutar código Perl.
Perl está inspirado a partir de lenguajes como C, sh, awk y sed (algunos provenientes de los
sistemas Uníx), pero está enfocado a ser más práctico y fácil que estos últimos. Es por ello que
un programador que haya trabajado con el lenguaje C y los otros tendrá menos problemas en
entenderlo y utilizarlo rápidamente. Una diferencia fundamental de Perl con respecto a los
otros lenguajes es que no limita el tamaño de los datos con los que trabaja, el límite lo pone la
memoria que en ese momento se encuentre disponible.
Si queremos trabajar con Perl será necesario tener instalado el interprete del lenguaje. A partir
de ese momento podemos ejecutar CGIs en nuestros servidores web. El proceso para
conseguirlo puede variar de unos servidores a otros, pero se suelen colocar en un directorio
especial del servidor llamado cgi-bin donde hemos colocado los correspondientes permisos
CGI. Además, los archivos con el código también deberán tener permiso de ejecución.
Este informe se complementa con los enlaces que podéis encontrar en la sección Perl de
nuestro buscador y ocasionalmente la sección CGI.


Qué es C
Descripción del nuevo lenguaje de Microsoft C#, vinculado a la plataforma .NET.
C# es el nuevo lenguaje de propósito general orientado a objetos creado por

Microsoft para su nueva plataforma .NET.
Microsoft.NET es el conjunto de nuevas tecnologías en las que Microsoft ha estado trabajando

estos últimos años con el objetivo de mejorar tanto su sistema operativo como su modelo de
componentes (COM) para obtener una plataforma con la que sea sencillo el desarrollo de
software en forma de servicios web.
Los servicios web son un novedoso tipo de componentes software que se caracterizan a la hora
de trabajar por su total independencia respecto a su ubicación física real, la plataforma sobre la
que corre, el lenguaje de programación con el que hayan sido desarrollados o el modelo de
componentes utilizado para ello.
El acceso a estos servicios se realiza en base a estándares de Internet, como son diferentes
mecanismos del protocolo HTTP (GET y PUT) o el novedoso protocolo RPC conocido como
SOAP (Simple Access Object Protocol), que no es más que una combinación de estándares
como HTTP y XML para realizar llamadas a los miembros de estos servicios web. La idea
detrás de SOAP consiste sencillamente en utilizar HTTP como medio de transporte para el
envío de los mensajes de solicitud de ejecución de los miembros de servicios web remotos (lo
que permite atravesar barreras tales como firewalls) y utilizar XML como lenguaje con el que
escribir los cuerpos de estos mensajes.
Pero la plataforma .NET no son sólo los servicios web, sino que también ofrece numerosos
servicios a las aplicaciones que para ella se escriban, como son un recolección de basura,
independencia de la plataforma, total integración entre lenguajes (por ejemplo, es posible
escribir una clase en C# que derive de otra escrita en Visual Basic.NET que a su vez derive de
otra escrita en Cobol)
Como se deduce del párrafo anterior, es posible programar la plataforma .NET en

prácticamente cualquier lenguaje, pero Microsoft ha decidido sacar uno nuevo porque ha visto
conveniente poder disponer de un lenguaje diseñado desde 0 con vistas a ser utilizado en
.NET, un lenguaje que no cuente con elementos heredados de versiones anteriores e
innecesarios en esta plataforma y que por tanto sea lo más sencillo posible para programarla
aprovechando toda su potencia y versatilidad.
C# combina los mejores elementos de múltiples lenguajes de amplia difusión como C++, Java,
Visual Basic o Delphi. De hecho, su creador Anders Heljsberg fue también el creador de
muchos otros lenguajes y entornos como

Turbo Pascal, Delphi o Visual J++. La idea principal detrás del lenguaje es combinar la
potencia de lenguajes como C++ con la sencillez de lenguajes como Visual Basic, y que además
la migración a este lenguaje por los programadores de C/C++/Java sea lo más inmediata
posible.
Además de C#, Microsoft propociona Visual Studio.NET, la nueva versión de su entorno de

desarrollo adaptada a la plataforma .NET y que ofrece una interfaz común para trabajar de
manera cómoda y visual con cualquiera de los
lenguajes de la plataforma .NET (por defecto, C++, C#, Visual Basic.NET y JScript.NET,
aunque pueden añadirse nuevos lenguajes mediante los plugins que proporcionen sus
fabricantes).
Nota: El propio autor de este artículo ha publicado un excelente libro de C# donde se

puede ampliar toda esta información y, por supuesto, aprender el lenguaje. Consta de unas
260 páginas y ha sido escrito con la idea de que cualquiera con unos conocimientos
mínimos de programación pueda seguirlo, aunque sería recomendable que el lector
conociese C++, Java o lenguajes similares. Puede ser descargado, junto con otra
documentación, de la web del autor: http://www.josanguapo.com/.
Este artículo es obra de José Antonio González Seco


Qué es .NET
La plataforma de Microsoft orientada a la creación de software para Internet.
Microsoft.NET es el conjunto de nuevas tecnologías en las que Microsoft ha estado trabajando

durante los últimos años -y cuyo lanzamiento definitivo es
inminente, estando ya disponible su primera versión Release Candidate- con los objetivos de:
Mejorar sus sistemas operativos

Mejorar su modelo de componentes COM+
Obtener un entorno específicamente diseñado para el desarrollo y ejecución del
software en forma de servicios que puedan ser tanto publicados como accedidos a través
de Internet de forma independiente del lenguaje de programación, modelo de objetos,
sistema operativo y hardware utilizados tanto para desarrollarlos como para
publicarlos. Éste entorno es lo que se denomina la plataforma.NET, y los servicios antes
mencionados son a los que se denomina servicios web.
Para el desarrollo y ejecución de aplicaciones en este nuevo entorno tecnológico Microsoft

proporciona el conjunto de herramientas conocido .NET Framework SDK, que es posible
descargarlo gratuitamente de su sitio web
http://www.msdn.microsoft.com/net e incluye compiladores de lenguajes como C#, Visual

Basic.NET, Managed C++ y JScript.NET específicamente diseñados para crear aplicaciones
para él.
El corazón de la plataforma.NET es el CLR (Common Language Runtime), que es una

aplicación similar a un máquina virtual que se encarga de gestionar la ejecución de las
aplicaciones para ella escritas. A estas aplicaciones les ofrece numerosos servicios que facilita
su desarrollo y mantenimiento y favorecen su fiabilidad y seguridad. Entre ellos los principales
son:
Modelo de programación consistente y sencillo, completamente orientado a objetos.

Eliminación del temido problema de compatibilidad entre DLLs conocido como
"infierno de las DLLs"
Ejecución multiplataforma
Ejecución multilenguaje, hasta el punto de que es posible hacer cosas como capturar en
un programa escrito en C# una excepción escrita en Visual Basic.NET que a su vez
hereda de un tipo de excepción escrita en Cobol.NET. Aunque más arriba se ha dicho
que en el .NET Framework sólo se ofrecen compiladores de C#, MC++, VB.NET y
JScript.NET, lo cierto es que aparte Microsoft y terceros han -o están- desarrollado
versiones adaptadas a .NET de muchísimos otros lenguajes como APL, CAML, Cobol,
Eiffel, Fortran, Haskell, Java, Mercury, ML, Mondrian, Oberon, Oz, Pascal, Perl,

Python, RPG, Scheme o Smalltalk

Recolección de basura
Aislamente de memoria entre procesos y comprobaciones automáticas de seguridad de
tipos en las conversiones
Soporte multihilo
Gestión del acceso a objetos remotos que permite el desarrollo de aplicaciones
distribuidas de manera transparente a la ubicación real de cada uno de los objetos
utilizados en las mismas.
Seguridad avanzada, hasta el punto de que es posible limitar los permisos de ejecución
del código en función de su procedencia (Internet, red local, CD-ROM, etc.), el usuario
que lo ejecuta o la empresa que lo creó
Interoperabilidad con código preexistente, de manera que es posible utilizar con
facilidad cualquier librería de funciones u objetos COM y COM+ creados con
anterioridad a la aparición de la plataforma .NET
Adecuación automática de la eficiencia de las aplicaciones a las caracterísitcas concretas
de cada máquina donde se vaya a ejecutar
Nota: El propio autor de este artículo ha publicado un excelente libro donde podremos
encontrar una descripción de .NET mucho más amplia. El libro en concreto trata sobre el
lenguaje C#, desarrollado específicamente para la plataforma .NET.Puede ser descargado,
junto con otra documentación, de la web del autor: http://www.josanguapo.com/.
Este artículo es obra de José Antonio González Seco


Qué es JSP
La tecnología Java para la creación de páginas web con programación en el

servidor.
JSP es un acrónimo de Java Server Pages, que en castellano vendría a decir algo como Páginas
de Servidor Java. Es, pues, una tecnología orientada a crear páginas web con programación en
Java.
Con JSP podemos crear aplicaciones web que se ejecuten en variados servidores web, de
múltiples plataformas, ya que Java es en esencia un lenguaje multiplataforma. Las páginas JSP
están compuestas de código HTML/XML mezclado con etiquetas especiales para programar
scripts de servidor en sintaxis Java. Por tanto, las JSP podremos escribirlas con nuestro editor
HTML/XML habitual.
Motor JSP
El motor de las páginas JSP está basado en los servlets de Java -programas en Java destinados
a ejecutarse en el servidor-, aunque el número de desarrolladores que pueden afrontar la
programación de JSP es mucho mayor, dado que resulta mucho más sencillo aprender que los
servlets.
En JSP creamos páginas de manera parecida a como se crean en ASP o PHP -otras dos
tecnologías de servidor-. Generamos archivos con extensión .jsp que incluyen, dentro de la
estructura de etiquetas HTML, las sentencias Java a ejecutar en el servidor. Antes de que sean
funcionales los archivos, el motor JSP lleva a cabo una fase de traducción de esa página en un
servlet, implementado en un archivo class (Byte codes de Java). Esta fase de traducción se
lleva a cabo habitualmente cuando se recibe la primera solicitud de la página .jsp, aunque
existe la opción de precompilar en código para evitar ese tiempo de espera la primera vez que
un cliente solicita la página.
Ejemplo de página JSP

En la imagen siguiente se puede ver un ejemplo extremadamente simple de una página JSP y
el esquema de conversión de esa página en un servlet.

Prerequisitos
Para aprender JSP, aparte de conocer HTML, será necesario comprender y tener algo de
experiencia en la programación en Java, que es un lenguaje de programación Orientado a
Objetos por completo. Una vez conocida la programación en Java se puede estudiar por
encima el sistema de Servlets, lo que nos dará una mejor idea del funcionamiento interno del
motor JSP.
Para aprender Java podemos consultar algunos enlaces del correspondiente directorio de
nuestro buscador de enlaces.
Además, necesitaremos descargar e instalar Tomcat, el contenedor de servlets usado en la

referencia oficial de implementación de JSP. Podemos acceder a un ejercicio para aprender a
realizar esta instalación, disponible también en la referencia de aprendizaje de la página de
Java.
Referencias JSP
Hemos creado una nueva sección en nuestro directorio dedicada por completo a las páginas
JSP, que será muy interesante para todo aquel que desee profundizar en el tema.
Nota: Esta descripción de JSP está extraída de un PDF en inglés muy completo que
introduce la tecnología, que se puede encontrar el la página corporativa de Java de Sun
Microsystems, en su sección de aprendizaje online. A su vez, dicho manual proviene del
portal Java jGuru.
jGuru: Introduction to JavaServer Pages technology



Qué es Oracle
Oracle es una potente herramienta cliente/servidor para la gestión de Bases de

Datos. Explicamos la herramienta y las ayudas que ofrece al desarrollador.

http://desarrolloweb.com/articulos/15.php
Oracle es básicamente una herramienta cliente/servidor para la gestión de Bases de Datos. Es

un producto vendido a nivel mundial, aunque la gran potencia que tiene y su elevado precio
hace que sólo se vea en empresas muy grandes y multinacionales, por norma general. En el
desarrollo de páginas web pasa lo mismo: como es un sistema muy caro no está tan extendido
como otras bases de datos, por ejemplo, Access, MySQL, SQL Server, etc.
Vamos ahora en centrarnos en que es Oracle exactamente y como funciona la programación

sobre éste. Oracle como antes he mencionado se basa en la tecnología cliente/servidor, pues
bien, para su utilización primero sería necesario la instalación de la herramienta servidor
(Oracle 8i) y posteriormente podríamos atacar a la base de datos desde otros equipos con
herramientas de desarrollo como Oracle Designer y Oracle Developer, que son las
herramientas básicas de programación sobre Oracle.
Para desarrollar en Oracle utilizamos PL/SQL un lenguaje de 5ª generación, bastante potente

para tratar y gestionar la base de datos, también por norma general se suele utilizar SQL al
crear un formulario.
Nota: Podemos aprender qué es el lenguaje SQL en un artículo de DesarrolloWeb.com.

Además, existe un manual de SQL para el que desee profundizar.
Es posible lógicamente atacar a la base de datos a través del SQL plus incorporado en el
paquete de programas Oracle para poder realizar consultas, utilizando el lenguaje SQL.
El Developer es una herramienta que nos permite crear formularios en local, es decir,
mediante esta herramienta nosotros podemos crear formularios, compilarlos y ejecutarlos,

pero si queremos que los otros trabajen sobre este formulario deberemos copiarlo
regularmente en una carpeta compartida para todos, de modo que, cuando quieran realizar un
cambio, deberán copiarlo de dicha carpeta y luego volverlo a subir a la carpeta. Este sistema
como podemos observar es bastante engorroso y poco fiable pues es bastante normal que las
versiones se pierdan y se machaquen con frecuencia. La principal ventaja de esta herramienta
es que es bastante intuitiva y dispone de un modo que nos permite componer el formulario, tal
y como lo haríamos en Visual Basic o en Visual C, esto es muy de agradecer.
Los problemas anteriores quedan totalmente resueltos con Designer que es una herramienta
que se conecta a la base de datos y por tanto creamos los formularios en ella, de esta manera
todo el mundo se conecta mediante Designer a la aplicación que contiene todos los formularios
y no hay problemas de diferentes versiones, esto es muy útil y perfecto para evitar machacar el
trabajo de otros. Pero el principal y más notable problema es la falta de un entorno visual para
diseñar el formulario, es decir, nos aparece una estructura como de árbol en la cual insertamos
un formulario, a la vez dentro de éste insertamos bloques o módulos que son las estructuras
que contendrán los elementos del formularios, que pueden estar basados en tablas o no.
Por lo tanto si queremos hacer formularios para practicar o para probar qué es esto de Oracle,
os recomiendo que uséis Developer pues es mucho más fácil e intuitivo al principio.
Este artículo es obra de David Masip


Qué es Fortran
Fortran es el primer lenguaje de alto nivel que salió al mercado. Ya que sigue
siendo útil en Física, vamos a estudiarlo.
Un poco de historia
Este lenguaje procedural fue el primero de alto nivel (1957).
Desarrollado por IBM para el IBM 704.
Orientado a la eficiencia en la ejecución.
Se creó la definición estándar del lenguaje en el 66.
Otras versiones son FORTRAN 77 y FORTRAN 90
Un sencillo ejemplo
Características
Tipos de datos soportados:
Numéricos (enteros, reales, complejos y doble precisión).

Boleanos (logical).
Arreglos.
Cadenas de caracteres.

Archivos.
FORTRAN 90 ya es estructurado, y no requiere sentencias GOTO. Sólo admite dos ámbitos

para las variables: local y global.
Veamos ahora un ejemplo más extenso:
Variables y constantes
FORTRAN no es sensible a mayúsculas y minúsculas. Los nombre de variables tienen

de 6 a 31 caracteres máximo y deben comenzar por una letra. Los blancos son
significativos.
Declaración explicita de variables.
Enteras (I-N), el resto reales. (se modifica con IMPLICIT).
Punteros: en los primeros FORTRAN no hay punteros y todas las variables se
almacenan en memoria estática. En FORTRAN 90 se declaran INTEGER, POINTER::P.
Para memoria dinámica ALLOCATE y DEALLOCATE
Tipos de datos
Arrays, pueden tener hasta 7 dimensiones y se guardan por colummnas.

REAL M(20),N(-5:5)
DIMENSION I(20,20) (tipo por nomenclatura implícita)
Cadenas de caracteres, el primer carácter es el 1, el operador // permite concatenar
cadenas.
CHARACTER S10, T25
Almacenamiento de datos. Se usa COMMON para datos compartidos y EQUIVALENCE
cuando almacenamos una variable con dos posibles tipos en la misma posición de
memoria (como union en C). Se usa DATA para inicializar datos estáticos.
DATA X/1.0/,Y/3.1416/,K/20/
Tipos definidos por el usuario, con TYPE <nombre>... END TYPE <nombre>
Control de secuencia
El conjunto de estructuras de control es limitado:
Expresiones, prioridad de operadores
Enunciados
Asignación, cuando se hace entre cadenas hay ajuste de tamaño con blancos o
truncamiento.
Condicional. Permite IF ELSE IF... Para selección múltiple SELECT CASE

CASE.....CASE DEFAULT.... END SELECT
Iteración. DO....END DO
Nulo, se usa solo para la etiqueta. CONTINUE.
Control de subprogramas. CALL invoca al subprograma y RETURN devuelve un valor al

programa llamante.
Construcciones propensas a error: GOTO.
Entrada y salida
Tipos de archivos:
Secuenciales
De acceso directo
Comandos: READ, WRITE, PRINT, OPEN , CLASE, INQUIRE (propiedades o estado

del archivo) REWIND y ENDFILE (para ubicar el puntero del fichero).
Para el tratamiento de excepciones en las sentencias READ/WRITE se puede introducir

la posición de la rutina de dicho tratamiento (ERR=90).
Subprogramas

Hay tres tipos de subprogramas:
Function, devuelven un solo valor de tipo numérico, lógico o cadena de caracteres.
Subroutine, devuelve valores a través de variables no locales COMMON.
Función de enunciado, permite calcular una sola expresión aritmética o lógica.
FN(X,Y)=SIN(X)2-COS(Y)2
Gestión de almacenamiento.
Las variables son locales o globales (COMMON)
Recursividad: RECURSIVE FUNCTION FACTORIAL(X)

Parámetros de subprograma. Paso por referencia.
Abstracción y encapsulación. Evaluación del lenguaje
La abstracción es posible mediante los subprogramas y el uso de variables COMMON,

aunque su uso es propenso a errores.
FORTRAN sigue siendo utilizado en el ámbito científico y es muy eficiente realizando
cálculos.
La estructura del programa suele ser dificil de entender.
En FORTRAN 90 se incluye la recursividad y la memoria dinámica.
Las etiquetas de las sentencias ya no son necesarias, ni el GOTO, pues se ha
transformado en un lenguaje estructurado.
El aspecto de los programas sigue siendo de procesamiento por lotes
Este artículo es obra de Guillermo Aedo Contreras


Qué es Lisp
Vamos a ver un tipo de lenguaje funcional que es muy útil en el campo de la

Inteligencia Artificial: Lisp.
Un poco de historia
60. McCarthy en el MIT.
Muy usado en IA.
En LISP la recursión se emplea a menudo como estructura de control, lo que resta
eficiencia a las ejecuciones.
Las últimas versiones de LISP incluyen un recolector de basura.
Un ejemplo sencillo
Perspectiva del lenguaje

Interactivo (usualmente)
Los datos en LISP son muy restringidos:
Átomos literales (símbolos)

Átomos numéricos
La estructura de datos básica es la lista. Incluye primitivas para su manipulación.
Los comentarios comienzan por ‘;’
Los parámetros de función van todos por valor o por referencia según la clasificación de
la función.
LISP es interpretado y usa una estructura de gestión de almacenamiento en montículo
con recolección de basura como almacenamiento primario para datos y programas.
Un ejemplo más extenso
Objetos de datos
Tipos de datos primitivos: átomos. Cada átomo tiene una lista de propiedades asociada,
accesible a través del puntero que almacena el nombre del átomo.
Tipos de datos estructurado: listas. Tienen asociado un puntero al primer elemento

(car) y otro al elemento siguiente (cdr). Una lista vacía apunta a nil. Para la asignación
se utiliza setq(x val).
Representación y almacenamiento.
Cada descriptor de un objeto de datos proporciona tipo y atributos.
En los datos estructurados (listas) se tienen sólo punteros a primero y a
siguiente.

El traductor LISP es una función read() que toma el fuente del fichero y lo interpreta.
La ejecución del programa consiste en la evaluación de las funciones contenidas en el
mismo.
Expresiones:
Condicional
Operaciones sobre átomos (en preorden): +, -, *, /
Operaciones sobre listas: cons, car, cdr, list, replace, null, equal.
Operaciones sobre propiedades: put, get.
Enunciados: prog() para ejecución secuencial.
Entrada y salida: open(), read(), print().
Definición de funciones: defun, define.
Gestión de subprogramas
Tres clases de funciones:
Función interpretada, en forma de estructura de listas. Primitivas eval y apply.
Función compilada, compiladas en un bloque de código máquina que puede ser
ejecutado por el interprete del hardware.
Macro, se declara con define. Es simplemente una función ordinaria en LISP.
Puede ser interpretada y compilada.
Gestión de almacenamiento
La memoria se estructura en forma de montículo, que maneja unidades de una palabra
de tamaño fijo usando una lista de espacios libres y un recolector de basura.
Entorno de referencia:
Local, es el que se da en las listas, como asociaciones de átomos relacionados de
una determinada manera.
Global o común, se consigue mediante asociación de un átomo con una
propiedad del mismo que contiene un puntero al datos referenciado. Se usa set y
setq.
Paso de parámetros:
Transmisión por valor, consiste en evaluar las expresiones de una lista de
parámetros y transmitir los valores resultantes.
Transmisión por nombre, transmitir las expresiones de la lista de parámetros sin
evaluar, y dejar que la función llamada los evalue usando eval. En funciones
macro la transmisión por nombre es la norma. Para funciones lambda se puede
especificar la transmisión por nombre usando nlambda, en lugar de lambda.
Funciones en Lisp
Funciones normales, son las que se suelen incluir en las implementaciones de LISP (ver
manual en cada caso).
Funciones de lista, para manipulación de listas:
car L, devuelve el primer elemento de L.
cdr L, devuelve la cola (lista - primero).
cons x y, devuelve uan lista formada por x e y.
list x y z, devuelve la lista (x y z).

quote x, no se evalúa x.
Predicados
atom x, devuelve True si x es un átomo.
numberp x, devuelve True si x es un número.
greaterp x y, devuelve True si x>y.
lessp x y, devuelve True si x<y.
null x, devuelve True si x es nulo.
and x y, devuelve x and y.
or x y, devuelve x or y.
not x, devuelve not x.
eq x y, devuelve True si x=y.
Funciones aritméticas:
+, -, *, y /.
rem x y, devuelve el módulo x/y (remainder).
Funciones de entrada y salida
load nombrearchivo, lee el archivo a memoria.
print x, imprime el elemento x.
open nombrearchivo, abre un archivo y devuelve una puntero al mismo.
read, lee del terminal un átomo.
help, proporciona ayuda.
trace, traza la función.
bye, termina LISP.
Abstracción y encapsulamiento
LISP, en origen, no incluye características de abstracción de datos.
CLOS fue una ampliación de LISP con orientación de objetos. Características:
Herencia múltiple.
Funciones genéricas.
Metaclases y metaobjetos.
Técnica de creación e inicialización de objetos que permite control del proceso
por parte del usuario.
Evaluación del lenguaje

LISP ha evolucionado durante más de 30 años y desarrollado para inteligencia artificial,
pero no es adecuado para aplicaciones convencionales.
Las versiones compiladas son algo más eficientes.


Qué es Prolog
Estudiaremos un caso de lenguaje orientado a la programación lógica (cálculo de

predicados): Prolog.
PROLOG está orientado a la resolución de problemas mediante el cálculo de

predicados, basado en:
Preguntas a la base de datos.
Pruebas matemáticas.
El programa PROLOG especifíca cómo debe ser la solución, en vez de dar el algoritmo
para su resolución. La solución se obtiene mediante búsqueda aplicando la lógica de
predicados.
Historia
Coulmerauer (1970) desarrolló un lenguaje para hacer deducciones de texto.
Se aplica un mecanismo de resolución sobre predicados especiales, cláusulas de Horn,
llamado unificación.
La difusión del lenguaje se produce en los 80, pero de forma muy limitada debido a la
falta de aplicaciones en dicho lenguaje.
Un ejemplo sencillo
Perspectiva del lenguaje

El programa prolog se compone de unos hechos (datos) y un conjunto de reglas, es

decir, relaciones entre objetos de la base de datos.

La ejecución del programa cargado en memoria consiste en realizar una pregunta de
forma interactiva: el interprete generará por inferencia los resultados que se deducen a
partir del contenido de la base de datos.
PROLOG tiene una sintaxis y semántica simples. Sólo busca relaciones entre los objetos
creados, las variables y las listas, que son sus estructuras básicas.
Comentarios entre / /
Un ejemplo más extenso
Objetos de datos
Tipos de datos primitivos: variables y constantes:
Enteros
Reales
CaracteresLos identificadores con minúscula representan hechos, los que van

con mayúscula variables. El alcance de una variable es la regla donde aparece.

Tipos de datos estructurados:
Átomos: constantes y variables de cadena.
Listas, representadas entre [ ].
Tipos definidos por el usuario. Las reglas para definir relaciones pueden actuar como
tipos de usuario.
Representación de almacenamiento
Las reglas y hechos son almacenadas en memoria como listas enlazadas.
La ejecución de prolog consiste en una búsqueda en profundidad de un árbol
conteniendo todas las posibles soluciones. Para cada una de ellas se evaluará su
corrección. La búsqueda se puede hacer más eficiente mediante la poda del árbol de
búsqueda (corte).
El orden de evaluación es secuencial.
Expresiones, operaciones aritméticas y operadores relacionales. Not().

Enunciados
Hechos, relaciones que se expresan en una consulta. Son tuplas con un nombre
de predicado y unos argumentos.
Reglas, implicaiones que se expresan en una operación consult.
Preguntas, sucesión de términos que finalizan con un punto.
Cortes, (!), fuerza el retroceso en la búsqueda. Esto puede impedir que se
encuentren ciertas soluciones, pero puede hacer más eficiente la búsqueda.
Entrada y salida, nl y write.
Subprogramas y gestión de almacenamiento

PROLOG tiene dos modos:
Modo consulta, se introducen nuevas relaciones (hechos) en el almacenamiento
dinámico de la base de datos.
Modos pregunta, se ejecuta un intérprete basado en pilas para evaluar las
preguntas del usuario.
Alcance de las variables:
Ambiente local de referencia, todas las variables son locales a la regla en que
están definidas. La unificación hace interaccionar nombres locales de una regla
con los de otras reglas.
Ambiente común de referencia, todos los datos son compartidos.
Paso de parámetros, la unificación proporciona el paso de parámetros entre
reglas.
Funciones normales, van integradas en el lenguaje:
Consult(nommbrearchivo)
Fail, siempre fracasa.
See(nombrearchivo), lee las entradas de un archivo y las incorpora al conjunto
de reglas.

Write(término).
Tell(término), reorienta la salida del write al archivo.
Told, cierra el archivo anterior.
Nl, salto de línea.
Atom(X), devuleve cierto si X es un átomo.
Var(X), devuelve cierto si X es una variable.
Integer(X), devuelve cierto si X es un entero.
Trace, activa la depuración del programa.
Abstracción y encapsulamiento
PROLOG no proporciona estas capacidades.
Evaluación del lenguaje

PROLOG va bien para problemas de relaciones, p.e. Tratamiento del lenguaje natural, y
consulta de bases de datos.
A pesar de que es posible desarrollar programas sin especificar el algoritmo de
resolución a veces hay que echar mano de otro tipo de programación para hacer los
programas más eficientes, y a menudo se emplea el corte para limitar el espacio de
búsqueda.


Qué es la Interacción Persona-Ordenador
La Interacción Persona-Ordenador, es la disciplina que estudia el intercambio de

información entre las personas y los ordenadores. Su objetivo es que este
intercambio sea más eficiente: minimiza los errores, incrementa la satisfacción...
La investigación en IPO/HCI lleva a la estandarización de la usabilidad, su mejora y apoyo

empírico. El enfoque científico de la IPO/HCI incluye una variedad de herramientas y técnicas
que ayudan a desarrollar mejores interfaces de usuario.
Nota: La Interacción Persona Ordenador es más conocida por su nombre en inglés,

Human-Computer Interaction y sus siglas HCI (en lo sucesivo utilizaremos las siglas
IPO/HCI).
Breve historia
Los orígenes de la IPO/HCI hay que buscarlas en la rama de la Psicología Aplicada que estudia
la Interacción Persona-Ordenador. Las dos disciplinas de las que surge la IPO/HCI son las
llamadas "Human Factors" y la Ergonomía (en realidad es la misma disciplina, el primer
termino se utiliza en EE.UU y el segundo en Europa). Actualmente el uso de estos términos no
esta claramente establecido y incluso a veces se utilizan de manera indistinta.
El predominio tradicional en la IPO/HCI ha sido de los ingenieros, aunque la influencia de la

psicología es creciente. La Psicología es la disciplina que estudia la percepción, la memoria, la
adquisición de habilidades y el aprendizaje, la resolución de problemas, el movimiento, las
tareas de juicio, de búsqueda o procesamiento de información y de la comunicación, es decir,
procesos todos cuyo conocimiento se requiere para el adecuado diseño de mecanismos de
interacción del usuario. Aunque la Psicología Cognitiva es una ciencia muy joven en lo que
respecta a investigaciones de carácter básico y sistemático, existen actualmente suficientes
hallazgos basados en resultados empíricos que permiten el desarrollo de la IPO/HCI y, por
ende, de sitios web adaptados a los usuarios.
La IPO/HCI es también una disciplina joven, pero no tanto como pudiera parecer. Desde el
primer ordenador ha sido necesario el diseño de un sistema de comunicación persona-
ordenador. Los estudios en esta disciplina han permitido dar una base teórica al diseño y a la
evaluación de aplicaciones informáticas. La importancia de esta disciplina se pone sobre
relieve al leer artículos sobre el tema escritos hace cuarenta años en los que se predecían
elementos de interacción de los que se dispone actualmente. Una de las asociaciones más
influyentes en este campo es la ACM SIGCHI (Association for Computing Machinery's Special
Interest Group on Computer-Human Interaction) que desde 1982 reune a los mejores

especialistas en IPO/HCI.
Los primeros estudios específicos de IPO/HCI aparecieron en los años sesenta y se referían a la
simbiosis Persona-Ordenador (Licklider, 1960). Este autor afirmó anticipándose a la
problemática posterior que el problema de la interacción hombre-ordenador no es crear
ordenadores productores de respuestas, sino ordenadores que sean capaces de anticipar y
participar en la formulación de las preguntas.
Licklider y Clark(1962) elaboraron una lista de 10 problemas que deberían ser resueltos
para facilitar la interacción personas-ordenador. Según el los cinco primeros problemas
deberían ser resueltos de manera inmediata, el sexto en un tiempo intermedio y los cuatro
últimos, a largo plazo:
1. Compartir el tiempo de uso de los ordenadores entre muchos usuarios.

2. Un sistema de entrada-salida para la comunicación mediante datos simbólicos y
gráficos.
3. Un sistema interactivo de proceso de las operaciones en tiempo real.
4. Sistemas para el almacenamiento masivo de información que permitan su rápida
recuperación.
5. Sistemas que faciliten la cooperación entre personas en el diseño y programación de
grandes sistemas.
6. Reconocimiento por parte de los ordenadores de la voz, de la escritura manual impresa
y de la introducción de datos a partir de escritura manual directa.
7. Comprensión del lenguaje natural, sintáctica y semánticamente.
8. Reconocimiento de la voz de varios usuarios por el ordenador.
9. Descubrimiento, desarrollo y simplificación de una teoría de algoritmos.
10. Programación heurística o a través de principios generales.
El tiempo ha demostrado que Licklider y Clark estaban en lo cierto en la mayoría de sus

observaciones, sin embargo, actualmente aún no se han conseguido solucionar algunos de los
problemás previstos para su resolución a largo plazo.
Hansen (1971) en su libro "User Engineering Principles for Interactive Systems" hace la
primera enumeración de principios para el diseño de sistemas interactivos:
1. Conocer al usuario
2. Minimizar la memorización, sustituyendo la entrada de datos por la selección de ítems,
usando nombres en lugar de números, asegurándose un comportamiento predecible y
proveyendo acceso rápido a información práctica del sistema.
3. Optimizar las operaciones mediante la rápida ejecución de operaciones comunes, la
consistencia de la interfaz y organizando y reorganizando la estructura de la
información basándose en la observación del uso del sistema.
4. Facilitar buenos mensajes de error, crear diseños que eviten los errores más comunes,
haciendo posible deshacer acciones realizadas y garantizar la integridad del sistema en
caso de un fallo de software o hardware.
A pesar de la obviedad y antigüedad de estos principios es fácil encontrar en sitios web de

comercio electrónico códigos inmemorizables para identificar productos, mensajes de error
ininteligibles y, en general, un maltrato constante al usuario.

Este artículo es obra de Eduardo Manchón


Qué es el formato PDF
Veremos qué es PDF, un poco de historia y lo que necesitamos para leer este
formato.
Historia del PDF

Hace unos años, mucha de la documentación que se servía en soporte digital, generalmente
almacenada en diskettes o CD-ROM's, tenía formato de texto plano y más adelante en archivos
de Microsoft Word que, sin duda muchos
usuarios han pasado por ello, no era siempre posible abrir si no se disponía de la versión más
reciente de este popular procesador de textos. Luego estos formatos y algunos otros también
bastante extendidos han ido cediendo terreno a dos tipos de documentos que poseen grandes
ventajas:
HTML, lenguaje en el que se elaboran la mayoría de páginas Web accesibles desde

Internet.
PDF, estándar para libros electrónicos con grandes capacidades de presentación.
Ambos formatos, especialmente el segundo, poseen la enorme ventaja frente a muchos otros
que han de poder visualizarse con iguales o muy similares resultados independientemente del
programa o versión del mismo que se
utilice para interpretarlos, amén de permitir crear documentos muy atractivos a la vista y nada
complejos de manipular o gestionar internamente por los equipos que los carguen.
¿Qué es PDF?
PDF es un formato portátil para documentos (Portable Document Format) desarrollado por
Adobe Systems y muy usado en Internet debido a su versatilidad, facilidad de uso y tamaño
pequeño.
Según se pregona extensamente en la Red, el formato de archivo PDF se ha convertido en el

estándar para la distribución de documentación, tanto en intranets empresariales como en la
Web, y parece igualmente un correcto
método de distribución de archivos en pre-impresión, son muy populares en la red por varias
razones:
Un documento PDF tiene la misma apariencia, color, tipo de imprenta, gráficos y

formato que un documento impreso.
Los archivos PDF se pueden ver utilizando el navegador mismo o se pueden almacenar

en la computadora para uso o impresión posterior.

El programa Lector Acrobat (Acrobat Reader) se puede obtener gratis para la mayoría
de los sistemas operativos.
Si bien el programa Acrobat Reader no se puede usar para editar (modificar) un
documento PDF, permite copiar texto del documento a otro archivo, y también efectuar
búsquedas para localizar una palabra o texto.
Pueden distribuirse por toda la Web, o mediante e-mails, o estar en CDs; pero este tipo
de archivos es muy utilizado a la hora de compartir información gráfica o de texto, como
por ejemplo, contratos, manuales, y hasta e-books.
Requisitos de lectura
Para presentar documentos PDF en la pantalla se necesita un programa de lectura de archivos
PDF, como por ejemplo Acrobat Reader o Acrobat Exchange, provistos por Adobe Systems
Incorporated.
El programa Acrobat Reader se puede descargar e instalar sin cargo haciendo click aquí o en la
siguiente dirección: http://www.adobe.com/products/acrobat/readstep2.html.
Para evitar problemas, actualice su navegador y programa de lectura de documentos PDF con
la versión más moderna disponible.
Nota: Tenemos varios artículos referentes al formato PDF en DesarrolloWeb.com:
Podemos ver en la sección de programas algunas descripciones de software útil

para el trabajo con PDF. También podemos encontrar descripciones de programas
en el artículo PDF para todos.
Tenemos una descripción sobre cómo generar PDF desde PHP.
También otros artículos variados como una descripción de las ventajas e
inconvenientes del formato y su uso en la web.
Este artículo es obra de Luciano Salvino


La filosofía Basecamp y Ruby on Rails
la apuesta del 2005. Si un lenguaje de programación está haciendo ruido en este

momento es Ruby. Gracias a Basecamp y su filosofía, se ha convertido en algo
más que un lenguaje: un estilo de vida.
37signals es una de las empresas referencia en el Diseño Centrado en el Usuario.
En el año 2003 lanzan su servicio de pago Basecamp dedicado a la gestión de proyectos.
En principio destinado a la gestión de proyectos relacionados con el desarrollo web para

empresas está terminando por abrir una línea para particulares: ¡los hay que hasta gestionan
su boda con una nueva versión Light del servicio!
Su diseño planteado desde el interfaz (es decir, se ha planteado la aplicación desde la

mismísima perspectiva del usuario), su funcionalidad avanzada y sencilla a la vez y el guiño a
la comunidad weblogger con RSS como sistema para estar al día de las novedades en el avance
de los proyectos convierten a Basecamp en un hito en el diseño de aplicaciones web que goza
de gran simpatía.
Además, desde un punto de vista estético, el diseño es limpio, atractivo y "personalizable".
La construcción del interfaz se basa en estándares XHTML, CSS.
¿Qué has hecho hoy por mejorar el mundo?: El manifiesto Basecamp

Basecamp es una filosofía de trabajo que busca mejorar la calidad de vida de los profesionales
y el resultado de su trabajo: las aplicaciones.
Como guía han publicado su manifiesto que muchos profesionales del sector suscribirían: "la
gestión de proyectos se basa en la comunicación", "el interfaz es el producto" entre otras
afirmaciones.
Y es que no tener en cuenta estas cosas unidas a un entorno de desarrollo pesado y complicado
lento amargan la vida de muchos programadores y además da como resultado aplicaciones
costosas y pésimas!
Basecamp por dentro: Ruby on Rails

La plataforma sobre la que corre Basecamp es Open Source, utiliza un lenguaje de
programación de nombre desconocido para muchas personas: Ruby.
El Framework de desarrollo que ha nacido de la unión de Ruby y Basecamp, se denomina

Rails. Facilita la creación y el mantenimiento de aplicaciones con un ahorro de trabajo

impensable en otros entornos.
El carácter emblemático para gestores, diseñadores y desarrolladores de Basecamp ha

despertado la curiosidad de muchas personas. Ruby on Rails, nombre por el que se conoce a
este entorno, inicia su arranque con fuerza.
Y a la vera de Ruby on Rails aparece un servicio de hosting especializado como Textdrive,

aparte de en “los clásicos” como PHP o Perl, en ofrecer el framework Rails.
¿Qué es Ruby?
Es un lenguaje de programación orientado a objetos, multiplataforma y Open Source, creado
en 1995 por Yukihiro Matsumoto, en Japón, donde este lenguaje es sumamente popular.
Su objetivo: simplificar la vida de los programadores mediante un lenguaje sencillo de

aprender y utilizar. Menos código, menos errores, mayor facilidad de mantenimiento, sin
necesidad de compilación.
El resultado: el tiempo se dedica a construir aplicaciones de manera eficiente, no a luchar con

entornos o errores ingestionables.
Hasta la fecha, Ruby ha evolucionado gracias a los esfuerzos de la comunidad y a su generosa

participación en foros, listas de distribución y canales de Chat en IRC.
¿Qué es Rails?
Rails es el framework o entorno de trabajo, también Open Source y multiplataforma
desarrollado por David Heinemeier Hansson que facilita el diseño y desarrollo de aplicaciones
web basadas en Ruby separando automáticamente en 3 capas todos los componentes de la
aplicación (Model, View y Control. MVC). Ello hace más sencillo y rápido el mantenimiento de
las aplicaciones que en otros entornos como Java.
En Ruby on Rails se puede encontrar abundante documentación mantenida libremente por

miembros de la comunidad a través de weblogs y wikis.
Lista de correo.
Rails también está bajo 43things, un gestor de to-dos vitales
y tras el nuevo diseño de 43things, están los 37signals.
Ruby on Rails en España

Hasta la fecha, en España, pocas personas se dedican "públicamente" a Ruby.
Manuel González Noriega, de Simplelógica, ha creado la primera lista de distribución de Ruby

en castellano. Una comunidad efervescente que va ganando adeptos.

Un poco más sobre Ruby on Rails

Mis primeros pasos con Ruby on Rails
Personas usando Ruby on Rails
Conmovedora Guía a Ruby (Chunky Bacon!)
Ruby on Rails Howtos
"The Building of Basecamp" Review
Este artículo es obra de Luis Villa


¿Qué es Telnet y SSH?
Qué es este protocolo de red y para qué puede servir hacer telnet a un webmaster.
Qué es este protocolo de red y para qué puede servir hacer telnet a un webmaster. Descripción
del protocolo SSH, para conectarse a una máquina de manera segura.
Telnet es un protocolo de red, utilizado en Internet para acceder remotamente a una máquina
o servidor. Telnet es un protocolo que permite acceder a la línea de comandos del servidor,
para realizar cualquier tipo de administración del sistema, típicamente Linux o Unix. Telnet
suele escuchar el puerto 23.
Para acceder por telnet a un servidor necesitas que ese servidor de soporte a telnet y además
tener una cuenta de usuario en la máquina a la que te conectas.
Existen diversos programas cliente que podemos utilizar para hacer telnet. Uno muy popular
es Putty.
Nota: Telnet es un protocolo poco seguro, por eso casi se ha dejado de usar. Ahora lo típico
es utilizar SSH que es otro protocolo muy similar, aunque con mejoras de seguridad
sustanciales. Mirar más abajo en este artículo.
De cara a un webmaster habría que decir que telnet serviría para conectarse con un servidor
web, que puede estar en un centro de datos lejos de nuestra oficina, como si estuviéramos
trabajando in situ, es decir, delante de él. Una vez dentro del ordenador, se pueden realizar
cualquier tipo de acciones de configuración remotamente, como acceder al sistema de ficheros
o configurar cualquier asunto del servidor, como el servidor web, el correo, php, tareas de
planificación diaria, etc.
Generalmente cuando se contrata un alojamiento básico no se dispone de acceso telnet, ya que

los alojamientos normales se ofrecen en máquinas compartidas por muchos otros dominios.
Con telnet podríamos configurar cualquier cosa del servidor y eso es algo que no nos van a
permitir, porque podría afectar a otros dominios o al correcto funcionamiento del servidor en
general.
Telnet es un servicio típico que viene con los servidores dedicados. Como un servidor dedicado
sólo lo utiliza un único usuario, con telnet puede configurar a su gusto cualquier cosa del
servidor. Una vez que tenemos un dedicado, podemos comprobar como a través del telnet nos
resulta muy cómo realizar algunas acciones de administración, como backups, migraciones,
planificación automática de tareas periódicas, reparación del servidor ante caídas, etc.

Telnet no es seguro. SSH sí es seguro
Cuando nos conectamos por telnet con un servidor tenemos que enviar nuestro nombre de
usuario y contraseña. Estos datos críticos se envían por medio de texto plano, sin ningún tipo
de encriptación, por lo que cualquiera podría leerlos si está "escuchando" nuestras
comunicaciones.
Para evitar este grave problema de seguridad se utiliza SSH, que es un protocolo de
comunicación en redes muy similar, pero en el que todas las comunicaciones viajan de manera
encriptada.
SSH suele trabajar en el puerto 22 y los programas que permiten hacer telnet lo más normal es
que permitan también hacer SSH. Por ejemplo, el mencionado Putty también permite hacer
SSH, lo que a veces se llama "telnet por ssh".

Disponible online en http://desarrolloweb.com/articulos/telnet-ssh-protocolo-red.html

Qué es AJAX
Damos un repaso global a AJAX, desde su comienzo hasta la actualidad.
Allá por mediados de los años 90, época en la que Internet apenas asomaba en nuestras vidas
cotidianas, y muchos eran los que todavía aún podrían prescindir de ella, era muy común oír
hablar del lenguaje JAVA. Ninguna publicación especializada escapaba al fenómeno: las
revistas se llenaban de artículos elogiando aquella tecnología, y vaticinando, cual chamán /
gurú, que, en el futuro, el lenguaje de programación que cambiaría nuestras vidas sería el
homónimo de un café típico de una ignota isla de Indonesia.
Pocos hubiesen arriesgado, por el contrario, que la base del verdadero fenómeno de los años
subsiguientes, se encontraría no en el todopoderoso JAVA, sino en un pequeño y humilde
lenguaje de script, el cual tomaría parte del nombre de la antigua vedette tecnológica, y que
muchos, durante mucho tiempo, confundirían erróneamente con su hermano menor, aunque
poco tendrían estos dos de parentesco: estamos hablando, claro, del JavaScript.
No sería hasta comienzos del siguiente milenio que este pequeñito encontraría un socio del
cual se nutriría con fuerza, sociedad de la cual se originaría una verdadera revolución que
cambiaría la forma en que vemos y utilizamos la red de redes. Este socio es, claro está, el XML.
Sin ser un lenguaje propiamente dicho, el XML ya tenía varios laureles en su haber: para ese
entonces prometía generar un profundo cambio en el intercambio de información y la
representación de la misma (de hecho por aquel entonces ya había dejado de ser una promesa
para convertirse en una realidad). Aquella fusión de la cual hablamos no ocurriría sino gracias
al desarrollo del paradigma de la revolución internetiana: el HTTPRequestObject. Pero no
sería hasta el mes de febrero del año 2005 que Jesse James Garrett, arquitecto de la
información, le daría un nombre al fenómeno acuñando el término AJAX: Asynchronous
JavaScript and XML (JavaScript y XML asincrónicos). Tal vez, sin pretenderlo, con el nuevo
término, de palabra corta y pegadiza, ayudara a que el fenómeno se expandiera aún con mayor
fuerza.
Pero, ¿qué es exactamente AJAX? Si usted tiene una cuenta de Gmail, probablemente ya lo
haya experimentado. AJAX es, sin lugar a dudas, una de las novedades más atractivas y
promisorias de la denominada Web 2.0. AJAX echa por tierra todo lo que conocíamos acerca
de la manera de relacionarnos con Internet. Esta tecnología redefine el término interactividad,
pasando al siguiente nivel. A partir de esta pequeña revolución, esté expectante de lo que
pueda ocurrir en los años subsiguientes en lo que a Internet se refiere, algo de lo cual ya puede
verse con solo recorrer algunos de los blogs especializados, que a diario reflejan alguna noticia
relacionada con algún nuevo servicio, sitio o aplicación que hace uso de las bondades de AJAX.
AJAX no es una tecnología propiamente dicha. Es, como dijimos, una fusión de tecnologías.
Pero ¿qué es lo que hace tan poderoso a AJAX? A decir verdad, la nueva vedette de Internet

basa su fortaleza en sus dos pilares fundacionales: un cada vez más poderoso JavaScript, que
ha ido mejorando con el correr de los años y se ha ido asentado gracias a la definición de
normas y estándares que se fueron adoptando (por fin) de manera cada vez más amplia, y de la
versatilidad del XML. En este caso también, como suele decirse, el todo es más que la suma de
sus partes.
Gracias a AJAX, atrás quedaron los vetustos formularios cuyas páginas debían ser recargadas
para el envío. Atrás quedaron también los interminables listados de información que nuestro
navegador bajaba, información de la cual tal vez sólo necesitábamos una pequeña parte. AJAX
hace que la información sea cargada de manera precisa, fácil y ágil.
Es gracias a todo esto que, volviendo al caso de Gmail, enviar un mensaje en este servicio de
correo electrónico no implica recargar todos los mensajes de nuestra bandeja de entrada una
vez enviado. O abrir un mensaje antiguo para recuperar un dato que precisamos no significa
tener que volver a solicitar y descargar toda la interfase del sistema (imágenes, html, scripts,
etc.) otra vez.
Para hacer una analogía rápida, AJAX hace más parecidas las aplicaciones web a aplicaciones
standalone. Pero con todas las ventajas de lo que una aplicación web implica.
Pero la cosa no termina en Gmail. Lo que hace tan emocionante a AJAX es que diariamente,
nuevas aplicaciones y servicios son lanzados haciendo uso de esta tecnología. Servicios que nos
aportan un plus extra por su agilidad, velocidad y simplicidad de uso. Casos de éxito como
flickr, Digg, del.icio.us, Writely (un procesador de textos montado totalmente en la web), o el
inminente Windows Live Mail, y un larguísimo etcétera son un claro ejemplo de ello.
¿Hasta dónde llegará AJAX? Nadie lo sabe, pero al menos podemos tener un indicio de ello.
No hace mucho fue anunciado el primer sistema operativo basado en AJAX: el AJAX OS, que
aún no tiene fecha de lanzamiento (solamente un escueto Coming soon), pero ya se anunció
que contará con soporte totalmente nativo para esta tecnología. El éxito de este
emprendimiento tal vez marque lo que AJAX es capaz de lograr. Y su techo definitivo.
Este artículo es obra de Serviweb

Disponible online en http://desarrolloweb.com/articulos/repaso-ajax.html

Qué son los documentos XPS
XPS es un nuevo formato, basado en XML, para documentos electrónicos creado

por Microsoft, disponible en todas las instalaciones de Windows Vista.
Hace poco he descubierto XPS, el nuevo formato de documentos creado por Microsoft.
Después de investigar un poco, parece interesante publicar un artículo para explicar un poco
de qué se trata.
XPS, que viene de las siglas XML Paper Specification, es un formato de documentos pensado
para que sea fácil de compartir, leer e imprimir. XPS es un formato independiente de
plataforma (que se podría leer en cualquier sistema operativo), abierto y sin royalties (se puede
utilizar en cualquier caso sin tener que pagar ningún derecho al creador). Microsoft ha lanzado
este formato recientemente y lo han integrado con Windows Vista y Office 2007.
La integración con Windows Vista es inmediata, dado que el sistema operativo tiene
incorporada una impresora XPS, para poder imprimir cualquier documento en este formato
desde cualquier programa, igual que podemos haber visto las impresoras PDF, que permiten
crear PDFs desde cualquier programa con la opción de imprimir. Con ello conseguimos
archivos con extensión .xps, que se pueden leer en cualquier sistema, siempre que tenga un
visor XPS instalado.
En Windows Vista, el visor de documentos XPS está integrado dentro del propio Internet
Explorer, por lo que para abrir un documento XPS tendremos que hacerlo con el Explorador
de Microsoft. Para quien lo desee, también se puede descargar un programa llamado XPS
Viewer, para visualizar directamente los documentos XPS sin tener que utilizar Internet
Explorer. Además, existe un paquete llamado “Xps Essentials Pack” que incluye el visor de
documentos y un programa para crearlos. Todos estos programas son gratuitos.
En Windows XP el visor habría que instalarlo aparte, porque de entrada no tiene

compatibilidad con el formato XPS. Aunque para ello tenemos que instalar primero el .NET
Framework 3.0, lo que supone un buen tiempo y unas cuantas descargas para, al fin, poder ver
los documentos XPS.
Dejo aquí una serie de enlaces de interés sobre XPS para el que desee investigar o trabajar
sobre este nuevo formato: (lo siento, pero todos estos links están en ingles)
Página de Microsoft dedicada a XPS Descarga de programas XPS Viewer o el Essential Pack
XPS en la Wikipedia
XPS y PDF
El formato es, en mi opinión, una apuesta de Microsoft para competir con el formato PDF,

aunque todavía tiene bastante por delante para que se convierta en un verdadero estándar
abierto. De hecho, para conseguir visualizar en XP un documento XPS tenemos que pasar un
buen rato y hacer algunas descargas.
Siguiendo con las similitudes con respecto a PDF, se podría decir que PDF está basado en
PostScript mientras que XPS está basado en XML. Hay que decir que suena bastante bien que
el formato esté basado en XML, por las ventajas de este lenguaje en cuanto a compatibilidad y
portabilidad.
Posibilidades de futuro para los documentos XPS

Es fácil que los usuarios de Windows Vista se familiaricen con el formato XPS, porque a la hora
de imprimir un archivo siempre aparece la opción de la impresora XPS. De hecho, mi interés
sobre el formato surgió a partir de ese punto. Además, como en el momento de escribir este
artículo no hay soporte para Windows Vista de ninguna impresora virtual de PDF gratuita
(para generar archivos PDF con la acción imprimir de los programas), pues no queda otra
posibilidad de utilizar la impresora XPS que viene incluida. Esto sin duda hará que los
usuarios comiencen a utilizar el formato XPS y a darlo a conocer naturalmente entre sus
contactos.
Ahora bien, habrá que esperar un tiempo hasta que la distribución de contenidos y
documentos de XPS sea tan habitual como la del formato PFD. A mi no me queda mucho lugar
a dudas que Microsoft lo conseguirá. No obstante, en cuanto al trabajo de Microsoft por
integrar XPS, no me queda nada claro a qué se refiere cuando dice que Office 2007 tiene
compatibilidad con XPS, si luego no consigo abrir con Word ese formato ni guardar un
documento con extensión XPS desde Office, a no ser utilizando la impresora XPS que viene
con Windows Vista.

Disponible online en http://desarrolloweb.com/articulos/documentos-xps.html

Qué es RSS
Vemos qué es RSS, rápidamente y en líneas generales. RSS es un formato de

distribución de contenidos de Internet basado en XML.
RSS es un estándar creado para distribuir contenidos, usualmente las novedades, de los sitios
web por un canal distinto de la propia página web. Gracias a RSS el usuario visitante de una
página web puede suscribirse a sus novedades y recibirlas en su ordenador, en el instante de
ser publicadas, sin necesidad de acceder a la página web donde se han insertado. Obviamente,
RSS está pensado para webs que publican novedades muy a menudo y para usuarios que
quieren estar al tanto de tales actualizaciones, sin tener que entrar todo el tiempo al sitio web
para ver si se ha publicado algo nuevo.
Para recibir las novedades se tiene que generar una comunicación entre el ordenador del
usuario y el servidor donde está la web. Todo se realiza por medio de un archivo RSS que
publica la web y un lector de RSS que debe tener instalado el ordenador del usuario. Es un
proceso simple, pero vamos a explicarlo en este artículo con calma para que quede accesible a
todas las personas.
Qué es realmente un RSS

Cuando hablamos de RSS nos referimos usualmente a la tecnología completa para distribución
de contenidos de los sitios web. Pero un RSS es realmente un formato de archivo, basado en
XML, que sirve para recoger contenidos publicados en páginas web. Los RSS tienen extensión
.rss o bien .xml, pero en realidad son un simple archivo de texto donde aparecen referencias a
contenidos publicados, en un formato específico, creado a partir de XML.
Por poner un ejemplo sencillo que pueda entender todo el mundo: Igual que HTML sirve para
escribir páginas en un formato entendible por los navegadores, RSS sirve para enumerar
artículos o páginas dentro de un sitio, en un formato que pueden entender programas
denominados lectores RSS o agregadores.
En el archivo RSS simplemente están los datos de las novedades del sitio, como el título, fecha
de publicación o la descripción. El programa que lea el RSS será encargado de darle estilo o
apariencia a los datos que se incluyan en el archivo y presentarlos de una manera atractiva al
usuario y de fácil lectura.
Que RSS sea un formato basado en XML significa que el archivo RSS se compone por una serie
de etiquetas definidas que tendrán un formato dado, que respetará las reglas generales de
XML.
Este artículo es el primero de una serie que vamos a hacer sobre RSS, para crear un completo
manual de RSS. De momento presentamos una serie de enlaces a artículos sobre RSS ya

publicados en DesarrolloWeb.com:
RSS y sindicación
Qué es y para qué sirve RSS
Dejamos algunos enlaces a lectores de RSS comentados en DesarrolloWeb.com:
FeedDemon
RSSOwl
Feed Reader

Disponible online en http://desarrolloweb.com/articulos/que-es-rss.html

Qué es Webkit
Webkit Open Source Project. Una sencilla explicación en castellano sobre este
sistema de código abierto que es el motor de productos como el navegador Safari.
Para los que nos gusta saber qué es cada cosa y dentro del marco de nuestro manual de Qué es
cada tecnología, publicamos ahora unas notas sobre Webkit, un framework que es conocido
principalmente por ser el motor de Safari, el conocido navegador del sistema operativo Mac OS
X.
WebKit, como se definen en su propia web, es un motor de navegación web de código libre y
además, un framework de Mac OS X que se usó para construir aplicaciones como el
mencionado Safari, Dashboard, Mail y otras.
Podemos entrar en su página web para encontrar cómo se definen a si mismos:

http://webkit.org/
Como framework entendemos un programa mediante el cual se facilita el desarrollo o

programación de otros programas, de la más variada gama. En el caso de WebKit, este
framework facilita especialmente crear aplicaciones que tienen funcionalidades como las que
podemos encontrar en Safari, léase, renderizado o visualización de páginas web, movimiento
entre distintas páginas por medio de links, descarga de archivos, gestión de componentes o
plug-ins, historial de navegación, etc.
WebKit es un producto de Apple, creado a partir de las librerías KHTML y KJS de KDE. KDE
es un entorno de escritorio para Linux, que dispone de librerías para la interpretación de
código HTML (KHTML) y Javascript (KJS), así que WebKit partió de estas librerías para su
creación, portándolas al sistema operativo Mac OS X. Debido a la utilización de partes de KDE
por parte de Apple, estas dos organizaciones comenzaron una colaboración que dio
interesantes frutos para la comunidad de software libre. Así, a mediados de 2005, Apple
comenzó el proceso de liberación de WebKit como open source, así como lo eran las librerías
de las que partieron, y a partir de ese momento se han creado diversos productos que utilizan
WebKit.
Las aplicaciones que utilizan WebKit son principalmente navegadores y otros programas que
hacen uso de Internet o las páginas web, debido a sus características y facilidades que ofrece el
framework. Sin embargo, el abanico de software que se ha creado con WebKit también incluye
editores de texto, lectores de RSS, programas de correo electrónico, mensajería, depuradores
diversos, herramientas de desarrollo, etc. Las aplicaciones que usan WebKit son las siguientes:
Navegadores
Arora

Atlantis
BumperCar
Find It! Keep It!
KidsBrowser
Midori
OmniWeb
osb-browser
Safari
Shiira
SunriseBrowser
TrailBlazer
Web Browser for S60
Origyn Web Browser
Clientes de correo electrónico

Entourage 2008
Mail
Mailplane
Mensajería instantánea o programas de Chat

Adium
Colloquy
Fire
iChat AV
MSN Messenger
Proteus
Yahoo! Messenger
Lectores RSS
MiNews
NetNewsWire
NewsFire
PixelNews
PulpFiction
Shrook
Vienna
Aplicaciones enfocadas al desarrollo de páginas web

Coda
CSSEdit
Contribute 3
RapidWeaver
Sandvox
Xyle scope

XML Nanny
XML-RPC Client
Safari Guide
Editores de Web-Blogs
ecto
iBlog
MarsEdit
Editores de texto
BBEdit
CreaText
Smultron
SubEthaEdit
Taco HTML Edit
TextMate
Aplicaciones de navegación modo quiosco (Navegación a ventana completa y

restringida, en tiempo, urls, etc.)
Kioskbrowser
webXkiosk
wKiosk Browser
Reproductores multimedia
InterActual Player
CocoaJT
Real Player
Programas de visualización de ayudas

Chmox
Help Viewer
Lifesaver
Visualizadores de páginas web como fondos de escritorio

DesktopBrowser
iBrowser
NagaraBrowser
WebDesktop
Nota:

Esta lista la he tomado de la Wiki de WebKit:

http://trac.webkit.org/wiki/Applications%20using%20WebKit. Podemos ver esa página para
un listado actualizado de los distintos softwares en cada categoría, así como para encontrar sus
descripciones y enlaces a cada uno de los programas.
Como podemos ver en la lista, hay varios softwares muy conocidos que usan WebKit, de
compañías diversas y tan importantes como Apple, Microsoft, Adobe, Yahoo!, Real Networks,
etc. Además, hay unos cuantos programas de desarrolladores independientes y empresas de
menor entidad.
Se puede encontrar más información de WebKit en su propia página web:

http://webkit.org/
También en otros link externos:
Webkit en la Wikipedia. WebKit en Español / WebKit en inglés. Apple Developer Connection

Web Kit

Disponible online en http://desarrolloweb.com/articulos/que-es-webkit.html

Qué es el DOM
El DOM es la estructura de objetos que genera el navegador cuando se carga un

documento y se puede alterar mediante Javascript para cambiar dinámicamente
los contenidos y aspecto de la página.
DOM es una abreviatura de Document Objet Model. En español podríamos traducirlo por
Modelo de Objeto de Documento, aunque en DesarrolloWeb.com nos hemos referido al DOM
habitualmente con el nombre de jerarquía de objetos del navegador, porque realmente es una
estructura jerárquica donde existen varios objetos y unos dependen de otros.
Los objetos del DOM modelizan tanto la ventana del navegador como el historial, el
documento o página web, y todos los elementos que pueda tener dentro la propia página, como
párrafos, divisiones, tablas, formularios y sus campos, etc. A través del DOM se puede acceder,
por medio de Javascript, a cualquiera de estos elementos, es decir a sus correspondientes
objetos para alterar sus propiedades o invocar a sus métodos. Con todo, a través del DOM,
queda disponible para los programadores de Javascript, cualquier elemento de la página, para
modificarlos, suprimirlos, crear nuevos elementos y colocarlos en la página, etc.
Lo cierto es que quien quiera que haya realizado un poco de trabajo con Javascript, aunque
este haya sido muy básico, ha tocado el DOM alguna vez. Aquí en desarrollo web .com hemos
visto multitud de ejemplos en los que se tocaba el DOM. Cuando por ejemplo hacemos una
sentencia en la que se accede al valor de un campo de formulario, con un código como este:
document.forms[0].elemento_formulario.value, estamos accediendo a la estructura de objetos
del DOM.
El DOM está definido y administrado por el W3C, por lo que los distintos navegadores
simplemente aplican las especificaciones del World Wide Web Consortium, para dar soporte al
DOM en sus aplicaciones. El DOM no sólo permite modificar páginas web en HTML, sino
también documentos XML.
A lo largo de la historia de los navegadores, se han ido aplicando en mayor o menor manera las
características del DOM. A medida que se sucedían versiones de los navegadores también se
iba dando un mayor soporte a las especificaciones del DOM, en lo que se han llamado los
niveles del DOM. El primero que empezó a disponibilizar por medio de objetos los
componentes de la página fue Netscape 2.0, que incorporaba lo que se llama el DOM nivel 0.
Actualmente, la última especificación publicada es DOM nivel 4.
Es importante destacar ahora que, dado que los niveles del DOM cambian de versión a versión
del navegador y que las especificaciones se han entendido de manera distinta por las distintas
organizaciones creadoras de los navegadores, se ha producido un marco donde trabajar con los
objetos de la página difiere de un navegador a otro. Esto lo vemos en el artículo DOM y
compatibilidad con los distintos navegadores.

Si deseamos obtener otros textos introductorios al concepto de DOM de Javascript,

recomiendo la lectura de la Wikipedia sobre el DOM Document Object Model.

Disponible online en http://desarrolloweb.com/articulos/que-es-el-dom.html

Qué son los BBCode
Los códigos BBCode son una notación para especificar estilo y formato de textos,
utilizados comúnmente en foros.
Los códigos BBCode (También se puede ver escrito separado, como BB Code) sirven para
especificar la forma con la que se debe mostrar un texto, por medio de una especie de
etiquetas, parecidas a las que conocemos en HTML, que permiten formatear dicho texto. Estos
códigos podemos haberlos visto utilizarse en foros o a la hora de subir comentarios de usuarios
a una página web.
Los BBCode son como estos:
Esto es un [i]ejemplo de texto[/i] con BBcodes: [b]aquí pongo una negrita[/b].
[code]y esto es un código fuente...[/code]
Y ahora una [url]http://www.desarrolloweb.com[/url].
Este código, como se puede apreciar, tiene varias marcas entre corchetes, para producir
diversos estilos y bloques de texto que deben formatearse de una manera específica. Al
procesar este texto y sus códigos BBCode, obtendremos como resultado un HTML como este:
Esto es un <em>ejemplo de texto</em> con Bbcodes: <strong>aquí pongo una negrita</strong>.
<code>y esto es un código fuente...</code>
Y ahora una <a href="http://www.desarrolloweb.com/">http://www.desarrolloweb.com</a>.
En definitiva, los BBCode, sirven para permitir a los usuarios un control mayor de los estilos y
el formato en general de los mensajes que publican en foros o en comentarios de posts. Pero
sin llegar a permitirles escribir directamente código HTML, para asegurarse que se mantiene
controlado el formato de estos contenidos a la hora de visualizarlos en las páginas. En este
artículo de desarrollo web .com explicaremos qué son los BBCode y dejaremos para artículos
posteriores la explicación sobre cómo implementarlos en nuestras aplicaciones web.
Los BBCode Fueron creados originalmente por el sistema de foros PhpBB, y son las siglas de
Buletin Board Code. Actualmente se han convertido en un estándar para la edición de textos en
diversos foros y sistemas de comunidades, donde los usuarios pueden participar.
Podemos ver una lista de los BBCodes aquí:
Nota: Pueden no estar todos, puesto que diversos sistemas implementan un conjuntos de
BBcodes distintos. Del mismo modo, puede que tu sistema no implemente alguno de los

BBCode que estoy indicando a continuación.
Formateo de texto sencillo
[b]Negrita[/b]
[u]Subrayado[/u]
[i]Itálica[/i]
[s]Tachado[/s]
[sub]Subíndice[/sub]
[sup]Superíndice[/sup]
Formateo de textos avanzado
[color=blue]En color azul[/color] ( permite otros colores, claro, con valores hexadecimal como #ff5500)
[size=12]tamaño texto[/size] (permite valores distintos, consultar el estilo en tu implementación)
[font=arial]cambio la tipografía[/font]
[align=right]alineación del texto[/align]
[quote="Pepe"]Esta es una cita de un texto enviado por Pepe[/quote]
[code]Esto es un código fuente[/code]
Enlaces
[url]http://www.desarrolloweb.com[/url]
[url=http://www.desarrolloweb.com]DesarrolloWeb.com[/url] (para que el texto del enlace sea distinto que la URL enlazada
Imágenes
[img]http://www.desarrolloweb.com/images/logo_desarrollo_web.gif[/img]
Listas
[list]
[*]Red
[*]Blue
[*]Yellow
[/list]
Las listas permiten otros tipos de lista si se indica un valor al iniciar la lista, como [list=1]
Enlaces a email

[email]email@dominiodelemail.com[/email]
Referencia: En DesarrolloWeb.com hemos publicado algunos artículo para implementar

estos BBCodes en una página web:
Creación de BBcode en PHP

Tutorial BBCode
Implementar códigos BBCode en PHP con PEAR

Disponible online en http://desarrolloweb.com/articulos/que-son-los-bbcode.html

Qué es un Blog
En este primer artículo vamos a conocer lo que es un Blog y vamos a relatar un

poco de su historia.
Dado el actual auge de este formato de publicación en Internet vamos a hablar un poco de los
blogs. El objetivo de este artículo es ofrecer una pequeña introducción al concepto de blog,
para pasar luego a lo largo de este manual de DesarrolloWeb.com a ofrecer distintas maneras
para crear un blog y personalizarlo.
Para empezar vamos a dar una definición de lo que es un blog a través de un ejemplo. Para ello
quiero que penséis en los cuadernos de bitácora de los barcos, en ellos se escribe día a día todo
lo que sucede a bordo del buque. Bueno pues un blog es algo parecido, ya que nace con la idea
de escribir una especie de diario online. Este diario suele ser personal, aunque hay blogs en los
que participan varias personas o una comunidad entera.
Los blog son una de las formas de publicación de la web 2.0, en este caso una evolución de lo
que eran antes las páginas personales. Con el paso del tiempo su aplicación y definición ha ido
creciendo hacia otros campos como son las noticias, opiniones, etc.
Un blog se define como una web que se actualiza de una forma periódica, donde
cronológicamente van a apareciendo artículos de diversos tipos, desde opiniones a noticias,
trucos, recetas y en general todo tipo de temáticas. Otra característica de los blog es que los
artículos publicados, que suelen llamarse "Post" (el plural sería posts), aparecen en la página
los más nuevos primero. Es decir, según se publica algo aparece en portada en primer lugar y a
medida que se publican nuevos artículos, se colocan los primeros desplazando los más viejos
hacia abajo.
Habitualmente, cada blog está dedicado a una temática en concreto pero puede haber algunos
de varios temas mezclados (caso de los blog personales).
Historia de los blog

Los blog, según se puede leer en la Wikipedia, se vieron por primera vez en 1994, cuando en
España todavía muchos ni sabíamos lo que era Internet. En realidad lo que ellos apuntan que
era uno de los primeros blog, no consistía en más que páginas personales, que no tienen
mucho que ver con los blog actuales.
De cualquier modo, el término Weblog se vio por primera vez en diciembre de 1997, acuñado
por Jorn Barger. Después de esto se creó el término blog (que viene de la abreviación de
Weblog), tanto como sustantivo como verbo: bloguear (editar un blog o postear, enviar un post
a un blog). También pronto se comenzó a utilizar la palabra blogger, como la persona que edita
un blog, que en español podríamos traducirlo por bloguero.

La popularización de los blog surgió sobre el año 1999 cuando diversos sitios web en inglés
empezaron a ofrecer servicios de creación y alojamiento para blogs, de modo que los usuarios
de Internet deseosos de convertirse en bloggers, no tuvieran que vérselas con las
complicaciones técnicas de crear su propia infraestructura para la edición de blogs.
Pero hasta el año 2002 el término no paso de ser algo específico del medio Internet para
introducirse en la sociedad y ser incluso objeto de investigación y fenómeno social.
Después de una pequeña especificación sobre lo que es un blog, pasamos a cómo podemos
crearnos uno, pero esto ya lo trataremos en el próximo artículo de este manual. Esperamos que
a lo largo de las siguientes entregas que vamos a ir publicando en desarrollo web .com, todos
los que deseen crear su propio blog, puedan hacerlo de una manera sencilla.

Disponible online en http://desarrolloweb.com/articulos/que-es-un-blog.html

Qué es un CMS
Definición y ejemplos de sistemas CMS: Content Manager System (Sistema gestor

de contenidos).
Una pregunta básica que me han hecho alguna vez es ¿qué es un CMS? Intentaré en este
artículo dar una definición rápida de CMS y algunos ejemplos de sistemas CMS utilizados para
hacer páginas web. En DesarrolloWeb.com hemos hablado varias veces sobre CMS, pero
todavía faltaría por aclarar lo que es exactamente:
CMS son las siglas de Content Management System, que se traduce directamente al español
como Sistema Gestor de Contenidos. Como su propio nombre indica, es un sistema que nos
permite gestionar contenidos. En líneas generales, un CMS permitiría administrar contenidos
en un medio digital y para el caso particular que nos ocupa, un CMS permitiría gestionar los
contenidos de una web.
Dicho de otra forma, un CMS es una herramienta que permite a un editor crear, clasificar y
publicar cualquier tipo de información en una página web. Generalmente los CMS trabajan
contra una base de datos, de modo que el editor simplemente actualiza una base de datos,
incluyendo nueva información o editando la existente.
Imaginaros un periódico o cualquier otra página medianamente compleja. Principalmente

aquellas que tienen que ser actualizadas diariamente o varias veces por día, donde además, las
personas que editan la información no tienen conocimientos de informática. A estos redactores
se les tiene que facilitar el trabajo mediante una herramienta que les permita subir
informaciones a la web y clasificarlas para que aparezcan en el lugar correcto. Por supuesto
que estas personas no deben preocuparse con el código de la página ni las particularidades de
programación de la plataforma donde esté alojada la web. Ellos sólo deben concentrarse en
escribir las noticias, o cualquier tipo de contenidos y luego subirlas a la página por un sistema
intuitivo y rápido. Una vez publicadas y clasificadas, las informaciones deben aparecer en la
página web automáticamente, en los lugares donde haya decidido el editor.
Una herramienta CMS generalmente contendrá una interfaz basada en formularios, a los que
habitualmente se accede con el navegador, donde se pueden dar de alta los contenidos
fácilmente. Esos contenidos luego aparecerán en la página en los lugares donde se ha indicado
al darlos de alta. Por lo tanto, un CMS estará compuesto de dos partes, un back y un front,
siendo el back la parte donde los administradores publican las informaciones y el front la parte
donde los visitantes visualizan las mismas.
Clasificación de CMS
En el mundo de los CMS hay cientos de posibilidades y de variantes, ya sea por sus
funcionalidades, casos de uso o por las tecnologías que se utilizan para crear las

infraestructuras para la publicación y visualización de contenidos.
Una primera clasificación de CMS se podría dar entre sistemas propietarios y no propietarios.
Digamos que un sistema propietario es el primer ejemplo que podemos encontrar de CMS,
puesto que son herramientas creadas a medida para actualizar una página web. Cualquier
página que se haya creado e incluya un sistema para actualizarla a través de formularios, o
cualquier interfaz que facilite la publicación, es un sistema CMS. En los inicios de la web no
existían sistemas CMS, comerciales o gratuitos, para gestionar los contenidos de los sitios, por
lo que se tenía que programar un sistema para poder actualizarla rápidamente, propio para esa
web. Por ejemplo, DesarrolloWeb.com tiene un CMS propietario, desarrollado por los
creadores del sitio. Por otra parte, tenemos los CMS no propietarios (he buscado alguna
palabra para referirme a ellos, pero siento decir que no la encuentro. Por supuesto que se
agradece un comentario si alguien sabe cómo decir "no propietario" en una sola palabra), son
sistemas que se han desarrollado por empresas o instituciones y que se disponibilizan para que
sean utilizados para la creación de cualquier tipo de página web. Estos CMS no propietarios
son, en muchos de los casos, completamente configurables, es decir, que sirven para producir
cualquier tipo de web con cualquier clasificación de secciones y contenidos.
Nota: Otras clasificaciones señalan que los sistemas propietarios son aquellos que son
comerciales, dicho de otra forma, creados por una empresa y que se ofrecen para su uso en
webs, sujetos a la compra de una licencia. En ese modo de entender la clasificación de CMS,
los gestores de contenidos de pago serían sistemas propietarios, aunque no se hayan hecho
a medida para una web específica, sino que sirvan para para desarrollar cualquier tipo de
proyecto. Los sistemas propietarios, en este caso, estarían en contraposición con los
sistemas CMS gratuitos.
Otra manera de clasificar los CMS sería en función de la utilización de los mismos, ya sea para
crear una web empresarial, una publicación como revista o periódico, un blog, un sistema e e-
learning, un Wiki, una tienda, foro...
Ejemplos de CMS
Ya que estamos tratando un tema importante, que seguro que interesará muchos lectores,
vamos a ir publicando nuevos artículos en desarrollo web .com concernientes a sistemas CMS,
valorando y comentando algunos sistemas que hayamos tenido la ocasión de probar. Pero
mientras tanto, podemos dar algunos ejemplos de CMS populares que existen en el mercado.
Vignette: http://www.vignette.com/es
Es un sistema CMS comercial, que dicho sea de paso, debe ser bastante caro. Es importante
comentarlo por ser el primer sistema CMS comercial que apareció en el mercado.
Drupal: http://drupal.org/
Uno de los CMS más populares, en este caso gratuito y open source. Creado en PHP y con
posibilidad de utilizar varias bases de datos distintas, por defecto MySQL.

Mambo: http://www.mamboserver.com/
Un sistema CMS libre y gratuito, creado en PHP. Puedes leer el artículo sobre qué es Mambo
publicado en DesarrolloWeb.com.
Joomla!: http://www.joomla.org/
Es un CMS de código libre, también creado en PHP. Surge como una mejora o ampliación de
Mambo
Wordpress: http://wordpress.org/
El CMS para la creación de blogs por excelencia. El más utilizado y el mejor valorado, también
creado en PHP y gratuito.
OsCommerce: http://www.oscommerce.com/
El sistema gestor de contenidos de código libre, para la creación de una tienda más conocido y
utilizado. Si te interesa, puedes leer el manual sobre OsComerce que hemos publicado.
De momento, dejamos por aquí esta introducción a los sistemas CMS, esperando poder haber
aclarado las dudas iniciales sobre lo que son los sistemas de gestión de contenidos. En breve
esperamos publicar más detalles sobre CMS para ayudar a su elección y configuración. De
momento podemos dejar un link a un artículo publicado hace tiempo en DesarrolloWeb.com
en el que hablamos sobre distintos CMS para publicar blogs.

Disponible online en http://desarrolloweb.com/articulos/que-es-un-cms.html

Qué es Podcast
Introducción al termino Podcast, en resumen, la suscripción o sindicación de

audio y vídeo por RSS. Veremos qué es Podcasting y cómo acceder a ese tipo de
contenidos multimedia.
Podcast es una de esas palabras que circulan por Internet y que se vuelven parte de nuestro
vocabulario habitual, o bien de esas palabras resultan todo un misterio para los que no las
conocen. En líneas generales, el Podcast es un modo de difusión de contenidos multimedia a
través de suscripción, es decir, una nueva vía de publicación de contenidos en audio o vídeo, a
los cuales accedemos a través de una suscripción a una fuente o canal de información.
Podcast es una reunión de palabras de tecnología, Pod viene de las siglas "Public On Demand"
y Cast viene de la palabra Broadcast. También se dice, por ejemplo en la Wikipedia y en otras
webs, que Pod viene del reproductor de Apple iPod. En cualquier caso, vamos a a analizar este
término en este artículo de DesarrolloWeb.com.
Public on demand hace referencia a que los podcast son una transmisión de multimedia
pública que se envía bajo demanda del usuario. Broadcast es una transmisión o difusión de
información desde un nodo emisor a múltiples nodos receptores al mismo tiempo, en
definitiva, una manera de transmitir información que se utiliza a menudo en Internet, sobre
todo de contenidos multimedia.
Podcast es un RSS que enlaza con audio y/o vídeo

Volviendo a Podcast, y para los que conozcan ya lo que es RSS (si no sabes qué es RSS, como
suscribirte o sindicarte a RSS y como publicar tus propios contenidos en RSS, lee el manual de
RSS de DesarrolloWeb.com), cabe decir que el podcast no es más que un RSS en el que se
añaden archivos multimedia, ya sea audio en formatos como MP3, o vídeo (en este caso se
habla de videocast).
Así pues un podcast es una vía de comunicación en la que el canal es Internet y donde en lugar
de texto, como suele ser en la web, se transmite la información en archivos multimedia,
generalmente de sonido en formato mp3 u ogg. La particularidad de los Podcast es que se
ponen a disposición de las personas por medio de suscripción RSS. El sistema es el siguiente:
el usuario se suscribe a tantos canales de podcasting como desea y todos ellos se centralizan en
un programa que maneja estas suscripciones. Entonces cuando uno de los canales a los que
está suscrito se actualiza, el usuario recibe directamente una notificación en el programa y si lo
desea, descarga el archivo multimedia y lo reproduce en su ordenador, con cualquier programa
reproductor, o bien sincroniza su dispositivo portatil de reproducción multimedia (lo que
llamamos coloquialmente el "mp3", tipo iPod, Zend, o similares) con los canales que le
interesan, para escucharlos tranquilamente en el lugar que desee.

La posibilidad de acceder a los podcasts por medio de dispositivos portátiles reproductores

multimedia es una de las grandes ventajas del sistema, ya que permiten acceder a los
contenidos ofrecidos por Internet desde cualquier lugar y en cualquier momento y no
necesariamente cuando estamos delante de la pantalla de nuestro ordenador.
En Internet podemos encontrar todo tipo de podcast de todo tipo de temáticas, desde
tecnología a deportes, salud, hogar, etc. Al igual que los blog, muchos podcast acostumbran a
utilizar un tratamiento informal y lenguaje coloquial, sin embargo, las características de los
podcast varían mucho de unos autores a otros, tanto en el tiempo de duración de los
contenidos como en lo improvisado o elaborado del material multimedia publicado.
Para continuar aprendiendo lo que es Podcast seguramente te interese leer el próximo artículo
publicado en Desarrollo web .com, en el que ofrecemos datos interesantes para cómo acceder a
contenidos de podcast y dónde encontrar fuentes de información podcasting.

Disponible online en http://desarrolloweb.com/articulos/que-es-podcast.html

Qué es HDR
Explicamos lo que es la técnica HDR o HDRR: High Dynamic Range Rendering,

con la que podemos conseguir fotos espectaculares.
HDR son las siglas de "High Dynamic Range Rendering", también conocido como HDRR, una
técnica de combinación de imágenes que ofrece unos resultados espectaculares. En español
podríamos traducirlo por algo así como Versionado de Alto Rango Dinámico, y no es una
tecnología nueva, sino que existe desde hace tiempo. Poco a poco podemos ir encontrando por
Internet más y más referencias y tutoriales para aprender HDR, así como programas y demás
materiales que podamos necesitar para introducirnos en esta tecnología.
HDR no es una técnica reservada sólo para los fotógrafos y diseñadores. En realidad cualquiera
de nosotros podemos hacer fácilmente una composición HDR con resultados tan buenos como
podría ofrecernos un profesional. Sólo hay que contar con una cámara digital, las herramientas
necesarias para hacer las fotos y un programa que permita combinar fotografías con HDR.
Seguramente que un fotógrafo o diseñador con más experiencia podría contar mejor que yo, un
mero desarrollador web, lo que es el HDR, pero podría comentaros que es una técnica de
combinación de fotos con distintos tiempos de exposición, para obtener una única instantánea
en la que todos los planos tienen la luz ideal.
HDR imita de alguna manera al ojo humano cuando reconoce una escena, ya que éste tiene la
capacidad de adaptarse a entornos con distintas cantidades de luz, abriendo y cerrando la
pupila para reconocer cada uno de los lugares que tienenluminosidad distinto. Sin embargo, la
fotografía, como muchos de nosotros sabremos, no tiene esa misma capacidad. Cuando
hacemos una foto, la cámara sólo es capaz de medir el nivele de luz una sola vez, de modo que,
al hacer la foto, optimiza su desempeño para esa luz que midió con su fotómetro. Por ello, a
menudo ocurre que la intensidad de luz del lugar que queremos fotografiar es variable, y la
cámara sólo es capaz de mostrar la luminosidad óptima para uno de los puntos de la foto.
Quizás me explique mejor con un ejemplo. A veces hacemos una foto en la que tenemos el cielo
muy claro y los objetos en primer plano más oscuros. Al hacer la fotografía podemos medir la
luz del cielo y pulsar el disparador. Entonces ocurrirá probablemente que los objetos en primer
plano salgan oscuros. Por el contrario, si medimos la luz de los objetos en primer plano y
hacemos la foto, lo más seguro es que el cielo salga demasiado claro. Tanto con la oscuridad
como con la claridad excesiva la foto pierde detalle y a menudo ocurre que no podemos sacar la
luminosidad perfecta para todos los puntos de la foto, sobre todo en momentos del día en los
que comienza a faltar la luz, como una puesta de sol.
Ahora que ya conocemos las limitaciones de las cámaras fotográficas, voy a intentar explicar
cómo HDR las soluciona. Con esta técnica se pueden combinar fotos con diferentes tiempos de
exposición, tomadas de manera independiente con una cámara. Esas fotos tendrán por tanto

diferente luminosidad y probablemente todos los elementos del entorno se vean correctamente
en alguna de las imágenes. La parte luminosa de la foto se verá bien con en la foto clara y en la
oscura se verán bien las partes que tenían menos luz. Al unir las fotos en una única instantánea
con la técnica HDR, las partes oscuras podrán verse igual de bien que las partes claras, por lo
que todo el escenario captado en esa foto HDR se verá en condiciones de luz óptima.
Nota: El tiempo de exposición es el tiempo en que el obturador de la cámara permanece

abierto para adquirir la luz y por tanto hacer la fotografía con más o menos luminosidad.
Generalmente, para hacer una foto HDR necesitaremos al menos tres fotos con diferentes
tiempos de exposición. Para eso podemos hacer las fotografías con el modo manual de la
cámara digital, indicando a la cámara que utilice uno u otro tiempo de exposición. Las fotos
tendrán que ser exactamente iguales, por lo que resultará muy aconsejable contar con un
trípode, para que al hacer las distintas fotos la cámara no se mueva nada y las tres fotos salgan
con el mismo encuadre exacto.
Nota: También podemos hacer una foto HDR a partir de una única foto, simulando con
algún programa de diseño gráfico la diferentes tiempos de exposición para la misma
imagen, de modo que tengamos tres imágenes con distinta luz. Sin embargo, según dicen,
en este caso los resultados no serán tan buenos como cuando utilizamos tres fotos distintas.
Si sabemos manejar nuestra cámara digital, y ofrece la posibilidad de controlar el tiempo de

exposición, obtener tres o más fotos del entorno no será dificil. Luego tendremos que utilizar
algún programa para combinarlas con HDR. Podría valer Photoshop u otros programas
disponibles que permitan hacer HDR.
En Internet tenemos diversos artículos y tutoriales que explican el paso de conseguir hacer la
combinación HDR. Por ejemplo podemos leer el artículo de nuestro sitio hermano
DesarrolloMultimedia.es: Cómo realizar un HDR, (High Dynamic Range), con Photoshop C2 o
Superior
También recomendamos ver el vídeo sobre cómo hacer un HDR con el programa Dynamic-
Photo HDR, publicado en DesarrolloWeb.com. Este vídeo se completa con otro en el que
realizamos otro efecto HDR, con el mismo programa. En el segundo vídeo mostramos cómo
hemos realizado la siguiente foto de ejemplo, una foto HDR que no es demasiado buena,
porque eran sólo unas pruebas, pero que sirve para hacerse una idea del potencial de esta
técnica.

Otros ejemplos de HDR

Pablo González, de la empresa Hello World Solutions y colaborador de DesarrolloWeb.com,
nos ha enviado otras fotos realizadas por él mismo con la técnica HDR, que resultan bastante
impresionantes y complementan bien el actual artículo, como nos comenta: "Bueno, pues yo
hice algunas pruebas este verano pero me temo que tampoco obtuve demasiada calidad.
Además tampoco guardé aqui las fotografías que mezclé, por lo tanto no se si te sirven como
ejemplo... De todas formas te paso algunos resultados adjuntos. Para hacerlas usé el programa
gratuito QTPFSGUI"
Bahía Santander

en HDR, por Pablo González
Cala Higuera en
HDR, por Pablo González
Genoveses en
HDR, por Pablo González

Disponible online en http://desarrolloweb.com/articulos/que-es-hdr.html

¿Qué es el cloud computing?
En estos últimos años se ha hablado mucho acerca del cloud computing, la nube,
el cambio que esto supone en nuestra forma de desarrollar y gestionar nuestras
aplicaciones… Pero ¿Qué es realmente el cloud computing?
Las grandes empresas comenzaron a utilizar este término para referirse a aquellos servicios
alojados en la red. De hecho esa es la primera cosa que a la mayoría de nosotros se nos viene a
la cabeza sobre "Cloud Computing". Por ello, podemos decir que la palabra nube sería
equivalente a lo que conocemos como Internet. Sin embargo, el concepto tiene mucho más
alcance y es algo que pretendemos relatar en el presente artículo.
Tipos de cloud
En la actualidad existen 3 tipos de nubes:
Nubes públicas: Se trata de aquellas que son administradas por el proveedor del
servicio. La gran ventaja de las mismas es que no requieren de una inversión inicial
para comenzar a utilizarlas y no suponen un gasto de mantenimiento para el cliente que
la consume. Estas nubes son compartidas con otros clientes dentro de los data centers
del proveedor.
Nubes privadas: Las nubes privadas, a diferencia de las públicas, son administradas por
el cliente para obtener un mayor control. Debido a esto, supone una inversión inicial en
la infraestructura ya que esta será alojada on-premise, es decir, en las instalaciones del
cliente. Como ventaja principal el cliente disfruta de una nube de su propiedad donde él
es el único que reside en ella, aunque los gastos de mantenimiento corren a cuenta del
propietario.
Nubes híbridas: Por último tenemos esta opción intermedia entre las dos nubes
anteriores. Si bien dicen que este tipo será el más extendido en el futuro, no está tan
definido como el resto. La idea principal de las mismas es que el cliente podrá mantener
el control de aquellas aplicaciones principales y delegar la administración en las que
considere secundarias.
Tipos de servicios
Una vez cubierto los tipos de nubes que existen ¿Qué podemos hacer con ellas?

Dependiendo de la necesidad que necesitemos cubrir, existen distintos tipos de servicios

dentro del cloud computing:
Infrastructure as a Service (IaaS): Este tipo de servicio lo que nos ofrece es la

infraestructura necesaria para poder subir nuestro entorno y además ejecutar el
software propietario en ella. Los dos pilares fundamentales son la computación y el
almacenamiento como servicio. En ocasiones se refieren a IaaS como HaaS (Hardware
as a Service). Como ejemplos de este tipo de servicios podemos mencionar GoGrid y
Amazon EC2 (Elastic Compute Cloud).
Platform as a Service (PaaS): Cuando hablamos de la plataforma dentro de la nube, el
servicio que nos ofrecen es el entorno donde podemos desplegar directamente nuestras
aplicaciones. Los ejemplos más claros en este apartado son la plataforma Windows
Azure por parte de Microsoft y Google App Engine.
Software as a Service (SaaS): El último servicio, y uno de los más conocidos por el
mercado, son aquellos transformados en aplicaciones finales proporcionadas por el
proveedor, listas para ser usadas por los clientes. En este tipo de servicio se nos asegura
el mantenimiento, el soporte y la disponibilidad del software. Dentro de este conjunto,
podemos encontrar Microsoft Business Productivity Online Standard (BPOS) lo cual
trata de un conjunto de conocidas aplicaciones en su versión online como SharePoint
Online, Exchange Online, Office Live Meeting y Office Communications Online. Otro
grupo de aplicaciones dentro de este ámbito serían Salesforce, conocidos
principalmente por su CRM en la nube, y Basecamp donde su producto estrella es su
herramienta de colaboración para proyectos.
Ventajas
Como ventajas de este modelo de administración y desarrollo podemos destacar el ahorro de
costes como la más importante, además de la alta escalabilidad, fiabilidad, así como la
abstracción del mantenimiento del hardware, algo hasta ahora novedoso en las grandes
empresas con su propio departamento de IT.
Uno de los conceptos que mejor definen a los entornos cloud es el término "Pay as you go", el
cual significa que solamente pagamos por uso y no una cuota fija mensual como, por ejemplo,
en los servicios de hosting tradicionales.

Por último, cabe mencionar la agilidad con la que disponemos de estos servicios, consiguiendo
en cuestión de minutos una puesta en producción que podría suponer meses, tratándose del
proceso tradicional on-premise.
Desventajas
Si bien es cierto que las ventajas del cloud computing son dignas de ser consideradas, existen
algunos puntos que pueden ser cruciales a la hora de pegar el salto a la nube:
En primer lugar, existe la percepción de inseguridad al desplazar nuestra información fuera de

nuestro alcance físico, la cual puede manifestar un sentimiento de vulnerabilidad. Para
solventar este "miedo" entre los posibles clientes, las grandes empresas del cloud disponen de
sistemas eficientes y de alta seguridad para mantener los datos a salvo de posibles ataques.
Otro de los inconvenientes es la dependencia de un proveedor de Internet. Debido a la

localización de los servicios, estamos atados a esta necesidad, por lo que es recomendable
disponer de una segunda conexión en caso de fallo de la principal.
Aunque cada día menos, todavía existe cierta inmadurez en alguno de los servicios ofrecidos
por falta de funcionalidad, en relación a productos similares diseñados para satisfacer estas
necesidades en servidores dentro del cliente.
En resumen
En este apartado hemos podido conocer el concepto de cloud computing como la propuesta
tecnológica de las grandes empresas para referirse a los diferentes servicios alojados en
Internet, así como los distintos tipos de nubes disponibles en el mercado. Además hemos
enumerado los tipos de servicios disponibles a día de hoy y cómo algunas empresas ya los
ofrecen al público.
En el siguiente artículo veremos cómo la plataforma Windows Azure encaja dentro del cloud y
cuáles son los servicios disponibles y futuros conocidos.
Nota: Otra aproximación a este novedoso concepto que poco a poco se integrará en la
tecnología de nuestro día a día se puede apreciar en el artículo Cloud computing ¿una
realidad?
Este artículo es obra de Gisela Torres Buitrago

Disponible online en http://desarrolloweb.com/articulos/que-es-cloud-computing.html

¿Qué es Office 365?
Vemos qué es Office 365 o también llamado Office en la nube.
Lo primero que se nos puede pasar por la cabeza cuando hablamos de Office en la nube es que
vamos a disponer de las funcionalidades de Office sin tener que instalar nada, bueno Office
365 es mucho más. Office 365 nos proporciona un conjunto de servicios en modo SaaS
(Software como servicio) que podremos adquirir de forma flexible y con una cuota mensual.
Entre los servicios de Office 365 encontramos: Exchange Online, SharePoint Online, Lync
Online, Office Web Apps y Office Desktops Apps.
Los servicios de Office365 se adquieren mediante suscripciones que se pagan mensualmente y

permiten. Las suscripciones se podrían asemejar a las licencias pero con la ventaja de que se
pueden reaprovechar entre distintos usuarios. Las suscripciones se pueden adquirir de forma
flexible pudiendo añadir o reducir suscripciones en función de nuestras necesidades, evitando
una inversión inicial alta y llevando el coste a una cuota mensual por usuario.
Actualmente las suscripciones se pueden adquirir en varios paquetes o planes: Plan 1

(Pequeñas empresas), Plan E para empresas medianas/grandes, plan K para usuarios de
lectura.

Entre las características de los servicios podemos resumir:
Exchange Online, ofrece servicio de correo sin necesidad de instalar ningún software,
provee: buzones de correos, cuentas de distribución, la posibilidad de definir reglas,
filtro anispam y de virus...
SharePoint Online, permite disponer de todas las funcionalidades de colaboración y
gestión documental que ofrece SharePoint 2010 pero en modo servicio.
Lync Online, es la evolución de Office Communicatior y permite la comunicación
instantánea entre compañeros o empleados.
Office Web Apps, permite utilizar las funcionalidades Word, Excel, Power Point y
One Note desde el navegador sin necesidad de realizer ninguna instalación.
Office Desktops Apps, es una versión de Microsoft Office Professional en cliente
asociada a la cuenta de Office365, se adquiere de forma mensual.
Además de los servicios mencionados Office 365 ofrece una serie de características comunes
como:
Construido sobre entorno seguro, ofrece mecanismos de seguridad como: SSL,

contraseñas fuertes, aislamiento de datos cumplimiento de varias certificaciones de
seguridad, integrado con ForeFront.
Posibilidad de integración con dominios de nuestra empresa, mediante ADFS2
podremos sincronizar nuestros usuarios y directivas del dominio en Office 365
reduciendo el mantenimiento y pudiendo ofrece un inicio de sesión único.
Mantenimiento transparente, el equipo de Microsoft Office 365 se encarga de toda las
instalaciones, despliegues, backups y tareas de mantenimiento necesarias para el
funcionamiento de Office 365.
Alta disponibilidad, Office 365 está pensado para ofrecer una disponibilidad de hasta
un 99%. Mediante la georeplicación, en caso de caída del centro de datos asignado se
garantiza el servicio de forma automática en otro centro de datos de otra región.
Actualizaciones automáticas, Office 365 irá aplicando los parches de cada uno de los
productos de forma automática.
Soporte, en función del plan que adquiramos podremos poner incidencias de soporte
ante problemas encontrados con los servicios.
Para la gestión de los servicios, Office 365 dispone de un portal desde el que los
administradores podrán configurar los servicios disponibles. Cuando hablamos de Configurar
nos referiremos siempre a las posibilidades de personalización de los servicios como buzones,
colecciones de sitio, cuotas, integración ADFS, pero nunca podremos configurar los
componentes que componen cada uno de los servicios como IIS, la configuración de
SharePoint 2010, Este es uno de los verdaderos atractivos ya que podemos conseguir un
ahorro de costes en mantenimiento e infraestructuras.
Para poder utilizar Office 365 actualmente solo podemos hacerlo suscribiéndonos a la beta
pública. Desde la URL https://portal.microsoftonline.com/ accederemos a la página de
administración desde la que podremos añadir usuarios, asignar licencias y gestionar los
distintos servicios.
Recursos

WebCast Office365 Office 365 Beta Service Descriptions Centro de recursos del desarrollador
de SharePoint Online (MSDN) Microsoft Office 365 for IT Professionals Jump Start
Este artículo es obra de Mario Cortés Flores

Disponible online en http://desarrolloweb.com/articulos/que-es-office-365.html

Qué es la virtualización
Artículo para personas no técnicas que explica con palabras sencillas el concepto
de la virtualización.
El otro día recibí la consulta de un amigo que quería entender qué es la virtualización y por qué
está tan de moda hoy en día. Ello me ha motivado para escribir este artículo, pues realmente es
un concepto interesante y, aunque ya lo hemos tratado en DesarrolloWeb.com de pasada en
diversos artículos, no tenemos una descripción específica que sirva de referencia para resolver
esta consulta
Realmente, la Wikipedia también ofrece varias notas interesantes sobre el tema de la

virtualización, por lo que no creo conveniente repetirme apuntando las mismas cosas que ya
otras personas han dicho, por lo que voy a intentar explicarlo de una manera más sencilla, para
que pueda ser asimilado por personas sin conocimientos técnicos.
En resumen, así rápidamente, la virtualización que es un proceso por el cual se pueden crear
varios sistemas operativos independientes ejecutándose en la misma máquina. Podrás
entenderlo con este ejemplo:
Piensa en tu ordenador. Tiene un sistema operativo, que puede ser Windows, Linux, OS X o el
que sea. Todos los ordenadores disponen de un sistema operativo y no es más que un
programa que controla sus componentes, como pueden ser los discos duros, DVD y otras
unidades de almacenamiento, la placa de vídeo, la de sonido, etc. El sistema operativo hace de
puente entre los programas de tu ordenador (Word, Excel, Photoshop, Internet Explorer,
Thunderbird, etc.) y los componentes mencionados, creando un entorno donde los diseñadores
de esos programas no tengan que preocuparse sobre cómo está organizado un disco duro o
cómo hacer que aparezcan imágenes en tu monitor a través de la placa de vídeo.
Ahora piensa en otro programa que funciona sobre tu sistema operativo, un tanto especial,
pues no te ofrece la típica aplicación de ofimática o servicios de Internet, sino que es capaz de
crear un entorno donde se ejecutan otros programas, como si fuera un sistema operativo. Eso
es la virtualización.
Así pues, la virtualización es la creación de un entorno virtual donde puedes ejecutar otros
programas de manera independiente. Esos programas serán los mismos que ejecutas
normalmente en tu ordenador, pero funcionarán, por así decirlo, en una réplica de un sistema
operativo. Por tanto, si entendiste lo que era un sistema operativo, podrás entender que la
virtualización es un programa que ofrece el soporte para instalar otros sistemas operativos
sobre tu misma máquina, los que funcionarán de manera encapsulada dentro de ese entorno
virtual.
Por familiarizarnos con la nomenclatura habitual en estos asuntos, se llama sistema físico al

sistema operativo u ordenador real y sistema virtual a aquellos que se ejecutan como
virtualización sobre el sistema físico. De modo que podríamos tener varios sistemas virtuales
ejecutándose sobre un único sistema físico.
Usos de la virtualización
En la práctica, la virtualización sirve para diversas situaciones, gracias a sus enormes
posibilidades. A continuación podrás ver varios ejemplos.
Ejecutar sistemas operativos diferentes al tuyo:
Los usuarios de sistemas operativos a veces necesitan ejecutar programas creados para otros
sistemas operativos. Por ejemplo, los usuarios de Linux a veces tienen necesidad de poner en
marcha un programa como Photoshop, que no existe en ese sistema. Pues bien, con programas
como Wine podrías conseguir tener un Windows funcionando sobre Linux. Existen otros
softwares de virtualización similares para Linux, con lo que los usuarios de ese sistema
operativo ya no tendrán problemas si necesitan poner en marcha cualquier programa que
necesiten y que solo funcione en Windows.
Del mismo modo, usuarios del sistema operativo de Mac OS X, también tienen programas para
hacer virtualización y poder ejecutar programas del sistema operativo Windows, por ejemplo,
en su máquina. Un ejemplo de ello es VirtualBox, que permitiría instalar y correr un sistema
Windows sobre un Mac, pero también otros sistemas operativos.
Nota: En teoría con este programa puedes ejecutar cualquier sistema operativo sobre
cualquier otro sistema. VirtualBox permite hacer virtualización en diferentes sistemas
anfitrión (host en inglés), como Windows o Linux, aparte del propio OS X.
Ejecutar aplicaciones críticas en entornos seguros:
Otro de los usos interesantes de la virtualización es la posibilidad de ejecutar cierto tipo de

aplicaciones con características inseguras en entornos seguros. Dicho de otro modo, la
virtualización es capaz de generar un entorno donde se puede ejecutar malware sin padecer
mayores problemas. Gracias a trabajar en un entorno virtual, las personas que se dedican a
analizar softwares maliciosos pueden fácilmente volver a un estado anterior del sistema
operativo y, a pesar de haber sido infectados, recuperar sin esfuerzo el estado limpio del
sistema.
El problema aquí es que cada vez es más frecuente que los propios malware detecten diversos
parámetros si el entorno donde están ejecutándose está virtualizado, para no realizar acción
alguna en ese caso. En estos casos y a modo de curiosidad, comento que las personas que
analizan el malware tienen que recurrir a sistemas de virtualización menos conocidos o
directamente a la ejecución de los programas maliciosos en máquinas físicas.
Alojamiento web en servidores virtuales:

Otro de los marcos en los que encontramos habitualmente usos de la virtualización es en las
empresas de hosting. Ellos tienen unos paquetes de alojamiento que se suelen llamar
“servidores virtuales”, también conocidos con las siglas VPS (Virtual Private Server), que
funcionan como si fueran servidores independientes o dedicados, pero donde en realidad se
ejecutan varios servidores en la misma máquina. Esto tiene la ventaja de abaratar costes (pues
de una máquina física se obtienen varios servidores virtuales), junto con unas posibilidades de
configuración bastante más versátiles que los alojamientos compartidos tradicionales.
Virtualización en Cloud Computing:
La virtualización es uno de los fundamentos en los que se basa el Cloud Computing. En este
modelo de trabajo no disponemos de un servidor, sino que se virtualizan todos los recursos
necesarios para que nuestra plataforma funcione. En la nube podemos estar utilizando los
recursos de una máquina, o de 1000 y realmente no tenemos por qué saberlo, ni nos tiene por
qué preocupar. Los sistemas se encuentran virtualizados, de modo que se pueden escalar en
función de la demanda y sin ningún coste operacional. Sería un poco largo de explicar este
novedoso concepto y para ello podemos mejor leer el artículo Qué es Cloud Computing.
Conclusión
La virtualización es una herramienta útil tanto para los usuarios comunes como para las
pequeñas y grandes corporaciones. No es que esté de moda ahora particularmente, puesto que
ya hace muchos años que existen diversos programas que nos ayudan a virtualizar sistemas
operativos, pero gracias a los servidores virtuales y al Cloud Computing hoy se ha puesto aun
más en boca de todos.
Esta ha sido una sencilla introducción a la virtualización, concepto que realmente tiene
muchas otras cosas que merece la pena conocer, si es que nos interesa ampliar la información.
De nuevo, recomiendo la lectura del artículo de la Wikipedia sobre virtualización. No obstante,
esperamos que por medio de este texto hayamos podido resolver las dudas más fundamentales
de las personas poco técnicas.

Disponible online en http://desarrolloweb.com/articulos/que-es-virtualizacion.html

Qué es el overclocking
Vemos qué es y en que consiste el llamado overclocking en equipos informáticos.
Para empezar este artículo diremos que la palabra overclocking significa trabajar por encima
del reloj, es decir, que lo que se pretende con esto es que un dispositivo, en este caso
informático, trabaje por encima de las posibilidades especificadas por su fabricante,
aumentando así su rendimiento.
Antiguamente esta misma práctica se conocía como undertiming pero fue perdiendo interés
debido a la constante mejora de los dispositivos sin tener que forzarlos.
Actualmente esta volviendo a resurgir debido a las mejoras realizadas en dicha práctica, que
hacen que los dispositivos lleguen a alcanzar incluso el doble de sus posibilidades iniciales sin
sufrir grandes riesgos.
Es importante recalcar que esto es posible siempre y cuando la refrigeración sea buena, de lo
contrario el dispositivo tiene el peligro de quemarse.
Esta práctica está muy extendida entre los usuarios de informática más exigentes, que tratan
de llevar al máximo el rendimiento de sus máquinas, asumiendo ciertos riesgos como son la
perdida del dispositivo, de datos o incluso del sistema completo.
Generalmente esta practica se realiza sobre placas base y procesadores, aunque hoy en día se
esta realizando también sobre tarjetas gráficas, memorias y dispositivos PCI.
En definitiva El overclocking puede hacer que nuestro ordenador rinda más con un coste
mínimo. De esta manera, podremos retrasar la compra de un equipo nuevo, y comprar uno
mejor que el que teníamos planeado por el mismo precio.
Problemas
Generalmente los mayores problemas vienen por la refrigeración pero tenemos otros
problemas como son:
Si forzamos el micro demasiado, normalmente se negará a arrancar, tendremos

bloqueos ocasionales o algunos programas no funcionarán, etc.
Al aumentar la velocidad de funcionamiento, aumentamos el calor que desprende el
mismo, que en caso de ser excesivo puede ocasionar fallos e incluso defectos
permanentes en el chip.
Alteración de la configuración global del equipo.
Realizar overclocking sobre el procesador o modificar la configuración “de fábrica” de
cualquiera de los componentes internos del mismo comporta la pérdida automática de

la garantía.
Ejemplos de overclocking
Cambiar la velocidad de cpu
Cambiar velocidad de tarjeta gráfica
Cambiar velocidad de dispositivos PCI
Alteración del rendimiento de la memoria RAM
Para que os hagáis una idea vamos a ver en concreto como se haría overclocking de la CPU.
Pongamos que tenemos un chip a 600 Mhz y queremos aumentarlo hasta los 700 Mhz. Bien
pues para ello necesitamos modificar la velocidad del bus de la placa base y el multiplicador de
la CPU.
De esta forma tendríamos unos datos iniciales:
Velocidad del bus: 100 Mhz multiplicador de la CPU: x 6 Velocidad final de CPU: 600 Mhz
Y haciendo overclocking:
Velocidad del bus: 108 Mhz Multiplicador de la CPU: x 6,5 Velocidad final de la CPU :750Mhz
Si os fijáis en el ejemplo hemos modificado ligeramente los valores y hemos conseguido 100
Mhz más. Y además dichos valores los puedes modificar desde la BIOS de tu placa base.
Este es sólo un ejemplo pero hay muchos y algunos fuerzan los dispositivos bastante, por lo
que siempre tenemos que tener en cuenta el grado de peligro que implica esta actividad.
Conclusión
El overclocking es una practica peligrosa, pero que puede traerte unos beneficios realmente
altos en lo referente a rendimiento de equipos informáticos.
Nota: Si necesitas saber información sobre velocidades del bus, del multiplicador, etc de tu
ordenador en Desarrolloweb.com hablamos de una herramienta que te puede ayudar, se
trata de CPU-Z
Este artículo es obra de Sara Alvarez

Disponible online en http://desarrolloweb.com/articulos/que-es-overclocking.html

Introducción a las redes
Concepto e historia de las redes de datos y su repercusión en la sociedad.
En la actualidad nos encontramos ante una de las eras informáticas más importantes, sobre
todo en lo referente a Internet y las redes de datos.
La globalización de Internet ha sido más rápida de lo que se esperaba, por lo en muchos

aspectos hemos tenido que aprender, aplicar y actualizar conceptos que hasta hace muy poco
eran impensables para la mayoría de la población.
Esto nos ha llevado a depender casi por completo de La red de Redes (Internet), para nuestras
relaciones sociales, comerciales y políticas.
A medida que los programadores sigan innovando y creando nuevos conceptos, Internet jugará
un papel decisivo en nuestros proyectos de futuro.
La comunicación en la actualidad es casi tan importante como el aire que respiramos. Los
métodos que utilizamos para comunicarnos están en continua evolución y es aquí donde se
centra Internet, ¿qué es Internet sino, sino una forma de comunicación?.
Para entender todo esto mejor, considero que necesitamos saber un poco más sobre la historia
de las redes, por ello vamos a comentar de forma muy general la evolución histórica de las
redes de datos.
Historia de las redes

Para empezar a hablar de redes debemos remontarnos a mediados del siglo XIX, donde se
utilizaba el telégrafo como forma de comunicación entre grandes distancias geográficas.
Algunos expertos consideran las señales de humo de los indios americanos como las primeras
redes rudimentarias, ya que servían para pasar información entre puntos alejados
geográficamente a través del humo. Pero no esta del todo aceptado por lo que lo dejo como
mera anécdota.
Posteriormente apareció la red telefónica, que fue el principal medio de transmisión de datos a
nivel mundial y el que revoluciono el mundo de las comunicaciones, no solo a nivel militar y
político sino a nivel personal, ya que poco a poco se fueron instalando teléfonos en las casas
particulares.
Ya a principios de los 60, aparecieron las primeras redes, que sólo ofrecían una conexión tipo
cliente-servidor, es decir, un ordenador hacia de servidor y otro de cliente, los clientes no
podían estar conectados entre sí.

A partir de aquí las redes han ido evolucionando rápidamente y ya en 1967 nace la red
antecesora de Internet, la ARPANET. Esta red fue creada con fines militares y de gobierno
pero a medida que fue añadiendo nodos (servidores) terminó por evolucionar a la conocida red
Internet.
Nota: Como curiosidad comentar que España se conecta por primera vez a Internet en
1985.
Como podréis observar a medida que Internet crece, se promueve la comunicación sin limites y
aumentan las posibilidades de hacer negocios, el crecimiento de la educación y la
investigación, etc.
Actualmente Internet esta presente en nuestras vidas, tanto a nivel personal como profesional
haciéndolas más fáciles y divertidas.
Conclusión
No sabemos hasta donde puede llegar Internet ni que efectos tendrá en el futuro, pero
podemos asegurar que actualmente las redes nos han ayudado en muchos aspectos, pero sobre
todo en la comunicación entre personal de diferentes partes del mundo. En definitiva las redes
son algo bueno en nuestra sociedad.
Este artículo es obra de Sara Alvarez

Disponible online en http://desarrolloweb.com/articulos/introduccion-redes.html

Vídeo: Qué es JSON
Un vídeo que explica qué es JSON, el formato ligero para intercambio de datos,
con notación de objeto Javascript.
Si quieres saber qué es JSON de una manera amena, te recomendamos ver este vídeo de una
presentación que hemos emitido en DesarrolloWeb.com / EscuelaIT. Se trata de explicar qué
es JSON, por qué es tan relevante para los desarrolladores web y los desarrolladores de
aplicaciones y cuáles son sus diferencias y similitudes con otro formato para el intercambio de
datos como es XML.
JSON es un formato de intercambio de información entre sistemas informáticos, cuyas siglas

son acrónimo de JavaScript Object Notation (Notación de Objeto JavaScript). En pocas
palabras podríamos decir que es una notación para definir datos, basada en el lenguaje
Javascript que resulta muy ligera de transferir, lo que la hace idónea para el intercambio de
datos.
A lo largo de este vídeo encontrarás una presentación en la que expliqué qué es JSON para una
de las clases experimentales que emitimos en la convocatoria al curso de Bases de Datos que
estamos organizando, a través de nuestra plataforma para la formación tutorizada EscuelaIT.
Es una presentación rápida y principalmente teórica, que sirvió para ofrecer como
introducción a una práctica de iOS que realizamos en esta misma sesión. En este artículo
puedes ver la parte inicial de la sesión, en la que se habló de JSON y se adelantó el resto del
guión de la sesión que se iba a emitir.
Nota: Aclaramos que esta sesión no corresponde con lo que se va a ver en el curso
completo de Bases de Datos, en el que dedicaremos mucho más tiempo a este lenguaje y
sobre todo a hacer prácticas para trabajar con JSON.
El vídeo se desarrolla atendiendo a los siguientes puntos principales:
Por qué intercambio de datos:
En el mundo en el que vivimos todo está conectado y tenemos que comunicar los unos con los
otros. Para solucionar la barrera idiomática se aprenden idiomas o se habla en determinadas
lenguas que conocen la mayoría. Sin embargo, cuando hablamos de sistemas informáticos
tenemos que entender que diversos entornos necesitan comunicar los unos con los otros y
salvar las barreras de incompatibilidad de los distintos lenguajes de programación o
plataformas con las que cada sistema está realizado. Es por ello que surgen los lenguajes de
intercambio de datos.

XML / JSON:
Son los dos lenguajes más utilizados para el intercambio de datos, de los cuales se explican
características fundamentales en el vídeo. Algunas similitudes de estos lenguajes son que
ambos se escriben en archivos de texto plano, que son entendibles por cualquier lenguaje de
programación.
Cómo es JSON:
Luego nos dedicamos a explicar cómo es un JSON por dentro. Cuáles son las características de
la notación de objeto Javascript y el abanico de datos que se pueden especificar a través de
JSON, viendo algún ejemplo de código JSON para especificar datos concretos.
Diferencias entre JSON y XML:
También nos dedicamos brevemente a mostrar las diferencias fundamentales entre los
lenguajes XML y JSON, tratando de destacar varios detalles que hacen únicos a estos lenguajes
y que nos servirán para decantarnos por uno u otro dependiendo de las características de
nuestro proyecto.
Ejemplos de XML y JSON en la "vida real":
Finalizamos la exposición destacando algunas de las utilidades de JSON y XML que nos
encontramos en nuestro día a día como usuarios de Internet o desarrolladores. Vemos que los
archivos RSS son en realidad archivos en un sublenguaje del XML y vemos algunas de las
principales API de servicios web y cómo usan JSON para transferir la información.
Con esto llegamos al final de la presentación, pero recordamos que no es más que un aperitivo
de lo que veremos en el Curso de Bases de Datos de EscuelaIT, donde además tendremos
oportunidad de poner en marcha aplicaciones prácticas en programación, que nos ayuden a
producir y consumir JSON desde PHP. Esto es, consumir JSON que venga desde servicios web
o APIs y queramos usar en nuestra aplicación, así como generar datos en formato JSON y
enviarlos al cliente para procesarlos desde Javascript.
Puedes ver el vídeo de JSON a continuación y os recordamos que esta sesión continuó con una
clase práctica de uso de JSON en una aplicación iOS, que os mostraremos en el siguiente
artículo de DesarrolloWeb.com.

http://desarrolloweb.com/articulos/que-es-json-video.html

Disponible online en http://desarrolloweb.com/articulos/que-es-json-video.html

Qué es BackboneJS
BackboneJS es una librería Javascript para programación del lado del cliente que
nos ofrece diferentes ventajas y utilidades en la programación, atendiendo a
patrones, de una manera flexible.
BackboneJS es una librería para el desarrollo de sitios web, principalmente usada para
aplicaciones web con bastante interacción con el cliente, donde se hace un uso intensivo de
Javascript, Ajax, etc. Te permite desarrollar en Javascript atendiendo a patrones, con una
variante del paradigma MVC, el mismo que se ha introducido con fuerza en la programación
del lado del servidor y que, desde hace menos tiempo, viene empezando a ser costumbre en el
desarrollo del lado del cliente.
Se trata de una heramienta muy indicada en aplicaciones de una sola página, aunque también
es útil para otros tipos de sitios, multipágina, donde se encuentran interfaces de usuario
avanzadas. Facilita la ordenación del código y la sincronización de las vistas con los datos de la
aplicación. Todo ello redunda en una programación más modularizada y con mayor separación
entre las partes de la aplicación, como presentación, datos, etc.
Utilizando palabras sencillas, BackboneJS es un conjunto de objetos que tienen métodos (o

funciones, si lo prefieres llamar así) que van a proveer de estructura a nuestro código, facilitar
el trabajo con datos, vistas para producir nuestro HTML, las interacciones para implementar
comportamientos que deba realizar frente a acciones del usuario y los servicios para comunicar
con cualquier tecnología que usemos del lado del servidor, ya sea NodeJS, PHP, Ruby, .NET,
etc.
En definitiva, es un paquete de utilidades que nos permite hacer una programación de mayor
calidad y aplicaciones web del lado del cliente más fácilmente mantenibles, sobre todo es útil
cuando ya nos encontramos ante aplicaciones web de cierta complejidad.
Nota: Este artículo y los siguientes están extractados del hangout Conocer Backbone.js

#BackboneIO que nos ofreció Erick Ruiz de Chavez en uno de los eventos online de
DesarrolloWeb.com.
Puedes encontrar el sitio oficial de BackboneJS en backbonejs.org
Facilidades de BackboneJS
Tal como se definen ellos mismos, Backbone.js ofrece una estructura para aplicaciones que
hace uso intensivo de Javascript y que provee de modelos llave / valor enlazables mediante
eventos, colecciones con la posiblidad de realizar diferentes utilidades por medio de una API,
vistas con manejadores de eventos declarativos y conexión a interfaces REST nuevas o ya
disponibles anteriormente.
De manera resumida, las facilidades de la librería Backbone son las siguientes:
Permite la programación atendiendo al paradigma MV...C? (Existe un debate si es MVR

porque en realidad no son controladores sino "Routeadores").
Te ayuda a crear estructuras bien definidas para los datos de tu aplicación y facilita la
creación de eventos cuando los datos cambian. Esto permite olvidarnos de la revisión de
las variables o la propagación de los cambios en la aplicación cuando los datos de dichas
estructuras cambian.
Simplifica el uso de vistas, que te ayudan a pintar o "renderizar" interfaces de usuario
en la página.
Permite el uso de colecciones de modelos, en los que tendrás acceso a diferentes
operaciones sobre los mismos, como filtrar, buscar, recibir notificaciones cuando
cambien, etc.
Simplifica y ayuda a ordenar el código de las peticiones AJAX para realizar solicitudes
al servidor.
Etc.
Nota: Para los que no lo conozcan, MVC es un patrón de desarrollo en el que se trata de
separar las responsabilidades del código fuente de las aplicaciones, separándolo en diversas
capas o partes, que son los Modelos (para trabajar con los datos), Vistas (código que trabaja
con la presentación) y los Controladores (para implementar la lógica del negocio, es decir,
la forma en la que interaccionan tus vistas, o lo que ve el usuario, con tus modelos, o tus
datos).
Qué tipo de librería Javascript es Backbone.js

Quizás merezca la pena explicar dónde encaja Backbone en el panorama de los frameworks y
librerías Javascript para que las personas que llegan nuevas aquí puedan despejar una de las
preguntas típicas al conocer Backbone.js.
¿Librería o framework? Se trata de un API de programación, por lo que podemos llamarlo

librería sin lugar a equivocación. Además, te permite trabajar con una variante del MVC, por lo
que también te impone una manera específica de organizar tu código, lo que es una de las

características de los frameworks, sin embargo, como veremos, Backbone es bastante flexible,
permitiendo aplicarlo a un sitio web completo o a un único módulo, algo que quizás nos aleja
de la idea de framework.
No obstante, esto no es más que una nomenclatura. Lo que debe quedar claro es que no viene a
sustituir a otras librerías del lado del cliente como pueden ser jQuery, Mootools, Ext.js... sino
que viene a aportar algo adicional que éstas no ofrecen, y que es fundamental para crear código
más mantenible en arquitecturas web medianamente complejas. BackboneJS en sí es un
paquete que tiene a jQuery como dependencia, o en otras palabras, su construcción está
basada en jQuery, por lo que se puede entender que no viene a sustituir, sino a complementar.
Entonces, BackboneJS lo podemos considerar como una nueva herramienta que viene a
facilitarnos el desarrollo y la cual tenemos que aprender para hacer desarrollo de alto nivel, útil
en cualquier proyecto, pues se trata de un paquete de ventajas adicionales al programar en
Javascript.
Dónde usar BackboneJS

Lo puedes usar donde te apetezca, nunca está de más implementar mecanismos que te ayuden
a crecer si ese proyecto va evolucionando, sin embargo, BackboneJS es una librería
especialmente indicada para el uso en aplicaciones web que hagan un uso intensivo de
Javascript.
¡No lo uses para asignar un comportamiento a un botón! o en cualquier página donde

piensas tener pocos elementos con interacción con el usuario y donde las funciones
manejadoras sean bastante sencillas. El usar Backbone aporta un poco de complejidad al
desarrollo, por lo que no sería tan adecuado para pequeños proyectos o páginas bastante
estáticas. Si tu código es muy pequeño y lo puedes tener en unas decenas de líneas de código,
no se recomendaría usar Backbone.
Usa BackboneJS en una aplicación web en la que ya se entiende que vas a tener bastante
lógica de negocio, bastante interacción, bastantes métodos y eventos trabajando. Allí ya es un
buen entorno donde sería excelente usar Backbone.js. Es útil también en cualquier página, que
aun siendo sencilla, tiene los mismos datos y se muestran en varios sitios distintos, replicados
en diversos elementos, ya que te permite mantener la sincronización con todos esos datos de
una manera sencilla y prácticamente automática, sin que tengas que estar revisando
constantemente cuándo cambian tus datos para actualizarlos en todos los lugares donde
aparecen.
Conclusión
Creo que con lo visto hasta el momento tendríamos una buena idea de lo que es BackboneJS,
aunque seguro que te habrás quedado con ganas de más y sobre todo con interés de ver otros
artículos más técnicos en los que nos metamos más en materia. En breve estaremos
produciendo este contenido.
Pero recuerda, este artículo está extractado de un hangout que realizamos en

DesarrolloWeb.com y que tienes disponible en el vídeo "Conocer BackboneJS". Fue un evento

realizado en directo que nos ofreció mucho más contenido interesante y de utilidad. En este
artículo solo hemos cubierto hasta el minuto 22 de ese programa, así que si te interesa seguir
ya mismo, te recomiendo prestarle atención.
Nosotros vamos a seguir transcribiendo el contenido presentado en este hangout, así que si
deseas saber más también puedes continuar esta lectura con el artículo Los eventos en
BackboneJS.
Este artículo es obra de Erick Ruiz de Chavez

Disponible online en http://desarrolloweb.com/articulos/que-es-backbonejs.html

Qué es MVC
Te explicamos de manera general MVC, Model - View - Controller o Modelo -

Vista - Controlador un patrón de diseño de software para programación que
propone separar el código de los programas por sus diferentes
responsabilidades.
En líneas generales, MVC es una propuesta de diseño de software utilizada para implementar
sistemas donde se requiere el uso de interfaces de usuario. Surge de la necesidad de
crear software más robusto con un ciclo de vida más adecuado, donde se potencie la facilidad
de mantenimiento, reutilización del código y la separación de conceptos.
Su fundamento es la separación del código en tres capas diferentes, acotadas por su

responsabilidad, en lo que se llaman Modelos, Vistas y Controladores, o lo que es lo
mismo, Model, Views & Controllers, si lo prefieres en inglés. En este artículo estudiaremos con
detalle estos conceptos, así como las ventajas de ponerlos en marcha cuando desarrollamos.
MVC es un "invento" que ya tiene varias décadas y fue presentado incluso antes de la aparición
de la Web. No obstante, en los últimos años ha ganado mucha fuerza y seguidores
gracias a la aparición de numerosos frameworks de desarrollo web que utilizan el
patrón MVC como modelo para la arquitectura de las aplicaciones web.
Nota: Como ya hemos mencionado, MVC es útil para cualquier desarrollo en el que
intervengan interfaces de usuario. Sin embargo, a lo largo de este artículo explicaremos el
paradigma bajo el prisma del desarrollo web.
Por qué MVC

La rama de la ingeniería del software se preocupa por crear procesos que aseguren calidad en
los programas que se realizan y esa calidad atiende a diversos parámetros que son deseables

para todo desarrollo, como la estructuración de los programas o reutilización del código, lo que
debe influir positivamente en la facilidad de desarrollo y el mantenimiento.
Los ingenieros del software se dedican a estudiar de qué manera se pueden mejorar los
procesos de creación de software y una de las soluciones a las que han llegado es la
arquitectura basada en capas que separan el código en función de sus responsabilidades o
conceptos. Por tanto, cuando estudiamos MVC lo primero que tenemos que saber es que está
ahí para ayudarnos a crear aplicaciones con mayor calidad.
Quizás, para que a todos nos queden claras las ventajas del MVC podamos echar mano de unos
cuantos ejemplos:
1. Aunque no tenga nada que ver, comencemos con algo tan sencillo como son el HTML y
las CSS. Al principio, en el HTML se mezclaba tanto el contenido como la presentación.
Es decir, en el propio HTML tenemos etiquetas como "font" que sirven para definir las
características de una fuente, o atributos como "bgcolor" que definen el color de un
fondo. El resultado es que tanto el contenido como la presentación estaban juntos y si
algún día pretendíamos cambiar la forma con la que se mostraba una página, estábamos
obligados a cambiar cada uno de los archivos HTML que componen una web, tocando
todas y cada una de las etiquetas que hay en el documento. Con el tiempo se observó
que eso no era práctico y se creó el lenguaje CSS, en el que se separó la
responsabilidad de aplicar el formato de una web.
2. Al escribir programas en lenguajes como PHP, cualquiera de nosotros comienza
mezclando tanto el código PHP como el código HTML (e incluso el Javascript) en el
mismo archivo. Esto produce lo que se denomina el "Código Espagueti". Si algún día
pretendemos cambiar el modo en cómo queremos que se muestre el contenido, estamos
obligados a repasar todas y cada una de las páginas que tiene nuestro proyecto. Sería
mucho más útil que el HTML estuviera separado del PHP.
3. Si queremos que en un equipo intervengan perfiles distintos de profesionales y trabajen
de manera autónoma, como diseñadores o programadores, ambos tienen que tocar los
mismos archivos y el diseñador se tiene necesariamente que relacionar con mucho
código en un lenguaje de programación que puede no serle familiar, siendo que a éste
quizás solo le interesan los bloques donde hay HTML. De nuevo, sería mucho más fácil
la separación del código.
4. Durante la manipulación de datos en una aplicación es posible que estemos accediendo
a los mismos datos en lugares distintos. Por ejemplo, podemos acceder a los datos de un
artículo desde la página donde se muestra éste, la página donde se listan los artículos de
un manual o la página de backend donde se administran los artículos de un sitio web. Si
un día cambiamos los datos de los artículos (alteramos la tabla para añadir nuevos
campos o cambiar los existentes porque las necesidades de nuestros artículos varían),
estamos obligados a cambiar, página a página, todos los lugares donde se consumían
datos de los artículos. Además, si tenemos el código de acceso a datos disperso por
decenas de lugares, es posible que estemos repitiendo las mismas sentencias de acceso a
esos datos y por tanto no estamos reutilizando código.
Quizás te hayas visto en alguna de esas situaciones en el pasado. Son solo son simples
ejemplos, habiendo decenas de casos similares en los que resultaría útil aplicar una
arquitectura como el MVC, con la que nos obliguemos a separar nuestro código atendiendo a

sus responsabilidades.
Ahora que ya podemos tener una idea de las ventajas que nos puede aportar el MVC,
analicemos las diversas partes o conceptos en los que debemos separar el código de nuestras
aplicaciones.
Modelos
Es la capa donde se trabaja con los datos, por tanto contendrá mecanismos para acceder
a la información y también para actualizar su estado. Los datos los tendremos habitualmente
en una base de datos, por lo que en los modelos tendremos todas las funciones que accederán a
las tablas y harán los correspondientes selects, updates, inserts, etc.
No obstante, cabe mencionar que cuando se trabaja con MCV lo habitual también es utilizar
otras librerías como PDO o algún ORM como Doctrine, que nos permiten trabajar con
abstracción de bases de datos y persistencia en objetos. Por ello, en vez de usar directamente
sentencias SQL, que suelen depender del motor de base de datos con el que se esté trabajando,
se utiliza un dialecto de acceso a datos basado en clases y objetos.
Vistas
Las vistas, como su nombre nos hace entender, contienen el código de nuestra aplicación que
va a producir la visualización de las interfaces de usuario, o sea, el código que nos permitirá
renderizar los estados de nuestra aplicación en HTML. En las vistas nada más tenemos los
códigos HTML y PHP que nos permite mostrar la salida.
En la vista generalmente trabajamos con los datos, sin embargo, no se realiza un acceso directo
a éstos. Las vistas requerirán los datos a los modelos y ellas se generará la salida, tal como
nuestra aplicación requiera.
Controladores
Contiene el código necesario para responder a las acciones que se solicitan en la aplicación,
como visualizar un elemento, realizar una compra, una búsqueda de información, etc.
En realidad es una capa que sirve de enlace entre las vistas y los modelos,
respondiendo a los mecanismos que puedan requerirse para implementar las
necesidades de nuestra aplicación. Sin embargo, su responsabilidad no es manipular
directamente datos, ni mostrar ningún tipo de salida, sino servir de enlace entre los modelos y
las vistas para implementar las diversas necesidades del desarrollo.
Arquitectura de aplicaciones MVC

A continuación encontrarás un diagrama que te servirá para entender un poco mejor cómo
colaboran las distintas capas que componen la arquitectura de desarrollo de software en el
patrón MVC.

En esta imagen hemos representado con flechas los modos de colaboración entre los distintos
elementos que formarían una aplicación MVC, junto con el usuario. Como se puede ver, los
controladores, con su lógica de negocio, hacen de puente entre los modelos y las vistas. Pero
además en algunos casos los modelos pueden enviar datos a las vistas. Veamos paso a paso
cómo sería el flujo de trabajo característico en un esquema MVC.
1. El usuario realiza una solicitud a nuestro sitio web. Generalmente estará

desencadenada por acceder a una página de nuestro sitio. Esa solicitud le llega al
controlador.
2. El controlador comunica tanto con modelos como con vistas. A los modelos
les solicita datos o les manda realizar actualizaciones de los datos. A las vistas les
solicita la salida correspondiente, una vez se hayan realizado las operaciones
pertinentes según la lógica del negocio.
3. Para producir la salida, en ocasiones las vistas pueden solicitar más información
a los modelos. En ocasiones, el controlador será el responsable de solicitar todos los
datos a los modelos y de enviarlos a las vistas, haciendo de puente entre unos y otros.
Sería corriente tanto una cosa como la otra, todo depende de nuestra implementación;
por eso esa flecha la hemos coloreado de otro color.
4. Las vistas envían al usuario la salida. Aunque en ocasiones esa salida puede ir de
vuelta al controlador y sería éste el que hace el envío al cliente, por eso he puesto la
flecha en otro color.
Lógica de negocio / Lógica de la aplicación

Hay un concepto que se usa mucho cuando se explica el MVC que es la "lógica de negocio". Es
un conjunto de reglas que se siguen en el software para reaccionar ante distintas situaciones.
En una aplicación el usuario se comunica con el sistema por medio de una interfaz, pero
cuando acciona esa interfaz para realizar acciones con el programa, se ejecutan una serie de
procesos que se conocen como la lógica del negocio. Este es un concepto de desarrollo de
software en general.
La lógica del negocio, aparte de marcar un comportamiento cuando ocurren cosas dentro de
un software, también tiene normas sobre lo que se puede hacer y lo que no se puede hacer. Eso
también se conoce como reglas del negocio. Bien, pues en el MVC la lógica del negocio queda
del lado de los modelos. Ellos son los que deben saber cómo operar en diversas situaciones y
las cosas que pueden permitir que ocurran en el proceso de ejecución de una aplicación.
Por ejemplo, pensemos en un sistema que implementa usuarios. Los usuarios pueden realizar
comentarios. Pues si en un modelo nos piden eliminar un usuario nosotros debemos borrar
todos los comentarios que ha realizado ese usuario también. Eso es una responsabilidad del
modelo y forma parte de lo que se llama la lógica del negocio.
Nota: Si no queremos que esos comentarios se pierdan otra posibilidad sería mantener el
registro del usuario en la tabla de usuario y únicamente borrar sus datos personales.
Cambiaríamos el nombre del usuario por algo como "Jon Nadie" (o cualquier otra cosa), de
modo que no perdamos la integridad referencial de la base de datos entre la tabla de
comentario y la tabla de usuario (no debe haber comenarios con un id_usuario que luego
no existe en la tabla de usuario). Esta otra lógica también forma parte de lo que se
denomina lógica del negocio y se tiene que implementar en el modelo.
Incluso, en nuestra aplicación podría haber usuarios especiales, por ejemplo "administradores"
y que no está permitido borrar, hasta que no les quitemos el rol de administrador. Eso también
lo deberían controlar los modelos, realizando las comprobaciones necesarias antes de borrar
efectivamente el usuario.
Sin embargo existe otro concepto que se usa en la terminología del MVC que es la "lógica de
aplicación", que es algo que pertenece a los controladores. Por ejemplo, cuando me piden ver el
resumen de datos de un usuario. Esa acción le llega al controlador, que tendrá que acceder al
modelo del usuario para pedir sus datos. Luego llamará a la vista apropiada para poder
mostrar esos datos del usuario. Si en el resumen del usuario queremos mostrar los artículos
que ha publicado dentro de la aplicación, quizás el controlador tendrá que llamar al modelo de
artículos, pedirle todos los publicados por ese usuario y con ese listado de artículos invocar a la
vista correspondiente para mostrarlos. Todo ese conjunto de acciones que se realizan
invocando métodos de los modelos y mandando datos a las vistas forman parte de la lógica de
la aplicación.
Nota: Este concepto Lógica de aplicación no está tan extendido entre todos los teóricos,
pero nos puede ayudar a comprender dónde está cada responsabilidad de nuestro sistema y
dónde tenemos que escribir cada parte del código.

Otro ejemplo. Tenemos un sistema para borrar productos. Cuando se hace una solicitud a una
página para borrar un producto de la base de datos, se pone en marcha un controlador que
recibe el identificador del producto que se tiene que borrar. Entonces le pide al modelo que lo
borre y a continuación se comprueba si el modelo nos responde que se ha podido borrar o no.
En caso que se haya borrado queremos mostrar una vista y en caso que no se haya borrado
queremos mostrar otra. Este proceso también está en los controladores y lo podemos
denominar como lógica de la aplicación.
De momento ¡eso es todo! Esperamos que este artículo haya podido aclarar los distintos
conceptos relacionados con el MVC y aunque no hayamos visto una implementación en código,
te sirva para poder investigar a partir de aquí. En DesarrolloWeb.com hemos tratado con
mayor detalle algunos aspectos de MVC y la relación entre vistas y modelos y sus
interpretaciones en un artículo que seguro te interesará. Además podrás ver cómo trabajar con
MVC en el Manual de Codeigniter, en el Manual de Laravel y en el Manual del framework
ASP.NET MVC.
Paralelamente queremos que conozcas nuestra plataforma para la formación EscuelaIT, donde
podrás aprender con nosotros todo sobre este MVC y otros asuntos relacionados con la
arquitectura del software en este curso de MVC y otras Técnicas de desarrollo de aplicaciones
web en PHP.

Disponible online en http://desarrolloweb.com/articulos/que-es-mvc.html

¿Pueden los modelos acceder a las vistas

directamente en MVC?
MVC es un patrón de diseño susceptible a interpretaciones que producirán

diversas implementaciones. En este artículo discutimos acerca de la manera
correcta de aplicar MVC en torno a la pregunta ¿Pueden acceder las vistas
directamente al modelo?
MVC es un patrón de diseño estructural, que nos indica cómo organizar el código de la
aplicación en diferentes "capas", atendiendo a su responsabilidad. No es el objetivo hablar de
MVC en plan general, pues ya se hizo anteriormente, sino sobre sus variantes a la hora de
implementarlo.
Para ello hemos preguntado a diversos compañeros de la comunidad de DesarrolloWeb.com

que nos han dado sus opiniones en base a la experiencia. El objetivo es servir de reflexión a los
lectores y hacernos pensar un poco acerca de diversas formas de implementar la separación del
código.
La clave no obstante, ya te lo adelantamos, es el "separation of concerns" o la "separación por

preocupaciones". Aunque quizás "preocupaciones" que es una traducción literal no se ajuste
tan bien como "Responsabilidades" o "intereses". Y es que, a la hora de aplicar MVC
encontramos diversas variantes y todas ellas se encargan de separar el código por partes, según
la función que realiza cada una.
La separación del código es una de las preocupaciones mayores de los programadores que
realmente quieren esforzarse por producir software que sea fácilmente mantenible, escalable,
etc. Separamos el código en MVC en lo que son Modelos, Vistas y controladores, pero también
es una buena práctica separar código en muchos otros ámbitos, como la creación de objetos y
su uso, las validaciones de las operaciones, etc.
Las vistas son más que sistemas de templates

Este es el argumento por el que comenzamos esta discusión y no lo traje yo, sino uno de los

estudiantes en un curso que estábamos impartiendo en EscuelaIT.
Las vistas se encargan de mostrar la presentación de los datos de la aplicación. Generalmente

en MVC los controladores son los encargados de preparar toda esa información a la vista y
luego invocar la vista pasándole todos los datos que se han recabado.
Pero puede haber otras interpretaciones en las que las vistas tengan un poco más de
responsabilidad. Por ejemplo, hay programadores que sostienen que las vistas deberían poder
acceder directamente a los modelos, para solicitar los datos por ellas mismas.
Si queréis conocer diversos argumentos en cuanto a esta interpretación es interesante la

lectura del artículo The View gets its own data from the Model que está salpicado con diversas
referencias bibliográficas que lo hacen especialmente confiable. Si tienes un rato no estaría
nada mal echarle una lectura, porque se traducirá en un buen ejercicio intelectual dedicado a la
programación. Si no tienes tiempo de leerlo, a continuación te hacemos un pequeño resumen:
En el mencionado artículo, el autor hace referencia en numerosas ocasiones a que, según su

opinión, la comunidad de PHP ha simplificado demasiado la responsabilidad de la vista,
creando código que produce un alto acoplamiento entre los controladores y las vistas. El
motivo es que, al necesitar enviarle los datos a la vista, eso produce que tengas un fuerte
acoplamiento con la vista. Si quieres reutilizar la vista desde otro controlador además tendrás
que repetir el mismo código, para generar esos datos, en todos los controladores que tengan
que usar una misma vista.
Son buenos argumentos a favor de ello y no puedo decir que el autor esté totalmente
desacertado, sino todo lo contrario, expone muy buenas ideas. Pero le voy a contradecir en dos
puntos:
1. En el MVC más enfocado en sistemas como Java (donde tenemos ventanas, interfaces
de usuario, etc.) le encuentro una aplicación muy apropiada, ya que las vistas están
"vivas" y cualquier cambio sobre ellas implica cambios en el modelo que deberían ser
realizados en el instante. En esos sistemas es necesaria una colaboración estrecha entre
la vista y el modelo, pero la programación web es diferente en este sentido y las vistas
tienen datos "cocinados en el servidor" y enviados al cliente. Solo cuando se produce
una nueva solicitud al servidor se pueden recibir nuevos datos con los que actualizar el
modelo. Pero esa nueva solicitud ya implica entrar entrar de nuevo en un ciclo de
llamadas entre integrantes de nuestra aplicación, controlador frontal, controladores
particulares, modelos y vistas, por lo que no veo tan negativo que la vista deba recibir
los datos del controlador, ya que el propio controlador es el que en algún momento
gestionará la solicitud.
2. En la mayoría de casos una acción del controlador produce una salida que está en una
vista. Todo lo que rodea a la vista está en un layout, que controlas con el sistema de
templates y las vistas suelen ser más específicas para mostrar aquello que es propio a la
acción que se está desarrollando en el método del controlador. No veo tan importante la
reutilización del código en el caso de la vista en una aplicación web MVC. En mi opinión
lo más importante que te ofrecen las vistas son la separación del HTML (generalmente)
de la salida, de modo que si tienes que cambiar la presentación no tengas que cambiar
todo el código de la lógica de negocio, acceso a datos, etc.

Además, a medida que vas conociendo soluciones propuestas por diversos frameworks te das
cuenta que el acoplamiento entre el controlador y las validaciones ya ha sido resuelto en
diversas ocasiones y un claro ejemplo son los middleware de Laravel, que se encargan de
realizar validaciones para que los controladores no necesiten ocuparse de ellas.
A continuación tienes una serie de notas interesantes sobre este asunto, que están extractadas
de conversaciones con colaboradores de DesarrolloWeb.com que nos han ofrecido su visión
personal sobre este asunto. En concreto les hicimos la pregunta: ¿Las vistas pueden / deberían
pedir los datos directamente al modelo?
Otras separaciones por responsabilidades como MVT

Consultando a nuestra amiga y compañera Eugenia Bahit acerca de esta discusión nos
comenta:
En MVC el acceso a los datos no es responsabilidad de las vistas. Las vistas, la única
responsabilidad que tienen con los datos es formatearlos al servicio de la interfaz gráfica. El
modelo, solo define la base para generar esos datos y el controlador hace el resto.
Esto es lo que uno como programador espera en una arquitectura MVC. Si algo de esto no se
respeta, entonces es la app la que pierde mantenibilidad. ¿por qué? Porque si yo, programador
externo, quiero modificar la app, buscaré los datos en el controlador. Si allí no los encuentro
¿dónde están? Tendré que recorrer la app para ubicarlos tirando manotazos de ahogado todo
el tiempo. Entonces, la app se hace más compleja de mantener.
Sin embargo, en MVT, a falta de controlador, sí son las vistas las que trabajan directamente
con los modelos. Django es el ejemplo perfecto (de hecho, incorporaron el concepto de MVT
como tal). En MVT, las vistas piden los datos al modelo y los formatean mientras que el
modelo hace el resto (define la base que genera los datos, sanea, valida, etc.).
¿Mi opinión profesional al respecto? Me quedo con MVC toda la vida. MVT termina siendo
muy desordenado y descuidado en grandes aplicaciones.
¿Mi visión al respecto? La mayoría de las apps (incluso frameworks) hechos con MVC, en
realidad implementan las tácticas técnicas de MVT (modelos que definen, sanean y validan
datos, controladores que solo definen nombres de recursos, vistas que lo hacen todo). Así que
no es nada extraño. Es algo que se ve en el 90% de las apps, es muy común. ¿es lo correcto?
No. Pero sí es común.
Yo no comparto que desde las vistas se deba acceder al modelo y me quedo 100% con MVC por
una cuestión de que soy 0% pragmática. A mi poco me interesa que algo funcione. Me interesa
que sea "perfecto", lo cual es nada pragmático.
En la mayoría de los frameworks y CMS las vistas son "tontas"

Esta es la respuesta que nos ofreció Carlos Ruiz Ruso, compañero que emite con nosotros los
#laravelIO.
Segun la filosofia MVC las vistas digamos que son tontas y así es la implementación en los

frameworks y CMS que conozco. Si el controlador no le pasa la información no deberían

funcionar. Y sería muy extraño que todo el global de los desarrolladores que hacen tan
importantes piezas de software estuvieran equivocados.
Por ejemplo, en laravel con Blade, o Prestashop que usar Smarty, a las vistas hay que pasarles
la información compilada desde el controlador. Es más, con Smarty ni tan siquiera puedes usar
el código de apertura de PHP, por lo que todo lo que manejas deben de ser variables ya
prefabricadas. Esa creo es la manera correcta.
¿Quieres desacoplar la vista del controlador? ¿no estás acoplando al modelo?

También preguntamos a nuestro compañero Eduard Tomàs, que tiene un perfil diferente, ya
que su especialidad es .NET.
A mi NO me gusta que las vistas accedan a los modelos porque eso acopla la vista con el
modelo. Ojo, que ese acoplamiento puede ser distinto en un lenguaje fuertemente tipado (C#,
Java) que un lenguaje con duck typing (JavaScript, PHP) pero es un acoplamiento de todos
modos.
Prefiero que las vistas sean independientes del modelo y en todo caso estén acopladas a datos
que les manda el controlador (llamémosle viewmodel a esos datos). La relación entre vista y
viewmodel es, usualmente, 1:1.
Así los controladores hablan con el modelo, lo "mastican" para obtener un viewmodel y ese
viewmodel contiene todo lo que necesita la vista y nada más. Cambios en el modelo no afectan
a la vista¡ ya que esta está desacoplada.
No hay balas de plata

Esa frase "no hay balas de plata" puede parecer un simple tópico, pero es bastante adecuada a
este asunto. La estrategia de unas personas puede ser distinta de la de otras, así como pueden
haber aproximaciones a MVC como el mencionado MVT o MVVM, que se adaptan mejor o
peor a diversas tecnologías, sistemas, filosofías, etc.
Lo que importa aquí es separar el código por responsabilidades, ya que te facilitará el

matenimiento y la reutilización. Hay personas que navegan entre cientos de líneas de código
secuenciales y que le resuelven sus problemas, pero lo correcto es separar, por intereses,
responsabilidades, etc. Si separas tu código, obtienes los beneficios buscados.
Por otra parte, conviene intentar adaptarse a la filosofía de la mayoría, de modo que sea más
fácil que el resto de las personas entiendan tu código y lo puedan modificar sin volverse locos.
Espero que este artículo colaborativo te haya resultado interesante. Cuéntanos tu opinión en
los comentarios. Gracias!

Disponible online en http://desarrolloweb.com/articulos/discusiones-aplicar-mvc-

correctamente.html

Qué es SVG
Explicaciones detalladas sobre el formato gráfico vectorial SVG, un lenguaje de

estándar abierto que forma parte de HTML5, usado para realizar dibujos
vectoriales en 2D.
SVG son las siglas de Scalable Vector Graphics, que podríamos traducir libremente al español
como gráficos basados en vectores escalables. En otras palabras, podemos decir que es un
formato gráfico basado en XML para crear archivos vectoriales en 2D, con un lenguaje de
marcado por medio de etiquetas.
Es recomendación del W3C desde 2001, aunque los navegadores hace menos tiempo que lo
vienen implantando para dar soporte. Firefox comenzó a usarlo en 2004 y Google Chrome lo
dispone desde su primer lanzamiento en 2007. Por su parte, Internet Explorer lo está
implementando desde la versión 9.
Nota: El soporte a las diferentes partes del estándar SVG actualizado lo puedes ver en
Caniuse. Observarás que casi todo SVG está ampliamente soportado, Lo que indica que
podemos usarlo sin preocupaciones. Únicamente, las tipografías SVG carecen de un soporte
generalizado.
En cuanto a versiones del estándar, va por la 1.1, aunque se supone que en verano de 2014
podremos asistir al lanzamiento de la versión 2. Entre sus posibilidades, podemos señalar la
capacidad de usar tres tipos de objetos gráficos:
1. formas de vectores gráficos (entre las que se incluyen líneas, poligonos, polilineas,
rectángulos, círculos o elipses, etc.).
2. imágenes y texto.
Además, a los objetos gráficos les podemos aplicar transformaciones (traslaciones, escala,

etc.), animaciones y efectos de filtro (muy variados, como los que conocemos en programas de
diseño como Photoshop).
Algunas ventajas de este formato son:
No pierde calidad si hacemos zoom.

Se puede escalar.
Se muestra de forma progresiva, no tenemos que esperar a que se descargue todo el
archivo.
Se puede reducir su tamaño a través del formato de compresión GZIP.
Se le puede aplicar estilos CSS.
Se puede modificar con JavaScript.
Al ser XML, es indexable por los buscadores.
SVG como formato vectorial

El uso de graficos vectoriales tiene de por sí algunas características que son representativas y
en el mundo web, todavía más destacables en comparación a los gráficos conocidos como
"mapa de bits".
Nota: Las imágenes que normalmente usamos en un sitio web tienen mapas de bits, con
extensiones como jpg, png o gif.
Su tamaño es generalmente menor en los vectores, en bytes, que sus versiones en mapa de bits.
Por ejemplo, en la siguiente imagen podemos apreciar que el mismo gráfico en SVG ocuparía
2KB y en PNG sería aproximadamente el triple, en torno a los 6KB.

Además, la nitidez de un SVG siempre será mejor que un mapa de bits, sobre todo se notará si
ampliamos la imagen. En un mapa de bits empezaremos a notar enseguida el pixelado en los
bordes, lo que se conoce como "dientes de sierra", mientras que en SVG siempre se mantiene la
nitidez perfecta, por ser vectorial.
En la siguiente imagen se ve una ampliación de un SVG y un PNG. Sobra decir que el de arriba
es el SVG.

Estructura de una etiqueta para hacer un SVG

Al tratarse de un lenguaje basado en XML está basado en etiquetas (recordar que el propio
HTML también se basa en XML). Por tanto, cuando queramos implementar una imagen SVG
debemos usar una etiqueta, la cual tendrá una estructura como esta:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="400" height="230" viewBox="0
0 400 230">
Encontramos varios atributos que a continuación explicamos por orden de aparición (aunque
en la práctica, al escribir la propia etiqueta podemos poner los atributos en el orden que
deseemos):
Version: Como decíamos, actualmente estamos en la 1.1.

Namespaces "xmlns" y "xmlns:xlink", algo que necesita el lenguaje de marcado XML. El
segundo, que pone xmlns:xlink es para referenciar archivos dentro del SVG, como
imágenes, para poner enlaces y si lo dejamos de poner suele dar muchos problemas con
Mozilla, porque se pierden las imagenes, no funcionan los links, etc.
Atributo "width" y "height" por defecto en píxeles, pero lo podemos poner en cualquier
unidad, como centímetros, picas, etc.
Coordenadas X e Y, empiezan siempre en la esquina superior izquierda.
"Viewbox", el primer caracter representa la coordenada horizontal, el segundo la

vertical, el tercero el ancho y el cuarto el alto. Como se puede apreciar en el código de la
etiqueta anterior, representan los mismos valores de coordenadas y tamaño de la
imagen, pero podemos alterarlos para indicar qué es lo que vamos a ver exactamente en
la imagen de todo lo que se represente en el código del SVG.

Nota: El atributo viewbox nos permite crear una especie de máscara, o marco,
con la que podemos mostrar o ocultar secciones de toda la imagen definida con el
código SVG. Para más información del viewbox puedes leer este artículo, del blog
del propio autor de este texto.
Formas básicas
Ahora veremos una serie de formas básicas que podemos especificar dentro de una imagen
SVG. Por supuesto, éstas se crearán a partir de etiquetas que se anidan dentro de la etiqueta
global del SVG.
Rectangle:
Etiqueta para obtener un rectángulo.
<rect x="200" y="50" width="100" height="150" fill="#d6a085" stroke="#bd8347"
strokewidth="10" />
Los atributos x e y son coordenadas horizontal y vertical donde lo situamos, siendo la

referencia la esquina superior izquierda. Luego asignamos altura y anchura, colores de relleno
y de borde y el grosor de la línea del borde.
Si lo queremos con los bordes redondeados, añadimos rx="4", siendo 4 el radio del
redondeado, que podemos cambiar a lo que nosotros deseemos, claro está.
Circle:
Etiqueta para hacer un círculo.
<circle cx="150" cy="100" r="40" fill="#16a085" stroke="#bdc3c7" strokewidth="4" />
Todos los atributos de los distintos tags para formas básicas son bastante parecidos. En este
caso cx y cy son las coordenadas x e y del círculo, sin embargo, en este caso la referencia a
situar es el centro del círculo. El atributo r es el radio.
Ellipse:
Etiqueta para hacer una elipse.
<ellipse cx="100" cy="100" rx="30" ry="80" fill="#16a085" stroke="#bdc3c7" strokewidth="4" />
Es muy parecido al círculo, solo que en una elipse definimos dos radios: uno horizontal y otro
vertical, que pueden tener valores distintos.

Polygon:
Para definir un polígono a base de indicar sus puntos vértices.
<polygon points="200,100 250,180 160,210" fill="#16a085" stroke="#bdc3c7" strokewidth="4" />
Lo utilizamos para dibujar formas con tres o más caras. Cada par de valores en el atributo
"points" indican uno de los vértices del polígono.
Line:
Una línea simple.
<line x1="50" y1="50" x2="150" y2="50" stroke="#bdc3c7" strokewidth="3" />
Indicamos la esquina del principio y fin, con sus coordenadas.
Polyline:
Una línea formada por varias líneas seguidas.
<polyline points="0,40 40,40 40,80 80,80 80,120" fill="none" stroke="#bdc3c7" strokewidth="10"
/>
Cada par de valores en el atributo "points" indican uno de los puntos de la línea.
Conclusión
Ahora con lo que hemos aprendido somos capaces de dibujar unas formas básicas en un
documento HTML, agregando unas etiquetas como estas:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="400" height="230" viewBox="0
0 400 230">
<line x1="50" y1="50" x2="150" y2="50" stroke="#bdc3c7" strokewidth="3" />
<line x1="140" y1="50" x2="150" y2="100" stroke="#ff0099" strokewidth="6" />
<ellipse cx="100" cy="100" rx="30" ry="80" fill="#16a085" stroke="#bdc3c7" strokewidth="4" />
<rect x="200" y="50" width="100" height="150" fill="#d6a085" stroke="#bd8347" strokewidth="10" />
<circle cx=0 cy=0 r=50 fill="#ddd"></circle>
<polyline points="0,40 40,40 40,80 80,80 80,120" fill="none" stroke="#bdc3c7" strokewidth="10" />
<polygon points="200,100 250,180 160,210" fill="#856" stroke="black" strokewidth="4" />
</svg>
Este artículo de momento termina aquí, pero tenéis más información en un evento
retransmitido en DesarrolloWeb.com. Se trata del hangout #vectoresIO sobre SVG del que
hemos transcrito este texto para publicarlo como artículo. En el evento enlazado podrás

encontrar todavía bastante más información de este lenguaje para dibujo vectorial.
Una excelente referencia de SVG encontrarás en Mozilla Developer Network, un recurso

imprescindible para documentarnos cuando estamos trabajando con este lenguaje.
Este artículo es obra de Jorge ATGU

Disponible online en http://desarrolloweb.com/articulos/que-es-svg.html

Qué es Markdown
En el artículo de hoy veremos cómo trabajar con Markdown, un rápido sistema

de formateo de texto en XHTML.
Markdown nos ayudará a aplicar al texto plano un formato XHTML de manera cómoda e
inmediata. Su adaptabilidad y facilidad de manejo lo convierte en una herramienta de
poderosa legibilidad, usada por GitHub.
¿Conocen a Alejandro AR (@kinduff)? Si no le conocen, les aviso de que recientemente ha

comenzado un interesante proyecto enfocado a dar pequeños consejos o tutoriales enfocados al
desarrollo web durante todo un año, 365 días terrestres. Pueden ver su comienzo aquí. En
dicho proyecto, a su entrada, pueden ustedes leer que comenta Alejandro que usa Parsedown
para poder escribir el proyecto en Markdown.
El lector se extraña. Ojea el resto de entradas y ve que las entiende. ¿Tendrá la web algún
rastreador de localización para traducir el idioma según la IP del visitante? ¿Se habrá
traducido correctamente la web de ese extraño lenguaje llamado Markdown al idioma habitual
del navegante? ¡Qué bueno es Alejandro! ¡Cómo programa!
El proyecto de Alejandro es interesantísimo, no dejen de echarle una ojeada, pero entre sus
virtudes no se cuenta, que yo sepa al menos, la de traducir automáticamente según la IP del
navegante. No hay nada que traducir, puesto que Markdown, más que relacionarse con el
lenguaje en sí, se relaciona con su formato.
Los que vivimos de WordPress sabemos que una de las primeras cosas que hay que hacer
cuando pretendemos darle un mínimo e interesante estilo a nuestras entradas, es
configurarnos o instalarnos un adecuado editor visual que nos permita darle formato al texto
con un solo clic de ratón.
Markdown es una alternativa que nos permite formatear un texto sin tener que recurrir a la
indicación expresa de etiquetas HTML, partiendo de eso que algunos seguimos llamando 'texto
plano' para convertirlo en un decente XHTML. Aquí pueden comenzar a ojearlo. Markdown es

un proyecto de licencia libre, con lo cual pueden descargarse en Internet multitud de

aplicaciones para poder usarlo en cualquier tipo de proyectos, páginas web pequeñas sin CMS
o mastodónticos proyectos basados en Drupal. WordPress, como es natural, cuenta con su
propio plugin. Asimismo, Markdown ha sido implementado en multitud de lenguajes: PHP,
Python, Perl, C#, Ruby, Java o JavaScript, por citar algunos.
Markdown permite la detección de ciertos símbolos de teclado, como las comillas o los
asteriscos, para posteriormente dar formato a la parte del texto en la que se encuentren, cosa
que nos facilita bastante el formateo, si no queremos tener que recurrir al clásico etiquetado
HTML, que entre otras cosas suele obligarnos a indicar un comienzo y un cierre, lo que puede
resultarnos una pesada tarea si la edición es prolongada (la clásica búsqueda de la etiqueta sin
cerrar cuando la noche llega y los ojos vagan por la pantalla cansados, sin encontrar el "/" que,
correctamente colocado, evitaría el caos).
Igualmente, Markdown permite, con ciertas configuraciones, ser usado en sitios en los que
nosotros personalmente no actuaremos, como por ejemplo en los datos que rellena el
navegante en el formulario de compra o suscripción, o en el comentario que añade a la
entrada.
Los textos escritos en Markdown pueden compartirse fácilmente entre ordenadores, móviles y
demás, se está estandarizando rápidamente y algunos sitios como GitHub o Reddit ya lo usan
para dar estilo a sus comentarios. También se usa en algunas wikis.
Aunque evidentemente Markdown está orientado a proyectos web, posee una gran legibilidad,
lo cual garantiza que en otros proyectos alejados de la nube no haya problema en que se use,
como en la elaboración de listas de tareas, en vez de tener que recurrir a las farragosas viñetas
de Word.
No estamos hablando, ojo, de dotar de color a las letras, de fuente concreta o de tamaño. Lo
que modificamos es su disposición, el que se muestren como en una cabecera, en negrita o en
listas organizadas.
Algunas definiciones:

Lo que hemos mostrado no es más que una introducción: hay toda una especificación sobre
Markdown en la que profundizar en busca de los resultados más completos.
Pasemos a los enlaces.
Destacaría la herramienta MarkdownHere.
Dicha herramienta tiene extensión para Chrome, Safari, Mozilla y además nos permite ver en

su web un ejemplo en vivo y en directo de lo útil que es usar Markdown.
También destacaría este conversor.
Aquí pueden ustedes leer un completo cheatsheet. Y aquí tienen más.
Pero, en realidad, lo primero que les recomiendo mirar es esta web, un tutorial online directo y
sencillo: www.Markdowntutorial.com.
Prueben Markdown: es fácil, directo y cómodo. Me lo agradecerán cuando recuerden esos

momentos en los que había que dedicarle varios minutos a la búsqueda de una etiqueta mal
cerrada.
Este artículo es obra de OldMith

Disponible online en http://desarrolloweb.com/articulos/que-es-markdown.html

Qué es el SEO
Conceptos generales sobre SEO para introducir a cualquier persona en el mundo

del posicionamiento en buscadores.
SEO son las siglas de Search Engine Optimization. Otras maneras de llamarlo son
"posicionamiento en buscadores" o, simplemente, "posicionamiento web". El SEO viene a ser
una serie de técnicas para optimizar un sitio web, de manera que mejore su visibilidad en los
motores de búsqueda.
El objetivo inicial de la actividad SEO es aparecer en un buscador cuando se busque por

determinados términos. Una vez que ya se ha cumplido esa primera etapa y estamos entre los
resultados de las búsquedas, se trata de conseguir que el sitio web optimizado aparezca lo más
arriba posible, aumentando su visibilidad y las posibilidades de que entren en nuestra página
en busca de un contenido determinado.
Nota: Este artículo está transcrito, de manera libre, de una clase de Introducción al SEO
que está publicada en Youtube y cuyo vídeo completo lo puedes ver al final de este artículo.
Existen principalmente dos áreas de optimización:
SEO On Page: Desde la propia página web, perfeccionando el propio sitio que queremos
posicionar, para que sea mejor considerado por parte de los buscadores. Esto se consigue
facilitando que el sitio web sea "entendido" por parte del motor de búsqueda, de manera que
indexe mejor el contenido y se alcancen diversos parámetros de calidad en diversas áreas, que
hagan entender que se trata de un sitio de calidad: contenido, velocidad, buena estructura, etc.
SEO Off Page: Todas las técnicas y acciones que podemos hacer de manera externa al sitio y
que nos ayuden a ganar relevancia en la web. Esto se hace principalmente consiguiendo
enlaces hacia el sitio a promocionar y mejorando las apariciones en otros medios, pero

también podría ser pagando por publicidad.
Problemática del aprendizaje SEO

En Internet podemos aprender muchísimo del posicionamiento en buscadores, pero tienes que
tener cuidado, porque no siempre la información se encuentra actualizada. Los buscadores son
muy dinámicos y van ajustando el modo en el que entienden el "ecosistema web", por lo que a
lo largo del tiempo las reglas siempre van cambiando. Es por ello que es importante la fecha de
publicación de los textos o vídeos que estás utilizando para aprender.
Lo que funcionaba un día puede que no funcione más adelante. Desconfía de los trucos que
puedas encontrar por ahí o de la magia que algunas personas puedan asegurar tener. Debes
entender que Google está en constante evolución y lo que un día puede ayudar en el
posicionamiento otro día puede perjudicarte, hasta el punto de recibir penalizaciones.
Nota: Muchas veces cuando mencionemos a Google, en realidad nos queremos referir a
cualquier buscador. Esto es porque Google tiene dominado el mercado de las búsquedas en
español, y no hay ningún otro buscador que le haga sombra, a nivel hispano. No obstante,
cuando digamos "Google", puedes entenderlo de manera general como "motor de
búsqueda".
Debemos aclarar que existen técnicas que siempre han funcionado y siempre van a funcionar y
son las que vamos a intentar explicar nosotros, tanto en este artículo como en las clases
gratuitas emitidas en DesarrolloWeb.com, como los cursos que organizamos en EscuelaIT,
como el Curso de SEO, desde cero a profesional. Ese tipo de técnicas, sobre todo relacionadas
con SEO on Page, serán siempre aquellas que ayudan a los buscadores a reconocer tu
contenido y todas las que mejoren de un medio u otro la calidad de tu sitio.
Los buscadores y cómo entienden y registran o indexan nuestra web

Los buscadores, como Google, tienen robots o sistemas que se dedican a visitar páginas
constantemente. Comúnmente, a esos robots les llamamos "arañas". Cuando visitan una
página lo hacen con profundidad, es decir, cuando analizan el contenido de una página y luego
van accediendo a todos los enlaces que hay en una página. Si encuentran cuatro páginas
enlazadas, el robot las visita también y por tanto las analizará. Si tienen enlaces, se dirigirá a
las páginas enlazadas y así de modo indeterminado, hasta cualquier nivel de profundidad en el
sitio.
Si publicamos nuevos contenidos en un sitio, la araña los encontrará cuando analice nuestra
web, debido a ese rastreo constante. Asimismo, si tenemos páginas salientes hacia otros
dominios, Google o el motor correspondiente, también accederá a ellas en su rastreo
permanente de los sitios en la web. Esto quiere decir que, cuando publicamos una página en
Internet y aunque Google no la conozca en un principio, podrá indexarla si alguien nos enlaza.
Puede resultar obvio que, cuanto más actualicemos nuestra web publicando nuevo contenido,
le estamos invitando a Google a analizar nuestro sitio con mayor frecuencia para indexar las

nuevas páginas.
Cuando Google ha rastreado una página, la añade a su base de datos de páginas de la web y ese
proceso es el que llamamos indexación del contenido. Todas las páginas indexadas por el
buscador son las que pueden aparecer entre los resultados de las búsquedas.
Es importante entender este proceso, porque nos dará una buena idea de cómo funciona el
buscador y por tanto seremos capaces de entender el proceso de indexación y cómo podemos
facilitarle a Google que encuentre nuestro sitio y guarde su contenido.
El tiempo requerido para aparecer en Google una página recién publicada en la web, de un
sitio o dominio no publicado hasta el momento, es variable. Generalmente, Google lo hará
cuando encuentre enlaces a nuestra web, pero puede requerir enlaces hacia nosotros de cierto
valor para comenzar a mostrarla en sus resultados. No obstante, podemos ayudar a Google a
encontrar nuestra página registrando el dominio en las "Webmaster Tools", de las que
hablaremos más adelante.
¿Qué páginas tiene Google de nuestra web?

Una de las primeras preguntas que nos podemos hacer cuando nos dedicamos a posicionar un
sitio en Internet es ¿qué páginas tiene Google de nuestra web en su base de datos? Esta es una
pregunta que seguro será clave, sobre todo en proyectos que ya existen. Se consigue con un
comando bien simple:
site:desarrolloweb.com
Para lanzar ese comando simplemente tenemos que hacer la búsqueda en Google de ese
término "site:desarrolloweb.com" o cualquier otro dominio, que generalmente escribiremos
sin las tres W ("www") y sin el "http://". Con ello conseguiremos todas las URLs que Google ha
rastreado, leído e indexado de nuestro dominio y tiene en su base de datos y que podrían
aparecer entre los resultados de las búsquedas.
Con esto también tenemos la ocasión de entender mejor cómo ve Google nuestro sitio web y
nuestro contenido, o sea, cómo entiende a nuestra página. Quizás te lleves algunas sorpresas, o
no, pero seguro que te ayudará a sacar algunas conclusiones.
Si no sale ninguna página haciendo el comando "site:" es que Google no ha indexado tu sitio
web. Esto puede ocurrir por mecanismos como el "robots.txt" que estés impidiendo a Google
que, a pesar que rastree tu sitio, no indexe tu contenido.
Vídeo: Qué es SEO

A continuación puedes encontrar el vídeo de una sesión formativa que emitimos en directo en
DesarrolloWeb.com que nos explica qué es SEO y algunos conceptos interesantes y básicos que
debemos saber para poder comenzar a posicionar mejor un sitio web en buscadores.
En ese vídeo se tratan los asuntos relativos al concepto de SEO explicados en este texto, así
como muchas otras informaciones útiles y básicas para comenzar en el mundo del
posicionamiento web.


http://desarrolloweb.com/articulos/que-es-el-seo-conceptos-generales.html

Disponible online en http://desarrolloweb.com/articulos/que-es-el-seo-conceptos-
generales.html

Qué es REST
Puede que te suene por las API REST. Te explicamos por qué se han popularizado
tanto en el mundo de Internet y qué características tienen estos sistemas.
Actualmente, las API REST están realmente de moda: parece que cualquier aplicación deba
proporcionar su “API REST”. Pero...¿qué significa realmente una API REST?
REST deriva de "REpresentational State Transfer", que traducido vendría a ser “transferencia
de representación de estado”, lo que tampoco aclara mucho, pero contiene la clave de lo que
significa. Porque la clave de REST es que un servicio REST no tiene estado (es stateless), lo que
quiere decir que, entre dos llamadas cualesquiera, el servicio pierde todos sus datos. Esto es,
que no se puede llamar a un servicio REST y pasarle unos datos (p. ej. un usuario y una
contraseña) y esperar que “nos recuerde” en la siguiente petición. De ahí el nombre: el estado
lo mantiene el cliente y por lo tanto es el cliente quien debe pasar el estado en cada llamada. Si
quiero que un servicio REST me recuerde, debo pasarle quien soy en cada llamada. Eso puede
ser un usuario y una contraseña, un token o cualquier otro tipo de credenciales, pero debo
pasarlas en cada llamada. Y lo mismo aplica para el resto de información.
El no tener estado es una desventaja clara: tener que pasar el estado en cada llamada es, como
mínimo, tedioso, pero la contrapartida es clara: escalabilidad. Para mantener un estado se
requiere algún sitio (generalmente memoria) donde guardar todos los estados de todos los
clientes. A más clientes, más memoria, hasta que al final podemos llegar a no poder admitir
más clientes, no por falta de CPU, sino de memoria. Es algo parecido a lo que ocurre con la web
tradicional (que también es stateless). Sea cual sea la tecnología con la que desarrolles para
web, seguro que conoces que puedes crear lo que se llama una “sesión”. Los datos de la sesión
se mantienen entre peticiones y son por cada usuario. El clásico ejemplo de sesión puede ser
un carrito de la compra, entre las distintas peticiones web, la información del carrito de
compra se mantiene (¡ojo! hay otras alternativas para implementar carritos de compra).
Por norma general, la sesión se almacena en la memoria RAM del servidor, por lo que es fácil
quedarnos sin memoria si introducimos demasiados datos en sesión (o tenemos muchos

usuarios simultáneos). Por supuesto, podemos utilizar varios servidores, pero como bien saben
los desarrolladores web, mover la sesión contenida en memoria entre servidores es
generalmente imposible o altamente ineficiente, lo que penaliza el balanceo de carga, lo que a
su vez redunda en menor escalabilidad y menor tolerancia a fallos. Hay soluciones
intermedias, tales como guardar la sesión en base de datos, pero su impacto en el rendimiento
suele ser muy grande. De hecho, el consejo principal para desarrollar aplicaciones web
altamenteescalables es: no usar la sesión.
Así pues, tenemos que el ser stateless es la característica principal de REST, aunque por
supuesto no la única. Así, cualquier servicio REST (si quiere ser merecedor de ese nombre)
debería no tener estado, pero no cualquier servicio sin estado es REST. Hay otros factores,
pero vamos a destacar el que los ingleses llaman “uniform interface” y es lo que diferencia un
servicio web clásico (orientado a RPC) de un servicio REST.
SOAP y REST
SOAP es el acrónimo de “Simple Object Access Protocol” y es el protocolo que se oculta tras la
tecnología que comúnmente denominamos “Web Services” o servicios web. SOAP es un
protocolo extraordinariamente complejo pensado para dar soluciones a casi cualquier
necesidad en lo que a comunicaciones se refiere, incluyendo aspectos avanzados de seguridad,
transaccionalidad, mensajería asegurada y demás. Cuando salió SOAP se vivió una época
dorada de los servicios web. Aunque las primeras implementaciones eran lo que se llamaban
WS1.0 y no soportaban casi ningún escenario avanzado, todo el mundo pagaba el precio de
usar SOAP, ya que parecía claro que era el estándar que dominaría el futuro. Con el tiempo
salieron las especificaciones WS-* que daban soluciones avanzadas, pero a la vez que crecían
las capacidades de SOAP, crecía su complejidad. Al final, los servicios web SOAP terminan
siendo un monstruo con muchas capacidades pero que en la mayoría de los casos no
necesitamos.
Por su parte REST es simple. REST no quiere dar soluciones para todo y por lo tanto no
pagamos con una demasiada complejidad una potencia que quizá no vamos a necesitar.
Uniform interface
Una diferencia fundamental entre un servicio web clásico (SOAP) y un servicio REST es que el
primero está orientado a RPC, es decir, a invocar métodos sobre un servicio remoto, mientras
que el segundo está orientado a recursos. Es decir, operamos sobre recursos, no sobre
servicios.
En una API REST la idea de “servicio” como tal desaparece. Lo que tenemos son recursos,
accesibles por identificadores (URIs). Sobre esos recursos podemos realizar acciones,
generalmente diferenciadas a través de verbos HTTP distintos.
Así, en un servicio web clásico (SOAP) tendríamos un servicio llamado BeerService que tendría
un método llamado GetAll que me devolvería todas las cervezas. La idea, independientemente
de la tecnología usada para consumir el servicio web, es que se llama a un método (GetAll) de
un servicio remoto (BeerService). Del mismo modo para obtener una cerveza en concreto
llamaríamos al método GetById() pasándole el id de la cerveza. De ahí que se diga que están

orientados a RPC (Remote Procedure Call – Llamada a método remoto).
Por su parte en un servicio REST la propia idea de servicio se desvanece. En su lugar nos queda
la idea de un “recurso”, llamémosle “Colección de cervezas” que tiene una URI que lo
identifica, p. ej. /Beers. Así, si invoco dicha URI debo obtener una representación de dicho
recurso, es decir, debo obtener el listado de todas las cervezas.
Para obtener datos de una cerveza, habrá otro recurso (cerveza) con una URI asociada.
Además, entre los recursos hay relaciones: está claro que una cerveza forma parte de la
“Colección de cervezas” así que parece lógico que a partir de la colección entera (/Beers) pueda
acceder a uno de sus elementos con una URI tipo /Beers/123, siendo "123" el ID de la cerveza.
Volvamos a nuestro servicio SOAP: para dar de alta una cerveza llamaríamos a un método
"AddBeer" de nuestro "BeerService", y le pasaríamos la cerveza a añadir. En cambio, en
nuestra API REST añadir una cerveza consiste en usar la URI de dicha cerveza, (p. ej.
/Beers/456 si estamos añadiendo la cerveza con ID 456) usando POST o PUT como verbo
HTTP y colocando los datos de la cerveza en el cuerpo de la petición. La URI para acceder a la
cerveza con ID 456 es siempre /Beers/456 y es el verbo HTTP (GET, POST, PUT, DELETE,...)
el que indica cual es la operación que deseamos hacer con esa cerveza.
Este artículo es obra de Eduard Tomàs

Disponible online en http://desarrolloweb.com/articulos/que-es-rest-caracteristicas-
sistemas.html

Snap.SVG librería Javascript para

trabajar con SVG
Qué es Snap.SVG y primeros pasos para manejar una potente librería que
permite crear, modificar y aplicar interacción dentro de imágenes SVG y
cualquier tipo de elemento dentro de éstas.
Snap es una relativamente nueva librería Javascript para trabajar con elementos SVG, ya
sabes, elementos generados con el formato de gráficos vectoriales escalables de HTML5. Con
Snap podemos resumir muchas de las tareas habituales que querrás hacer dentro de un
contenido SVG, como es el caso de insertar elementos, alterar sus características, animarlos,
etc.
Digo "relativamente" nueva porque ya tiene más de un año, aunque solo se han lanzado 3
releases hasta el momento, estando en el instante de escribir este artículo a la versión 0.3. No
obstante, el trabajo está ya muy avanzado, pues viene bien direccionado, ya que su creador es
el mismo que otra librería SVG mucho más conocida, Raphael JS.
En este artículo vamos a presentar Snap y daremos algún ejemplo con el que puedas ponerte a
jugar, así como también queremos sentar las bases para profundizar en breve en otras
entregas.
De momento puedes echar un primer vistazo a Snap en su página web: http://snapsvg.io/.

También puedes consultar su Github y ver en detalle todo el código fuente de esta librería de
código abierto: https://github.com/adobe-webplatform/Snap.svg.
Observarás que los responsables de traerte Snap son "Adobe Web Platform" por lo que,
además de la garantía de contar con un experimentado líder del proyecto Dmitry Baranovskiy
(Creador de Raphael), tiene una gran empresa detrás. Todo ello nos hace entender que Snap
tiene un futuro muy prometedor y de paso el interés de Adobe en SVG como lenguaje abierto
con el que se desarrollarán seguramente una serie de productos de la compañía.

Las diferencias con Raphael JS son básicamente dos:
1) Snap no tiene soporte a Internet Explorer 6, sino que en su diseño se ha buscado optimizar
la librería para navegadores modernos, permitiendo explorar características avanzadas del
SVG y mejorar el rendimiento del código. 2) En Snap puedes manejar tanto los elementos SVG
creados con código Javascript como aquellos elementos SVG que ya estaban en la página antes
de la carga de la librería Snap. Eso quiere decir que puedes acceder al DOM mediante
selectores CSS y cargar dentro de Snap contenidos escritos en SVG para su animación o para lo
que sea necesario. Como dicen en la descripción del producto, puedes entenderlo con el simil
"el jQuery para SVG".
Para encontrar más información sobre Snap.SVG, así como demos de uso y otros tutoriales
puedes consultar este artículo con una serie de enlaces destacados para conocer Snap.
Por qué SVG

SVG es un formato vectorial, eso tiene muchas ventajas tanto relacionadas con la visualización
de los elementos como con la carga de la página.
Visualización: Si se permite, podemos decir que SVG es un formato de imagen "responsive",

dado que se puede adaptar perfectamente a la pantalla del ordenador o dispositivo donde
estemos visualizando la imagen. Al ser vectorial, tanto la ampliación de la imagen como su
reducción no pierden calidad, con lo que estamos seguros que el contenido gráfico se va a ver
con su mejor cara.
Carga: El peso de los archivos SVG depende de los elementos que tenga y su complejidad. Las
imágenes se escriben con texto, lo que resulta bastante ligero. Una gran imagen con una forma
simple seguro que es más ligera si la especificas en SVG que como mapa de bits, aunque lo
cierto es que carga de los elementos SVG puede ser más rápida, o también podría ser más lenta
en ciertas condiciones, todo depende de la imagen y del tamaño como la quieras mostrar.
Animación: lo que en todo caso será siempre más rápido de carga es la animación, puesto
que los elementos se pueden animar con un poco de código y cambiar sus características de
manera radical, algo que si se hiciera por vídeo sería miles de veces más pesado.
Compatibilidad: El SVG está dentro del HTML5, lo soportan todos los navegadores
modernos, tanto a nivel de escritorio como dispositivos móviles. Por tanto es una herramienta
muy interesante para hacer todo tipo de aplicaciones multiplataforma.
Juegos: Al tratarse de gráficos vectoriales podemos crear todo tipo de juegos gran
interactividad y animaciones muy ligeras. Al ser HTML5 funcionará en todos los navegadores y
como lenguaje nativo en plataformas como Windows 8 o FirefoxOS. Como es multiplataforma
podrías hacerlo funcionar en dispositivos de otros tipos por medio de WebApps.
A nivel de SVG hay cientos de demos en la web, que seguramente conozcamos y con los que
podemos entender las posibilidades del formato.
Librería Javascript para SVG

SVG no deja de ser un lenguaje de marcación, igual que entendemos el HTML. De hecho el
código SVG se puede embeber dentro del HTML y el aspecto es muy similar. Podemos definir
en código SVG ya muchas utilidades e incluso animaciones y algo de interactividad. Pero a
poco que quieras avanzar, experimentarás que el lenguaje de marcación se queda corto.
Para que SVG cobre vida necesitas un poco de Javascript, para responder a la interactividad
(definiendo eventos) y manipular los elementos SVG cuando el usuario haga ciertas cosas. Si
llevas un tiempo en el mundo del desarrollo web podrás perfectamente hacerte a la idea.
Ahora bien, con Javascript hay muchas cosas que son un poco costosas para realizar y que te
llevarían un tiempo de investigación para conseguir. Acceder al DOM de un contenido SVG,
inyectar nuevos elementos, definir eventos, utilidades como el Drag&Drop, animarlos, etc.
Además, debido a que existen muchos navegadores y no siempre el Javascript es exactamente
igual, te verías en la necesidad de probar tu proyecto en decenas de plataformas (SO y
navegadores distintos) y depurar cuando encuentres diferencias en el lenguaje.
Todo ello se puede resumir de manera palpable si te ayudas de una librería como Snap, que te
proporcionará un API de funciones que realizan las tareas más útiles, sin que tengas que
aprender y trabajar tanto como si partieras de cero.
Primeros pasos con Snap

Lo primero que haremos para empezar a jugar con Snap es bajarnos la librería, desde la página
del producto y con el botón de "Download".
Observarás que la descarga ya viene con una carpeta llamada "Demos" que será genial para
observar cómo trabajar ciertas cosas y ver que tipo de tareas puedes realizar con Snap.
El archivo de la librería en si está en la carpeta "dist", lo encuentras en "snap.svg-min.js" o bien

en la versión sin minimizar, adecuada para la etapa de desarrollo. Ese archivo lo tendrás que
incluir en tu código HTML para disponer de la librería:
<script src="snap.svg-min.js"></script>
Ahora podemos hacer un primer código de prueba nosotros mismos con el que crear algún
elemento y colocarlo en la página. De momento vamos a crear todo el dibujo SVG desde cero,
enteramente con Javascript, luego aprenderemos a usar SVG que ya tengamos como contenido
en el HTML o en archivos aparte. Como lo vamos a hacer todo desde Javascript no necesitas ni
crear la etiqueta SVG, así que no necesitas colocar nada en el BODY de la página.
Vamos a crear todo el sistema dentro del evento onload, así nos aseguraremos que el
Javascript se ejecuta cuando ya está el DOM listo. Por facilitar las cosas, muestro el código de
una sola vez, con comentarios para explicarlo.
window.onload = function(){
//creo el "espacio" SVG donde voy a trabajar
//el área tendrá 800px de anchura x 300 de altura

var misvg = Snap(800, 300);
//creo un rectangulo, posición (0,0) y anchura y altura el máximo. ç
//Este rectángulo ocupará todo el área de trabajo
//será como una especie de fondo para mi diseño
var rect = misvg.rect(0,0,"100%", "100%");
//el rectángulo tiene negro como color predeterminado
//cambiamos su atributo fill para que sea de otro color.
rect.attr({
fill: "#ccc"
});
//creo un círculo. Radio 150 píxeles y posición (100, 200)
var bola = misvg.circle(100, 200, 150);
//la bola será negra, puesto que no hemos cambiado el color
//coloco un texto, lo posiciono en la coordenada (500,290)
var txt = misvg.text(500, 290, "http://www.desarrolloweb.com");
//cambio diversas propiedades del texto
txt.attr({
fill: "#950",
"font-size": "18",
"font-family": "verdana"
});
Nota: Por supuesto, el Javascript anterior lo pondrás dentro de un bloque SCRIPT en tu

página. Quizás sobra decirlo, pero antes de este bloque de script tienes que haber incluido
el SCRIPT para cargar el código de la librería Snap.SVG, si no no funcionaría.
De momento eso es todo. Espero que te haya parecido interesante y te hayas quedado con
ganas de más. Pronto volveremos a la carga con nuevas explicaciones.

Disponible online en http://desarrolloweb.com/articulos/snap-svg-libreria-javascript-
trabajar-svg.html

JSONP
Qué es JSONP y por qué se utiliza en el desarrollo de sitios web. Ejemplos JSONP
en la librería Javascript jQuery.
El uso de APIs en el mundo del desarrollo web está cada vez más extendido y el formato JSON
se ha popularizado como formato de intercambio de información. Es ligero y compatible con la
mayoría de los sistemas donde lo puedas llegar a consumir.
En el mundo de la web y con respecto a la programación del lado del cliente, es habitual que
queramos consultar datos que vienen de APIs REST para realizar aplicaciones enriquecidas.
Esos datos pueden estar alojados en nuestro servidor o en servidores remotos, en cuyo caso
podría haber algunas restricciones de seguridad. Para evitarlo puede que hayas oído hablar en
alguna ocasión de JSONP. En este artículo queremos profundizar en la materia y contarte
algunas diferencias entre JSON y JSONP, así como los motivos y modos de uso de JSONP.
Problemática de seguridad con JSON

Quizás alguna vez has advertido que, en ciertas ocasiones, no es posible hacer una llamada a
Ajax a través de dominios distintos para traernos algún dato. Esto es una limitación en la
programación web del lado del cliente y es debido a una restricción de seguridad de los
navegadores.
La causante de ese problema es una política llamada "Same-origin policy", que está pensada
para evitar que se carguen mediante Javascript datos potencialmente inseguros, por estar en
otros servidores. Es decir, los datos que nos traemos desde Ajax conectando con nuestro
propio dominio son considerados seguros, pero los que están en otros dominios de Internet no.
Esta restricción se puede evitar si el dominio con el que te conectas está configurado para
aceptar conexiones desde otros dominios. Esto se consigue activando la configuración "Cross-
origin resource sharing", pero también puede solucionarse, independientemente de la
configuración del servidor, a través del uso de JSONP.

Cómo es JSONP
JSON y JSONP son básicamente lo mismo, un formato ligero para intercambiar datos con
notación de objeto Javascript. La notación no difiere en absoluto entre JSON y JSONP, pero sí
la "envoltura". En JSONP en lugar de viajar el dato a secas como en JSON, lo que viaja es una
función generalmente llamada "callback". Esa función es como un Javascript, que engloba el
dato que hemos solicitado. De ahí que a veces se conozca a JSONP como JSON con padding.
Nota: No comentamos mucho acerca de JSON porque ha sido motivo de diversos artículos.
Para referencia puedes consultar el artículo Qué es JSON.
Por ejemplo mira el código fuente que recibes cuando accedes a esta URL:
"http://api.openbeerdatabase.com/v1/beers.json?callback=mifuncion&query=beer"
Verás que lo que recibes es algo como esto:
mifuncion({
"datos": "del",
"json": "con JSONP"
})
Por qué JSON no puedo accederlo y sí JSONP

Quizás te preguntes: Si hemos dicho que debido a la restricción de los navegadores "Same-
origin policy" no se puede acceder a datos que residen en servidores externos. ¿Por qué puedo
acceder a los datos JSONP y no a los JSON normales?
Realmente son lo mismo, solo cambia un poco de esa envoltura de la función en JSONP. ¿Cuál
es la magia?
Para hacer posible el JSONP en situaciones cross-domain se usa una alternativa permitida de
carga de scripts en una página. Como sabes, el navegador sí que acepta la carga de código
Javascript que traigas con la etiqueta SCRIPT y el atributo src de otro dominio. Es la base de
los servicios CDN.
<script src="http://example.com/otro/dominio"></script>
Debido a que eso no provoca ningún problema de seguridad, JSONP se aprovecha de ello para
acceder de ese modo al recurso solicitado, inyectando ese script en la página y ejecutando su
código para extraer el dato.
Nota: Fíjate que si te llegase un JSON normal no podrías ejecutarlo tal cual. El JSON es un

literal de objeto y no una sentencia Javascript que sea capaz de ejecutar el navegador, por
ello no podrías meterlo tal cual en una etiqueta SCRIPT de la página.
Cómo procesar un JSONP para extraer el dato

Afortunadamente nuestra librería Javascript preferida debe ser capaz de extraer ese dato por
nosotros, de una manera semi-transparente. Generalmente solo tendremos que advertir que
vas a recibir el dato en JSONP en lugar de JSON tradicional.
Lógicamente la forma que haremos esto depende de la construcción de tu librería. Veamos

ahora algunos ejemplos de código. Verás que es bastante sencillo.
JSONP en jQuery
Para indicar a jQuery que el dato de respuesta llega en JSONP utilizamos la variable de
configuración "dataType", asignando el valor "jsonp".
Este código no te requerirá muchas explicaciones si conoces el trabajo con Ajax en jQuery.
Revisa el Manual de jQuery para eventuales consultas de Ajax.
$.ajax({
url: "http://api.openbeerdatabase.com/v1/beers.json",
data: {
query: "beer"
},
type: "GET",
dataType: "jsonp",
success: function(respuesta){
console.log("Recibes: ", respuesta);
$("<pre>").text(JSON.stringify(respuesta)).appendTo("body");
});
Lo que quiero que se vea es que en la función success() el parámetro "respuesta" tiene un
objeto Javascript nativo, que es el resultado de la cadena JSONP recibida convertida en su
correspondiente objeto.
Con el console.log() vuelcas ese dato en la consola de Javascript. Con la etiqueta PRE creada al
vuelo y el método JSON.stringify() consigo que se convierta ese objeto a un literal de cadena,
con lo que puedo volcarlo como texto en la página y verlo sin necesidad de la consola.
Generalmente tú en tu programa harás con tu objeto otra cosa distinta, eso ya depende de tu
aplicación y el objetivo de los datos que acabas de recibir. Lo interesante aquí es que jQuery se
encarga el solito de transformarte el JSONP en un objeto manipulable por código Javascript.
De momento es todo. Espero que hayas resuelto tus dudas y no sea para ti un problema
acceder a cualquier API que te devuelve datos con JSONP.


Disponible online en http://desarrolloweb.com/articulos/que-es-jsonp-ejemplos-libreria-
jquery.html

Raspberry Pi, un completo ordenador en

una tarjeta de crédito
Un ordenador de coste y tamaño super reducido que es capaz de facilitar el

acceso universal a la tecnología y permite llevar más allá el mundo del Internet
de las Cosas.
Raspberry Pi es un computador que cabe en la palma de una mano y que ha venido a

revolucionar varios aspectos de la informática, principalmente gracias su reducido tamaño y
precio. Es capaz de realizar las tareas habituales que podrás llevar a cabo con cualquier otro
ordenador de sobremesa, pero por sus características es especialmente indicado para
domótica, enseñanza y el ahora tan popular "Internet of things".
Está basado en un procesador ARM, y se distribuye en modelos con componentes distintos.

Por menos de 40 dólares encuentras el más avanzado con conexiones para audio, vídeo por
HDMI y RCA, USB, Ethernet, y un mini USB para su alimentación eléctrica. No tiene disco
duro, para el almacenamiento utiliza una memoria como las de las cámaras digitales.
El ordenador está pensado para correr bajo GNU/Linux por lo que tendremos opciones más
que de sobra para su funcionamiento. Existen varias distribuciones preparadas
específicamente para funcionar en la Raspberry Pi como "Raspbian", que es una modificación
de la conocida distro Debian. Incluso se pueden adquirir memorias con el sistema
preinstalado, que serían más adecuadas para personas con menor experiencia.
Usos de Raspberry Pi
Al fin y al cabo no es más que un ordenador, por lo que los usos son ilimitados. Sin embargo,
debido a sus características está más enfocado en asuntos donde no se requiera grande
capacidad de procesamiento.
Enseñanza: Con ordenadores de este precio incluso las escuelas humildes podrían ser

capaces de facilitar equipos informáticos a sus estudiantes. Esto permite romper barreras de
acceso a la tecnología, sobre todo en países en vías de desarrollo. En general Paspberry Pi es
ideal para aprender programación, el manejo de un sistema operativo, ya sea con interfaz
gráfica o por línea de comandos. Existen decenas o cientos de lenguajes de programación que
se pueden usar dentro de Raspberry Pi, como podrían ser Python, PHP, NodeJS y otros más
tradicionales como C o Pascal.
Domótica: El tamaño lo hace especialmente adecuado para cualquier aplicación en el hogar.

Con las conexiones adecuadas podría usarse para la automatización de todo tipo de tareas,
desde controlar el sistema de iluminación, riego, cámaras de seguridad, etc.
Robótica e Internet de las cosas: La robótica es otro de los nichos donde Raspberry Pi
tiene su foco principal, además, los más atrevidos lo están usando con éxito para todo tipo de
aplicaciones en lo que se conoce como "Internet of Things". Gracias a su puerto integrado
Ethernet, o a la posibilidad de extenderlo con Wi-fi, se puede conectar con Internet y realizar
cualquier tipo de comunicación. La comunidad de usuarios altamente imaginativa lo está
usando para crear drones, tanto aéreos, terrestes, acuáticos e incluso submarinos, dispositivos
de monitorización de condiciones climáticas, etc.
Estación multimedia: Conectado al televisor es ideal para reproducir audio y cualquier

película, gracias a la GPU incorporada. Es ideal también para navegación y para usar los
servicios de Internet en general.
Limitantes de Raspberry Pi
Como se ha mencionado, se trata de un ordenador de bajísimo coste que ha abierto grandes
posibilidades a muchos niveles. Sin embargo, por sus características, el ordenador también
tiene algunas limitantes que se deberían mencionar. Obviamente, no es el equipo adecuado
para jugar o montar vídeo, por poner dos ejemplos.
Principalmente encontramos que las 256 Mb de RAM pueden resultar insuficientes para
determinados tipos de aplicaciones. La potencia del procesador podría también ser una
limitante, menor que la de muchos teléfonos móviles y tablets actuales. En resumen, su
versatilidad es una de sus virtudes, aunque no su capacidad de procesamiento.
Déjate llevar por la imaginación

Lo más impactante es la cantidad de utilidades que los usuarios de Raspberry Pi están
proyectando y llevando a la práctica. Más de un adulto habría deseado tener un dispositivo así
para jugar cuando era pequeño.
Si haces una búsqueda en Youtube podrás encontrar vídeos de maravillas que se están
haciendo con este ordenador, como robots, drones teledirigidos, estaciones multimedia y
muchos de ellos nos llevan paso por paso para poder realizar esos mismos proyectos por
nosotros mismos.
La inversión es mínima y las horas de diversión están garantizadas. Para los profesionales de la
domótica o de la automatización resulta de un aliado que puede hacer realidad proyectos
impactantes a muy bajo coste, algo siempre habían deseado ofrecer a sus clientes.

Algunos consejos
La capacidad de la memoria depende del uso que vayamos a hacer con el ordenador, aunque
con 4 Gb sería suficiente. Lo que sí es importante es que la memoria sea rápida, clase 10 en
adelante.
Si lo queremos conectar, tal cual se distribuye a Internet debemos comprar el modelo

avanzado (B+) y conectarlo con cable de red. De ese modo tendrás todas las posibilidades de la
nube y almacenamiento remoto de cualquier tipo de archivos.
También es posible instalarle un dispositivo Wi-FI en un puerto USB, existiendo muchos

modelos soportados. En esta Wiki de eLinux.org puedes encontrar periféricos compatibles,
http://elinux.org/RPi_VerifiedPeripherals, aunque probablemente si tienes uno en casa
también te funcione, simplemente tendrías que probarlo.
Este artículo es obra de Ana Alvarez Sanchez

Disponible online en http://desarrolloweb.com/articulos/raspberry-pi-tecnologia.html

Qué es Vagrant
Artículo para resumir Vagrant, una herramienta para crear entornos de

desarrollo completos basados en máquinas virtuales, independiente de
plataforma y apto para desarrollo con cualquier tecnología.
En este artículo vamos a hablar de una herramienta que sin duda nos interesa a todos los
desarrolladores y más todavía a los que trabajamos en tecnologías abiertas y en arquitecturas
cliente / servidor, como puede ser la web.
Se trata de conocer Vagrant, una herramienta que nos permite crear cualquier entorno de
desarrollo basado en máquinas virtuales. Ofrece una interfaz fácil de usar para crear servidores
perfectamente configurados e independientes del sistema operativo del desarrollador. Pero
además lo hace de una manera rápida y que elimina cualquier tipo de necesidad de
configuración por los desarrolladores, que pueden concentrarse en lo que realmente importa,
que es mejorar la productividad de su trabajo.
Vagrant es un proyecto open source, compatible con cualquier sistema operativo y que todo
equipo de desarrollo debería usar, para poder facilitar la vida tanto a desarrolladores como
jefes de proyecto.
Problemática de los entornos de desarrollo

Por lo general, en un proyecto cada programador desarrolla en local. Cada uno es responsable
por instalar todos esos paquetes de software en su máquina y actualizar las versiones,
configurar las librerías, etc. No son fuera de lo común situaciones como estas:
Algo que te funciona a ti no le funciona a otros
Alguien agregó una librería nueva o cambió la configuración de un software no lo

documentó
Otro software en la máquina de uno de los desarrolladores está provocando problemas

en la instalación del proyecto

Algo que funciona en local no funciona en remoto
Entra un nuevo desarrollador en el proyecto y hay que perder un tiempo explicando

cómo instalar el entorno
Este problema se agrava cuando estás trabajando con varios desarrolladores y varias
herramientas (lenguajes, bases de datos, librerías…) y además sus versiones. En general se
tiende a generar un abanico grande de configuraciones, presente en cada uno de los entornos
de desarrollo de cada uno de los componentes del equipo. A medida que el proyecto crece y
tiene más y más dependencias, ésto que suele derivar en mayores problemas.
Luego está el típico problema de que unos desarrolladores trabajan en Windows y otros en
Mac y luego el servidor de producción está en Linux. Cuando lo interesante es contar con un
entorno de desarrollo lo más parecido posible al entorno donde la aplicación va a ejecutarse en
producción.
Solución: virtualización
La solución pasa porque todos los componentes del equipo de desarrollo trabajen sobre un
mismo entorno, configurado de la misma manera y con los mismos "ingredientes" que se van a
tener en el servidor de producción. Todo eso se puede conseguir mediante la virtualización de
una máquina en los ordenadores de los componentes del equipo de desarrollo. Cada uno tiene
su propia máquina virtual y desarrolla sobre ella. Entre todos pueden compartir el estado de la
máquina, para que las configuraciones de uno de los desarrolladores se repliquen en las
virtualizaciones de los otros.
Esa idea parece es un poco complicada si no tienes una herramienta como Vagrant, pues te
tocaría más o menos hacerlo todo desde cero con VirtualBox u otro software de virtualización,
y configurar todo paso por paso. Tendrías que crear la máquina, instalar desde cero el sistema
operativo, configurar la red, instalarle los programas o librerías que necesitas, etc.
Te obligaría a tener muchos mayores conocimientos de sistemas, para poder realizar las
configuraciones y del software de virtualización que se esté usando, para organizar las carpetas
compartidas y cosas así. Además estaría por resolver el problema de sincronización de la
máquina con todos los desarrolladores del equipo, y la necesidad de largas esperas para
aprovisionar los entornos de desarrollo cuando éstos cambian.
Vagrant es un software por encima que nos permite solucionar todos esos problemas, creando
una interfaz de configuración sencilla e independiente del sistema de virtualización que cada
cual use, como VirtualBox, VMware, Parallels, etc.
Puedes encontrar más información de Vagrant en la página del proyecto.

https://www.vagrantup.com/
Te puedes hacer a la idea que Vagrant es como una capa por encima de tu software de
virtualización, que te ofrece funcionalidades orientadas a la creación de máquinas virtuales
para desarrollo. Esas máquinas se pueden configurar por medio de un archivo de texto y
compartir con el resto del equipo el mismo archivo para que todos puedan crear máquinas
virtuales exactamente igual a la tuya.

Herramientas que facilitan el trabajo con Vagrant

Así como Vagrant es una capa por encima de VirtualBox o VMWare, encima de Vagrant
también encontramos otras herramientas o capas que hacen un completo ecosistema que nos
puede facilitar mucho la vida.
Un referente es PuPHPet, un sitio web que tiene una especie de asistente que te permite crear
máquinas con diferentes características, distribuciones de Linux, servidores, firewall,
lenguajes, librerías, etc. Una vez finaliza el asistente simplemente tienes que descargar el
archivo de configuración para que, al crear la máquina con Vagrant, te la configure tal como le
has indicado en el asistente.
Osea, puedes entender PuPHPet como el complemento ideal de Vagrant si no eres

administrador de sistemas, ya que nos permite crear máquinas con entornos perfectamente
configurados de una manera totalmente automática, sin tener que lidiar nosotros con la
configuración de elementos tales como servidores web, lenguajes como PHP, NodeJS, Ruby,
etc., motores de bases de datos, etc. con sus configuraciones.
En su sitio web podrás encontrar más información. https://puphpet.com/
Conclusión
Es una estupenda manera de gestionar tus entornos de desarrollo de una manera
indepentiente y pormenorizada, que permite salvar decenas de los problemas a los que te has
enfrentado en cientos de ocasiones. Vagrant es una de esas herramientas que seguro que en
poco espacio de tiempo ocuparán un lugar destacado en cualquier equipo de desarrollo.
En futuros artículos te explicaremos cómo trabajar con Vagrant y con herramientas como
PuPHPet.
Este artículo es obra de Erick Ruiz de Chavez

Disponible online en http://desarrolloweb.com/articulos/que-es-vagrant.html

Introducción a TypeScript
Qué es TypeScript y qué necesitamos para empezar a usar este lenguaje de

programación que compila a Javascript.
TypeScript es un lenguaje de programación de alto nivel que implementa muchos de los

mecanismos más habituales de la programación orientada a objetos, pudiendo extraer grandes
beneficios que serán especialmente deseables en aplicaciones grandes, capaces de escalar
correctamente durante todo su tiempo de mantenimiento.
La característica fundamental de TypeScript es que compila en Javascript nativo, por lo que se

puede usar en todo proyecto donde se esté usando Javascript. Dicho con otras palabras,
cuando se usa TypeScript en algún momento se realiza su compilación, convirtiendo su código
a Javascript común. El navegador, o cualquier otra plataforma donde se ejecuta Javascript,
nunca llegará a enterarse que el código original estaba escrito en TypeScript, porque lo único
que llegará a ejecutar es el Javascript resultante de la compilación.
En resumen, TypeScript es lo que se conoce como un "superset" de Javascript, aportando

herramientas avanzadas para la programación que traen grandes beneficios a los proyectos.
Qué es un Superset
Es un lenguaje escrito encima de otro lenguaje o mejor dicho, que compila a otro lenguaje. En
el caso de TypeScript es un lenguaje que compila a JavaScript, pero que incluye muchas
facilidades y ventajas.
Los lenguajes como JavaScript basados en un estándar evolucionan muchas veces más lento
que las necesidades de los desarrolladores. Entonces surgen empresas o comunidades que
deciden expandir un lenguaje, aportando todas las herramientas que se echan en falta para
poder desarrollar con las mejores condiciones.
Los superset compilan en el lenguaje estándar, por lo que el desarrollador programa en aquel
lenguaje expandido, pero luego su código es "transpilado" para transformarlo en el lenguaje
estándar, capaz de ser entendido en todas las plataformas.

Nota: En este artículo mencionamos que TypeScript compila a Javascript, pero quizás es
más específico decir que "transpila" a Javascript. Transpilar es un término relativamente
nuevo, viene del inglés "transpiler", fruto de la unión de las palabras "translate" y
"compiler". Realmente es más correcto decir que TypeScript (u otros superset) transpilan,
puesto que lo cierto es que no hay una compilación, sino es una traducción de un código
fuente en otro código fuente en un lenguaje diferente.
Existen dos superset populares para Javascript. Por un lado tenemos CoffeeScript y por otro
lado TypeScript. La diferencia principal es que mientras que CoffeeScript te aleja del lenguaje,
con TypeScript escribes en un lenguaje que es muy similar al propio Javascript. Por ese motivo
los programadores interesados en usar un superset se han volcado principalmente a
TypeScript.
De todos modos, existen personas a favor y en contra de los superset, por varios motivos. Pero
en este caso usar TypeScript no tiene una desventaja particular, ya que si queremos aprovechar
las ventajas de Javascript tendremos que decantarnos por el uso de ES6, lo que nos obligará a
usar un transpilador como Babel. Al final, desarrollar en TypeScript o en el propio JavaScript
con ES6 hace muy poca diferencia en la práctica, puesto que las dos alternativas te obligarán a
usar un transpilador. En resumen, en el caso de usar ES6 necesitas de Babel, u otro
transpilador, y en el caso programar en TypeScript usarás el propio transpilador de TypeScript
(sigue leyendo para mayores aclaraciones).
Por qué TypeScript

En concreto TypeScript nos ofrece muchas de las utilidades que se necesitan en JavaScript
para poder convertirlo en un lenguaje escalable, a la altura de las necesidades más exigentes.
TypeScript nos ofrece muchas de las cosas que los desarrolladores de lenguajes más
tradicionales vienen usando en su día a día.
Una de las diferencias fundamentales es que TypeScript es verdaderamente orientado a

objetos, trayendo herramientas como la herencia, sobrecarga, etc. En resumen tiene cosas que
suenan a lenguajes como Java, C++, C#, etc. Otro ejemplo clave es el del tipado estático. En el
caso de TypeScript este tipado estático es opcional, pero obviamente su uso es muy
recomendado y es una de las principales utilidades que nos van a facilitar mucho el trabajo y la
depuración de los programas.
Nota: TypeScript se parece a C#. Es un hecho. El motivo es que el propio creador del
lenguaje, Anders Hejlsberg, es ingeniero de Microsoft y actualmente arquitecto jefe de C#.
El propio TypeScript nace con el objetivo de aportar a Javascript las herramientas y
ventajas en el desarrollo con las que están acostumbrados desarrolladores de lenguajes más
potentes como C# o Java.
Cuando trabajamos con TypeScript tenemos a nuestra disposición todas las herramientas de
Javascript ES6 (EcmaScript 6) y muchas de las que encontraremos en la futura especificación
ES7. Por lo tanto, usar TypeScript te asegura que podrás adelantarte al futuro y empezar a usar

las posibilidades de estos estándares en el presente.
Además, TypeScript es la opción más natural de entrar en Angular 2, la nueva versión del más
popular de los frameworks JavaScript. Si trabajas o vas a trabajar con Angular 2 apreciarás
dominar TypeScript, por varios motivos que explicaremos. Entre ellos porque la mayor parte
de la documentación la encontrarás con este lenguaje y porque te ofrece las mejores
herramientas para combinar con el estilo de desarrollo promovido por Angular 2.
Qué necesitamos para usar TypeScript

Básicamente necesitamos descargar dos programas. El primero es NodeJS, no porque
necesitemos desarrollar con Node, sino porque el compilador de TypeScript está desarrollado
en NodeJS.
Desde el sitio de NodeJS encontramos las opciones para la instalación en nuestro sistema
operativo, por medio de un típico instalador con su asistente (siguiente, siguiente…) Más
información en el Manual de NodeJS.
Luego necesitarás el TSC (Command-line TypeScript Compiler), la herramienta que nos

permite compilar un archivo TypeScript a Javascript nativo. Este software es el que está
realizado con NodeJS y su instalación se realiza vía npm con el siguiente comando:
npm install -g typescript
Cómo crear y compilar un archivo TypeScript

El archivo TypeScript lo creas con cualquier editor de texto para programadores, como
habitualmente haces con cualquier otro lenguaje. Solo que generalmente usarás la extensión
".ts".
Algo muy importante: Cualquier código Javascript compila en TypeScript. Esto quiere decir
que el código que tenemos en Javascript lo podemos usar también perfectamente dentro de
Javascript. Por tanto, para trabajar con TS podemos usar perfectamente los conocimientos que
tenemos en Javascript, agregando diversas ayudas que nos ofrece TypeScript.
Este sería un posible código TypeScript donde hemos colocado básicamente unos cuantas
declaraciones de tipos en variables. Además de una función que se ha declarado devuelve
"void" (nada).
var a:number = 9;
a += 4;
function mostrar(b:string) :void{
console.log(b);
mostrar('hola');

Para compilarlo usarás el mencionado TSC y lanzarás un sencillo comando que convertirá el
código a Javascript nativo.
tsc ejemplo.ts
La herramienta TSC incluye además "watchers" que permiten vigilar cambios en los archivos
TS, compilando su código a JS en el instante sin que tengamos que intervenir. Además es
habitual que el compilador, se use en conjunto con otras herramientas como Gulp para
mejorar aún más el flujo de desarrollo.
Existe asimismo un archivo de configuración llamado "tsconfig.json" en el que podemos

indicar todas las opciones que queramos para el compilador (por ejemplo el estándar
EcmaScript al que deseamos compilar el código, el tipo de reporte de errores que se desea, las
rutas donde colocar los archivos compilados, etc).
Editores y TypeScript
Una de las cosas que debemos de conseguir cuando vamos a programar con TypeScript es un
editor que lo soporte. El motivo es que los editores son capaces de compilar el código
TypeScript a la vez que se está escribiendo, informando de errores en el código en el instante
de su creación, lo que ahorra mucho tiempo y facilita el flujo de desarrollo.
Te informará de asuntos como:
Una variable con tipado estático a la que se le intenta cargar un dato de otro tipo
Una función que devuelve un valor de un tipo distinto al que debería
Una función a la que no se le están pasando los valores de tipos correctos, o los objetos
de clases correctas
Un objeto sobre el que se intentan invocar métodos privados
Y la lista no para de crecer…
Además, al tipar las variables seremos capaces de obtener muchas más ayudas "intellisense",
como métodos invocables sobre cadenas o números, métodos que contiene un objeto, etc.
Existen editores que ya incorporan las ayudas para la programación en TypeScript, como
Visual Studio o Visual Studio Code (Este último un editor ligero y gratuito para cualquier uso).
Otros editores como Vim, Atom, Sublime Text o Brackets necesitarán la instalación de plugins
especiales para poder aportar todas las ayudas de TypeScript.
TypeScript Playground
Un sitio interesante para probar TypeScript sin necesidad de instalar nada, o para revisar
rápidamente cómo un código TS compilaría a Javascript, es el TypeScript Playground.
Encontrarás dos cajas de texto, en la primera escribes código TypeScript y en tiempo real verás
cómo este código compila a Javascript en la caja de la derecha. Además encontrarás ayudas en
la caja de la izquierda, donde escribes TS, indicando en qué partes de tu código se encuentran
problemas y sus motivos.

Esta es una herramienta muy útil tanto para aprender TypeScript como para probar
puntualmente un código que os recomendamos experimentar ya mismo. Tiene un desplegable
muy útil porque ya te muestra varios ejemplos de código ya escritos, si es que quieres ver cómo
funciona el compilador sin tener ni idea de cómo se escribe en TS.
Vídeo de presentación de TypeScript

Para acabar os ofrecemos a continuación el vídeo de presentación de TypeScript, que grabamos
con motivo del inicio del Curso de TypeScript en EscuelaIT. En esta clase online tuvimos a
nuestros profesores del curso, que nos explicaron para qué sirve TypeScript y nos realizaron
unas cuantas demostraciones de su uso, capaces de aclarar dudas y facilitar los primeros pasos.

http://desarrolloweb.com/articulos/introduccion-a-typescript.html
Este artículo es obra de Enrique Fernandez Guerra

Disponible online en http://desarrolloweb.com/articulos/introduccion-a-typescript.html

Progressive Web Apps
Qué son las Progressive Web Apps, características y tecnologías para desarrollar
este tipo de aplicaciones web.
Progressive Web Apps es un nuevo concepto que llega al mundo del desarrollo web de la mano
de Google. Es algo que engloba varias cosas, como herramientas, tecnologías o simplemente la
forma como las aplicaciones web se relacionan con los usuarios. Lo describiremos en el
presente artículo.
Pero antes de comenzar, cabe decir que seguramente ya has experimentado las Progressive
Web Apps anteriormente, aunque quizás sea algo a lo que no le habías puesto nombre todavía.
Muchos de los grandes, como Google, Facebook, Twitter o Linked-in están usando
herramientas de Progressive Web Apps en sus sitios web y tú también puedes hacerlo de una
manera relativamente sencilla.
Qué características incluye el concepto de Progressive Web Apps

Podemos nombrar una serie de herramientas o características que están incluidas dentro de lo
que se conoce como Progressive Web Apps. Verás que todas tienen un denominador común:
ser funcionalidades asociadas con las apps para móviles, que hasta hace poco eran ajenas a la
web.
Y es que, en resumen, las Progressive Web Apps son funcionalidades extendidas de las
aplicaciones web, que permiten colocarlas a un nivel mucho más próximo de las aplicaciones
móviles, o de escritorio. Es decir, son un pasaporte para convertir una web en una aplicación
capaz de hacer cosas que antes estaban asociadas a programas y aplicaciones instalables en
ordenadores o dispositivos.
Notificaciones push: Para mi es una de las características más interesantes dentro de las
Progressive Web Apps. La posibilidad de enviar notificaciones al usuario, ya sea a su móvil o al
ordenador de escritorio, laptop, etc. Hasta ahora las notificaciones estaban reservadas
prácticamente para las aplicaciones de móviles y hoy las Progressive Web Apps también son
capaces de enviarlas. No necesitas una app y tampoco una aplicación. El propio navegador se

encarga de enviarlas al usuario, incluso a pesar que la página de la aplicación no esté abierta.
Acceso offline: Aunque tus usuarios se queden sin conexión a Internet, una Progressive Web
App es capaz de seguir funcionando. Obviamente algunas de las funcionalidades no estarán
disponibles, pero será capaz de sincronizar los datos una vez la conexión vuelva al ordenador o
al dispositivo.
Cacheo, precacheo: Son capaces de cachear las páginas de una manera distinta,
permitiendo arrancar mucho más rápidamente en sucesivos accesos. Además son capaces de
adelantarse al usuario y acceder a recursos, como páginas o imágenes, que se prevé van a
requerirse más adelante, para cachearlos y servirlos más rápidamente cuando llegue el
momento.
Instalación en la pantalla de inicio: Son capaces de instalarse en la pantalla de inicio del

móvil, igual que ocurre con las apps para dispositivos.
Pantallas de splash: Cuando arrancan pueden mostrar una pantalla inicial al usuario, con el
logotipo de la web o cualquier otra imagen, que se visualizará durante la carga de la aplicación.
Storage: El uso del sistema de almacenamiento de datos del navegador para realizar tareas
diversas, es otra de las características habituales de las PWA.
Como ves, estas capacidades, y otras que pueden englobarse en el conceto de Progressive Web
App son todas muy similares a las que ya conoces de las apps nativas de los teléfonos. Solo que
no tienes que instalar nada, simplemente se acceden como cualquier otra web. Obviamente,
todo esto va unido a un diseño y experiencia de usuario que también se asemeja al de las apps
para móviles.
Lenguaje y tecnología para hacer Progressive Web Apps

El lenguaje para hacer todo esto es Javascript, el lenguaje de la web. No necesitas nada más. Ni
tan siquiera un framework o nada parecido, aunque librerías como es el caso de Polymer,
Angular o React facilitarán algunas de las tareas.
Nota: En mi caso he experimentado en el desarrollo de Progressive Web Apps en una

aplicación Polymer y es realmente rápido el desarrollo porque en el catálogo de
componentes de Polymer ya se encuentran varios para implementar de una manera rápida
y cómoda muchas de estas características. Puedes aprenden en el Manual de Polymer y
atento al próximo curso de desarrollo de apps con Polymer, donde explicaremos al detalle
cómo realizar todas estas cosas.
De todos modos, cuando hablamos de tecnología nos tenemos que detener a explicar alguna
cosa sobre uno de los actores principales de las Progressive Web Apps, el service worker.
Qué es un Service Worker

Los service workers son los facilitadores de muchas de las asombrosas características de las

Progressive Web Apps. Son los que permiten acceder offline a una web, así como recibir
notificaciones aunque el usuario no esté visitando nuestra web en ese momento, por poner
algunos ejemplos.
Básicamente son archivos de código Javascript referenciados en la página, igual que otros
scripts que se puedan usar. Solo que los service workers se instalan en el navegador del usuario
y son capaces de funcionar incluso cuando el usuario no tiene abierta nuestra página.
Esos Service Workers tienen acceso a la plataforma web (el navegador) y pueden hacer cosas
como acceder a su sistema de caché, mostrar contenido aunque el usuario esté offline, guardar
información en el sistema de almacenamiento, lanzar notificaciones, etc.
Tú mismo puedes construir tu propio service workers o usar una especie de templates
mediante los cuales puedes configurar el service worker para que éste se genere
automáticamente atendiendo a una configuración que puedes definir según tus necesidades.
Los service Workers en sí dan para escribir un manual independiente para ellos solos. De
momento Google o Mozilla son los que más información han publicado de ellos. Si buscas
información encontrarás algunos buenos tutoriales en la web.
La PWA de DesarrolloWeb
Durante el parón de vacaciones de agosto construí una Progressive Web App, que todavía estoy
mejorando poco a poco, a medida que el tiempo me lo permite. La hice con ánimo de
experimentar con todas estas funcionalidades nuevas del ámbito de la web, y de paso mejorar
algunas cosas que estaban anticuadas en DesarrolloWeb.
La puedes visitar en https://app.desarrolloweb.com/
Hay muchas cosas que hacer todavía, y muchas ideas que espero tener tiempo de implementar
durante los próximos meses.
Vídeo de las Progressive Web Apps

El pasado martes emitimos un programa en directo para hablar de las Progressive Web Apps.
Es un buen modo de mantenerte informado de las características de la web de hoy y del futuro.
Te arrojará muchos otros datos para conocer las características y el ecosistema de las PWA.
Puedes verlo a continuación:

http://desarrolloweb.com/articulos/que-son-progressive-apps.html

Disponible online en http://desarrolloweb.com/articulos/que-son-progressive-apps.html

Ionic 2 Vs NativeScript
Una comparativa de las dos alternativas más populares para el desarrollo de apps
para móviles, basadas en Javascript: Ionic 2 y NativeScript.
Hoy vamos a analizar dos alternativas en contraprosición como son Ionic 2 y NativeScript,
herramientas basadas en Javascript para el desarrollo de apps. Ambas permiten, mediante
una única base de código, construir aplicaciones para varias plataformas móviles, al
menos Android e iOS. Obviamente, el trabajo de desarrollo se reduce casi a la mitad, porque
con un mismo proyecto podemos producir las aplicaciones para ambos sistemas, sin necesidad
de empezar desde cero cuando queremos migrar una app de iOS para Android o viceversa.
A nivel de costes es claramente mejor, porque tenemos menos trabajo, pero es también muy
relevante que el mismo equipo de desarrollo pueda acometer el proyecto en ambos sistemas, lo
que reduce el personal necesario en plantilla.
No obstante, hay que decir que todo no son balas de plata y que lo nativo es esencial para
muchos tipos de aplicaciones. Sobre todo aquellas que necesitan un alto rendimiento o las que
necesitan hacer cosas muy específicas sobre el hardware de los dispositivos. Empresas grandes
y proyectos exigentes creo que deberían centrarse claramente en los lenguajes nativos, que
siempre han de ser las mejores soluciones. Pero para proyectos menos exigentes y empresas
que miren el presupuesto, Ionic o NativeScript son las mejores opciones.
Otro motivo por el que irnos a lo nativo es que podemos soportar las versiones de dispositivos
que nosotros nos fijemos como objetivo. Recuerda que Ionic y NativeScript funcionarán bien
en dispositivos Android 4 y superiores. Ver más abajo detalles.
Por qué Ionic y NativeScript

Cada vez resulta más apropiado usar una tecnología basada en Javascript para el desarrollo de
apps para móviles. El motivo no es solo que resulta muy tentador usar un lenguaje que ya
conocemos para el desarrollo de una app, sino que verdaderamente las soluciones basadas en
Javascript funcionan muy bien.

Lo cierto es que no son las únicas alternativas pero creo que sí son las más relevantes para la
mayoría de las personas. Primero porque ambas se basan en Angular 2, un framework muy
potente y que es conocido por un gran número de desarrolladores. Usar Angular 2 para el
desarrollo de apps es posible en ambas soluciones, sin que tengamos que hacer ningún trabajo
para integrar el framework en la app.
Si no piensas usar Angular 2, quizás podrías fijarte también en Apache Cordova como
alternativa a Ionic. Pero la verdad es que tanto Ionic 2 como NativeScript te ofrecen una buena
cantidad de componentes y plugins muy útiles para desarrollar rápidamente funcionalidades
comunes, por lo que serían muy atractivos para considerar en cualquier proyecto.
Después de asistir a cursos de ambas tecnologías en 2016: Curso de Ionic 2 de EscuelaIT y

curso de NativeScript también en EscuelaIT, creo que puedo dar mi opinión con bastante
fiabilidad. No obstante, siempre me gusta advertir que la opinión de una persona no debería
ser determinante para tu elección sino las necesidades de tu proyecto. O incluso el equipo de
desarrollo que tengas contigo.
Lo ideal sería que hicieras los primeros pasos con uno y otro y así vas aclarando el panorama y
viendo cuál se adapta mejor a tus necesidades. Tenemos vídeos en Youtube, en el canal de
desarrolloweb (mira las referencias más abajo) que dan muy buenas vistas de pájaro de los
estilos de desarrollo y de las cosas que puedes hacer con uno y otro. Ya luego cuando sepas cuál
podría ser tu apuesta, tenemos los cursos en EscuelaIT para aprender a desarrollar y realizar
proyectos con mucho detalle y profundidad.
Ventajas e inconvenientes de Ionic 2

Para comenzar a hacerte tu propia opinión te recomendamos los vídeos de Ionic 2 que hemos
emitido en el canal de DesarrolloWeb.com:
Hangout de presentación general de Ionic 2

Clase práctica de Ionic 2
Ahora veamos los pros y los contras, recordando que siempre me refiero en contraposición a
uno y otro sistema y no en general a los de otras plataformas.
Ionic pros
Me gusta bastante el estilo de desarrollo en Ionic 2. Es más parecido a lo que se usa en la web
en general, por lo que una persona que esté familiarizada en el desarrollo de aplicaciones web
con Angular 2 será capaz de adaptarse más rápidamente a Ionic 2, en comparación con
NativeScript.
Pero creo que lo más importante es que en Ionic 2 eres capaz de reutilizar más código de un
proyecto que tengas en la web con Angular 2. Muchas cosas te tocará rehacerlas, puesto que es
cierto que los componentes de interfaz gráfica que te ofrecen en Ionic son específicos, pero si
tienes bien estructurado tu proyecto eso no será tan problemático.
En Ionic me gusta mucho también la cantidad de componentes que ofrecen para hacer muchas
cosas y el hecho de que esos componentes ya se adapten al look & feel que las aplicaciones

tienen en cada dispositivo. A nivel de diseño lo veo más trabajado.
Ionic contras
En Ionic 2 eres más dependiente de los plugins para acceder al hardware y a las cosas nativas
como notificaciones, etc. Los plugins vienen de terceros y si dejan de funcionar te dejan de
funcionar a ti también. Aunque eso no debería ser un problema, quizás solo ante la
fragmentación de Android.
Hablando de compatibilidad, a priori también NativeScript es un poco más compatible con

versiones anteriores de Android. Aunque usando CrossWalk podemos revertir este problema.
Ventajas e inconvenientes de NativeScript

Como siempre digo, si quieres hacerte tú mismo la opinión, que sería lo más adecuado,
tendrías que comenzar viendo los vídeos en los que hemos tratado el desarrollo de apps con
NativeScript:
Conocer NativeScript en líneas generales

NativeScript por la práctica
Primeros pasos para crear un proyecto con NativeScript
Nativescript pros
A priori, y aunque no he hecho pruebas en este sentido, debemos suponer un mayor

rendimiento en NativeScript que Ionic 2, porque el producto es nativo, una vez compilado.
Lo más relevante no obstante es que en NativeScript no usas un web view, por lo que tu
aplicación no sería una simple web con envoltura de app. Trabajas directamente con lo nativo,
hardware, recursos diversos. En general NativeScript te permite sentir más cercano al
dispositivo, puedes usar librerías que usan los mismos desarrolladores de iOS y Android.
Dicho de otra forma, no estás encorsetado a lo que te permite hacer una web.
Nativescript contras
En mi opinión, NativeScript tiene una curva de aprendizaje más pesada para la gente que viene
de la web. No puedes reaprovechar buena parte del código de la web, aunque usas Javascript y
angular 2 igual que ionic, entre otras cosas porque el mecanismo para producir las vistas no es
exactamente el mismo, sino tiene un sabor más parecido a como se desarrolla en Java para
Android. Hay que recordar que no estás desarrollando una web propiamente dicha, sino una
aplicación y eso hace que diversas cosas que se pueden usar en la web no se pueden usar
directamente en NativeScript por mucho que quieras.
Veo más rico el conjunto de componentes de interfaz gráfica disponibles en Ionic. NativeScript
tiene sus propios componentes y en ese sentido Telerik está haciendo muy buen trabajo, pero
como nos tiene acostumbrados la compañía, no todos los componentes se liberan como open
source. Tenemos que tener en cuenta en este sentido que NativeScript lleva menos tiempo de
vida, por lo que es de suponer que poco a poco la comunidad vaya liberando componentes de

interfaz gráfica que incrementen las alternativas existentes hoy.
Conclusión
Como ya apunté al principio del artículo, lo ideal es que pruebes ambas alternativas para ver
cuál se ajusta a tus necesidades, porque en principio te sirven para hacer las mismas cosas y las
aplicaciones en las que las puedes usar son más o menos del mismo tipo. Para mi la diferencia
fundamental es cómo se accede a los recursos del móvil, como la cámara, por medio de plugins
o de programación que compila a nativo. También la curva de aprendizaje y la capacidad de
reutilizar partes de una aplicación web pueden ser determinantes para determinados
desarrolladores.
No obstante, habría que ver las opiniones de personas más experimentadas y para ello hemos
realizado un evento en el que abordaremos esta misma comparativa con los profesores de los
cursos de EscuelaIT dedicados a ambos frameworks. Puedes verlo en el vídeo a continuación.

http://desarrolloweb.com/articulos/ionic-vs-nativescript.html

Disponible online en http://desarrolloweb.com/articulos/ionic-vs-nativescript.html

Qué Es Cada Tecnolgía PDF

Cargado por

Copyright:

Formatos disponibles

Qué Es Cada Tecnolgía PDF

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Qué Es Cada Tecnolgía PDF

Cargado por

Copyright:

Formatos disponibles

Qué es cada tecnología

http://desarrolloweb.com/manuales/15.php Página 1 de 172

Introducción: Qué es cada tecnología

Encuentras este manual online en:

http://desarrolloweb.com/manuales/15.php Página 2 de 172

Autores del manual

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de

Guillermo Aedo Contreras

José Antonio González Seco

Erick Ruiz de Chavez

Desarrollador web, Geek "de hueso colorado", Marido feliz.

http://desarrolloweb.com/manuales/15.php Página 3 de 172

Juliana Monteiro Lazaro

Rubén es doctor en química y programador aficionado con experiencia

Diseño web Murcia

Gisela Torres Buitrago

Desarrolladora en tecnologías .NET y Windows Azure MVP

http://desarrolloweb.com/manuales/15.php Página 4 de 172

Mario Cortés Flores

SharePoint Lead en Plain Concepts

Diseñador gráfico y Web

Desarrollador Web. jQuery. Responsive Design. Wordpress. Friki por

Apasionado de la informática, los videojuegos, rol y... la cerveza. Key

Ana Alvarez Sanchez

Directora de contenidos de EstiloyModa.com

Enrique Fernandez Guerra

http://desarrolloweb.com/manuales/15.php Página 5 de 172

Desarrollador web Frontend, especializado en Javascript y TypeScript.

http://desarrolloweb.com/manuales/15.php Página 6 de 172

El HTML es un lenguaje de marcación de elementos para la creación de documentos

http://desarrolloweb.com/manuales/15.php Página 7 de 172

Para aprender HTML en profundidad tenemos un manual en DesarrolloWeb.com. Además se

Vídeo qué es HTML

Para ver este vídeo es necesario visitar el artículo original en:

Este artículo es obra de Miguel Angel Alvarez

http://desarrolloweb.com/manuales/15.php Página 8 de 172

color: indica el color del contenido la etiqueta donde estemos utilizándolo,

http://desarrolloweb.com/manuales/15.php Página 9 de 172

generalmente indica el color del texto.

Color en los enlaces

Para hacer esto utilizaremos el atributo style dentro del enlace:

<a href="mienlace.html" style="color:red">

Espaciado entre líneas

<p style="line-height: 25px;">

líneas, así saldrán separadas

Espaciado entre caracteres

Este párrafo tiene las letras espaciadas por 1 centímetro.

Enlaces sin subrayado

http://desarrolloweb.com/manuales/15.php Página 10 de 172

<a href="mipagina.html" style="text-decoration:none">

Incluir estilos para todo un sitio web

1- Creamos el fichero con la declaración de estilos

2- Enlazamos la página web con la hoja de estilos

Para ello vamos a colocar la etiqueta <LINK> con los atributos:

rel="STYLESHEET" indicando que el enlace es con una hoja de estilo.

http://desarrolloweb.com/manuales/15.php Página 11 de 172

<link rel="STYLESHEET" type="text/css" href="estilos.css">

<title>Página que lee estilos</title>