Etiqueta: javascript

Algunas maneras de optimizar un sitio web

Publicado el

por Sergio Seijas Freixenet


Desde que Google anuncio que la velocidad de carga de un sitio web iba a influir positivamente/ negativamente en el posicionamiento web, muchos usuarios nos han ido preguntando cómo pueden optimizar el rendimiento de sus sitios web para optimizar este nuevo punto.
En este artí­culo comentaremos varias opciones y trucos para mejorar la carga de nuestro sitio web mediante el popular archivo .htaccess y sin él.

Leverage Cache Browser

Empezamos este post con la activación de Leverage Cache Browser. ¿Que quiere decir? Pues bien, Leverage Chache Browser es una pequeña función para Apache que permitirá cachear todos los archivos que especifiquemos de un sitio web en el navegador del usuario. De esta forma, la primera vez que un usuario accede al sitio se descargan desde nuestro servidor, almacenándose en el disco local del usuario, es entonces, cuando el usuario vuelve a entrar en la página, y todas las peticiones a imágenes, CSS, JS… que antes habí­a descargado, ahora las ejecutará desde su disco, de esta forma optimizamos la carga y reducimos las peticiones que recibe el servidor, ahorrando consigo recursos que pueden servirnos para un pico de tráfico, por ejemplo.
Continúa leyendo «Algunas maneras de optimizar un sitio web»

Sobre la información inútil que nos bajamos [Infografí­a]

Publicado el

por Carolina Velasco


Click para ampliar
GTmetrix, la popular plataforma dedicada a la optimización de sitios web ha publicado una interesante infografí­a sobre el tiempo perdido en la descarga de información inútil que hacemos los usuarios.
A partir del análisis de los 1.000 sitios web top de su ranking, el equipo de GTmetrix determinó la cantidad de información inútil que descargamos al acceder a estos sitios y los resultados no dejan de sorprender.
3.000.000 de GB son descargados mensualmente de información completamente inútil y que lo único que provoca es aumento de la transmisión de datos y disminución, por tanto, del ancho de banda sin ninguna justificación.

Qué se considera como información inútil

Entre estas toneladas de data sin ninguna utilidad encontramos de forma habitual y recurrente que muchos de los sitios no utilizan imágenes optimizadas o escaladas adecuadamente, como las que modifican su tamaño a través del HTML o el CSS, utilizan un formato ineficiente o las exportan con niveles de calidad más propios de la impresión a gran formato.
La solución a esto es utilizar en los sitios web imágenes pre escaladas y herramientas gratuitas como Smush.it, Jpegtran o PNGOUT que nos permiten entregar imágenes de muy buena calidad, pero con un menor tamaño de archivo.
Los archivos HTML, CSS o JavaScript pueden contener datos como whitespace, indentation y/o comentarios, los que añaden peso extra a los archivos y que no son de ninguna utilidad para quienes navegamos por Internet.
Reducir el peso de estos archivos es una acción que se agradece a los Web Masters, así­ sólo descargamos el código fuente necesario para navegar por el sitio y evitando pérdidas innecesarias de tiempo y de saturación de la red.
Nosotros como usuarios también podemos colaborar para reducir el tiempo y el ancho de banda necesario en nuestras conexiones. Basta que utilicemos un compresor de archivos para nuestros enví­os y a la hora de recibir información, preferir la información comprimida.

23.000.000 Gb, mucha, pero mucha información


El tema de la información descargada, pero sin ninguna utilidad, es más crí­tico de lo que podrí­amos pensar. Volvamos a los 23 millones de GB de este tipo de datos que generan mensualmente los 1.000 sitios web del top de GTmetrix y hagamos un breve análisis:
Esa enorme cantidad de información equivale a descargar 5.750.000.000 canciones y has leí­do bien, cinco mil setecientos cincuenta millones de temas musicales, lo que a un usuario común con una conexión ADSL normal le tomarí­a unos 619 años de descarga.
619 años es un tiempo suficiente para obtener 154 tí­tulos universitarios, viajar alrededor del mundo unas 80.932 veces o escuchar 65.069.280 veces Bille Jean, la famosa canción de Michael Jackson.
Este tiempo trasladado a tiempo de trabajo equivalen a 5.442.440 horas de trabajo, tiempo suficiente como para construir el 77% del Empire State Building, uno de los rascacielos emblemáticos de Nueva York.

Una Internet más rápida depende de todos

Así­ como todos nos merecemos y necesitamos una Internet rápida y con navegación fluida, también todos debemos comprometernos; usuarios y Web Masters para que la transmisión de información inútil, redundante o no comprimida deje de ser una práctica habitual.
Debemos aprender que la red se satura y que su ancho de banda no es infinito y que al igual que en nuestras ciudades debemos tomar medidas y resguardos para asegurar ”“dentro de lo posible- un tráfico y una circulación expeditos.

Mobilastic – Un constructor de webs para móviles. Sólo programadores.

Publicado el

por Juan Diego Polo


Al contrario de la enorme cantidad de aplicaciones que prometen crear sitios web para móviles sin necesidad de conocer nada de programación (aquí­ ya os comenté varios), mobilastic ha sido creado por y para programadores y diseñadores web.
Para probarlo hay que tener conocimientos de HTML, CSS, Javascript, etc. y se requiere experiencia en el desarrollo de sitios web, como se puede comprobar en los ví­deotutoriales disponibles.
Disponible en beta cerrada, podéis pedir una invitación en su página principal, por desgracia sólo tengo un código disponible para entregar al primer interesado en los comentarios.

the-m-project – Framework HTML5 para programar para móviles

Publicado el

por Juan Diego Polo


En the-m-project.net tenemos un nuevoi proyecto que puede facilitar mucho la vida de quienes quieren programar aplicaciones en HTML5.
Con el código libre, y responsable por aplicaciones de gestión de listas, integraciones con twitter y otras que podemos ver en su web como ejemplos, es ideal para que pueda ser usado en el desarrollo de aplicaciones para dispositivos móviles que no sean compatibles con tecnologí­a Flash.
Con una documentación bastante completa, se encuentra en fase alpha, buscando colaboradores que ayuden a transformar el proyecto en una plataforma más completa y útil para todos.

50 aplicaciones gratuitas para diseñadores y programadores web

Publicado el

por Juan Diego Polo

Excelente el artí­culo publicado en speckyboy.com donde muestran una lista de aplicaciones de gran utilidad para quien programa y diseña sitios web.
Podemos encontrar procssor.com, para limpiar código CSS, scriptsrc.net, para usar librerí­as JS, htmlform.com, para crear formularios HTML, spritebox.net, para crear clases CSS, TryRuby, para probar Ruby desde el navegador, plupload.com, para programar uploads de archivos, Favigen para crear favicons, FrameBox, para crear bocetos, css3generator y css3menu, para quien trabaja con CSS3, browize, para ver el resultado de la web en otros tamaños de navegador … decenas de aplicaciones que ya fueron comentadas en algún momento en nuestra categorí­a de Utilidades para Diseño, aunque siempre es bueno recordarlas de vez en cuando.

Wirify – Transforma cualquier página web en un borrador

Publicado el

por Juan Diego Polo

Si vais a empezar un proyecto de diseño web y queréis discutirlo con el cliente basando las ideas en la estructura de alguna web ya existente, Wirify os puede ayudar, y mucho.

Se trata de un bookmarklet (un enlace que se puede arrastrar en la barra de favoritos de vuestro navegador) que al pulsarlo transforma la página web que estáis viendo en un diagrama de estructura, mostrando los bloques de texto y los gráficos, para poder facilitar la discusión.

En la captura superior podéis ver un ejemplo de lo que hace, transformando la página de The New York Times en un boceto donde queda clara la estructura del contenido.

Ví­a webresourcesdepot

DHTMLX Touch – Una librerí­a para programar aplicaciones HTML5 para móviles

Publicado el

por Juan Diego Polo

DHTMLX Touch es una librerí­a Javascript que hace mucho uso de HTML5 para facilitar el desarrollo de aplicaciones para móviles.

Con este framework podemos crear herramientas fáciles de ejecutar en teléfonos y tablets, siendo compatible con una enorme cantidad de dispositivos como iPad, iPhone y teléfonos Android. También tiene un entorno de programación visual.

La librerí­a es gratuita, con licencia GPL y en estado alpha, con lo que habrá que estar atentos a su evolución.

Ví­a webresourcesdepot.com

Zepto.js – Ligero framework Javascript para Smartphones

Publicado el

por Javier Muñiz

Los smartphones ya forman parte de nuestra vida cotidiana y por lo tanto es necesario que los programadores seamos consecuentes a la hora de desarrollar nuestras aplicaciones web. Para ello existen frameworks realmente ligeros como Zepto.js (2K) que nos permiten aprovechar muchas de las opciones de estos dispositivos.

De este modo, con estas librerí­as tendremos la opción de controlar los eventos relacionados con las funciones táctiles, así­ como obtener información adiciona sobre el dispositivo en el que se está ejecutando la aplicación, para que podamos actuar en consecuencia.

Si os animáis a echarle un vistazo podéis descargarlo desde su web oficial y utilizarlo según los términos de la licencia MIT a la que está sujeto.

Ví­a | Creativos Online

Artisan JS – Librerí­a para dibujar en el navegador con JavaScript

Publicado el

por Javier Muñiz

Hace bastante tiempo que las webs dejaron de ser meras páginas estáticas y pasaron a convertirse en complejos servicios para navegadores, que exigen a los desarrolladores realizar mayores esfuerzos.

Artisan JS es una librerí­a para JavaScript que puede ayudarnos en la difí­cil tarea de crear aplicaciones de dibujo online.

Para ello pone a disposición del programador una serie de funciones que permiten trabajar desde el canvas con primitivas gráficas, añadir efectos a imágenes e incluso trabajar con capas de una forma bastante sencilla.

La verdad es que la herramienta pese a su sencillez tiene un aspecto bastante bueno y lo mejor es que podremos usarla en nuestros proyectos, aunque teniendo en cuenta que está sujeta a las licencias GPL y MIT.

Ví­a | Pixelco blog

Un nuevo gusano, Rainbow, toma el control de Twitter e infecta a millones de usuarios

Publicado el

por Juan Diego Polo

Esta mañana, hemos asistido a la que ha sido la primera infección masiva de Twitter, viendo cómo una cadena de caracteres extraños aparecí­an en nuestros perfiles.

Desde Panda Security me enví­an una nota de prensa con más información sobre la infección:

Se trata de una vulnerabilidad en Twitter que hace que cualquier usuario que opere a través de la web twitter.com, cuando recibe este mensaje y al pasar el puntero del ratón por el tweet que contiene esta cadena extraña, le pueda pasar diferentes cosas inesperadas:

– Automáticamente, y sin que él haga nada, enviará a sus followers la cadena maliciosa, contribuyendo así­ a su distribución

– Le pueden aparecer mensajes extraños con letras gigantes, cuadros de diálogo donde se lee “Hola”, cuadros negros donde deberí­a estar el texto de un tweet, etc.

– Cuando cualquiera visita su perfil, éste puede ser redirigido a cualquier otra dirección web

Dicha vulnerabilidad permite la ejecución de código javascript, con el que se pueden hacer diferentes cosas y abre grandes posibilidades a usuarios que pretendan utilizarlo de forma maliciosa.

Según Luis Corrons, Director Técnico de PandaLabs:

El mayor peligro podrí­a ser que la URL utilizada en el ataque usara alguna vulnerabilidad para infectar nuestros equipos. Si un delincuente hace que además de hacer un RT del código, la URL implicada usara técnicas de Drive-by-Download, estarí­amos hablando de millones de ví­ctimas potenciales, aunque es poco probable ya que presumiblemente twitter tape el agujero antes de que esto suceda.

El origen parece ser una cuenta creada en Twitter, llamada Rainbow, nombre que ha bautizado al gusano:

Al principio, las primeras inyecciones de javascript eran simples bromas, aunque con el paso del tiempo, ha ido evolucionando, y parece que algunos usuarios con otras intenciones están utilizando dicha vulnerabilidad para hacer cosas más serias.

Para finalizar, un consejo para evitar males mayores: cualquier cliente de Twitter que no ejecute javascript, como TweekDeck, nos permite seguir utilizando la red social sin ningún riesgo. Así­ que, evitemos utilizar la web, al menos, hasta que se solvente la vulnerabilidad.

Actualización – Del Harvey, del equipo de Twitter, informa que ya han solucionado el problema:

Actualización 2 – En el blog oficial de Twitter cuentan cómo y cuándo han resuelto el problema.