Slide Note es un sencillo plugin desarrollado en jQuery que te permitirá mostrar una nota en tu página web con efecto de slide, bastante visual para mostrar un mensaje de bienvenida o la información que desees. Además Slide Note puede mostrar el contenido de una URL y opcionalmente puede mostrar también algún elemento incrustado en una página Html. Una vez instalado este plugin, su funcionamiento es sencillo, una vez abras tu página y al hacer scroll aprecerá tu nota con un efecto de slide desde el lateral del mismo, además tiene un botón de cierre al estilo de aplicaciones Mac. Puedes ver una Demo a través de slidenote.info, realiza scroll con tu ratón y la nota aparecerá. Como opciones de configuración podrás cambiar el botón de cierre de la Nota y la esquina desde donde aparecerá la misma. Podrás utilizar este plugin en cualquier plataforma, WordPress, Joomla, Drupal, eso sí sabiendo algo de código, pero ...

Tile5 es un proyecto open source (código abierto) que te permitirá mostrar mapas con HTML5 a través de una librería en Javascript. Una vez integrado tus usuarios podrán disfrutar de una experiencia más completa mediante HTML5. Además Tile5 es compatible con la mayoría de proveedores como Bing, Google, Yahoo, MapQuest… Detrás de la API utilizada para generar los mapas la librería Javascript te permitirá también crear otro tipo de interfaces. Además HTML5 provee de compatibilidad con plataformas móviles y navegadores de escritorio por lo que aseguras la visualización de la aplicación en cualquier de ellos. Puedes ver distintas demos de implementada a través de la página del proyecto. Además puedes acceder a la documentación de la API bien detallada, así como unos tutoriales para implementar Tile5. Página proyecto ...

PaintbrushJS Playground es una librería desarrollada en Javascript que permite aplicar efectos de imagen en el lado del cliente. Utiliza elemento Canvas y funciona aplicando una clase en jsp a un elemento en la página web y aplicando parámetros con algunos elementos en HTML. Actualmente este proyecto permite aplicar los siguiente efectos: Blur, escala de grises, mosaico, ruido, posterizado de imagen, tonos sepia y tinta de color. Puedes ver una Demo de esta librería y ver como funciona a través de su página web. Te permitirá aplicar cada efecto mediante una barra y ver la rapidez con que aplica los efectos. Recuerda que está desarrollada por completo en Javascript. Además también puedes descargar el código y acceder a la documentación de esta clase. Página web PaintbrushJS Playground Visto en ...

Si necesitas una buena recopilación de temas WordPress gratuitos y estás pensando en hacer un nuevo blog o página web pásate por topwpthemes vas a encontrar gran cantidad de temas. Además a través de esta página ya se está experimentando con diseños en HTML5 y CSS3 si exploras entre sus proyectos, verás fantásticos efectos en HTML5 y Javascript. Además cuentan con elementos para agregar fácilmente bloques Adsense o a través de Banners de publicidad que son muy populares ahora en algunos sitios. Estos temas están muy bien organizados, además puedes ver rapidamente una Preview para ver sus características y como decimos si te pasas por esta página te recomendamos que veas varios diseños porque emplean fantásticos recursos en Javascript para tratarse de Temas gratuitos. También en HTML5 y con nuevas propiedades en CSS3. Puedes acceder a través de la página de ...

jQuery Image Scale Carousel te que permite redimensionar o escalar al vuelo un Carrusel de imágenes realizado en jQuery. Además de ofrecer tus imágenes de calidad puedes permitir al usuario cambiar el diseño de forma sencilla para visualizar en cualquier tipo de dispositivo. Por otra parte si tus imágenes son de alta resolución o no tienen un tamaño estándar, esta librería realizada en jQuery te ayudará a redimensionarlas de forma sencilla. También se puede utilizar, como decimos, como añadido para el usuario, para distintos tipos de dispositivos y resoluciones. Este Carrusel de imágenes se puede implementar a través de un plugin y convertirá cualquier imagen con la altura y anchura necesarias. Además dispone de controles para imagen (siguiente, anterior) así como auto-play para mostrar pase de diapositivas. A través de la página del proyecto tiene indicaciones para poder implementarlo con facilidad en cualquier sitio o proyecto web. Puedes acceder a este proyecto a través de la página ...

jQuery iPhone UI es una librería realizada en Javascript que emula a la perfección la interfaz del iPhone a través de una web-app que está disponible a modo de demo desde esta página. Con ella se pretenden crear aplicaciones web, emulando la interfaz del iPhone con funcionalidades distintas, es bastante original. el jQuery Team acaba de anunciar que van a poner su esfuerzo en desarrollar aplicaciones web móviles y dicho esto, ya han sacado esta librería para lanzar aplicaciones web sencillas a través de esta interfaz. Una vez cojas esta librería en jQuery verás la facilidad de uso que tiene y la soluciones listas para usar. Además puedes ver otros proyectos en los que están trabajando el jQuery Team, como sharekit, también para aplicaciones web para móviles. Estas aplicaciones se pueden ejecutar en un navegador web y accesibles y de fácil carga a través de dispositivos móviles. Sin consumir muchos recursos y con ...

wdCalendar es un plugin en jQuery muy potente y que ofrece características similares a Google Calendar, además con una API de desarrollo muy completa. Este calendario funciona mediante Arrastrar/soltar eventos y de forma muy sencilla. Además se pueden crear/borrar/modificar eventos muy rápido. Se trata de un calendario completo que puedes implementar sobre un diseño ya creado. Además ofrece vistas por días/mes/año y el día presente y el contenido se actualiza de inmediato, me ha sorprendido la interfaz que tiene y las posibilidades también. La interfaz de wdCalendar se comporta de forma fluida y estable. Dispones de una vista por días, meses o años para organizar los eventos del calendario de forma muy dinámica. Puedes ver una Demo de WdCalendar desde este enlace Sitio Web WdCalendar Visto en ...

A través de noupe.com hemos visto esta fantástica recopilación de técnicas en Javascript y jQuery listos para utilizar en Diseño de páginas web. Esta recopilación cuenta con Snippets, librerías, artículos, herramientas y recursos listos para usar que mejorarán la experiencia de usuario en tu Sitio Web ofreciendo un mayor dinamismo, productividad y presencia. Colorful Sliders With jQuery & CSS3 En este Tutorial se usa jQuery además de características en CSS3 para crear un efecto Slider dinámico en 3D. Estas técnicas se puede utilizar en pequeños proyectos con jQuery. Sponsor Flip Wall With jQuery & CSS Este codigo ya lo vimos en una entrada anterior y te proporcionará un bloque de Banners animados en jQuery, bastante dinámico, para tu página web. TipTip jQuery Plugin TipTip detecta el tamaño de las ventanas de los navegadores y permite dar tamaño a los tooltip con coherencia. De esta forma el tooltip se ajustará perfectamente al tamaño de pantalla. Está ...

Con Ajax puedes potenciar el contenido de una página y darle el dinamismo que desees. Se basa en Javascript y ya hay muchas recopilaciones de recursos en internet para poder implementar con funciones en tu página. Consulta estos enlaces que hemos recopilado para ti. Ajax Solutoire DevSnippets Ajax Lady Free Ajax Scritps Ajax Rain Ajax Scripts W3CTag Fuente ...

El pasado lunes en la WWDC 2010 se aprovechó también para presentar el nuevo navegador de la compañía de la manzana, Safari 5, el cual ahora soporta extensiones como otros navegadores y también tiene mejor soporte con Html5 el nuevo formato que ofrece vídeo en internet entre otras cosas. Además ofrece bastante mejoras para hacer una navegación en internet mucho más rápida. se ha hecho mucho incapié en la integración con Javascript mediante la obtención previa de los DNS. Además se ha aumentado en un 30% la ejecución de Javascript. Según Apple el nuevo Safari es 3 veces más rápido que Google Chrome y el dobe que Firefox. Sabéis que también está disponible para Windows, aunque la experiencia no es la misma. Además se ofrece Safari Reader que permite la lectura de artículos eliminando contenido innecesario. Además se han añadido nuevo motores de búsqueda como Yahoo o Bing, además de Google. La nota curiosa ...

En este tutorial veremos como crear un panel de login animado con Mototools. Este panel se coloca en la cabecera y a través de un simple botón hará desplazar el contenido del mismo para realizar la acción de login o registro de nuevo usuario. Utiliza Mototools 1.2, a través del enlace tendrás acceso a la explicación paso a paso del proceso, por el que una vez descargado el código fuente te será más fácil implementarlo en tu Sitio Web siguiendo los pasos propuestos. A través de web-kreation.com no presentan este tutorial, que ya habíamos visto algo parecido, aunque este únicamente presentará el panel de login sin funciones adicionales como otros plugins. Además lo puedes implementar en cualquier Gestor de contenidos ya que es un código generalizado y también añade código CSS para estilar el panel. Tutorial | Sliding Login Panel With ...

Inspire es el nuevo tema que han diseñado los chicos de WooThemes. Siento gran predilección por esta línea de Themes para WordPress. En este caso nos presentan una plantilla inspirada como decimos en el nuevo dispositivo de Apple. Con diseño de botones y elemetos en blanco sobre un fondo azulado. Además Inspire cuenta con página de inicio a modo de presentación de producto. También dispone de un área de artículos destacados desarrollado con jQuery y además incluye una plantilla de página para portfolios profesionales. Como es habitual dispone también de estilos personalizados, que cambian el diseño en CSS al vuelo y Widgets personalizados para esta plantilla WordPress. Esta inspirada en el nuevo iPad de Apple, aunque se puede personalizar fácilmente para ofrecer cualquier producto en internet. Nos gustaría saber que tipo de plantillas elegís para vuestro Blog, para tener una idea de vuestro estilo, ya que hay una gran oferta de themes para WordPress. Sitio ...

La publicidad en una página web, bien sea un Blog o una página de empresa es necesaria para conseguir recursos adicionales, como pueda ser el mismo soporte de la misma. Adsense de Google es un buen ejemplo de ello, que mediante las técnicas SEO necesarias conseguirás un buen soporte para tu página. Si tu página necesita mostrar la publicidad de forma distinta a lo habitual puedes plantearte este tutorial como forma alternativa. Este tutorial te propone mediante algo de código en jQuery (que puedes descargar) y código Css una forma llamativa de mostrar tus banners publicitarios. De esta forma conseguirás atraer más a tu público. Puedes acceder a la Demo para que te hagas una idea de su funcionamiento. Te muestra el banner y cuando haces click en el, gira el marco para ofrecer el enlace a la web. Si te atreves a implementarla en tu Sitio Web comentanos sobre el proceso. Puede ...

La optimización de un sitio Web es una tarea muy importante; tratar de gastar los menos recursos posibles siempre es una prioridad para así evitar desperdiciar ciclos de procesador o memoria RAM, lo que reflejará un tiempo de carga mucho menor en el sitio. Existen varias técnicas para lograr esta tarea, que dicho sea de paso, puede tomar mucho tiempo en perfeccionarse. Por un lado, las acciones que se hagan de lado del servidor son fundamentales, pero también se pueden complementar con algunos recursos que ayudan al navegador a acceder a los recursos en menor tiempo. Optimización del lado de servidor (server-side) Existen algunos factores que hay que tomar muy en cuenta durante la optimización en el servidor. Son tan importantes que la correcta administración y toma de decisiones, determinar en mayor parte, el éxito al optimizar. Elegir un servicio de host decente Elegir bien la casa de los sitios Web es algo vital. ...

AJAX se ha vuelto muy popular confirme ha pasado el tiempo, hasta el punto de permitir a otras aplicaciones web, actuar como si fueran de escritorio. AJAX es capaz de proveer funcionalidad adicional a una página web, que de otra manera no podría ser posible. ¿Que es AJAX? ¿Como es que trabaja? AJAX significa Asynchronous JavaScript and XML. Es utilizado para: Comunicarse con el servidor de la aplicación; antes de AJAX, no había aplicación que fuera capaz de comunicarse directamente con el servidor. Con AJAX, el cliente y el servidor, pueden comunicarse libremente. Y así trabaja: Alguna acción desencadena el evento, tal y como darle click a un botón Una vez que se desencadena el evento envía una petición al servidor utilizando XML El script de lado del servidor (PHP, ASP, etc.), reconoce el pedido por medi ode JavaScript, y puede accesar la base de datos en caso necesario y procesa la información Vuelve a utilizar XML ...