Mar 3 2008

Test Everything - todas las herramientas para testear tu sitio, JUNTAS.

Emiliano

Que hace?? Testéa cualquier sitio web de todas las maneras que quieras y te imagines. Todo lo que necesitas hacer es escribir la URL del sitio que quieres examinar, y elegir entre las diferentes categorías y opciones que existen para recibir un informe detallado de cada variable que elijas.

Test Everything no es algo nuevo ni tiene nada nuevo tampoco, pero es una de las mejores súper herramientas con las que me he encontrado a lo largo de la red y siempre he usado.

Test Everything

Podrás chequear desde SPAM, validación de código, un heatmap de tu sitio, todos tus links, accesibilidad, redes sociales, traductores, SEO, el historial de tu URL, todo sobre el page rank, el tráfico desde alexa, quien te linkea, tus paginas indexadas, tendencias, análisis de tus meta tags, la vista en diferentes buscadores, la cantidad de diggs que tienen tus artículos, etc., etc., etc., etc.… you name it!!

La captura muestra la simpleza de la web, tienes 8 categorías o grupos de herramientas, que se irán desplegando en cuadros internos para que tú (a modo de checklist) elijas a tu preferencia la cantidad, variedad y calidad de reportes que quieras para tu sitio.

Si no la conocías, ya puedes empezar a usarla para examinar todo lo que quieras.
Aunque para comprobar el Page Rank, ya deberías contar con “tu propia herramienta”, un excelente aporte de Pablo.


Feb 28 2008

5978 iconos de alta calidad, gratis. Si, cinco mil novescientos setenta y ocho.

Emiliano

La gente de nerdbusiness nos regala lo que sin dudas es, la recopilación más grande de iconos presentadas en un solo artículo.
Hay muuuuchos iconos, de todas las clases y para todos los gustos.
web 2.0, retros, grunge, de diferentes nichos y marcas, de todas las categorías y para el uso que te puedas imaginar.
Desde gadgets en general, iconos de Mac, windows, firefox, vista, explorer, navidad, música, RSS y ciertamente muchos mas.

iconos 1

Son todos gratis y se tomaron el pequeño trabajo de organizarlos. Están en jpg y en el tamaño más grande disponible y (como corresponde) con el link adonde esta publicado el trabajo original de cada autor (por si quieres ir un poco mas allá).
iconos 2

Aquí están los links de la página original para adueñarte de todos, renovar tus proyectos y solucionar para siempre tu stock de iconos!!

Disfrútalos!

Página 1 - Página 2 - Página 3
Página 4 - Página 5 - Página 6


Feb 27 2008

Como crear un favicon con Photoshop y subirlo a tu web

Emiliano

Créeme, no necesitas ser un usuario profesional de photoshop, con solo tener el programa y seguir los pasos podrás fácilmente crear tu favicon y subirlo a tu blog en minutos.

Para un mejor entendimiento sobre este artículo, se recomienda la previa lectura de “Favicon la frutilla del postre”.
El siguiente post es una traducción de un tutorial de
Jennifer Apple de PhotoshopSupport.com. (En ingles).

Logos y favicones

Un favicon es un pequeño icono personalizado que aparece al lado de la URL de un sitio, en la barra de dirección del buscador y en las pestañas de las ventanas.
Y cuando digo pequeño, no exagero, el tamaño de un favicon es de 16 píxeles por 16 píxeles. Asi que si te gustan los desafíos de diseño, prueba con este!

Todo lo que necesitas para añadir un favicon a tu pagina, es crear un archivo de Icono de Windows llamado favicon.ico, el cual luego subirás en el directorio principal de tu sitio para hacerlo visible para todo el mundo.

Descargar el plugin
Necesitaras bajar un plugin para poder exportar en Photoshop, el archivo en el formato que se requiere para un favicon (formato de Icono de Windows - .ICO). Puedes bajarte el plugin
aquí.
Este plugin lee y escribe archivos ICO en 1, 4 y 8-bit indexados y 24-bit en modo RGB, también lee y escribe 32-bit “XP” iconos (con 8-bit canal alpha).
Si no entendiste nada de la última oración, no te hagas problema.

Asegúrate de instalar el plugin antes de empezar con este tutorial, si lo instalas con el Photoshop abierto, deberás salir y reiniciar el programa para que lo reconozca y te permita guardarlo bajo el formato de archivo de un favicon (.ico)

Empecemos
Dado que 16 x 16 es un área demasiado pequeña, puede ser difícil ser creativo. Por esto en vez de empezar tu proyecto en un área de 16 x 16, hazlo en una de 64 x 64 (siempre que planees redimensionar tus archivos, usa múltiplos de tamaño). Para esto selecciona Archivo>Nuevo”, y elige un tamaño personalizado de 64 x 64 pixeles.

El diseño
Logos y faviconesSi ya tienes un logo, deberías reducirlo al tamaño de 16 x 16 pixeles para ver si se adecua y queda bien. Si no luce bien en este tamaño, trabaja con el lienzo de 64 x 64 y trata de crear un diseño simple que incorpore colores de la paleta usada en tu sitio.

Cuando estés listo para probarlo, selecciona Imagen>Tamaño de imagen y reduce el tamaño a 16 x16. Clickea en “remuestrear la imagen” y elige la opción “bicubica” (este último paso solo si tienes Photoshop CS).

Este es el mejor seteo para evitar que una imagen se ponga borrosa cuando redimensionas su tamaño.

Si sientes que el favicon no ha quedado como tu esperabas, sigue probando hasta que estés conforme. Trabajar en un tamaño tan pequeño puede hacer que te lleve unos cuantos intentos antes de lograr un buen resultado.

Guardando tu favicon
Ve a “Archivo > Guardar como” y asegúrate de nombrar el archivo “favicon.ico”. Dentro del mismo menú, en el formato (“tipo”) debes elegir Windows Icon (ICO). Recuerda que este formato solo estará disponible en Photoshop luego de haber descargado e instalado el plugin.
Ya que en el próximo paso necesitaras subir este archivo al directorio raíz de tu sitio web, es una buena idea guardarlo y colocarlo en ese lugar de tu disco duro ahora.

Subiendo el archivo Favicon.ico
Conéctate a tu servidor y sube el archivo Favicon.ico a tu sitio.
Para esto, debes colocarlo en el mismo directorio que tu página de inicio (índex), y dejarlo suelto. Asegúrate de no colocarlo en alguna carpeta de imágenes o algún otro directorio.

Algunos buscadores trataran de rastrear un link en el código HTML de tu sitio hacia el archivo favicon.ico. Puedes ayudar a estos buscadores añadiendo este link en la sección de encabezado de cada página en donde quieras que aparezca el favicon.
Aquí está el código del link que debes incluir: <
link rel=”Shortcut Icon” href=”/favicon.ico”> Una vez que hayas añadido este código, recarga todas las paginas que hayas modificado.

Testeo
Si tu nuevo favicon no se muestra de inmediato, prueba refrescar la pagina o escribe un ‘?’ al final de la url, que engañara al browser haciéndole creer que la pagina es nueva y no está en la memoria cache.

Inspiración
Si necesitas algo de inspiración, échale un vistazo a esta hermosa colección de favicones. También mira a la lista de 50 diseños categorizados de Smashing Magazine. Podrías encontrar alguno que despierte una idea para el tuyo.

Eso es todo. Disfruta de tus favicones!


Feb 27 2008

Favicon - La frutilla del postre. Porque debes tener uno si o si

Emiliano

Existen toneladas de libros explicando el poder y la importancia del logo de una marca. A mí no se me ocurrió una mejor idea para explicar el “porque” de esa importancia que mostrándote algunos de los logos más famosos (por millonésima vez) para que tu memoria emotiva los busque en el subconsciente y te des cuenta de que han logrado su trabajo a la perfección.

Logos y favicones
En el mundo de los negocios muchas veces se dice (un tanto en broma y un tanto en serio) que existe algo peor que el hecho que se hable mal de ti o tu compañía, y eso es: que no se hable en absoluto.

Con la mayoría de los iconos que veras a lo largo de este articulo, pueden surgirte diferentes sensaciones. Puedes haber tenido una mala experiencia como usuario o ser consumidor habitual del producto o servicio, pueden habértelo recomendado, puede ser algo que uses en tu vida diaria o algo que quieras pero este fuera de tu alcance (no me digas que no te gustaría tener una Ferrari??).

En fin, puedes amarlos u odiarlos, pueden gustarte o no, pero hay una cosa que es segura no puedes ignorarlos, están en tu cabeza, no sabes quién te los metió ni cuándo ni cómo, pero están ahí y ese es su mayor logro.

Logos y favicones
Basándote en lo anterior, aun necesitas explicación sobre la importancia que puede llegar a tener un favicon??

Deberías vivir encerrado en un sótano o adentro de alguna cueva para no conocer la mayoría de estos iconos.
Este reconocimiento inmediato y hasta casi inconsciente nos habla de la magnitud del poder que poseen por sí mismos y todo lo que valen para la marca que representan.

Ahora bien, un favicon es lo mismo que un logo??
No exactamente pero para nosotros el punto es el mismo.

Favicon es una más, de la larga lista de palabras raras surgidas en la red, es una abreviatura para “favorites icon”, en resumen, es un icono.
Pero no es cualquier icono, sino tu icono, el de tu blog, de tu sitio, de tu marca personal.
Por eso es importante que lo tengas desde un prncipio, porque es parte del paquete de herramientas que te ayudaran a construir y brindarle personalidad a cualquiera que sea tu producto o servicio.

Logos y favicones

Donde y cuando se ve tu favicon??
Si bien cada navegador de Internet tiene su interface, hoy en día todos están programados para mostrar los favicones de las páginas que el usuario visita.
Por lo general los vemos en la barra de direcciones URL y a la izquierda de la pestaña de la ventana. También se visualiza en el área de “favoritos” de cualquier navegador.

Como hago un favicon??
Como para la mayoría de las cosas disponibles para tu blog, en la red hay desde tutoriales sobre cómo hacerlos, consejos sobre cómo hacerlos, formas, colores, como instalarlos, y demás.

Aquí tienes un tutorial para crear uno fácilmente con photoshop, y subirlo a tu blog en minutos

Si no te animas a hacerlo tú mismo, también existen templates de favicones de libre uso y gratuitos como los diseños de wordpress, o alguno de los servicios en línea disponibles para hacerlos en segundos
Realmente es muy fácil conseguirlo y demasiado importante como para no tener uno.

Hacer que tu favicon o logo taladre el subconsciente de la gente, y que esta, llegue a relacionarlo automáticamente con una marca o servicio, es un trabajo a largo plazo.
Ten cuidado a la hora de la elección del diseño, piensa en lo que realmente quieres comunicar y busca el modo de hacerlo de una manera efectiva y simple.
Muchas veces por intentar tener algo a la moda del momento o demasiado complicado, se pierde de vista lo que se quiere y se termina perdiendo la efectividad de la herramienta.
Existen también favicones animados, sin embargo, a pesar de llamar más la atención, resultan distractivos para el lector, es por esto que su uso no es tan popular.
Ten en cuenta que dependerás de mucho tiempo para que tu logo (y favicon) sea relacionado con tu marca, es por esto que comúnmente se dice que un logo que se cambia es casi como empezar de cero.

Logos y favicones
En fin, el favicon puede parecerte solo “un pequeño detalle” o algo de poca relevancia, pero lo cierto es que si logras impactar a los visitantes con tu servicio y tienes un buen diseño de favicon, estos no tardaran en registrarlo en sus retinas y relacionarlo de inmediato con tu sitio, quieran o no.

Si no sabes cómo subirlo a tu blog, es fácil!!
Visita este tutorial y lo encontrarás explicado paso a paso.


Feb 27 2008

Fireshot: Captura y diseño de pantallas fácil y en segundos.

Emiliano

FireShot es una excelente extensión de Firefox para hacer capturas de pantalla, editarlas a gusto y usarlas para lo que quieras. Todo muy fácil, útil y rápido

Si si, hay muchas aplicaciones parecidas a esta, pero esta trae unas cuantas diferencias que la hacen realmente mejor y mas útil.
Por sobre todas las cosas destaco su usabilidad, practicidad, facilidad y rapidez para conseguir resultados eficientes en segundos.

FireShot

Sin más preámbulos, entre muchas cosas totalmente configurable, esto es lo que puedes hacer con Fireshot:

  • Tomar una captura parcial de una sección, tomar una captura de lo que se ve en el navegador o tomar la captura de la web completa.
  • Las capturas que hagas pueden ser guardadas en el disco (PNG, JPEG, BMP), copiadas en el portapapeles o ser enviadas por email o a editores externos para procesarlas más tarde.
  • Por supuesto que antes de todo eso, si quieres, puedes editarlas con un muy fácil y usable entorno, pero con un amplia gama de herramientas que incluyen:
    Redimensionar imágenes a tu antojo
    Cortarlas seleccionando con formas elípticas y rectangulares
    Agregar texto y configurarlo como quieras
    Agregar formas
    Sombrear áreas
    Dibujar a mano alzada
    Incluir cajas de comentarios
    Enmarcarlas, rellenar espacios con color
    Invertir colores o seleccionar colores de la misma captura.
    Desenfocar fondos para resaltar algo en primer plano
    Borrar, pintar o aplicar motivos a algún fondo resaltando lo que nos interesa
    Poner un recuadro luminoso alrededor de algo

Todo eso entre otras cosas, y como si fuera poco, permite la combinación de estas herramientas para lograr efectos más avanzados.

 

En fin, creo que es especialmente útil para esas ocasiones en que solo queremos obtener una modificación pequeña pero necesaria de algo que vemos, sin tener que recurrir a abrir programas de edición como el Photoshop.
Yo la empece a usar buscando una buena herramienta que me ayude a hacer reviews.

Realmente es una buena opción, es rápida, no ocupa espacio, no emplea ningún tipo de recursos si no se usa. (si alguien sabe de una mejor, que avise)

Pueden descargarla e instalarla directamente desde aquí.

Espero que les sea útil


Feb 20 2008

Las excusas que conviertes en verdades y te apartan del exito.

Emiliano

Esta guía no tiene listas de consejos, ni tips o herramientas para hacer nada, lo que si tiene en vez de eso son varias excusas.

Excusas que transformamos todos los días en argumentos y explicaciones totalmente lógicas y razonables para justificar lo que nos tiene apartados del éxito que deseamos y no alcanzamos.

Si no leíste el articulo “Los riesgos de no correr riesgos” te recomiendo que lo hagas antes de continuar con este

…_by_mpedziwiatr
Excusas que cargamos a lo largo de la vida y que podemos decidir (o no) reconocerlas y tomar un poco mas de control sobre nuestro destino.

Casi no existe habilidad técnica que no puedas aprender o conocimiento que no puedas adquirir, aunque no son esas cualidades las que hacen destacar a la gente que alcanza el éxito por sobre el resto, sino las cualidades personales. Continue reading