Browsing all articles in Scripts
Feb
29

Animar botones con jQuery

Button Animator es un plugin jQuery para animar botones de manera sencilla, sin saber nada de programación, y con apenas unas lineas de código.

El plugin esta preparado para lograr animar botones HTML que utilizan CSS Sprite, una practica de las más recomendadas y que ya comentamos en reiteradas oportunidades, muy útil para mejorar el rendimiento de nuestros sitios web.

Button animator soporta cinco tipo de animaciones distintas: efecto fade, slide up, slide down, y dos animaciones más que resultan de la combinación de las anteriores.

efectos animados para botones con jQuery

El plugin completo es muy liviano, apenas 4KB en su versión simplificada, un peso bastante adecuado si lo evaluamos desde el beneficio que obtenemos con su utilización.

Ejemplo de Uso

$(document).ready(function(){
	$('#slide_down').itgButtonAnimator({
		find_child : 'a',
		animation : 'slide_down',
		slideRange : 20,
		animationInSpeed : 400,
		animationOutSpeed : 300
	});
});

El identificador #slide_down corresponde simplemente a una lista de enlaces común y corriente.Más facil imposible :D

Web: jQuery Button Animator

Feb
29

Google ofrece a los desarrolladores Android mejoras en las estadísticas del Market

Android

Uno de los indicadores que muestran la buena salud de una plataforma móvil es, además de las ventas de los terminales, su catálogo de aplicaciones y el movimiento que tenga este catálogo en cuanto a crecimiento, descargas y número de desarrolladores. Teniendo en cuenta estos factores, creo que poca gente tendrá dudas a la hora de afirmar que Android goza de muy buena salud y que la que, a día de hoy, es la plataforma móvil con mayor penetración tiene a su alrededor un nutrido equipo de desarrolladores que trabajan en aplicaciones para el Android Market. Pensando en que los desarrolladores puedan manejar mucha más información sobre el rendimiento de sus aplicaciones, Google ha anunciado mejoras en la aplicación de seguimiento estadístico que pone a disposición de los desarrolladores que publican aplicaciones.

Es habitual en muchas empresas, tras cualquier actuación, analizar los resultados de impacto mediante alguna herramienta que presente un cuadro de mandos o informes estadísticos; una utilidad que Google puso a disposición de los desarrolladores de Android hace tiempo (disponible desde la Consola del Android Market) y ahora complementa con nuevos cuadros de mando en los que los desarrolladores podrán visualizar nuevas métricas con las que evaluar el impacto de su aplicación: instalaciones realizadas por usuarios, instalaciones y desinstalaciones realizadas cada día, instalaciones activas por dispositivo, actualizaciones realizadas, etc. Además de los nuevos indicadores, Google añade nos nuevas dimensiones a los informes: operadores y versión de la aplicación, permitiendo así visualizar los datos desde dos nuevas perspectivas

Por otro lado, para que los desarrolladores puedan observar la evolución en el tiempo del impacto de sus aplicaciones, Google añade paneles estadísticos en el que ver representaciones temporales para todos los indicadores y todas las dimensiones para que, así, sea más sencillo observar tendencias de crecimiento (o todo lo contrario) y evaluar posibles mejoras en las aplicaciones publicadas.

¿Y por qué es importante este tipo de aplicaciones? Como decíamos al inicio, medir el impacto de las actuaciones es algo importante para comprobar que nuestra estrategia es la adecuada y se están cumpliendo los objetivos que nos habíamos marcado. En el caso de los desarrolladores, este tipo de información les puede ayudar a mejorar sus aplicaciones, segmentar mejor a su público objetivo o estimar cuándo lanzar mejoras y actualizaciones.

Fuente: bitelia

Feb
27

Consejos para preparar tu sitio web ante un aumento de tráfico

Un nada despreciable compendio de consejos han armado en el blog oficial de Google Webmasters destacando algunos puntos a tener en cuenta en caso de que nuestro crezca tanto y se vuelva tan popular que requiera de ayuda extra para mantenerse activo. También son útiles para los portales prestos a la cobertura de eventos o temas que llaman una excesiva atención parcialmente.

1. Crea una versión ligera del sitio

NO, no se trata sólo de optimizar los sitios en busca de una mejor experiencia para el usuario -algo de lo que ya se ha escrito bastante- quitando el peso a la carga de elementos, es ir más allá al crear una versión ligera del sitio que se pueda «activar» tan pronto se supere determinado tope de visitas. Puede ser mostrando la versión móvil también a los usuarios que entran desde un PC de escritorio, o bien generando páginas ligeras.

Se recomienda crear, usando preferiblemente HTML estático en vez del dinámico, versiones alternas para la Homepage (en muchas ocasiones la que se lleva el mayor porcentaje de visitas) o de las páginas virales que empiezan a recibir incluso mayor número de peticiones. Prescindir de muchas imágenes y del Flash también es de ayuda.

2. Aprovecha los servicios de terceros

Si bien los sistemas de hosting más populares hacen lo posible por mantener en pie la carga en situaciones extremas, en situaciones aberrantes o más que extremas, sólo servicios como los de Microsoft, Google o Amazon, con su millonaria infraestructura de servidores, pueden resistirlo sin problema -lo que explica que nunca se ven afectados por ataques como los de denegación de servicio-.

En el blog recomiendan -por obvias razones- crear copias del sitio usando Google Sites o Blogger para reenviar todo el tráfico en caso de emergencia, o por ejemplo usarlos para guardar las imágenes y liberar al hosting de la carga que éstas implican. Igualmente Google Docs para los documentos y formularios, y si es posible una CDN (Content Delivery Network) como Amazon CloudFront el cuál de paso minimiza la carga del sitio ostensiblemente.

3. Formatos sencillos en archivos para descargar

Para los documentos descargables, siempre que sea posible prescindir de los PDF usando a cambio formatos de texto plano; estos ocupan apenas una fracción del peso de los primeros. Si no es posible, tratar de manejar la mayor proporción de texto respecto al número de imágenes incluidas en el documento: se hacen más ligeros los ficheros, se disminuye la carga al servidor, se hace más veloz la descarga y de paso, se facilita su lectura e indexación por parte de Google.

4. CSV y XML para los datos tabulares

Si lo que deseas compartir son datos almacenados en tablas utiliza, al menos como alternativa en forma de adjuntos, los ligeros formatos de CSV (texto separado por comas) y el XML. Bueno para la carga y SEO del sitio al igual que para los usuarios ya que sin importar su número, podrán acceder a la información completa, mucho más rápido, sin recargar su navegador e incluso teniéndola disponible perfectamente para manejarla en otros servicios y aplicaciones.

Fuente: wwwhatsnew

Jan
5

code.NASA, el nuevo portal para proyectos de software libre de la NASA

code.NASA

La agencia espacial norteamericana ha decidido lanzar un sitio web en el cual losdesarrolladores podrán acceder a todos los proyectos de software libre que tiene en marcha la agencia espacial. Llamado code.NASA, el portal ya se encuentra a disposición de los usuarios e incluye amplia documentación sobre los desarrollos y proyectos de software libre de la NASA.

El objetivo de la NASA es el de convertir a este proyecto en una suerte de centro de desarrollo de proyectos, que sirva a su vez de punto de encuentro para los expertos. Es principalmente por esto último que han implementado foros de discusión y herramientas colaborativas, de modo que los nuevos proyectos que vayan surgiendo tengan un lugar para sus discusiones y cuenten con elementos para trabajar en ellas.

Ya hay proyectos alojados en code.NASA, y en varios  casos ya se puede descargar su código fuente desde el repositorio GitHub de la NASA. Entre los primeros proyectos que han llegado al portal se encuentran un mapa lunar, un software de modelado, un software de simulación del satélite Goddard y una herramienta para determinar una órbita. El objetivo a largo plazo es que todos los proyectos de la agencia espacial se lleven a cabo con un modelo de desarrollo abierto y con un alto nivel de participación de la comunidad de usuarios.

Via feedscoop

Dec
22

Google libera una serie de herramientas y scripts para la administración de sistemas Mac

google (3)

Que las grandes compañías tienen sus propias herramientas internas para facilitar el trabajo de los equipos es un secreto a voces. En ocasiones dichas herramientas acaban desembocando en proyectos más elaborados que llegan a nosotros, y en otros casos incluso se utilizan nuevos proyectos de forma interna para probarlos previo lanzamiento al mercado en forma de beta o demostración. No es el caso que nos cuenta a continuación.

En Google, los administradores de sistemas tienen diversas aplicaciones, scripts y herramientas para trabajar internamente. Utilidades que hacen la vida de los trabajadores más fácil, y, utilidades que pronto empezaremos a ver. Clay Caviness, uno de los admins de Google, ha anunciado a través de su perfil de Google+ que su equipo empezará a liberar gran parte de esas herramientas y scripts que hasta ahora se usaban sólo de manera interna.

¿El objetivo? Ayudar a otros administradores Mac. ¿Promesas? No. Google lanzará las aplicaciones, y de hecho ya ha comenzado a hacerlo, con una serie de elementos que definen que servirán para administrar y mantener monitorizada una flota de ordenadores Mac en un entorno corporativo. La primera herramienta se llama crankd, y sirve para ejecutar scripts Python relacionados con redes y la actividad del sistema. Las instrucciones de uso han sido posteadas junto con la aplicaciónen Google Code.

También ha sido liberado un script cuyo cometido es permitir a los administraciones crear una serie de datos de una base de datos. Interesante movimiento de los de Mountain View, ¿verdad?

Dec
21

10 Excelentes tutoriales de JQuery Slider y Plugins

La  Comunidad de desarrollo web como en gran parte van a poner en práctica Plugins jQuery en su proyecto para facilitar la generación de mostrar la imagen. Su flexibilidad siempre es una preocupación en todos los amantes de la web. En este artículo muestra 10 excelentes tutoriales deslizante jQuery Plugins y para los desarrolladores.

FitText

FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

Moving Boxes

“Many of the concepts presented in those tutorials are the same with this slider, so I’m not going to throw a lot of source code at you this time. The big difference here is that there are buttons to change panels and the panels zoom in and out. Fun!”

Numeric Navigation jQuery Slider

Easy Slider (as I call this plugin) enables images or any content to slide horizontally or vertically on click. It is configurable with css alone. So, basically you link to plugin file, set the content up and style it with css.

arbor.js

Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling.

Photobooth with PHP, jQuery and CSS3

In this tutorial,you will find a jQuery and PHP powered photobooth. It will allow your website visitors to take a snapshot with their web camera and upload it from a neat CSS3 interface.

Rotating Image Slider with jQuery

An asymmetrical image slider with a little twist: when sliding the pictures we will slightly rotate them and delay the sliding of each element. The unusual shape of the slider is created by some elements placement and the use of thick borders. We will also add an autoplay option and the mousewheel functionality.

Creating a modern gallery with Raphael

How to create a modern gallery (with cool animation effect) using Raphael library and jQuery.

jQuery and CSS3 Random Rotation Menu

“We are going to create a great menu with some content area that slides out. We use the grunge style because we want it to look a bit messy: the menu items are going to have a random rotation using the CSS3 property “transform”. So, when we load the page each menu item will be positioned differently, giving a random and creative look to this grunge page.
The content area is going to be visible in the beginning, but slide out and back in everytime another menu item is clicked. Also, we will be randomizing the rotation degree of the content area.”

Supersized

Supersized is a fullscreen background slideshow built using the jQuery library.

AnythingSlider jQuery Plugin

This new AnythingSlider is an attempt at bringing together the functionality of all of those previous sliders and adding new features. In other words, to create a really “full featured” slider that could be widely useful. This is the first time (on CSS-Tricks) that one of these sliders is an actual plugin as well, which should make implementing it and customizing it much easier.

Fuente: djdesignerlab

Dec
20

Slider CSS3 que no utiliza Javascript

The pure CSS3 slider es un fantástico experimento que utiliza CSS3 con la intención de reemplazar por completo la utilización de javascript para crear las animaciones de transición. No hace falta decir que logra su objetivo con total facilidad.

Este slider CSS3 funciona perfectamente en los navegadores más modernos que utilizan WebKit, tambien se ejecuta sin inconvenientes en Firefox. Lamentablemente el navegador con el que vamos a encontrar problemas es el Internet Explorer, un navegador que si bien esta perdiendo cuota de mercado todos los meses, las personas que lo utilizan todavía son muchas y es un error menospreciar ese mercado.

Pure CSS3 slider es un experimento, el autor mismo lo reconoce y prácticamente nos dice que no lo usemos en sitios reales, no obstante en un futuro no muy lejano y en cuanto progrese la aceptación de CSS3 en los distintos navegadores, su implementación será muy simple y posible.

slider de imagenes sin javascript y con CSS3

Demostración online: The pure CSS3 slider

El slider cuenta con distintos niveles de animación. Por un lado veremos una animación que corresponde a la transición de contenidos, actualmente esta configurado para funcionar con cuatro imágenes. Por otro el cargando, que se indica mediante una fina linea en la parte inferior de las imágenes. Y finalmente un pequeño movimiento que se acciona al querer ejecutar la pausa. Muy buenas todas.

El experimento se puede descargar de forma gratuita, comprimido en formato zip, y sin ningún tipo de limite, simplemente con presionar el botón de descarga tendremos en nuestra computadora el slider para poder realizar distintas pruebas.

Web: The pure CSS3 slider

Oct
27

Java encadena dos meses seguidos de pérdidas y ve amenazado su liderazgo en este ranking.

Esta nueva clasificación mensual deja algunas ideas interesantes en cuanto a la relevancia de los diferentes lenguajes de programación según el indice TIOBE.

En este sentido, si la tendencia apuntada durante los últimos meses se mantiene, C se convertirá durante noviembre en el lenguaje de programación con mayor popularidad.

Sorprende la nueva caída de Java pese a al reciente lanzamiento de Java SE 7 durante el pasado mes de agosto, tras cerca de cinco años de trabajo.

Otras observaciones relevantes son las relativas a los buenos resultados de Objective-C que todo apunta se convertirá en el lenguaje de programación del año, sustituyendo a Python que tras un aumento de su popularidad durante la última parte de 2010, ha venido perdiendo posiciones en los últimos 10 meses.

Dart el nuevo lenguaje de programación de Google liberado hace apenas dos semanas, y cuya pista se ha empezado a seguir recientemente por este ranking, promete dar que hablar si como aseguran sus creadores aspira a convertirse en el sucesor de JavaScript.

Ranking Lenguajes de Programación Octubre 2011

  1. Java
  2. C
  3. C++
  4. PHP
  5. C#
  6. Objective-C
  7. (Visual) Basic
  8. Python
  9. Perl
  10. JavaScript

Fuente: desarrolloweb

Oct
27

cupcakeipsum, un lorem ipsum más… dulce

Seguramente pocos de vosotros desconocéis lipsum.com, la web que genera textos en latín para rellenar espacios en los diseños y prototipos de páginas web.

Durante muchos años se ha convertido en una costumbre universal, existiendo un texto bastante explicativo con el origen de este texto en dicha web.

Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (persona que se dedica a la imprenta) desconocido usó una galería de textos y los mezcló de tal manera que logró hacer un libro de textos especimen [...] Tiene sus raices en una pieza clásica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad.

El caso es que muchos estamos ya cansados del viejo texto y abrimos las puertas a nuevas opciones, motivo por el cual os presento cupcakeipsum.com, generador de textos relacionados con los dulces.

Aunque el resultado esté exclusivamente en inglés, el objetivo es el mismo, dando más color a un tema que parece no querer cambiar mucho durante los próximos años.

Fuente: wwwhatsnew

Oct
27

Diseño de etiquetas (PSD + jQuery)

Si estas planeando cambiar el diseño de las etiquetas de tu sitio, entonces este recurso te será de mucha utilidad. Se trata de un archivo PSD en descarga directa, listo para ser editado y totalmente gratuito, este recurso es una propuesta de 365psd, y consiste en unas etiquetas deslizables con un diseño de lo más atractivo.

Para descargar las etiquetas simplemente ingresamos a 365psd y presionamos el botón de descarga, no necesitamos registrarnos ni efectuar pago alguno.

Una excelente noticia. Cuando descargamos el archivo no solo vamos a encontrarnos con los archivos PSD, sino que también con una implementación de las etiquetas en HTML, que utiliza el framework jQuery para animar el deslizamiento. Simplemente quedan genial implementadas.

Diseño etiquetas (PSD)

Visualmente las etiquetas se asemejan a una barra de chocolate, honestamente me recuerdan a los clásicos plásticos en donde venia el chocolate hace muchos años. Ideal para sitios web relacionados a proyectos gastronómicos :D

No hace falta decir que podemos cambiar el color y forma si lo creemos necesario, simplemente editamos el archivo PSD con Photoshop, o cualquier otro programa compatible, y guardamos los cambios en la carpeta de imágenes que viene en la descarga.

Web descarga: 365psd

Fuente: kabytes

 

Últimos posts

Categorías

Videos

Servicios Web para Pymes Perú

Email: info@innovatecmedia.com
Telf: 661-8752
www.innovatecmedia.com

REDES SOCIALES

Facebook: Innovatecmedia.com
Web: www.innovatecmedia.com

Tags

Seo Packages