Demo con las capacidades de HTML5

Si alguien aún duda de las maravillas que se pueden hacer con HTML5, os dejo una presentación donde se muestran muchas de sus grandes bondades. Requiere de las últimas versiones de los navegadores para que podáis visualizarla correctamente: PRESENTACI??N HTML5 Fuente

Redimensionar las columnas de una tabla

Hoy día ver una tabla estática y simple en una web resulta un poco soso (ya nos hemos acostumbrado a nuevas y mejoradas tecnologías), así que si queremos darle un poco de vidilla a nuestras tablas de forma que podamos redimensionar la anchura de sus columnas en Ubuntu Life nos presentan jquery.grid.columnSizing, un plugin para JQuery con el que mediante un simple clic y arrastrar nos hará esa tarea. La forma de usarlo es descargar e importar las librerias js necesarias [html]<script type="text/javascript" src="jquery-1.1.3.1.pack.js"></script> <script type="text/javascript" src="jquery.dimensions.pack.js"></script> <script type="text/javascript" src="jquery.cookies.pack.js"></script> <script type="text/javascript" src="jquery.iutil.pack.js"></script> <script type="text/javascript" src="jquery.idrag.js"></script> <script type="text/javascript" src="jquery.grid.columnSizing.js"></script>[/html] Y luego incluir la llamada correspondiente para tu tabla, por ejemplo: [jscript]$("table") .eq(0) .columnSizing({ viewResize : false, viewGhost : false, selectCells […]

El tamaño sí importa

¡Qué no te engañen! Por mucho que digan, el tamaño sí que importa. Así que os dejo algunos trucos y consejos. Vistos en Mundo geek: El tamaño es muy importante, al menos a la hora de crear una página web: cuanto menos ocupen los archivos que componen nuestra web, menos tiempo tardará en descargarlos el usuario y menos ancho de banda consumiremos. Veamos algunos métodos para ahorrar algunos kilobytes en nuestras imágenes, hojas de estilo o scripts. Reducir el tamaño de los PNG ??ltimamente, y para imágenes muy vistas, como el logo de la página, suelo utilizar este método que descubrí en su día en las recomendaciones sobre imágenes de la Wikipedia. Necesitarás las herramientas PNGOUT, OptiPNG, DeflOpt y AdvDef: […]

Bug en Internet Explorer 7 y 8 con gif animados

En un proyecto que he realizado recientemente, he necesitado poner la típica imagen de “Cargando” mientras se realizaba una carga. El proceso es bastante simple. Sólo debes de poner un div oculto por defecto y mediante javascript muestras la capa, en dicha capa tenía un gif animado con una barra que se llena. Lo que ocurre es que en todos los navegadores basados en FireFox funciona a la perfección pero ¿cual es mi sorpresa al usarlo en Internet Explorer 7 y 8? Una vez más no funciona. La razón que IE no anima un gif una vez se está enviando un formulario. Después, de mucho guglear encuentro este post de Geek Rider. Os dejo el código de C# (C sharp) […]

Generar documentos PDFs con Javascript

A través de Ubuntu Live descubro jsPDF, una librería muy simple (no se pueden elaborar documentos PDFs muy complejos) pero con la ventaja de poder crear un PDF directamente desde el lado cliente con javascript, lo cual para ciertas ocasiones, es mas que suficiente. Un ejemplo de creación de PDF (extraído de los ejemplos de la librería) seria el siguiente: [js] var doc = new jsPDF(); doc.setFontSize(22); doc.text(20, 20, ‘This is a title’); doc.setFontSize(16); doc.text(20, 30, ‘This is some normal sized text underneath.’); // Output as Data URI doc.output(‘datauri’); [/js] Os recomiendo que veáis el funcionamiento en los ejemplos, especialmente el último, donde se interactúa con el cliente. Enlace al proyecto y descarga.

Las 3 formas más seguras de publicar emails en la web

Poner email en texto plano en una página puede llegar a ser un verdadero problema, ya que hay bots que escanean nuestras páginas buscándolas y almacenándolas junto a otras para posteriormente usarlas para enviar SPAM a esas cuentas. Evitar esto no siempre es sencillo, ya que muchos pueden permitirse el lujo de eliminar los emails, otros necesitan ponerlos visibles al público. Por eso, los desarrolladores encuentran formas ingeniosas para sortear este obstáculo. ¿Pero cuanto de efectivo tiene cada una de las formas posibles? Como vemos en la imagen, técnicas como construir la dirección con Javascript o introducir comentarios entre los tags no solucionan el problema aunque lo minimizan. Según las pruebas que Tillate.com realizó hace ya más de 1 año, […]

Traductor en 52 idiomas para tu web

Si estás meditando sobre la idea de incluir un traductor a tu web deberías sopesar la posibilidad de usar TranslateThis, un botón sencillo que nos permitirá traducir nuestra página hasta en 52 idiomas diferentes: <div id=”translate-this”> <a href=”http://translateth.is/”>Translate</a> </div> <script type=”text/javascript” src=”http://www.google.com/jsapi”> </script> <script type=”text/javascript” src=”http://x.translateth.is/translate-this.js”> </script> <script type=”text/javascript”> TranslateThis(); </script> Usa la API de Google Translator, así que como es un traductor bastante potente (teniendo en cuenta lo difícil que es la traducción automática de textos) creo que es una buena solución. ¡Facilísimo de implementar y usar! ¿Conocéis alguna otra alternativa? Fuente

Vocales acentuadas en HTML

Bueno, ando trabajando en un proyecto en Java y a la hora de comentar las clases y paquetes que voy creando me decidí a usar javadoc. Javadoc es una utilidad de Sun Microsystems para la generación de documentación de APIs en formato HTML a partir de código fuente Java. Javadoc es el estándar de la industria para documentar clases de Java. La mayoría de los IDEs (como Eclipse, que es el que estoy usando) los generan automáticamente. Para quien nunca haya usado javadoc, os comento que te crea en un directorio principal los ficheros HTML de la estructura y el índice de la documentación a generar, y en subdirectorios inserta los ficheros HTML con la documentación de las clases pertenecientes […]

PHP Mail tester, comprobando direcciones de correo electrónico

Muchas de las aplicaciones Web, incluso algunas de las que hemos podido construir usan un campo de email que hemos de rellenar para poder continuar. Nos encontramos con el caso de que al proporcionar ese correo basta con especificar el usuario y el dominio separado por una arroba para que se verifique como correcto. En muchos casos, y la evidencia lo refleja, esto no es suficiente, ya que podemos proporcionar un usuario o dominio inventado; es aquí donde aparece PHP Mail Tester. Esta útil y a la vez sencilla utilidad nos permite comprobar si el servidor existe y si el usuario es válido, para ello, realiza los siguientes pasos: Obtiene los registros MX para el dominio dado. Se conecta a […]

Rotar texto Html con CSS

En bloobs me encuentro con el siguiente ???truco de diseño web con CSS???. Vamos a girar un texto, algo que hasta ahora no quedaba más remedio que hacerlo con una imagen. Además contamos con la ventaja de que se ve en Explorer, como veremos más adelante para Explorer hay que hacer algún ???retoque???, pero se consigue girar, que es lo importante. Ese ???truco???, nos permite abrir aún más el diseño de nuestros sites, utilizando además texto en Html, lo cual significa menor peso y ayuda al posicionamiento SEO. A continuación vamos a ver el código necesario y lo fácil que es usarlo. Para conseguir que este código funcione en Explorer, tenemos que recurrir a el BasicImage Filter, un filtro que […]