Webquest: Elaboración de Páginas Web para Dispositivos Móviles

Introducción

Hoy en día son numerosos los dispositivos que se conectan a Internet. Como bien sabemos, los orígenes de Internet se sitúan en la Investigación Militar, pasando por las Universidades y culminando a finales del Siglo XX con la llegada de Internet a nuestras casas y a los centros educativos. Pero en éste timeline hay algo en común: todos los equipos son Ordenadores Personales, Servidores o Estaciones de Trabajo de Escritorio. En lo que llevamos de Siglo XXI han aparecido numerosos dispositivos que ya disponen de conectividad a Internet tales como: electrodomésticos, televisores, equipos de Car-Audio, navegadores y los que más conocemos y están «a la orden» en nuestro día a día: los dispositivos móviles. Con nuestro teléfono móvil o tablet podemos hacer prácticamente todas las actividades cotidianas que requieren el uso de Internet y que normalmente solíamos hacer con un PC doméstico: consultar el correo, ver las noticias, leer libros, pujar en subastas, hacer compras, consultar el saldo de nuestras cuentas bancarias, pagar impuestos y recibos. Todo esto tiene algo en común y es el leitmotiv de éste módulo: son Aplicaciones Web. A pesar de que ya somos capaces de desarrollar aplicaciones Web, tenemos que considerar que dada la peculiaridad de los dispositivos móviles (capacidad de procesamiento, memoria, tamaño y resolución de pantalla y Sistema Operativo, principalmente) resulta indispensables adaptar dichas Aplicaciones a éstos dispositivos, por lo que surge la necesidad del Responsive Design o diseño Responsable/Adaptable, siendo el término anglosajón más utilizado que el castellano.

Tareas

El Responsive Design es fundamental e indispensable en el desarrollo de Aplicaciones Web para Dispositivos Móviles. Para conocerlo mejor, ver sus posibilidades y considerar un uso del mismo en nuestros proyectos futuros se propone este trabajo de investigación, el cuál se elaborará por grupos repartiendo las tareas entre todos los miembros del mismo. La manera más sencilla de coordinar los trabajos es utilizar los documentos de Google, disponibles a través de Google Drive (http://drive.google.com), donde se incluirá toda la información que se vaya encontrando en Internet y que se considere importante. Posteriormente, con esta información, los grupos agregarán comentarios a ésta entrada con enlaces a sus respectivos documentos de Google y finalmente elaborarán un Wiki en el se recogerán todos aquellos aspectos importantes e indispensables en la aplicación de la estrategia de Responsive Design a cualquier proyecto Web y en especial, a los proyectos finales que están desarrollando. Los grupos, al igual que el proyecto final, serán de cuatro personas y serán los mismos que los utilizados para el mismo. Finalmente, se expondrán los blogs en el Aula de Clase a través de una breve presentación oral. Esta exposición va destinada a sus compañeros/as, por lo cuál, los contenidos han de ser claros y directos, así como la indicación de una aplicación eminentemente práctica de los mismos. Para elaborar los blogs utilizaremos WordPress (http://www.wordpress.com).

Proceso

La libertad de los contenidos se deja a vuestra elección. Eso sí, debe contar al menos con los siguientes apartados:

1. Definición y Características del Responsive Design.

2. Sintaxis en CSS3 para aplicación de estilos propios.

3. Código de buenas prácticas en Responsive Design.

4. Herramientas informáticas para la elaboración de Sitios Web para dispositivos móviles y ejemplos de uso de las mismas.

5. Algunos ejemplos.

6. Proyecto de conversión de Aplicación Web de Escritorio a Aplicación Web de Dispositivo Móvil enfocado a nuestro Proyecto Final.

7. Reflexiones de equipo del trabajo desarrollado.

Se deben incluir imágenes y/o gráficos aclaratorios en los distintos apartados del trabajo de investigación, así como una reflexión de grupo coherente en aquellos conceptos técnicos detectados.

Recursos

A continuación se os dejan algunos recursos con los que partir en el desarrollo de éste trabajo:

http://www.w3schools.com/html/html_responsive.asp

http://www.destacaimagen.com/diseno-y-maquetacion-web-smartphones-y-tablets/

http://googlewebmaster-es.blogspot.com.es/2011/03/como-hacer-que-un-sitio-web-sea-apto.html

http://es.wikipedia.org/wiki/Dise%C3%B1o_web_adaptable

https://econsultancy.com/blog/64823-the-five-golden-rules-of-responsive-web-design/

Evaluación

Los criterios de evaluación de éste trabajo se recogen en el siguiente listado y se ponderarán del 0 al 10 en función de la calidad del criterio correspondiente.

1. Claridad y concisión de los contenidos desarrollados en cada apartado.

2. Presentación y organización de los contenidos.

3. Ortografía

4. Adaptación de los contenidos encontrados al nivel técnico de conocimientos del aula.

5. Elección de los ejemplos.

6. Originalidad y aportaciones personales en los contenidos expuestos.

La evaluación será realizada tanto por el profesor como por los compañeros/as del aula, estableciéndose una ponderación del 50% de la nota por parte del profesor y el 50% restante por el promedio de las evaluaciones realizadas por los compañeros.

Conclusión

Una vez finalizada la exposición y evaluación de trabajos realizaremos una puesta en común en el aula sobre los contenidos que se han visto durante el proceso de investigación.

Créditos

Profesor: David Taima Hernández

Web: https://www3.gobiernodecanarias.org/medusa/ecoblog/dtaiher