Buscar este blog

miércoles, 31 de agosto de 2016

Historia de HTML

Tim Berners-Lee es considerado el padre de la Web al desarrollar en 1990 las tres tecnología que dieron lugar a ella: HTML, URL Y HTTP.

La mejor información que se tiene sobre los primeros años de HTML se encuentra en el libro Ragget On HTML, de 1998, pues Dave Ragget, unos de los autores de este libre, fue el editor de la especificación del lenguaje HTML durante muchos años.

HTML se desarrolló a partir de SGML (Standard Generalized Markup Language), un estándar ISO de 1986 que se empleaba para la organización y etiquetado de textos, y que no impone ningún conjunto de etiquetas en especial; así, SGML es idéntico al actual XML. Berners-Lee inventó la etiqueta <a href> para los hipervínculos , que SGML no incluía.



Las primeras versiones de HTML entre 1990-1993 no fueron estandarizadas, en parte porque su uso no estaba muy extendido.

El primer intento de estandarización lo encontramos en junio de 1993, en un borrador escrito por Berners-Lee y Daniel Connolly, donde se puede encontrar la primera versión de este lenguaje, el HTML 1.0.; todavía no incluía las tablas ni los formularios, y los documentos creados con él ya no son útiles en la actualidad.

En noviembre de 1993 salió la luz la nueva versión, HTML+, que  nunca llegó a estandarizarse. Incorporaba por primera vez tablas y formularios, y era capaz de definir formulas matemáticas con ecuaciones; esta característica no se incorporó a HTML finalmente, pero dio lugar a un lenguaje totalmente independiente, llamado MathML.

Tras la fundación en 1994 de W3C, que se encargará desde entonces de las tecnologías que mueven la web, en noviembre de 1995 aparece HTML 2.0, el primero en estandarizarse, aunque sólo llegó a ser una recomendación del W3C. Coincidió con la guerra entre navegadores, por lo que tanto Netscape como Microsoft introdujeron sus propias etiquetas, pero nunca fueron añadidas a HTML.

En enero de 1997 se publicó HTML 3.2, la primera versión estandarizada directamente por el W3C.

En diciembre de 1999 se publicó la última revisión, HTML 4.01.

El W3C abandonó el desarrollo de HTML para concentrarse en XML, un metalenguaje que define unas reglas para definir otros lenguajes. En enero de 2000 se publicó XHTML 1.0, una reformulación de HTML 4 con reglas más estrictas, e incluso se llegó a una revisión en 2002, pero fue un lenguaje no que se usó demasiado.

En 2004 Apple, Mozilla y Opera crean un grupo llamado WHATWG que comienza un nuevo desarrollo de HTML, al que por fin se une también el W3C. Así se llega al HTML 5, estandarizado en 2014, y HTML 5.1, que lo hará en este 2016, según las previsiones de W3C.

miércoles, 24 de agosto de 2016

El lenguaje HTML

HTML son las siglas de HyperText Markup Language, que puede traducirse como lenguaje de marcas o marcado de hipertexto.

El lenguaje HTML tiene muchas etiquetas, pero aplicando el Principio de Pareto (la regla del 80-20), sólo hay que conocer bien el 20% de las etiquetas, ya que con ellas se crea el 80% del contenido de las páginas web. Las etiquetas más importantes son:

  • html
  • head
  • meta
  • title
  • link
  • style
  • script
  • body
  • p
  • a
  • strong
  • em
  • img
  • form
  • input
  • select
  • textarea
  • table
  • tr
  • th
  • td
  • blockquote
  • hr
  • ul
  • ol
  • li
  • div
  • span

martes, 23 de agosto de 2016

Prototipado: wireframes, mockups y prototipos




Para llegar al prototipado de una aplicación web, un Arquitecto de información debe ser responsable de los siguientes pasos:

  1. Identificar los objetivos del proyecto.
  2. Identificar las necesidades de los usuarios.
  3. Especificar las funcionalidades y requerimientos de la aplicación web.
  4. Definir y diseñar los sistemas de navegación, organización, etiquetado y búsqueda.
  5. Prototipar, por fin, la aplicación web.
El prototipado se realiza mediante planos y maquetas:

-PLANOS
  • Son diagramas de organización y funcionamiento.
  • Se conocen como blueprints, diagramas de contenido o flujo, o mapa web.
  • Deben ser comprensibles y reflejar con claridad la estructura, el flujo de navegación y la relación entre los elementos.


-MAQUETAS

  • Son diagramas de presentación.
  • Crean una referencia visual de la estructura, organización e interacción a nivel de página.
Se dividen en:

1. Prototipos de baja fidelidad

  • Dibujos estáticos (Sketching, dibujos a lápiz y papel)
  • Wireframe (inventariado de contenido más elaborado y comportamiento de la página)
  • Cuando tenemos una secuencia de wireframes, hablamos de Storyboard.

2. Prototipos de alta fidelidad


  • Llamados funcionales o mockups.
  • Maquetas dinámicas, en HTML, que tienen implementadas partes del sistema final a desarrollar.

La importancia de prototipar una aplicación antes de comenzar el diseño gráfico y su implementación es vital, por varias razones:
  1. El equipo y el cliente se centran en el diseño de contenidos e interacción y no en el diseño visual.
  2. El cliente ve y comprende cómo será la aplicación, mucho mejor que si se le ofrece escrita en un documento.
  3. Evita malentendidos entre el proveedor y el cliente e incluso entre los propios miembros del equipo.
  4. Ayuda a especificar los requerimientos y a detectar inconsistencias o falta de funcionalidad.
  5. Es un complemento de gran valor en el análisis.
  6. El prototipo se modifica con facilidad y rapidez.
  7. Se evitan modificaciones posteriores mucho más costosas cuando la aplicación ya se está implementando.
  8. Se reducen costes y tiempo.
  9. Permite realizar pruebas de usabilidad, como tests con usuarios, en etapas tempranas del proyecto.
  10. Se detectan y solucionan los problemas antes de comenzar su implementación.
  11. El resultado son aplicaciones web más fáciles de entender, de usar y que se ajustan mejor a las necesidades de los usuarios.
Consejos para realizar un buen prototipo: 
  • Sencillez y claridad.
  • Hazlo en blanco y negro.
  • Representa los tamaños y proporciones de los bloques de contenido.
  • Ten en cuenta las pautas de accesibilidad y usabilidad.
  • Diseña para tus usuarios.         


jueves, 18 de agosto de 2016

El desarrollo web

Muchas veces se confunden los términos desarrollo web y diseño web y se piensa que el diseño web incluye el desarrollo completo de una página web. Y no es así.

DISEÑO WEB

-Diseño visual (look and feel) - Elementos gráficos
-Herramientas gráficas (Adobe Photoshop, GIMP)
-Diseño (sin código) - Trozos:
  • HTML + CSS
  • Elementos gráficos


DESARROLLO WEB

-Programación necesaria para construir una aplicación web
-Parte cliente:
  • HTML y CSS para la creación de páginas web.
  • JavaScript y DOM para la programación de la parte cliente.
-Parte servidor (creación del back end):
  • Lenguajes de script (PHP, ASP, ASP.NET, JSP, Perl y Coldfusion)
  • Diseño y desarrollo de bases de datos
  • Seguridad
-Fases del desarrollo web: Contacto inicial, Planificación, Contenido, Diseño, Desarrollo y  Lanzamiento.



 Infografia Un sitio web diseñado

Modulo 2: Cómo se escribe una página web

Módulo 2: Cómo se escribe una página web


miércoles, 17 de agosto de 2016

¿Cómo funciona el DNS?

El siguiente vídeo es un vídeo oficial de red.es, "una entidad pública que trabaja para que la sociedad española aproveche al máximo el potencial de Internet y las nuevas tecnologías". Este vídeo puede ser un poco difícil de entender porque no contiene ninguna explicación, es simplemente una animación, pero con lo que te hemos explicado en Las direcciones IP y el sistema de nombres de dominio seguro que lo podrás entender correctamente.

La idea principal que transmite este vídeo es que sólo transcurren unas milésimas de segundo desde que el usuario aprieta el botón para navegar a una dirección web hasta que se resuelve la dirección IP asociada a un nombre de dominio y se solicita el recurso asociado a la dirección web.


Guía para principiantes para nombres de dominio

¿Cómo es el proceso de registro?

¿Por qué hay tanta diferencia en los costos de los nombres de dominio?

¿Qué ocurre si olvido renovar mi nombre de dominio?

¿Puedo comprar y vender un nombre de dominio?

Estas y muchas otras preguntas son respondidas en la Guía para principiantes para nombres de dominio publicada por ICANN (Internet Corporation For Assigned Names and Numbers), el organismo que regula los nombres de dominio.

Cómo nos conectamos a Internet

El siguiente vídeo de la Comisión Nacional de los Mercados y la Competencia explica las principales formas que existen de conectarse a Internet en España (cobre, fibra óptica y cable coaxial) y algunas de sus diferencias.



Arquitectura de la World Wide Web

Architecture of the World Wide Web, Volume One es una recomendación del W3C del año 2004 en la que se describe la arquitectura de la Web y las decisiones de diseño que condujeron a alcanzar esa arquitectura y modo de funcionamiento.

Lo más destacable es la definición de la Web que se ofrece en la introducción:

La World Wide Web (WWW, o simplemente Web) es un espacio de información en el que los elementos de interés, denominados recursos, se identifican mediante identificadores globales llamados Identificadores Uniformes de Recursos (URI).

 Por cierto, parece que con este primer volumen tuvieron suficiente... el segundo no hay forma de encontrarlo.

lunes, 15 de agosto de 2016

Sistema de gestión de contenidos (CMS)

Un sistema de gestión de contenidos (en inglés Content Management System y también conocido por sus siglas CMS) es un software que permite crear, administrar y publicar contenidos en forma de páginas web.

En este curso vas a aprender a utilizar Blogger, un servicio disponible a través de Internet que se puede clasificar como un sistema de gestión de contenidos ofrecido bajo la modalidad de Software como Servicio (en inglés Software as a Service y también conocido por sus siglas SaaS), un servicio de distribución de software donde el programa y los datos que maneja el programa se alojan en servidores a los que se accede a través de Internet.

Las direcciones IP y el sistema de nombres de dominio

Las direcciones IP identifican los dispositivos conectados en una red, como por ejemplo un ordenador; sin embargo, normalmente empleamos un nombre de dominio. ¿Qué relación existe entre las direcciones IP y los nombres de dominio?



En la actualidad hay dos sistemas de direccionamiento IP:

- IPv4: Se expresan por un número binario de 32 bits, y permiten un espacio de direccionamiento de 4.294.967.296.
- IPv6: Se expresan por un número binario de 128 bits, y permiten un espacio de direccionamiento de 3,4x10^38; como estas direcciones son más largas se emplea la notación hexadecimal: 4 dígitos hexadecimales separados por 2 puntos.

Los nombres de dominio se transforman en direcciones IP gracias al Sistema de Nombres de Dominio (DNS, Domain Name System en inglés); básicamente es una base de datos distribuida entre diferentes ordenadores, los servidores de DNS, que se comunican entre sí.
El sistema DNS ofrece muchas ventajas, siendo dos las principales:
-Los nombres de dominio son mucho más fáciles de recordar que las direcciones IP.
-Los nombres de dominio son mucho más fiables, ya que las direcciones IP pueden cambiar por diversas razones.

Como hemos visto, las DNS son el mecanismo de traducción del conjunto de números que forman la dirección IP del ordenador. Es decir, cada vez que un usuario quiera entrar a ‘www.swhosting.com’ las DNS lo traducirán a ’59.159.412.66’, por ejemplo.
Los registros NS son los nombres de los servidores que determinan las DNS, es decir, dos o más servidores tendrán la información con la cual el ordenador del usuario que quiera entrar a ‘swhosting.com’ ubicará el dominio en cuestión. Como mínimo, deben haber dos registros (es decir, dos servidores): el primario o ‘Máster’ y el secundario o ‘Esclavo’. El primario es el que alberga toda la información de la ubicación de los archivos del servidor mientras el secundario es el que replica la información del servidor primario.
Los tipos de registros más utilizados son:


  • A = Address – (dirección) Este registro se usa para traducir nombres de servidores de alojamiento a direcciones IPv4.
  • AAAA = Address – (dirección) Este registro se usa en IPv6 para traducir nombres de hosts a direcciones IPv6.
  • CNAME = Canonical Name – (nombre canónico) Se usa para crear nombres de servidores de alojamiento adicionales, o alias, para los servidores de alojamiento de un dominio. Es usado cuando se están corriendo múltiples servicios (como FTP y servidor web) en un servidor con una sola dirección IP. Cada servicio tiene su propia entrada de DNS (como ftp.ejemplo.com y www.ejemplo.com). Esto también es usado cuando corres múltiples servidores HTTP, con diferentes nombres, sobre el mismo host. 
  • NS = Name Server – (Servidor de Nombres) Define la asociación que existe entre un nombre de dominio y los servidores de nombres que almacenan la información de dicho dominio. Cada dominio se puede asociar a una cantidad cualquiera de servidores de nombres.
  • MX = Mail Exchange – (registro de intercambio de correo) Asocia un nombre de dominio a una lista de servidores de intercambio de correo para ese dominio. Tiene un balanceo de carga y prioridad para el uso de uno o más servicios de correo.
  • PTR = Pointer – (indicador) También conocido como 'registro inverso', funciona a la inversa del registro A, traduciendo IPs en nombres de dominio. Se usa en el archivo de configuración de la zona DNS inversa.
  • SOA = Start of authority – (Autoridad de la zona) Proporciona información sobre el servidor DNS primario de la zona.
  • ANY = Toda la información de todos los tipos que exista.


El dominio .es

¿Cuándo se comenzaron a comercializar los dominios territoriales .es?

Los dominios territoriales .es fueron fundados en 1989, en 1990 se registró el dominio de la propia entidad gestora, pero en 1991 se comenzaron a comercializar.

Aunque los dominios “.es” fueron fundados en 1989, no es hasta 1990 cuando se produce el primer registro, www.nic.es., creado por la propia entidad gestora de estos dominios de Internet.

Los primeros registros del “.es” datan de 1991, siendo el más antiguo en vigor, como se ha visto, el del Instituto de Astrofísica de Canarias (iac.es).

¿Cuántos dominios territoriales .es se han registrado hasta el momento?

En 2009, el “.es” cumple 20 años, con 1,2 millones de dominios registrados. Cinco años más tarde, en este 2014, superan los 1,7 millones, 500.000 más que los “.com”, y representan 1 de cada 2 dominios de Internet de cuantos existen en nuestro país.

Las estadísticas correspondientes al mes de agosto de los dominios “.es” indican que en España hay registrados un total de 3.421.735 dominios y más de la mitad de ellos, el 50,81%, son un “.es”. Este tipo de dominios, los que más se identifican con España y el idioma español, suman 1.738.732 y superan en más de millón a los “.com”, que ocupan el segundo lugar y representan el 34,62%, 16 puntos por debajo.

¿Cuál es el organismo que gestiona los dominios territoriales .es?

Los dominios “.es” fueron creados en 1989. En sus primeros años de desarrollo, fueron gestionados por RedIRIS, la red española de comunicaciones para el ámbito académico y científico, que fue impulsada en el marco de Fundesco e integrada posteriormente en el Centro Superior de Investigaciones Científicas (CSIC).


Con la creación de la entidad pública Red.es, en el año 2002, se inicia un cambio de rumbo en la gestión de los “.es”, que culmina con el Plan Nacional de Nombres de Dominio de 2005.

viernes, 12 de agosto de 2016

Los nuevos nombres de dominio

.com, .org, .net y otros más fueron los primeros nombres de dominio que existieron en Internet. Pero Internet ha crecido mucho desde su nacimiento, las necesidades han aumentado y esos nombres de dominio se han quedado pequeños.

A mediados de 2012, ICANN (Internet Corporation For Assigned Names and Numbers), el organismo que regula los nombres de dominio, publicó una lista con los 1.930 nuevos nombres de dominio de primer nivel que habían sido solicitados durante el proceso que había iniciado unos años antes. Estos nombres de dominio no existen todavía, se están introduciendo poco a poco y algunos han sido rechazados.

Algunos de los nuevos nombres de dominio se refieren a profesiones, como .abogado o .doctor, así como a empresas y marcas, como es el caso de .microsoft, .google, .canon, .dunlop o .calvinklein.

Respecto a España, destacan los dominios geográficos como .barcelona o .madrid, junto a los de marcas como .zara o .movistar, y entidades financieras como .lacaixa y .bbva.

Y respecto a Latinoamérica, algunas empresas han solicitado nombres de dominio específicos, como .avianca., .globo o.uol.

Los nombres de dominio

Si analizamos de derecha a izquierda la siguiente url:

http://www.ua.es/es/estudios/index.html

encontramos que está compuesta por: 
  • El documento o archivo: index.html
  • La ruta al documento o directorio: es/estudios
  • El dominio o máquina: www.ua.es
  • Esquema: http
El dominio es un nombre único que sirve para identificar un sitio web en Internet.

Hasta hace unos años, sólo podían usarse los caracteres ASCII, una tabla que contiene 128 caracteres, pero de los que sólo 95 pueden ser imprimibles; además, al ser letras del alfabeto inglés, no contiene acentos ni la letra ñ, lo cual era bastante engorroso para el idioma español. Esto se solucionó al introducir el IDN (Internationalized Domain Name, o Nombre de Dominio Internacionalizado), que tiene caracteres en otros idiomas, aunque su uso no está muy extendido.

En Internet, el dominio de un sitio web puede ser sustituido por una dirección IP, ya que existe una correlación entre los dos; la IP sirve para identificar un ordenador en la Red.

http://185.22.92.56/es/estudios/index.html

Los nombres de dominio se organizan en diferentes niveles:

     1. Nivel 1:
     
        -Genéricos: Son dominios de propósito general, e inicialmente acababan en .com, .edu, .gov,              .mil, .net y .org; después se añadieron otros como .biz, .mobi y .xxx.

        -Territoriales: Son los que identifican a un país (.es para España, .fr para Francia, .de para                   Alemania...). El registro de estos dominios esta sometido a las normas de cada país; en España             los gestiona la organización red.es, y se puede conocer su funcionamiento en la web                             dominios.es

     2. Nivel 2: Son los que registramos al solicitar un dominio, y suelen estar compuestos por un          nombre + dominio de nivel 1 (idesweb.es, sergiolujanmora.es...).

     3. Nivel 3: Se utilizan en algunos países, y normalmente se componen de nombre + dominio          de nivel 1 y 2; en España están los dominios controlados .com.es, .nom.es, .org.es, .gob.es y              .edu.es (datos.gob.es, mecd.gob.es).

En la url

www.dlsi.ua.es

podemos distinguir: 
  • .es, dominio de nivel 1 territorial.
  • .ua, dominio de nivel 2.
  • www.dlsi como nombre de máquina o host.

Example.com y example.org, junto con example.net, son dominios de segundo nivel reservados para ser utilizados en ejemplos y documentación, y son gestionados por la IANA, que pertenece a la ICANN.

lunes, 8 de agosto de 2016

Las URLs amigables

Según la Wikipedia, las URLs amigables o semánticas son '' aquellas URLs que son, dentro de lo que cabe, entendibles para el usuario. Lejos de las clásicas URLs de las páginas dinámicas llenas de variables GET y números difíciles de recordar, las URL semánticas están formadas con palabras relacionadas con el contenido de la página y fáciles de recordar. Estas se utilizan en los sitios web dinámicos (no estáticos); por ello se están utilizando mucho más que las URL extensas.''

En esta tabla se pueden ver varios ejemplos de URLs amigables:



Las URLs

Creadas también por el padre de la Web, Tim Berners-Lee, las URLs son el sistema para localizar recursos en la World Wide Web: su nombre, Uniform Resource Locator en inglés, significa Localizador de Recursos Uniforme.

El formato básico de una URL es el siguiente:

esquema: //máquina/directorio/archivo

aunque también puede contener otros datos, como nombre de usuario y contraseña, puerto de conexión o una combinación de todo lo anterior.

La URL

http://desarrolloweb.dlsi.ua.es/idesweb-2a-ed/modulo-01

estaría formada por: 
  • Esquema: http://
  • Máquinadesarrolloweb.dlsi.ua.es
  • Directorioidesweb-2a-ed
  • Archivomodulo-01
El esquema o servicio es el protocolo que se usa para recuperar un recurso a través de una red de ordenadores; los más conocidos son http, https, ftp, mailto y file.

Las URLs son el elemento que definen los hiperenlaces y el hipertexto, que permiten relacionar información de diversas fuentes por medio de enlaces.

Cuando una URL es muy complicada y difícil de memorizar, se emplean los Acortadores de URL, que convierten una URL larga en una corta; see han popularizado gracias a las redes sociales como Twiter, que limita el uso de caracteres en sus mensajes, y los más famosos son el de Google, el de Bitly y el de Owly.

Desde 1994, en los estándares de Internet, el concepto de URL ha sido incorporado dentro del más general de URI (Uniform Resource Identifier, Identificador Uniforme de Recursos) pero el primero sigue utilizándose de manera muy amplia.




viernes, 5 de agosto de 2016

El hipertexto y la hipermedia


Las páginas web son el ejemplo más conocido del uso del hipertexto y la hipermedia, aunque no son el único sistema que los utiliza. Podríamos definirlos así:

-Hipertexto: Conjunto estructurado de textos, gráficos, etc..., unidos entre sí por enlaces y conexiones lógicas. Los padres del hipertexto han sido varios, resultando los más relevantes:

  • Paul Otlet: Considerado como el padre de la Bibliografía y la Documentación, a principios del siglo XX (1934) ideó MUNDANEUM, un archivo centralizado donde se recogiese todo el conocimiento de la humanidad, usando un sistema de ficheros que contenían enlaces que las conectaban entre sí. 
  • Vannevar Bush: Uno de los administradores del proyecto Manhattan, publicó en 1945 un artículo sobre un dispositivo fotoeléctrico y mecánico llamado MEMEX, capaz de crear y seguir enlaces entre documentos almacenados en microfichas.
  • Ted Nelson: Acuñó en 1963 los términos hipertexto e hipermedia, e ideó XANADÚ, un sistema basado en el hipertexto que aún hoy sigue en desarrollo. Acuñó también el concepto de la teledildónica.
-Multimedia: Que utiliza conjunta y simultáneamente diversos medios, como imágenes, sonidos y texto, en la transmisión de una información.
-Hipermedia: Si juntamos las dos definiciones anteriores, este concepto podría definirse como un Conjunto estructurado de diversos medios unidos entre sí por enlaces y conexiones lógicas para la transmisión de una información.

miércoles, 3 de agosto de 2016

Evolución de la Web: de la página web a la aplicación web



Desde la publicación de la primera página web en 1990, estas han tenido una gran evolución que las ha hecho muy distintas de esa primera versión, debido a varios motivos:
  • Evolución del lenguaje HTML, que en sus versiones fue incorporando imágenes, tablas y marcos.
  • La incorporación del diseño gráfico al desarrollo de las páginas web, que dio lugar al Diseño Web.
  • La incorporación de los formularios, que permitían mayor interacción entre el usuario y el sitio web.

Así, las páginas web han terminado transformándose en Aplicaciones Web, gracias a la incorporación de un software que permite realizar todo tipo de tareas desde a través de la misma página; ello proporciona interesantes ventajas:
  1. No necesitan actualización: el usuario siempre accede a la última versión.
  2. Independencia de dispositivo: el usuario puede acceder a la página web desde cualquier dispositivo con acceso a internet.
  3. Ubicuidad: Permite acceder a sus funciones desde cualquier sitio o dispositivo desde el que se acceda.
Todo esto ha permitido el concepto de Computación en la nube (CLOUD COMPUTING), que acabará con lo que entendemos por ''ordenador personal'', ya que cualquier dispositivo con el que se acceda a una página web determinada acabará comportándose como nuestro PC.