Sección: batallitas

El desarrollo de una página web

Me ha dado mucha envidia José Pujol con sus “posts” en los que explica el día a día de su trabajo, así que en esta entrada voy a hacer lo mismo.

En la web de Público tenemos dos partes muy diferenciadas: el gestor de contenidos y las páginas que genera (básicamente, la portada, las subportadas y las páginas con noticias) y el resto (blogs, video, sección de cine, archivos estáticos, etc).

Hoy voy a tratar de contar cómo hemos construido la página web del concurso Foto Libre.

Lo primero que hicimos fue reunirnos con la gente del periódico que organizaba el concurso (departamentos de fotografía, “marketing” y sistemas). En esta reunión se estableció la mecánica del concurso desde un punto de vista genérico, sin entrar en detalles técnicos.
Esta fase se suele denominar “toma de requisitos” y es fundamental para que un proyecto salga adelante. Tienen que quedar perfectamente especificadas todas las características deseables.

Con esta información, desde la parte de diseño y programación web (nosotros) se hicieron unos bocetos o esquemas de las páginas. Por ejemplo: “pantalla de inicio, desde ahí el usuario puede ir al formulario de registro o a la galería de fotos”, o “pantalla de registro, el usuario introduce sus datos para participar y se le envía un correo de confirmación”, etc.
Existe un término llamado “casos de uso” que sirve para documentar las posibles interacciones y flujo de trabajo de una aplicación.
En este punto, todavía no se ha escrito nada de código, pero son pasos necesarios para que todo salga bien. Si no está claro qué se quiere obtener, difícilmente el proyecto será del gusto del peticionario.

Cuando todos los implicados han dado el visto bueno a estos bocetos, empieza el trabajo de los diseñadores (Matteo y Daniel) y programadores (Rodrigo y el autor de estas líneas).

El separar funciones es bueno y productivo y permite avanzar en paralelo. Mientras los diseñadores van esbozando las distintas pantallas, los programadores vamos haciendo el trabajo “de trastienda”: diseño de la base de datos (si es necesaria, claro), elección de la tecnología que se utilizará en el desarrollo (lenguajes de programación, “frameworks”, etc), diseño funcional de la aplicación (separación de las distintas funcionalidades de la aplicación), etc.

En este punto, los diseñadores nos proveen con algunos archivos HTML y CSS estáticos. Los programadores los “desmenuzamos” y asignamos a cada parte de la aplicación una labor, algunas de estas unidades funcionales son las que se encargan de generar el HTML de forma dinámica (obteniendo los datos de las fotos de una base de datos, validando los datos que introducen los usuarios cuando se registran o suben fotos, etc).
Es la llamada “capa de presentación”.

Hoy en día muchas webs se diseñan siguiendo un patrón o modelo muy conocido: MVC (Modelo, Vista, Controlador).
La capa M (modelo) abstrae, representa y ofrece mecanismos de acceso a los datos “crudos” de la aplicación, la capa C (controlador) se ocupa de gestionar las peticiones de las distintas páginas y solicitar los datos para generar estas páginas.
Por último, la capa V (vista o presentación) “pinta” o representa los datos en un formato determinado (en nuestra aplicación de Foto Libre, en HTML).

Para muchas páginas web sencillas o informales esta separación está casi más en la mente de las persona que escribe el código, pero en desarrollos de mayor entidad conviene separar físicamente estas funcionalidades.

Espero no haberles aburrido mucho. Es difícil condensar en unas pocas líneas tanta información. Otro día les contaremos más cosas sobre el trabajo que hacemos.

Comentarios (9)

Los servicios de Internet menos conocidos

¿Alguno de ustedes se acuerda y/o utilizó Gopher? ¿Qué fue de Archie? ¿Está perdiendo popularidad el IRC frente a otros sistemas de mensajería instantánea?

Internet no se reduce a navegar, leer el correo y “mensajear”. Hay muchas aplicaciones, servicios y protocolos que son desconocidos para el público en general.

Sólo voy a comentar algunas de estas aplicaciones/protocolos menos conocidos pero muy utilizados hoy en día:

[Todos los enlaces apuntan a la Wikipedia en inglés]

  • NTP: Network Time Protocol. Sirve para ajustar la hora de un equipo desde un servidor que ofrezca este servicio. No se si Windows utiliza este protocolo. En sistemas Unix (Mac OSX, Linux, *BSD, …) se utiliza con frecuencia.
  • SSH: Secure Shell. Permite trabajar en una “shell” o “línea de comandos” de un equipo remoto de forma segura (utilizando datos cifrados). Ha sustituido en muchos entornos al veterano Telnet y es una herramienta indispensable hoy en día para la administración de servidores.
  • DHCP: Dinamic Host Configuration Protocol. Mediante este protocolo la mayoría de los ordenadores conectados a un red consiguen una dirección IP y algunos datos más para poder trabajar.
    Al arrancar el sistema, el ordenador emite por su tarjeta de red una “petición” (algo como ‘¿hay algún servidor DHCP en esta red que me de los datos de configuración?’). El servidor DHCP le asigna entonces una dirección IP, las direcciones de los servidores de nombres y algunos datos más.
  • DNS: Domain Name System. Sin este servicio no podríamos usar Internet como lo hacemos hoy en día. A grandes rasgos, este servicio se encarga de traducir los nombres comunes de los ordenadores (p. ej., blogs.publico.es) a las direcciones IP que tienen asignadas.
    Es uno de los servicios básicos de Internet. Una caída de un servidor DNS suele ser bastante catastrófica, puede dejar sin servicio a muchos (cientos, miles o más) usuarios, dependiendo de la importancia del servidor.
Comentarios (3)

El maldito botón “Limpiar formulario”

Me contaban el otro día una anécdota nada divertida. Cierta persona tenía que rellenar un formulario con un montón de campos para una administración pública, había que especificar hasta 80 centros de trabajo, más los datos comunes, etc. En total, unos 100 campos.

Al pie del formulario había dos botones: “Validar y enviar” y “Limpiar”. La persona que me contó este caso, no muy ducha en cuestiones informáticas, interpretó que “Limpiar” se refería a una especie de corrector ortográfico o algo así, así que lo pulsó.

Mágicamente, el formulario se borró por completo, tirando a la basura más de una hora de trabajo de esta persona. Para echarse a llorar.

Y yo añado: y para matar al diseñador o programador de ese formulario.

  1. Los botones de un formulario pueden rotularse. ¿No estaría más clara la función de ese botón si estuviese rotulado como “Borrar todo” o algo así?
  2. Regla de oro cuando se diseña un interfaz de usuario: si una acción es potencialmente destructiva, pide al usuario confirmación antes de proceder a ejecutarla.
  3. Opinión más personal: ¿para qué se necesita un botón de “limpiar” en un formulario? Sinceramente, no le veo ninguna utilidad.
Comentarios (11)

RetroMadrid 2008

Una entrada breve:

Me han enviado información sobre una feria de informática clásica, RetroMadrid 2008, que se va a celebrar próximamente.

Para los que nos gustan los equipos antiguos y la “arqueología informática” es una exposición digna de verse.

RetroMadrid 2008

Los datos del evento son:

  • Fecha: Sábado 8 de marzo de 2008.
  • Horario: 10:30 a 18:30.
  • Lugar: Centro Cultural El Greco (Calle el Greco s/n. 28011 Madrid).
  • Entrada: Gratuita.
  • Teléfonos: 91 479 32 61 – 31 50
Comentarios

Direcciones IP, usuarios únicos y pucherazos

Hace unos días una de las encuestas que poníamos en la web de Público proporcionó unos resultados un tanto sorprendentes. Como mi compañero Electoblogger comentaba en su entrada, teníamos la sospecha de que la encuesta estaba falseada.

Obviamente partimos del supuesto de que este tipo de “encuestas web” sólo tienen un valor estimativo y que no son representativas ni válidas desde un punto de vista estadístico.
Personalmente, no fue el resultado de la encuesta lo que me resultó más sospechoso, sino el número de votos: teníamos casi el doble de votos que en otras encuestas, y eso que se publicó en fin de semana, que siempre hay menos lectores.

Como este “blog” está dedicado a cosas técnicas, dejaremos el análisis sociológico y político de estos presuntamente resultados falseados y nos meteremos en lo que nos gusta: la informática.

Cuando se hacen encuestas en una página web se trata de limitar las votaciones repetidas siempre de alguna forma, cumpliéndose la siguiente proporcionalidad en la mayor parte de los casos: a mayor fiabilidad del método de control, mayor incomodidad para el usuario.
En nuestras encuestas lo que más hemos primado ha sido la comodidad para participar, con lo que el control era relativamente fácil de ser eludido.

Direcciones IP

¿Cómo averiguamos que nos estaban haciendo una votación masiva?
Cuando un dispositivo (no sólo un ordenador) se conecta a Internet se le asigna un identificador único (ahora mismo matizo esto) o dirección IP (del inglés Internet Protocol).

Estas direcciones consisten en un número hexadecimal (en base 16) de 32 cifras bits, que se suele representar en notación decimal (base 10) de la forma aaa.bbb.ccc.ddd, donde los distintos números toman un valor de 0 a 254.

Hay algunos conjuntos de direcciones de red que se han establecido para uso interno, esto es, para redes que utilizan el protocolo de Internet pero que no están conectadas a Internet. No debería encontrarse nunca en Internet un equipo con la dirección, por ejemplo, 192.168.1.2 (dirección típica de red interna).

No voy a entrar en más detalles de cómo se asignan estas direcciones ni cómo se reparten, sólo quiero destacar un hecho: las direcciones IP disponibles son limitadas y se están acabando. Para solucionar este problema o al menos mitigarlo se han inventado varias técnicas:

  • Direcciones IP dinámicas:
    Si usted se conecta desde su casa, cada vez que establece una conexión su proveedor de Internet le asigna una dirección IP. Cuando termina la conexión, la dirección IP vuelve a estar libre y puede ser asignada a otro usuario.
    Con este sistema un proveedor de acceso puede reservar, por decir un número, 10.000 direcciones y dar servicio a, por ejemplo, 50.000 usuarios (siempre y cuando no se conecten más de 10.000 usuarios simultáneamente).
    Si usted quiere una dirección IP fija, tiene que encontrar un proveedor que se la “venda” y pagarla, por supuesto.
  • Servidores “proxy”:
    Supongamos una oficina en la que todos los equipos están interconectados en una red interna. Si se quiere proporcionar acceso a Internet (páginas web, generalmente) a los equipos de esta red interna se puede añadir un equipo adicional (servidor proxy) que por un lado está conectado a Internet (con una dirección IP) y por el otro está conectado a la red interna (con una dirección IP de las “privadas”). Además tiene instalado un programa que le permite recuperar páginas web y servirlas a otros equipos.
    El resto de equipos solicitarán las páginas web al “proxy” y éste será el que las recupere de Internet.
    Desde Internet, todos los equipos de esta oficina están “saliendo” con la misma dirección IP, la del proxy.
  • NAT (del inglés Network Address Translation o Traducción de Direcciones de Red):
    Es una técnica bastante diferente a la del proxy desde el punto de vista técnico, pero con un resultado “desde el exterior” similar: varios equipos “salen” a Internet con la misma dirección IP.

La consecuencia de todo esto es la siguiente (generalizando mucho): los usuarios finales en Internet tenemos dos perfiles. O somos usuarios “domésticos” con direcciones IP variables (hoy “salgo” con una, mañana con otra) o somos usuarios “corporativos” que compartimos la misma dirección con el resto de equipos de la oficina.

Registro de direcciones

Los servidores web guardan en un registro mucha información, la más típica es qué página nos piden, a qué hora y qué día, el resultado de la petición y la dirección IP que nos solicitó esa página o recurso.
En el caso de nuestra encuesta presuntamente falseada teníamos una dirección IP desde la que se había votado miles de veces lo mismo.
O era la dirección IP de una oficina, empresa, institución o similar con muchísimos usuarios que nos visitaban y votaban lo mismo o era la dirección de un particular que estaba “jugueteando” un rato con nuestra encuesta.

¿Cómo saberlo? Existen herramientas para saber a qué entidad u organización pertenece una determinada dirección IP. En el caso de nuestro “sospechoso” la dirección pertenecía al proveedor de acceso mayoritario en España (Telefónica), y el nombre del equipo era el típico que utilizan los proveedores de Internet para sus clientes “domésticos” con direcciones IP dinámicas.

Por supuesto, esta dirección en otro momento puede pertenecer a cualquier otro cliente, pero los proveedores de acceso están obligados por ley a guardar un registro de qué dirección asignan a cada abonado y en qué intervalo de tiempo el abonado tiene esta dirección. Esta información es confidencial y sólo puede ser accedida por orden judicial.

No es el caso, nuestro “supervotante” no ha cometido delito alguno, sólo ha utilizado muchas veces (miles de veces) un servicio que ofrecíamos saltándose algunas restricciones.

El caso es que a la poca fiabilidad que pueda tener una encuesta de este tipo se le ha unido la incertidumbre de que algún usuario ha votado masivamente. Estamos pensando qué hacer para aumentar la fiabilidad de nuestras encuestas sin complicar mucho el sistema para que siga siendo fácil participar. A ver qué se nos ocurre …

Conclusión

¿Cree usted que utilizar Internet es un acto anónimo? Ni de lejos.

Comentarios (16)

Siguiente Página »      artículos anteriores ->