Category Archives: Tips Avanzados

Programación, Tips Avanzados

Código útil para tus proyectos! (Parte 1)

May 23, 2007 admin

Aquí una colección de código muy útiles para el desarrollo de sitios. En su mayoría,

por no decir que todos, gratis y listos para descargar!

Un buen ejemplo listo para usar, de un formulario con todos los campos que se puedan necesitar.

Hecho con CSS y semánticamente correcto.

Web: http://nidahas.com/sandbox/form_template.html

Buena

colección de scripts de calendarios basados en Javascript y CSS!
Este sitio ofrece también varios

ejemplos de código abierto para descargar.

Web: http://dhtmlsite.com/

Galería de imágenes con Javascript: Esta galería crea una presentación con efecto de

cross fade entre imágenes/fotos de un mismo tamaño.

Web: Descargar

código | Demo

Crossfader de contenido: Este código

permite hacer un crossfade entre contenidos de información (sets) usando javascript, CSS y Script.aculo.us.

Web: http://mikeomatic.net/ | Demo

Creador de Preloaders de Ajax: Muy

útil herramienta para crear vistosos preloaders de Ajax. Ingresando parámetros basicos, genera un archivo GIF para descargar.

Web: http://www.ajaxload.info/

Tooltip para formularios: El título lo describe todo.

Este código crea un "tooltip" cuando se ubica el mouse sobre un campo específico del formulario.

Web: Info y descarga | Demo

Con este script puedes crear un Agregador de RSS similar al iGoogle (o Google Home), que es tu

página de partida en la cual puedes incluir los RSS de tus sitios preferidos. Tiene la capacidad de hacer "drag and drop" de las cajas creadas utilizando AJAX.

Web: Info y descarga | Demo | Más scripts de

drag and drop

Crea Encuestas con AJAX (Ajax Poller): Crea e incluye fácilmente encuestas

en tu sitio. requiere base de datos.

Web: Info y descarga | Demo

Layout o matic: Creador automático de layouts de sitios. Ingresa las variables necesarias en un pequeño formulario para poder

descargar y previsualizar el layout generado.

Web: http://www.inknoise.com/

ESWAT: Project Framework: Es un kit que contiene a manera de plantilla, la estructura de un

sitio típico, así como los directorios de diseño y desarrollo en un estructura lógica y muy útil. También contiene scripts predefinidos.

Web: http://eswat.ca/

Ajax Uploader: Script para subir archivos a un servidor, utilizando Perl, PHP y AJAX. Se puede customizar el "look" del script.

Web: Información | Descarga

Tips Avanzados

14 rules for fast web pages

May 11, 2007 admin

Steve Souders of Yahoo’s "Exceptional Performance Team" gave an

insanely great presentation at Web 2.0 about optimizing website performance by focusing on front end issues.

This is a

big presentation, with a lot of data in it (a whole book’s worth apparently), but half way through he boils it down into 14 rules for faster front end performance:

Make fewer HTTP requests
Use a CDN
Add an Expires header
Gzip components
Put CSS at the top
Move JS to the bottom
Avoid CSS expressions
Make JS and CSS external
Reduce DNS lookups
Minify JS
Avoid redirects
Remove
duplicate scripts
Turn off ETags
Make AJAX cacheable and small

Via: http://www.skrenta.com/

HTML y CSS, Tips Avanzados

Tutorial: Crea botones atractivos en CSS

May 8, 2007 admin

Gracias a Guillermo me enteré de este interesante sitio, donde se detalla en un tutorial, como crear botones (con interactividad en el evento onClick) con poco CSS y un par de

imágenes.

This tutorial will teach you how to create pretty looking textual buttons (with alternate pressed state) using CSS. Dynamic

buttons save you heaps of time otherwise spent creating graphics and will basically make you a happier person at the end of the day.

Tutorial: http://www.oscaralexander.com/

Browsers, HTML y CSS, Tips Avanzados

Internet Explorer (IE 5, 5.5, 6 and 7) CSS Hacks

April 2, 2007 admin

Interesante artículo de Andrew Sellick, que nos muestra

algunos tips para "hackear" el CSS y lograr efectos deseados en cuanto a compatibilidad de browsers.

Phew. Right now I’ve got that out of the way lets start

off with one of the most commonly used hacks, the underscore hack.

_width:100%;

This will work in all IE browsers below IE 7 but NOT IE 7 itself.

Next we move onto the backslash hack.

width:100%;

This will work in most browsers (Firefox 2 and 1.5, IE 7 and 6, Opera) however it is not recognised in IE

5.5 and 5.

Then the star hack.

*width:100%;

This works in all versions of IE but not other browsers.

Seguir leyendo en: www.andrewsellick.com/

Tips Avanzados, Tutoriales

Tutorial: Perfila imágenes con un par de clics

March 30, 2007 admin 3 Comments

En este sencillo tutorial les explicaré como “siluetear” o perfilar una imagen aprovechando el potencial de los filtros (en este caso el “Blending Mode”).

Los pasos son muy sencillos y no requieren conocimientos avanzados en el uso de programas de diseño, sin embargo los resultados son excelentes y sobre todo ahorran mucho tiempo en la tediosa labor de siluetear imágenes para utilizarlas en algún diseño.