Material Design para Bootstrap 3

Existe una clara tendencia en el mundo del desarrollo de intentar replicar una misma experiencia de usuario tanto en móviles como en navegadores de escritorio. Lograrlo no es sencillo, sin embargo existen recursos para facilitarnos esta tarea como es el caso de Material Design para Bootstrap 3.

MD para Bootstrap 3 es un desarrollo de un programador independiente que está intentando, con gran éxito, replicar la experiencia de Material Design para Android en cualquier navegador web, algo que ya muchos intentaron, sin embargo este proyecto utiliza bootstrap como framework de desarrollo, detalle que es sumamente interesante.

Este recurso se instala fácilmente como cualquier theme para Bootstrap con la gran ventaja que esto representa. Una solución sencilla al problema de lograr una experiencia similar entre aplicaciones móviles nativas y soluciones basadas en navegadores.

Instalación de Material Design para Bootstrap 3

• NPM : npm install bootstrap-material-design
• Bower : bower install bootstrap-material-design

Una buena noticia para aquellos que están buscando economizar recursos, este proyecto está disponible para su utilización desde dos CDN oficiales.

• Bootstrap Material Design on CDNJS.com
• Bootstrap Material Design on JSDelivr.com

Este es un ejemplo de los scripts necesarios para su funcionamiento

  <!-- Material Design fonts -->
  <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700">
  <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/icon?family=Material+Icons">

  <!-- Bootstrap -->
  <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

  <!-- Bootstrap Material Design -->
  <link rel="stylesheet" type="text/css" href="dist/css/bootstrap-material-design.css">
  <link rel="stylesheet" type="text/css" href="dist/css/ripples.min.css">

Este proyecto cuenta con los principales componentes de bootstrap en su versando para Material Design.
Como siempre les recomiendo visitar la web del proyecto para recibir más información además de ver sus funciones en acción.
Web: MD para Bootstrap 3

Usando HTTP/2 en NorfiPC para cargar las páginas más rápido

Mejoras y ventajas que ofrece HTTP/2. Que navegadores lo admiten. Como saber si lo usamos en una página y si un sitio web lo ha implementado. Diferencias entre HTTP 1.1, SPDY y HTTP/2.

En este artículo compartimos información sobre HTTP/2, el nuevo protocolo de internet introducido para acelerar la navegación, que permite cargar los elementos de las páginas de una forma más rápida y eficiente.
Nuestro sitio web al igual que todos los que operan bajo el servicio CDN de CloudFlare, usa HTTP/2 desde diciembre del 2015.
HTTP/2 es la más reciente versión y una evolución del protocolo predeterminado de internet HTTP.
Permite agilizar y mejorar considerablemente la carga de las páginas web, especialmente las que contienen varios elementos y necesitan de varias peticiones por el navegador.
No obstante se mantiene la compatibilidad con los protocolos anteriores, por lo que las páginas se pueden cargar usando el antiguo HTTP 1.1, el experimental SPDY y HTTP/2.
Depende del navegador usado por el lector y si el servidor web al que accede lo tiene implementado.

Diferencias entre HTTP 1.1, SPDY y HTTP/2

HTTP 1.1

HTTP 1.1 es el primero de los protocolos introducidos para navegar en internet y usado en todos los sitios web. La versión original HTTP 1.1 data de 1999.
Permite intercambiar datos entre el navegador y el servidor web, mediante el envío y recepción previa de peticiones, con la desventaja de una gran latencia entre peticiones ya que la conexión se abre y se cierra con cada una de ellas.

SPDY

SPDY es un protocolo experimental desarrollado e introducido por Google para mejorar el rendimiento en las comunicaciones entre servidor y cliente y reducir el tiempo de carga de las páginas web.
SPDY (se pronuncia como la palabra en inglés "speedy"), utiliza una sola conexión TCP para manejar varias peticiones HTTP a la vez.
Según Google permite una mejoría de más de un 50% en la velocidad de carga de las páginas.
Existen 5 versiones (2, 3, 3.1, 4 y 5).
SPDY está disponible solo en los sitios, que lo que lo han implementado.
Actualmente se sigue empleando, pero se ha interrumpido su desarrollo.

HTTP/2

HTTP/2 es una completa revisión de HTTP basado en SPDY.
Al igual que SPDY mejora la carga de los elementos de las páginas usando las siguientes funcionalidades:

- Multiplexación: Varios recursos son cargados mediante una sola petición, a diferencia de HTTP 1.1 que requiere que cada petición use su propia conexión TCP.
Esto es una gran ventaja porque los navegadores solo establecen un número limitado de conexiones al mismo tiempo y actualmente las páginas necesitan de muchos recursos.
Por ejemplo esta página requiere para cargar completamente, que el navegador efectúe 66 peticiones.
Tantas peticiones se deben a los elementos propios de la página (texto, imágenes, CSS), los scripts de las redes sociales y la publicidad.
- Compresión de encabezados HTTP.
- Protocolo binario en vez de textual.

Tanto HTTP/2 como SPDY requieren un certificado SSL valido y están solo disponibles para conexiones HTTPS.

Que navegadores web admiten HTTP/2

No todos los navegadores web admiten HTTP/2 y SPDY.
Actualmente las últimas versiones de los siguientes navegadores los admiten: Google Chrome (versión de escritorio y móvil), Firefox (versión de escritorio y móvil), Edge, Opera, Opera Mobile, Amazon Silk (dispositivos Kindle Fire) y iOS Safari (a partir versión 9).
De lo anterior se deduce que los que usan dispositivos con Android deben de instalar algunos de los navegadores anteriores.
Para obtener información actualizada accede a la siguiente página: Lista de navegadores que soportan HTTP/2
Para comprobar si el navegador que usas admite HTTP/2, solo entra a la siguiente página creada por CloudFlare: Test de HTTP/2

Como saber si un sitio web usa HTTP/2

En el momento de esta publicación solo grandes redes como Akamai (Facebook), Google, CloudFlare y otros sitios han implementado HTTP/2 en sus servidores.
Si sientes curiosidad y quieres comprobar el uso de HTTP/2 en las páginas en que navegas, puedes en el navegador web una extensión.
Para Google Chrome está disponible HTTP/2 and SPDY Indicator y para Firefox SPDY Indicator.
En la siguiente imagen de ejemplo se puede ver el funcionamiento de HTTP/2 and SPDY indicator en Chrome, al cargar una página de nuestro sitio.
La extensión muestra un pequeño icono a la derecha de la barra de direcciones, que usa un color diferente con cada tipo de protocolo.
Para el predeterminado HTTP 1.1 el icono es de color gris, para SPDY verde y para HTTP/2 azul.

Extensión en el navegador Google Chrome que indica si una página de un sitio emplea el protocolo HTTP/2, SPDY o HTTP 1.1.

Otra opción es usar una herramienta online para probar la implementación de HTTP/2 en cualquier sitio web de internet.
Para eso accede a: HTTP/2 Test

Probando con el servicio de HTTP/2 Test si HTTP/2 esta implementado en el sitio NorfiPC.

Como saber que elementos de una página no son cargados con HTTP/2

Aunque el servidor de un sitio lo tenga implementado y el navegador lo acepte, no todos los recursos de una página son cargados mediante HTTP/2, porque algunas peticiones pueden ser hechas a sitios de terceros como las redes sociales.
Para comprobar el protocolo usado en la carga de cada recurso, se puede usar en el navegador Google Chrome la herramienta Developers Tool (Herramienta para Desarrolladores).
Para eso en el panel Networks habilita el menú "Protocolos".

Herramienta para Desarrolladores de Google Chrome mostrando que elementos de una página son cargados usando HTTP/2, en ese caso el protocolo se representa como "h2".

Sitios populares que han adoptado HTTP/2

Entre los sitios más importantes de internet que han implementado HTTP/2 en sus servidores se encuentran: Google, Facebook, Youtube, Yahoo, Twitter, Instagram y Feedly.

---

Como implementar HTTP/2 en un sitio web

Los desarrolladores y administradores de sitios pueden encontrar toda la información para implementar HTTP/2, en la página principal del proyecto en http://http2.github.io/. También herramientas para probar y diagnosticar su funcionamiento.
Como decíamos al comienzo del artículo todos los sitios que usan CloudFlare, pueden activar HTTP/2 en sus sitios.

Más información sobre HTTP/2

➔ En el sitio IsTheWebHTTP2Yet se ofrece información sobre la implementación de HTTP/2 en los sitios de internet, agrupándolos en tres categorías:
Sitios que han anunciado el soporte, que soportan parcialmente el protocolo y los que ofrecen soporte verdadero.
En cada caso se puede descargar una lista con las direcciones URL de los sitios.
También se muestran varios gráficos que muestran el crecimiento de la adopción en cada caso, comenzando el verdadero soporte en septiembre del 2015.
Además el inicio del soporte por servidores, organizaciones y países. Se destaca entre las organizaciones CloudFlare.
➔ En W3Techh se muestra el crecimiento de la adopción de HTTP/2 desde mediados del 2015 y los sitios más populares que lo han implementado.

Significado de los Códigos de Estado y de Error HTTP

Mensajes que usan los servidores de internet para indicarle al navegador el estado de las páginas, recursos o archivos solicitados. Origen y causa. Como ver los Códigos de Estado y como cambiar y modificar los mensajes de Error creando paginas personalizadas.

Al hacer la petición de una página web con el navegador web, el servidor donde el archivo está alojado responde siempre con un código de tres caracteres, conocido como Código de Estado HTTP.
Este breve mensaje o respuesta le indica al navegador el estado del recurso o de la pagina solicitada y de él depende la siguiente acción a seguir.
Algunos de estos Códigos de Estado generan automáticamente molestas Páginas de Error.

Que indican los Códigos de Estado y que los causa

Los codigos que comienzan con el numero 1 indican Respuestas informativas.
Un código 200 significa que no existen problemas y a continuación se procede a entregar la información solicitada. Otros codigos que comienzan con el 2 indican Peticiones correctas.
Un código 301 indica que la pagina existe pero en otra dirección. Otros códigos que comienzan con 3 indican situaciones relacionadas con redirecciónes del servidor.
Todos los códigos de estado anteriores que son informativos no se muestran al usuario. No obstante se pueden ver usando la Consola del navegador.
Un código 404 indica que el archivo solicitado no existe en el servidor. Otros códigos que comienzan con el 4 indican errores del cliente.
Un código 500 indica errores en el servidor, así como otros que comiencen con el número 5.
Los códigos anteriores 4XX y 5XX se conocen como Códigos de Error y se muestran siempre en el navegador del usuario con un mensaje predeterminado en cada caso, que a veces es difícil de comprender.
El registro oficial de los Códigos de Estado HTTP es mantenido por la IANA (Internet Assigned Numbers Authority).
A continuacion explicamos el significado de los Codigos de Estado mas frecuentes, recibidos al navegar en internet.

Lista de los Códigos de Estado HTTP más frecuentes

Todos los Codigos de Estado consisten en un grupo de tres numeros separados con un guion de una frase descriptiva en ingles. El primero de los numeros indica que pertenece a una de las cinco clases de respuesta.

Códigos de Estado Informativos y de Redirecciones

200 - OK
Es el codigo de estado mas frecuente, significa que todo funciona correctamente. indica que la petición fue recibida correctamente, entendida y aceptada.
Tambien existen los codigos 201, 202, 203, 204, 205, 206, 207 y 208, todos corresponden a Respuestas informativas.

301 - Moved Permanently (Movido permanentemente)
Redirecciona la peticion e indica que la pagina o recurso a cambiado de direccion y que esta peticion y las futuras deben ser realizadas a la nueva direccion.

302 - Moved Temporarily (Movido temporalmente)
Redirecciona la peticion e indica que la pagina o recurso ha sido movido pero de forma temporal.

304 - Not Modified (Sin modificar)
Indica que la petición a la URL no ha sido modificada desde que fue requerida por última vez, en otro lenguaje que los recursos son cargados de la cache del navegador, lo que ahorra ancho de banda y reprocesamiento tanto del servidor como del cliente.
Para asegurarnos que se cargan los recursos desde el servidor, debemos refrescar la pagina o sea usar las teclas Control y F5.

Tambien existen los codigos 300, 303, 305, 306, 307 y 308, todos corresponden a Redirecciones.

Códigos de Error del cliente y servidor

Error 404 - Not Found (No se encuentra)
Es uno de los codigos de estado mas molestos. Indica que la pagina o recurso no ha sido encontrado en el servidor, porque se ha eliminado o ha cambiado de direccion, sin haberse referenciado la nueva. Se debe revisar la dirección usada en el navegador.
No se debe confundir con errores DNS del navegador que indican que la dirección empleada conduce a un dominio o servidor que no existe, el Error 404 es generado por el servidor indica que la pagina no está disponible.

Página predeterminada con Mensaje de Error 404 que devuelve Apache, ante un archivo no encontrado.

La página de Error 404 predeterminada que devuelven los servidores generalmente está en inglés y su contenido es confuso, por ese motivo muchos sitios la personalizan incluyendo más información o recursos de utilidad para el visitante, como puede ser un cuadro de búsqueda o un enlace al Mapa del sitio.
Lo anterior se puede comprobar en nuestra Página de error 404.

Error 401 – Unauthorized (No autorizado) y 403 – Forbidden (Prohibido)
Son codigos de estado similares que generan una pagina de error. Indican que no se tiene acceso al recurso o pagina por alguna razon que pueden ser las siguientes:
- Cuando la autentificación ha fallado o ha sido denegada en una página protegida con contraseña.
- Cuando la dirección IP desde donde se accede está bloqueada o baneada.
El Error 403 es muy usado para rechazar y discriminar visitantes por su procedencia geográfica. Una solución es usar servicios VPN para burlar la censura.

Tambien existen los codigos 400, 402, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 422, 423, 424, 425, 426, 428, 429, 431, 449 y 451, todos han sido creados para informar de Errores del cliente.

Error 503 - Service Unavailable (Servicio no está disponible)
Codigo de estado que genera una pagina de error que indica que el servidor donde esta alojada la pagina o el recurso no funciona.
En esos casos se puede acceder en otro momento, porque es posible que la interrupcion sea momentanea, debido a mantenimientos o por otra razon.

Error 504 - Gateway Timeout (Tiempo de espera de la conexión agotado)
Indica retardo en la red debido a una mala conexión o excesivo tráfico, que impide que los datos no se reciban correctamente.

Tambien existen los codigos 500 (generico), 501, 502, 505, 506, 507, 508, 509, 510 y 511, todos corresponden a Errores de servidor.

Los anteriores son los Codigos de Estado mas frecuentes.
Puedes ver una lista de todos los empleados actualmente en HTTP en el siguiente documento: Códigos de estado HTTP.docx

Códigos de Error de CloudFlare

CloudFlare el servicio CDN que usa nuestro sitio web y que sirve páginas de centenares de miles de sitios web, ha agregado otros Códigos de Estado no estandarizados.
Son necesarios para el servicio ya que funciona como un proxy entre el navegador del cliente y el servidor original.

Error 521 - Web Server Is Down (Servidor original caído)
Indica que el servidor original del sitio no funciona.

Error 522- Connection Timed Out (Terminado el tiempo de espera)
Indica que se ha establecido una conexión con el servidor original, pero no ha finalizado, generalmente por falta de recursos.

Mensaje de Error 522 que muestra CloudFlare al tratar de acceder a una página que usa el servicio y que no responde correctamente.

Tambien CloudFlare usa los códigos 520 (generico), 523, 524, 525 y 526, todos corresponden a Errores de servidor.

Otros Códigos de Error HTTP

Además de los anteriores varios servicios y aplicaciones usan Códigos de Estado propios. Algunos son los siguientes:

420 - Enhance Your Calm (Twitter)
450 - Blocked by Windows Parental Controls (Microsoft)
509 - Bandwidth Limit Exceeded (Ancho de banda excedido, usado por cPanel de Apache, en servicios compartidos de alojamiento.)

Como ver los Códigos de Estado HTTP

Los códigos de estado del grupo 2XX y 3XX que siempre pasan desapercibidos, se pueden ver usando la Consola Web del navegador.
En la siguiente captura se puede ver la Consola del navegador Google Chrome, donde se advierte una Redirección 301. Sucede al usar el enlace a una página que ahora usa otra dirección URL.

Redirección 301 en una página de nuestro sitio en la Consola del navegador Google Chrome.

La Consola web de los navegadores se abre usando las teclas Control + Shift + J.
Esta opción es de interés para los desarrolladores y aficionados poder conocer y comprobar el funcionamiento de determinadas páginas de sus sitios y los cambios hechos.

---

Como cambiar y modificar los Mensajes de Error HTTP

Todas las paginas con mensajes de error que reciben los usuarios en el navegador web, debido a los Códigos del Estado de los grupos 4XX y 5XX, se pueden editar y modificar para que la información sea más comprensible y agradable, en vez del predeterminado que la mayoría de las veces está en inglés y solo usa un lenguaje técnico.

Instalar la Barra de Alexa en el navegador web, ventajas y beneficios

Funcionamiento de la extensión o plugin para el navegador, que nos permite saber el Rank de la popularidad y ofrece información de los sitios de internet que visitamos. Diferencias en los distintos navegadores.

Uno de los varios complementos o extensiones que podemos usar en el navegador web, para tener una mejor experiencial al navegar en internet, es la Barra de Alexa.
La Barra de Alexa es desarrollada por el servicio de Alexa Internet, que se dedica a monitorear el tráfico de internet.
Al instalarla y usarla podemos recibir información sobre cada sitio web que visitamos, principalmente conocer su popularidad, importancia y el tráfico que recibe.
En este artículo explicamos de que se trata, como funciona y las ventajas y beneficios de esta extensión para los que navegamos en internet.

¿Qué es y cómo funciona la Barra de Alexa?

La Barra de Alexa es una extensión, plugin o complemento para el navegador web.
Al instalarla recibimos de forma opcional información sobre los sitios de internet que visitamos.
También nos convertimos en miembros de una inmensa comunidad, que ayuda a valorar la importancia de estos sitios.
La barra en los navegadores Google Chrome, Firefox y Opera no resta velocidad a la navegación, ni interfiere en lo absoluto.

¿Qué es el Rank de Alexa?

La principal información que nos muestra la Barra de Alexa de los sitios es el Rank o Índice asignado por Alexa.
Es un valor numérico relacionado con su popularidad, en la medida que sea menor, mayor será el tráfico que posee dicho sitio.
Algunos ejemplos del Rank de Alexa de sitios de internet.

- Google: 1
- Wikipedia: 7
- VirusTotal: 4175
- NorfiPC: 13622

Algunos sitios que no son muy populares poseen un Rank de 1 o de varios millones.

Rank de Alexa y otros datos que muestra la Barra de Alexa en el navegador web.

Ventajas y beneficios al usar la Barra de Alexa

Al usar la Barra de Alexa en nuestro navegador web nos beneficiamos por las siguientes razones:

- Conocemos mediante el Rank de Alexa la importancia relativa y popularidad de sitio que visitamos, lo que nos permite valorar la fiabilidad de la información que encontramos en sus páginas.
En muchas ocasiones tenemos dudas sobre la autoridad de una página al leer su contenido o al descargar algún archivo, en caso de que el Rank del sitio sea de varios millones, nos demostrara que casi no es visitado y por lo tanto poco fiable.
- Podemos ver una la lista de sitios relacionados, que nos servirá como sugerencia.
- Tenemos la opción de ver como lucia el sitio en una fecha pasada, usando el enlace de la página que visitamos a Wayback Machine. Este es un servicio de Internet Archive que guarda copias regularmente de los sitios de internet.
- Ayudamos a que nuestros sitios preferidos (como este) sean mejor valorados ya que enviando información al servicio de Alexa de las páginas en las que navegamos, nos convertiremos de una especie de evaluadores del tráfico de internet.

Al usar la Barra de Alexa ayudas a nuestro sitio web NorfiPC
Como explicamos en otro artículo, si eres un lector de nuestro sitio o un visitante regular, nos ayudas y apoyas al usar este complemento en tu navegador, porque así contribuyes a que nuestra web sea correctamente valorada y aportas tu grano de arena para mejorar nuestro ranking.

Como instalar la Barra de Alexa

La Barra de Alexa está disponible para los principales navegadores de internet: Internet Explorer, Firefox y Google Chrome, aunque en Opera también se puede instalar usando la extensión de Chrome.
Instálala en tu navegador usando el siguiente botón, al acceder a la web de Alexa el navegador que usas será detectado y podrás instalar el plugin que le corresponde:

La Barra de Alexa en los distintos navegadores

En los navegadores Google Chrome y Firefox después de instalar la extensión de Alexa solo se muestra su icono al lado de la barra de direcciones, que como explicábamos no interfiere en lo absoluto con la velocidad de la navegación.
Para obtener información de un sitio necesitamos dar un clic en el icono para abrir un pequeño cuadro con los datos correspondientes.
Es decir los datos de los sitios se muestran solo a petición del usuario.

La Barra de Alexa en el navegador Google Chrome.

En el navegador Internet Explorer no funciona así, la barra está situada bajo la barra de direcciones mostrando los datos en todo momento, lo que la hace más pesada de cargar.
La ventaja es que la información siempre está a mano, además hay disponible opciones en la configuración de la barra para mostrar botones de Facebook, Twitter y otras redes sociales, para poder interactuar y compartir el contenido en estos sitios.

La Barra de Alexa en el navegador Internet Explorer.

Como guardar los mapas de internet para verlos offline

Usar GMapCatcher un programa gratis para descargar y salvar mapas web desde varios servicios de internet, para usarlos y navegar por ellos sin conexión a la red o guardarlos como imágenes. Como programar las descargas y exportar los mapas en imágenes PNG.

Muchas personas se sienten decepcionadas al explorar los mapas usando varios de los servicios disponibles online y no poder guardarlos para poder consultarlos cuando no tengan conexión a internet.
Esa funcionalidad solo está disponible usando dispositivos portables.
Para poder solucionarlo existen varios programas o aplicaciones para la computadora, pero sobresale una en particular que usamos personalmente y recomendamos en este artículo, llamada GMapCatcher.

GMapCatcher, una herramienta para salvar mapas de internet

GMapCatcher es un programa para la computadora que permite descargar mapas desde diferentes servicios e internet, para poder visualizarlos más tarde y navegar por ellos aun sin conexión a la red.
Es una aplicación gratis y un proyecto de código abierto.
Se puede visitar la página del proyecto en Github y descargar el ejecutable para Windows desde Code.google.com
GMapCatcher fue creado originalmente como su nombre sugiere, para descargar los mapas de Google Maps, pero debido a desacuerdos con el servicio esta opción fue suprimida.
Actualmente el programa permite guardar y descargar mapas desde otros servicios de internet.

Mapas que se pueden descargar con GMapCatcher

A lo largo de su desarrollo ha habido cambios en las sucesivas versiones de la aplicación, sobre los servicios de mapas desde los cuales se puede descargar contenido.
La versión más reciente en el momento de la creación de este artículo, la 0.8.0.5, permite descargar mapas desde varios servicios de mapas online.
Los principales son los siguientes:

- OpenStreetMap
- Virtual Earth (Carreteras, Satélite y combinado)
- Here (antiguos mapas de Nokia, Carreteras, Satélite y Terrestre)
- Yandex

Como usar GMapCatcher

Después de descargar GMapCatcher para Windows e instalarlo, podemos iniciar la aplicación usando su acceso directo.
El programa posee una interface de usuario sencilla.
Consta de un panel central donde se visualiza el mapa, un control de zoom lateral, una casilla Offline para activar el modo de descarga, una casilla que permite sobrescribir la cache de los mapas y un menú donde seleccionar el servicio.
Todos los controles se pueden ver en la siguiente imagen.

Ventana del programa GMapCatcher, usado para guardar mapas de internet.

Es posible al estar online buscar por una locación, usando el cuadro de búsqueda en la parte superior.
El nivel de zoom mínimo es 16 (el mundo completo) y el máximo -2, solo disponible en algunas regiones.

Como descargar mapas con GMapCatcher

Los mapas se pueden descargar con GMapCatcher de dos formas:

1- Ampliando la zona preferida del mapa, usando la rueda del ratón o la barra de desplazamiento lateral y esperar que las miniaturas del mapa terminen de descargar, lo que depende del nivel de zoom empleado.
A partir de ese momento el mapa estará disponible offline.
2- Usando la opción "Batch Download" (Descarga programada), es la ideal cuando necesitamos descargar grandes zonas a distintos niveles de zoom.
Para eso primeramente encuadramos en el visor del programa la zona a descargar, damos un clic derecho sobre el mapa y en el menú seleccionamos "Batch Download".
En el cuadro de ajustes que se abre introducimos el o los niveles de zoom deseados y presionamos el botón "Download".
El tiempo de descarga dependerá del área seleccionada, el nivel de zoom y la velocidad de la conexión de internet.

En las siguientes imágenes de ejemplo se puede ver como descargamos el mapa de la Ciudad de la Habana, usando el servicio de OpenStreeMap, con la opción "Batch Download".
Los niveles de zoom introducidos son desde el 5 hasta el 1.

Descargando el mapa de la Ciudad de la Habana con GMapCatcher, mediante el método de Descarga programada.

Seleccionando los niveles de zoom al descargar un mapa con GMapCatcher.

Antes de hacer lo anterior debemos verificar que esta desmarcada la casilla "Offline" a la izquierda en la parte superior.
Después de concluir la descarga podemos navegar por el mapa descargado de la misma forma que lo hacemos en internet, pero a más velocidad.

Visualizando el mapa de Ciudad de la Habana usando el nivel de zoom 1, después de descargarlo con GMapCatcher.

Guardar mapas como imágenes con GMapCatcher

Con GMapCatcher podemos explorar el mapa usando varios niveles de zoom, pero también guardar una sección determinada como un archivo de imagen en formato PNG.
Esta opción llamada exportar, es de utilidad para ver los mapas en otro equipo o dispositivos o para poder imprimirlos.
Para guardar una sección de un mapa con GMapCatcher haz lo siguiente:

1- Da un clic derecho encima del mapa a guardar y en el menú selecciona "Export".
2- Se abre un panel con los controles para encuadrar la sección del mapa deseada y seleccionar el nivel de zoom.
Primero escogemos el nivel de zoom y después debemos de ir aumentando gradualmente el ancho y la altura de la selección, hasta que abarque el área deseada.
3- Finalmente presionamos el botón OK.

En la siguiente imagen de ejemplo se selecciona un área de la ciudad para guardar, usando el nivel de zoom 1.

Exportar sección del mapa de la Ciudad de la Habana y guardarlo como una imagen PNG

La imagen creada será guardada en la carpeta de la aplicacion, que en Windows es "Archivos de programa > GMapCatcher".

Usar GMapCatcher en una computadora sin acceso a internet

Las miniaturas con las que el programa forma los mapas, se guardan de forma predeterminada en una carpeta de nombre ".GMapCatcher", situada en la carpeta de usuario, aunque se puede establecer otra ubicación mediante las preferencias (Settings).
De forma predeterminada se guardan como archivos (Files), pero podemos crear una base de datos en SQLite y de esa forma tener un archivo único, con lo que evitamos la fragmentación.
Esta carpeta podemos moverla a otra computadora sin acceso a internet e instalar el programa posteriormente para poder visualizar los mapas.
Antes de eso podemos comprimirla para agilizar la operación.
Si usamos distintos servicios de mapas es recomendado establecer en las preferencias, la opción de guardar los mapas en diferentes carpetas.

---

Actualizar los mapas

Para actualizar los mapas con el tiempo y asegurarnos de disponer de información fresca, podemos marcar la casilla "Force update" al estar conectados a internet.

GMapCatcher dispone de otras funcionalidades como crear Marcadores, Localizaciones y leer rutas de GPS, pero en este artículo nos hemos centrado en su empleo para guardar mapas y exportarlos.
Es una aplicación de extrema utilidad para los que poseen una conexión de internet limitada y a ellos va dedicado este artículo. 

 

origen norfipc.com