Colección de herramientas SEO online

Escrito por Elías el 22 de Julio de 2008

A estas alturas dudo mucho que quede alguien sin saber sobre lo importante que es en la actualidad el SEO para cualquier tipo de desarrollo web, que además con el tiempo seguirá aumentando su peso: cuantos más sitios en la red, más importante será el SEO. Desde el blog “Search engine journal” sacan recopilatorio que le vendrá muy bien a los SEO profesionales y a los que no lo somos tanto. En él muestran unas cuantas utilidades cumpliendo todas tres premisas: Ser herramientas útiles para seo,s, se encuentran en la web y son gratuitas.

Enlace: Online SEO Tools - the Ultimate Collection | Vía: eTc

Publicado en: HerramientasOnline, SEO
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

131 estilos para Adobe Fireworks

Escrito por Elías el 21 de Julio de 2008

Fireworks es un programa muy usado en muchos campos, especialmente en el de la creación web, ideal para plantear un sitio web desde cero o usarlo para la creación de elementos gráficos. Al igual que photoshop cuenta con la opción de usar estilos que facilitan mucho el trabajo y con los que se pueden obtener muy buenos resultados de forma simple. Desde 2experts Desing liberan un pack de estilos, concretamente 131 diferentes con degradador muy estilo 2.0.

Enlace: 131 Ultimate Web 2.0 Styles for Adobe Fireworks

Publicado en: Brushes&Patterns, Útiles Diseño
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Identificar tipo de letra

Escrito por Elías el 21 de Julio de 2008

Seguro que al igual que yo en alguna ocasión te interesó o necesitaste saber que fuente se usa en determinada web, ya sea para los textos, secciones, logotipo etc. Personalmente usaba un plugin para firefox con el que hacerlo el cual la verdad estaba bastante limitado y en la actualidad ya no se le da soporte ni está disponible para firefox 3.

WhatTheFont biene a cubrir este vacio en forma de herrmienta online. Para saber que tipografía usa determinada web tendremos que hacer una captura de no más de 360×275 que subiremos al servicio o bien le indicaremos la URL donde esté colgada. Él se encargará de diseccionar las diferentes letras que encuentre en la imagen y nos dará vairas  opciones de que fuente puede ser. Con las primeras pruebas parece que funciona bastante bien, veremos en el futuro que tal responde. La única pega que le encuentro es el proceso bastante tedioso que tenemos que realizar para averiguar el tipo de fuente: hacer captura, recortar, colgar.

Enlace: WhatTheFont | Vía:  BaluArt

Publicado en: HerramientasOnline, Tipografías
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Añadiendo funciones extra a formularios

Escrito por Elías el 18 de Julio de 2008

Los formularios son un tema jugoso dentro del desarrollo web, tienen misiones importantes dentro de los sitios web, complejidades y muchas opciones de personalización. Como factor importante nunca se puede olvidar la usabilidad, tienen que cumplir a la perfección la misión para la que estén concebidos, haciéndose necesario en ocasiones ampliar funciones mediante por ejemplo javascript y css.

Desde woork liberan un interesante artículo donde tratan estas cuestiones de forma concreta con la explicación de implementaciones prácticas, desde como contar los caracteres introducidos en un input hasta como cambiar el aspecto de uno cuando se encuentre pulsado pasando por como mostrar mensajes aclaratorios o sugerir opciónes a la hora de introducir datos. Todo explicado de forma clara, con imagenes-esquemas de ejemplo y códigos necesarios (que son bastante simples de usar). Otra gran aportación de woork a la comunidad.

Enlace: Useful tips to enrich your HTML Forms

Publicado en: CodesWeb
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

UnmatchList - Recursos por doquier

Escrito por Elías el 17 de Julio de 2008

Suculento descubrimiento hacía el otro día, UnmatchList se llama el sitio. Está orientado a diseñadores y desarrolladores web donde recopilan de forma ordenada y por temáticas recursos de todo tipo. Desde CMS,s hasta CSS, SEO, flash o photoshop. Una vez entremos en determinada categoría veremos los sitios recopilados junto con una breve descripción de lo que nos encontraremos tras el enlace. Más que interesante guardarse el sitio en favoritos para acudir a él cuando necesitemos de una pequeña ayuda a la que seguro encontramos respuesta por el importante número de recursos y tematicas contenpladas.

Además aseguran actualizan cada mes con nuevos servicios que encuentran y en no mucho tiempo promenten nuevas herramientas al servicio como opción de poder mandar automaticamente nuestra web (ahora se puede hacer mandado un mail a la “bieja usanza”).

Enlace: UnmatchList

Publicado en: Recopilaciones, Recursos&Software, Utilidades
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Tags themes wordpress

Escrito por Elías el 15 de Julio de 2008

Una de las herramientas más potentes con las que cuenta wordpress a la hora de desarrollar themes para el sistema son sin duda las tags, conocidas también como template tags, que nos sirven para realizar determinadas funciones como mostrar fechas de posts, nombre de autores, título de entradas, enlaces permanentes etc. Es bastante complicado acordarse de todas las que hay, para que sirve cada una y que atributos admite por lo que este recopilatorio de DBS nos vendrá que ni pintado.

En él se muestran la mayoría de tags que podemos usar en nuestros themes de wordpress separadas en diferentes categorías en función de su utilidad (para los post, para autores, categorías etc) junto con breve explicación, ejemplo de uso y los atributos que soporta, todo de forma perfectamente ordenada y muy claro. Recomendable tenerlo a mano para cuando nos toque crear un theme wordpress o queramos modificar algo del nuestro.

Enlace: WordPress Template Tags Reference Guide

Publicado en: Templates&Themes, Wordpress
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

50 wallpapers con la naturaleza como protagonista

Escrito por Elías el 14 de Julio de 2008

Ninguna duda cabe sobre que la naturaleza es fuente inagotable de inspiración y belleza superando en muchas ocasiones al mejor de los diseñadores. En smashing magazine son conscientes así que nos regalan un recopilatorio de 50 instantáneas verdaderamente bonitas donde predomina lo natural para que las usemos como fondo de nuestro escritorio. Algunos de los wallpapers tienen bastante fotomanipulación o se les aplicó alguna otra técnica con la cámara, sin perder un ápice de calidad por ello.

Enlace: 50 Remarkable Nature Wallpapers

Publicado en: Iconos&Wallpapers
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

jQZoom – Hacer zoom sobre imágenes

Escrito por Elías el 13 de Julio de 2008

En ocasiones he echado de menos que en las tiendas online no me permitieran ver con más detalle determinado producto, factor muy importante dentro de la web, sobre todo cuando se trata de compras. El usuario quiere tener todos los detalles posibles del producto que adquirirá. Esto nos permite hacer jQZomm, un plugin de jQuery con el cual podremos cargar dos imágenes, una miniatura y otra más grande que no será visible en un primer momento. Cuando pasemos el ratón por encima de la miniatura iremos viendo ampliada la porción sobre la que tengamos el puntero.

Su instalación es la usual en este tipo de scripts: primero nos lo descargamos y entre head - /head llamamos a la hoja de estilos, jQuery y el plugin. Solo nos queda aplicar las clases necesarias en las imágenes para que poner en funcionamiento jQZomm.

Enlace: jQZoom

Publicado en: CodesWeb, Imagen
3 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Web Standards Curriculum – Curso gratuito de estándares por Opera

Escrito por Elías el 11 de Julio de 2008

Recurso-joya con el que me topo de casualidad como suele pasar. Se trata de un completo curso en forma de artículos ideado por Chris Mills, desarrollador de Opera. Es todo un evangelizador de estos temas y hacía tiempo que tenía en mente un trabajo como Web Standards Curriculum, así que se lo planteo a sus jefes que accedieron.

El documentó está formado por varios artículos, casi todos de Chris, donde se tratan los temas más importantes sobre desarrollo/usabilidad sin ser necesario tener conocimientos previos extensos. Se habla desde principios básicos de HTML hasta la planificación de un sitio o teoría del color. Obligada lectura.

Enlace: Web Standards Curriculum

Publicado en: Tutoriales
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Fugue Icons

Escrito por Elías el 8 de Julio de 2008

Uno de los paquetes de iconos que más vueltas dio por la red fue el creado por Yusuke Kamiyamane, Diagona Icons, además de las píxel fonts liberadas también por Yusuke. Hoy leo en Criterion que el responsable de esos iconos y fuentes vuelve a la carga con un nuevo paquete de iconos, Fugue Icons. 410 en total en formato .png y con tamaño 16×16. El estilo es muy similar al pack Diagona, con un acabado profesional y perfectos para usar en algún proyecto web.

Enlace: Fugue Icons

Publicado en: Iconos&Wallpapers, Útiles Diseño
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Mostrar mensajes emergentes con desvanecimiento

Escrito por Elías el 8 de Julio de 2008

Ya hablamos en varias ocasiones de los tooltips, función que se implementa para poder mostrar mensajes emergentes al pasar el ratón sobre determina porción de texto, con lo que ampliamos funcionalidades sin recargar la interfaz del sitio web.

Los tooltips no cubren todas las opciones de mensajes emergentes, es posible que no queramos mostrar un dialogo al pasar el ratón sobre un enlace, si no que se muestre el dialogo en un lugar determinado de la web, sin que esta se recargue, cuando se clickee sobre un enlace. La diferencia es sutil pero importante. Para esto nos sirve jGrowl, una librería basada en jQuery con la que podremos soltar pequeños recuadros con mensajes cuando el usuario pique sobre el texto que nosotros queramos. Las opciones de configuración son varias, contando cada dialogo con efecto “desvanecimiento” cuando se cierra. Tenemos toda la información en el sitio del creador.

Enlace: jGrowl

Publicado en: CodesWeb
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

10 sitios con tutoriales y guías para Gimp

Escrito por Elías el 4 de Julio de 2008

Hacía tiempo que no comentaba nada sobre Gimp, el programa primo de photoshop, con la diferencia de ser totalmente libre y contar con una comunidad que cada día crece un poco más en beneficio de todos. En esta ocasión me encuentro con un completo recopilatorio donde nos enseñan nada más y nada menos que 10 sitios especializados en el programa, con gran cantidad de material para conseguir casi cualquier cosa mediante Gimp. Cada día quedan menos disculpas para no usar la alternativa libre de photoshop, porque a cada nueva versión mejora, aumenta sus opciones, mejoras otras y lo más importante: más comunidad.

Enlace: 10 Great Sites for GIMP Tutorials and Guides

Publicado en: Gimp, Recopilaciones, Tutoriales
2 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Iconos gratuitos de alta calidad

Escrito por Elías el 3 de Julio de 2008

Por aquí nos gustan los iconos así que vamos con unos cuantos de alta calidad. Primeramente el pack liberado desde fuction, 128 en total de gran calidad con diseños pensados para ser usados en la web, todos ellos estilo “brillante” en tamaño 48×48, entre los que tenemos varios de servicios sociales, flechas, sobres etc. Se pueden usar tanto para proyectos comerciales como personales sin ningún tipo de requisito.

Seguimos por el último recopilatorio liberado desde smashingmagazien (que también son unos apasionados de los iconos). 55 paquetes diferentes, entre los que se encuentran el mentado anteriormente, con iconos de alta calidad pensados para diseño web y escritorio. Encontraremos todo tipo de temáticas, estilo y tamaños, siendo conveniente leer las licencias de cada pack ya que no todos se pueden usar para proyectos comerciales.

Enlace: Free Icons: Function Icon Set, 128 Completely Free Icons | 55 Free High Quality Icon Sets

Publicado en: Iconos&Wallpapers, Útiles Diseño
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

BgPatterns - Generador de patrones para backgrounds

Escrito por Elías el 2 de Julio de 2008

El uso de backgrounds en creación web está a la orden del día, pudiendo ser estos de muchos tipos y estilos. Por ejemplo los motivos son una gran opción con la que darle un toque interesante a un sitio de forma fácil y rápida. Esta tarea se nos facilitará aún más a partir de ahora con la herramienta en linea BgPatterns la cual nos permite precisamente eso, generar patrones personalizados. Es completa y simple, podemos escoger color de fondo, color de la figura, texturas, varios motivos diferentes y orientación de los mismos. Todos los cambios que efectuemos podremos verlos en funcionamiento dentro del mismo sitio que toma nuestro patrón y lo aplica a la web. Una vez lo tengamos a nuestro gusto solamente nos quedará descargarlo y empezar a usarlo. Personalmente hecho en falta un mayor número de figuras, la mayoría son de estilo ornamental y las que no son figuras poco resultonas en un fondo.

Enlace: BgPatterns

Publicado en: HerramientasOnline, Útiles Diseño
0 Comentarios » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!

Dar estilos con javascript a Checkboxes, RadioButtons y Select Lists

Escrito por Elías el 1 de Julio de 2008

Dentro del desarrollo web los componentes de un formulario suelen ser de lo más problemático por las diferentes interpretaciones que cada navegador hace de ellos. Para personalizarlos nada mejor que algo de css e imágenes a lo que añadiremos esta estupenda librería en javacript con la que podremos dar un bonito aspecto a nuestros Checkboxes, RadioButtons y Select Lists. Lo que hace el script es sustiur cualquiera de los elementos anteriores por una imagen (manteniendo el funcionamiento por supuesto). Para usarlo solamente tendremos que instalarlo y colocar una clase en el elemento queramos se le den los estilos. Además es totalmente configurable pudiendo cambiar las imagenes que bienen por defecto por las que nosotros diseñemos o queramos. Está testeado en los navegadores más usados y en caso de que el javascript del navegador no esté activado no abrá ningún problema de usabilidad ya que se mostraran los elementos sin estilos pero igualmente funcionales.

En el sitio tenemos explicaciones más detalladas de que es lo que hace exactamente el código y como podemos personalizarlo a nuestras necesidades.

Enlace: Custom Checkboxes, Custom Radio Buttons, Custom Select Lists

Publicado en: CodesWeb, Útiles Diseño
1 Comentario » | Reacciones otros blogs | Comparte en marc.sociales/mail: Click!