Básicamente en esta entrada vamos a ver algunas fuentes frescas y de gran calidad que obtenemos de ver Smashing Magazine.

Sin más charla, vamos a las fuentes:

Freebooter Script

Esta fuente realmente impresiona por sus curvas. Es una fuente “Tipo Cursiva” que está muy buena para diseños y títulos raros. La misma está diseñada por Graham Meade.

Cora Basic Regular (OpenType)

Una fuente de estilo sans-serif que es bastante gruesa y fuerte, la misma fue diseñada por Veronika Burian y José Scaglione.

Walkway (TrueType)

Walkway es una fuente bastante peculiar, finita y agradable. Parece bastante elegante y modesta, y tiene una gran variedad de formas.

Karabine

Esta fuente creada por Jonathan Paquette es bastante original, sucia y “linda” para hacer diseños al estilo “dirty”. Personalmente es la que más me gusta de todas estas que vimos aquí.

Lo bueno es que en Internet siempre tenemos gente que nos ayuda a solucionar nuestros problemas.

Esta nota tratara en una primera instancia de que tamaño deberíamos utilizar para generar nuestro layout, y luego nos adentraremos en como hacer el layout con CSS puro, para poder optimizar nuestro sitio, haciéndolo de la manera más sencilla posible.

¿Qué tamaño deberá tener el layout de nuestro sitio?

Bueno, esa es una decisión muy personal a la hora de crear un nuevo diseño. Pero basándonos en estadísticas, podríamos decir que podemos encontrar en este sitio, podríamos sacar bastantes conclusiones:

• Por empezar, podemos decir que la gente que usa 640×480 ya es prácticamente despreciable (sin ofender a nadie, claro).
• Otra conclusión que sale a primera vista es que el 80% de la gente podrá visualizar correctamente una pagina diseño preparado para 1024×768 (50% de 1024 + 27% de 1280 + 3% de 1152). Tengamos en cuenta, que cada vez es mayor la cantidad de gente que usa 1024, incluso 1280.
• Si hacemos un diseño pensado para 800×600 seguramente tendremos en cuenta al 99% de la gente.

Aquí le dejo un resumen de las estadísticas esas:

1024×768 (50%)
1280×1024 (27%)
800×600 (10%)
Unknown (8%)
1152×864 (3%)
1600×1200 (0%)
640×480 (0%)

Ahora bien, si decidimos usar 1024, o 800 o la que sea; eso no significa que debamos utilizar esa resolución en nuestro layout. Es muy importante tener en cuenta que el área visible de un explorador no es exactamente la misma que la de nuestra pantalla.

Según este excelente post (en ingles) titulado “size does matter”, que tiene muchas estadísticas y habla sobre cual es la mejor resolución para hablar; aparte de dejarnos estadísticas (aunque mas detalladas) similares a las que vimos arriba, nos dice cuales son las mejores resoluciones para trabajar:

Si usamos una resolución de 1024px de ancho, el tamaño que deberíamos considerar para utilizar es de 994px. En cambio si pensamos usar una resolución de 800px de ancho, deberíamos considerar en que nuestro layout deberá ser de 770px de ancho.

1024px de pantalla: 994px de navegación.
800px de pantalla: 770px de navegación.

Por otra parte, según podemos ver un interesante articulo que se ha posteado en xyberneticos, podemos decidir que si queremos hacer un diseño pensando en una resolución de 1024px, podríamos utilizar un ancho de layout de 960px.

El motivo de elegir 960px seria la posibilidad de dividir este numero por 2, 3, 4, 5 y 6; permitiendo así generar columnas de diferentes tamaños de muy fácil configuración y agradables a la vista, de 160px, 192px, 240px, 320px o 480px.

Con esto creo que ya se puede decidir cual es el ancho de la pantalla que voy a utilizar para mi sitio, ahora lo que se necesita es poner manos a la obra y generar el layout. Como dijimos en un artículo anterior, es bueno que utilicemos CSS y no tablas, entonces vamos a hacerlo con CSS.

¿Cómo hago mi layout con CSS?

Bueno, hacer esto es bastante sencillo con CSS. Lo mas seguro es que el layout de nuestro sitio necesite varias cosas; como un header, un footer, y 2 o 3 columnas en el medio (o quizás 1 sola).

Para no dar muchas vueltas al asunto, lo mas fácil para generar nuestro layout en CSS es obteniéndolo ya generado de alguna manera.

Una forma de hacer esto, es utilizando herramientas que encontraremos en Internet tales como: Layout-o-matic.

Otra opción es bajarte ya el código CSS de sitios como Iron Myers, que es un excelente sitio con un montón de opciones para hacer tus layouts; como también utilizar los layouts que proporciona Mollio.

Luego de que tengan el “layout base” de sus sitios, ahí deberán modificarlo un poco para obtener los mejores resultados que ustedes deseen.

La tarea es bastante sencilla una vez que hayan planificado como es que desean hacerlo. La planificación es muy importante en este tipo de cosas.

Ahora bien, ¿cómo sé efectuar el diseño de las aplicaciones web 2.0?

Bueno, yo creo que los diseños deberían hacerse siempre con CSS por varios motivos. ¿Cuáles? Bueno, lean el post a continuación que creo que va a darnos una idea de cuales son las ventajas de utilizar CSS en nuestros diseños. Obviamente, empezaremos por una introducción al tema.

¿Qué son los CSS?

Las Hojas de Estilo (o CSS, por Cascading StyleSheets) son un mecanismo que permiten aplicar formato a los documentos escritos en HTML (y en otros lenguajes estructurados, como XML) separando el contenido de las páginas de su apariencia. Para el diseñador, esto significa que la información estará contenida en la página HTML, pero este archivo no debe definir cómo será visualizada esa información. Las indicaciones acerca de la composición visual del documento estarán especificadas en el archivo de la CSS.

¿Cómo Funcionan los CSS?

Las Hoja de Estilo no utilizan el archivo de la página Web para especificar el formato de la página (en realidad, a veces pueden hacerlo, pero no es recomendable hacerlo de esa manera). En su lugar, usan un archivo de texto puro con extensión “.CSS” que luego se vincula a la página.

Este archivo contiene reglas que constan de un selector (en este ejemplo, H1) y una o más declaraciones (en el ejemplo tenemos cuatro declaraciones). Cada declaración tiene dos partes: una propiedad (por ejemplo, FONT SIZE) y un valor (en este caso, 19pt). Estas reglas son las que determinan cómo deberá mostrarse la página.

Nuevamente, si quisiéramos componer los encabezados H1 con tipografía Arial, de 19 puntos, en color azul y alineación central, el archivo CSS debería contener el siguiente texto:

H1 {

   font-family: Arial, Sans-serif;

   font-size: 19pt;

   color: #0000FF;

   text-align: center;

}

Luego, en cada página de nuestro sitio agregamos un link a la Hoja de Estilo:

<LINK REL="stylesheet" href="hoja_de_estilo.css" TYPE="text/css">

El elemento LINK especifica:

• el tipo de vínculo: a una hoja de estilo (”stylesheet”)
• la ubicación de la hoja de estilo a través del atributo “href”
• el tipo de hoja de estilo que se vincula: “text/css”

Ahora, todos los encabezado H1 de las páginas que contienen la referencia al archivo de la CSS tendrán el aspecto que hemos definido.

10 razones (o ventajas) para utilizar CSS

1.- Separación del contenido y presentación.

Las hojas de estilo generalmente se encuentran en archivos separados del código principal (html, por ejemplo). Esto nos va a permitir que en un equipo de trabajo, programador y diseñador puedan realizar sus tareas de forma independiente aunque paralela, sin correr el riesgo de que haya interferencias entre ambos, y ello no alterará el resultado final.

2.- Flexibilidad.

Podríamos comparar las hojas de estilo con la ropa que guardamos en nuestros cajones. Nosotros somos los mismos, pero dependiendo de la temporada variamos nuestra apariencia.

En el caso de las hojas de estilo sucede lo mismo: podemos cambiar en cualquier momento alguna parte o la totalidad del diseño de nuestras páginas con sólo modificar nuestra hoja de estilo, sin que ello suponga modificar el contenido.

3.- Unificación del diseño de las páginas del sitio.

Un sitio web, ya sea dinámico o estático, suele estar formado por unas cuantas páginas. Mantener una misma apariencia se puede volver una tarea pesada y tediosa si tenemos que copiar y pegar código cada vez que creemos una página nueva, o que deseemos modificar una misma cosa en todas.

Enlazando a cada una de nuestras páginas nuestras hojas de estilo, agilizamos este proceso y minimizamos el trabajo.

4.- Optimización de los tiempos de carga y de tráfico en el servidor.

Al haber dividido contenido y apariencia obtenemos archivos más ligeros, y esto nos reporta dos beneficios: por un lado, reducimos notablemente los tiempos de carga del sitio en el navegador. A esto debemos unir la capacidad de éste para mantener nuestra hoja de estilo en caché.

Por otro lado, reducimos el volumen de tráfico de nuestro servidor, que siempre es de agradecer, tanto si disfrutamos de servicios gratuitos en que solemos tener cuotas muy reducidas, como si pagamos por tener alojamiento propio.

5.- Precisión o elasticidad.

Desde el momento en que usemos CSS, el tamaño y posicionamiento de los elementos que formen nuestras páginas podrá ser exacto. Podremos indicarle al navegador en qué píxel debe colocar ésta o aquélla imagen, o qué alto y ancho deberá mostrar.

Pero al mismo tiempo, podremos emplear medidas variables o relativas que nos permitan expandir el contenido hasta ocupar la totalidad de la ventana de navegación a nuestro antojo, o contraerla a sólo una parte de la misma, con independencia de la resolución de pantalla del usuario.

6.- Accesibilidad y estructuración.

La combinación de CSS y marcadores descriptivos va a posibilitar que nuestra página se vea correctamente con o sin hoja de estilos, puesto que en cualquier caso, la información se mantendrá estructurada y ordenada.

Esto supone que podrá ser accesible sin ningún tipo de problemas tanto por navegadores antiguos o sin soporte para CSS, como para personas con algún tipo discapacidad.

7.- Limpieza del código fuente.

Si escribimos una hoja de estilo independiente, el código fuente de nuestra web va a resultar menos farragoso y agilizaremos las tareas de localización de las líneas que busquemos.

8.- Compatibilidad y continuidad.

Las reglas establecidas por la especificación CSS-1 fijaron los estándares del diseño, y se mantienen y respetan en la CSS-2. Es de prever que en el nivel 3 sucederá lo mismo con respecto a su predecesor.

Pero lo realmente interesante es que los navegadores que no soporten CSS-3 no tendrán problemas a la hora de asimilar el contenido CSS puesto que siempre les quedará la compatibilidad de CSS-2, o la CSS-1 en su caso. La compatibilidad de las especificaciones CSS anteriores estará siempre garantizada.

9.- Estandarización frente a especificaciones propietarias.

La adopción de estándares por la W3C ofrece la ventaja de la compatibilidad del código entre los diferentes navegadores web. El uso de “soluciones propietarias”, como es el caso de muchas etiquetas o patrones usadas por Microsoft.

En su interpretación de lo que es y no es CSS, dificulta la creación de páginas web, porque supone tener que escribir dos códigos distintos para obtener un mismo resultado, en función del tipo de navegador que use el visitante.

El uso del estándar CSS de la W3C evitará visualizaciones incorrectas de nuestras páginas en distintos navegadores.

10.- Permite la diferenciación de estilos para imprimir / visualizar en pantalla.

El uso de CSS nos va a permitir también maquetar separadamente el contenido de nuestra web para ser mostrado en pantalla o para ser impreso.

Tengamos en cuenta que las necesidades y propiedades de un folio de papel y de un monitor nunca van a ser las mismas, y gracias a CSS podremos determinar cómo queremos que se imprima lo que mostramos en la pantalla, manteniendo siempre una apariencia limpia, ordenada y agradable visualmente.

Espero que estas pequeñas reflexiones hayan servido para animarte a dar el gran salto y vestir a tu web con un bonito traje CSS hecho a medida. Y si aún no te animas a usar CSS en tu sitio, te invitamos a conocer CSS Reinicia, una iniciativa que busca que sitios web en nuestro idioma se reinventen gracias a esta tecnología.

Crear un blog en Blogger

Para comenzar, iremos al sitio de blogger: http://www.blogger.com, donde nos encontraremos con la pantalla que vemos a continuación, y vamos a apretar el botón que dice CREAR TU BLOG AHORA.

Al presionar dicho botón, como veremos en la siguiente pantalla, nos encontraremos con un formulario para crear una cuenta de google.
¿Por qué una cuenta de google? Pues bien, blogger pertenece a google.
Entonces, si tenemos una cuenta de google accedemos a ella para evitarnos este paso de crear una cuenta; como podemos leer en la pagina de blogger: “Este proceso creará una cuenta de Google que podrá utilizar con otros servicios de Google. Si ya tiene una cuenta de Google, por ejemplo de Gmail, Grupos de Google u orkut, por favor primero acceda a ella.”
En caso de no tener una cuenta de google, no hay que preocuparse; el formulario es bastante simple y en el mismo explica que es cada cosa que debemos completar, así que completémoslo. Luego presionamos el botón de CONTINUAR.

Luego de eso, llegaremos a una pantalla donde dice “Asignar un nombre a su blog”, como vemos a continuación.
En el campo “Título del blog”, que será el título que aparecerá en tu blog; Este básicamente, es el nombre que se le quiere dar al blog.
En el campo “Dirección del blog (URL)”, será la dirección por la cual se podrá acceder a tu blog. Es recomendable comprobar la disponibilidad, haciendo click en el link que se ve allí; para no intentar varias veces con diferentes nombres.
Una vez completados estos campos, presionaremos el botón de CONTINUAR.

Ahora llegamos a una pantalla donde nos pide “Elegir una plantilla”. Aquí vamos a elegir la apariencia que va a tener nuestro blog; como pueden ver, hay muchos estilos para elegir. Así mismo, aquí, si presionamos sobre el link de vista preliminar, vamos a poder ver un ejemplo para poder decidirnos mejor. Si no te gusta ninguna de estas plantillas, mas adelante veremos como personalizarla o incluir una plantilla nueva.
Una vez que hayamos elegido el que más nos gusto, apretamos el botón de CONTINUAR.

Y al fin llegamos a la pantalla donde dice “Su blog se ha creado”. ¿Qué? ¿Ya esta listo? Pues si, así de sencillo es crear un blog en blogger. ¿No me creían?
Ahora bien, una vez creado el blog, es cuestión de publicar diferentes artículos; así que vamos a ver como funciona eso, haciendo click en el botón de EMPEZAR A PUBLICAR.

Publicar mensajes en Blogger

Si luego del tutorial anterior percibieron que crear un blog en blogger era muy fácil, es por que todavía no redactaron su primer mensaje; Obviamente, por que es mucho más fácil.
Como podemos ver en la pantalla a la que llegamos luego de presionar EMPEZAR A PUBLICAR, nos encontramos con una solapa donde dice “Creación de entradas”, luego tres opciones: Crear, Editar entradas y Moderar comentarios. Nosotros estamos situados en Crear, y debajo de eso podemos ver un formulario donde se puede ingresar él titulo de nuestra entrada; y luego el articulo que queremos redactar.
El lugar donde se redacta él articulo es un lugar donde se puede escribir (al mejor estilo “word”) y tiene una muy bella barra de herramientas donde podemos editar el formato, corregir ortografía, hasta añadir imágenes o videos. Por otro lado, también tenemos la opción de editar el articulo en formato HTML para los que deseen hacerlo.
Una vez redactado el articulo, podemos o bien guardarlo (para editarlo mas adelante) presionando el botón de GUARDAR AHORA; O bien publicarlo para que toda la gente que ingrese a tu blog pueda verlo presionando el botón de PUBLICAR ENTRADA.

Luego de publicar el mensaje, llegaremos a una pantalla donde nos dice “La entrada de tu blog se ha publicado correctamente”. Así de simple fue publicar un articulo en blogger.

Ahora si podemos ir a nuestro blog, presionando en el link que dice “Ver blog”, o bien utilizando la dirección que ingresamos al crear nuestro blog en donde nos pedían ingresar la “Dirección del blog (URL)”, podremos ver el blog con la plantilla (o template) que elegimos, y con el articulo que redactamos.
Adicionalmente podemos ver el archivo del blog, que es una recopilación de enlaces a entradas anteriores clasificados por año y mes; y también podremos ver datos personales del creador del blog.
Otra cosa importante que podemos ver, es que al final del blog, veremos un link que dice “Suscribirse a: Entradas ATOM”. Bien, esos son los RSS de tu blog, que si bien no es tan fácil de reconocerlos en la mayoría de las plantillas, blogger se encarga de crearlos automáticamente para ti.

Configurar Blogger

Bien, ya logramos tener nuestro blog, y ya sabemos publicar artículos; pero para ver mas a fondo como funciona blogger, vamos a ver los detalles mas interesantes de su configuración.
Si entramos a http://www.blogger.com, una vez logueados, vamos a poder ver como en la pantalla que tenemos a continuación, una lista con nuestros blogs y links para la edición de nuestro perfil.
En cada uno de nuestros blogs tenemos links para crear nuevas entradas; tanto como links para las 3 solapas principales de blogger: Entradas, Configuración y Diseño. Nosotros vamos a hacer click en el link de configuración.

Luego de hacer click allí, nos enviara a la configuración básica de nuestro blog. Allí no hay nada demasiado importante; pero si leen lo que dice en cada ítem de la configuración se entenderá a la perfección. Lo más destacable de aquí, es que si queremos eliminar nuestro blog para siempre; es aquí donde debemos hacerlo, al final de la configuración básica.

Si presionamos en el link de Publicación, podremos ver mas opciones de configuración. Esta pantalla simplemente sirve para cambiar la URL de nuestro blog; bien para cambiar nuestra dirección dentro de blogspot.com o para agregar nuestro propio dominio registrado.

En la solapa de Formato, la tercera que tenemos en configuración, podemos definir el formato de muchas cosas dentro de nuestro blog; Desde el formato de la fecha, hora, o el índice de nuestros archivos, hasta cuantas entradas queremos que se muestren en cada página. Cada ítem de la configuración aquí adentro esta bastante bien explicada; y si la leen con detenimiento no creo que sea necesaria una explicación mas profunda.

En la solapa de Comentarios, podremos configurar todo lo relativo a los comentarios que nos dejara la gente en nuestros post; Desde quienes están habilitados para dejarnos comentarios, hasta los vínculos de retroceso (mas conocidos como trackbacks) de los cuales hablaremos en algún post futuro; los cuales considero que son muy importantes en el ambiente de la blogosfera, por lo cual recomiendo que los actives.

La solapa de configuración de Archivo es bastante sencilla, y simplemente nos deja administrar la frecuencia con la que queremos que nos muestre los archivos, o sea, como van a estar clasificados; y también nos permite elegir la opción de que cada entrada tenga su propia pagina, lo cual es muy recomendable que sea así.

En los Feed del sitio, tendremos las opciones para configurar los RSS de nuestro blog, dejándonos decidir cuanto de cada articulo queremos que se almacenen en los feed; si usamos los feeds desde otra pagina, como FeedBurner, que es un aplicativo que explicaremos en algún otro articulo.

En Correo electrónico vamos a poder configurar un correo electrónico para poder recibir las entradas de nuestro blog a ese correo, también como vamos a poder configurar un correo desde el cual, mandándole un correo al mismo, vamos a poder enviar artículos que se publicaran en el blog.

Por ultimo, en la solapa de permisos, podemos agregar varios autores al blog, permitiendo que no solo nosotros, los creadores, podamos escribir en el mismo; y de esa manera hacer un blog comunitario entre mas de una persona. Adicionalmente, aquí, vamos a poder definir los permisos de quien va a poder leer nuestro blog; Lo más común es que cualquier persona pueda leer nuestro blog.

Ya con esto hicimos una breve repasada de toda la configuración de blogger; pero todavía no vimos como cambiar el diseño. Bueno, eso lo veremos a continuación.

Diseño en Blogger

Llegando al final del tutorial, esta es la tercer pestaña principal dentro de nuestro blog en blogger. Esta pestaña tiene cuatro subpestañas las cuales son: Elementos de página, Fuentes y colores, Edición de HTML y Selección de plantilla nueva.
En la primera de todas, Elementos de página, se puede ver un boceto de cómo es nuestro blog, donde podremos cambiar y acomodar de forma “drag and drop” (o sea, arrastrando las cosas) la fachada de nuestro blog de manera muy simple como vemos a continuación.

En la segunda pestaña, en Fuentes y colores, podemos cambiar de manera muy visual los colores de nuestro blog. Simplemente eso, miren:

Cuando vamos a la tercer pestaña, Edición de HTML la cual es la mas jugosa a mi parecer, podemos editar el codigo HTML de la plantilla que estamos utilizando; o bien subir alguna plantilla que podamos encontrar en internet (o creemos nosotros por nuestra cuenta).
Si desean buscar una nueva plantilla (o template) para su blog en blogger, yo les recomiendo que busquen en google, o bien en http://freetemplates.blogspot.com/ (esta pagina esta disponible en ingles).

Por ultimo, llegando al final de nuestro tutorial, nos encontramos con la opción de Seleccionar plantilla nueva. Esta opción es la misma opción que teníamos a la hora de crear nuestro blog. Simplemente elegimos alguna plantilla de las disponibles por blogger.

Si luego de leerte este tutorial te quedaron mas dudas acerca de blogger, sugiero que investigues por la ayuda de blogger, que esta en español y es bastante clara.
Ahora si ya no hay excusas para que te crees tu propio blog.

En este articulo, complementando nuestro articulo anterior ¿Qué es RSS y como usarlo?, presentaremos formas de hacer un mejor diseño, usabilidad y colocación de los iconos de RSS en un sitio web; haciendo una recopilación de muchos iconos de RSS que son de libre uso y se encuentran en la web.

Icono estándar de RSS

RSS se usa normalmente en los sitios que se actualizan frecuentemente, así cualquier usuario que este interesado en obtener rápidamente las novedades de ese sitio, puedan obtenerlas. Por lo tanto, es importante que los que visitan un sitio web puedan identificar rápidamente donde están los RSS del sitio. La forma de que un usuario reconozca rápidamente donde están los RSS de un sitio, es reconocer un patrón o una imagen que la identifique fácilmente; ese patrón a reconocer es actualmente el icono estándar de RSS, y por eso este icono es normalmente el mas utilizado para mostrar los mismos.

De todas formas, la web es un lugar ideal para la creatividad y los experimentos, por lo cual vamos a encontrar miles de variaciones y modificaciones al icono estándar que estamos observando. Los diseñadores creativos suelen encontrar soluciones espectaculares para agregar los iconos de RSS a sus diseños, haciendo que estos encajen perfectamente con la estética del sitio.

Ideas para los iconos de RSS

Aquí vamos a poner varias alternativas para los iconos de RSS (y algunas redes sociales), los cuales son bastante interesantes. Si te gusta alguno de estos para tu propio sitio, asegurate de leer las licencias de uso de los mismos antes de agregarlos a tu diseño.

En cambio, si sos diseñador grafico, esto puede ser de gran utilidad para tomar como punto de inspiración a la hora de crear tus propios iconos de RSS. Lo que si hay que tener siempre en cuenta, es que el icono debe ser siempre reconocible mas allá de los experimentos que se tomen a la hora de crear un icono novedoso.

Vallamos a los diferentes modelos de iconos que son poco comunes:

Aquí tenemos un hermoso icono dentro del hermoso sitio de webfruits (valga la redundancia) el cual no es muy común.

Un diseño espectacular para el icono en Dezinerfolio, el cual es atractivo y se encuentra en la parte superior de la pantalla.

En Xyberneticos encontramos un icono de RSS escondido, el cual se entiende muy bien; y gracias a su tamaño y ubicación resulta muy útil.

En Hongkiat podemos ver un icono de RSS azul, el cual se ajusta perfectamente a su diseño.

En Oilman seguimos viendo un icono azul en contraste con el naranja lo cual lo hace mas llamativo.

Aquí, en Bartelme, vemos unos diseños de iconos al estilo notepad.

Un simpático icono con patas en Vikiworks, que si bien esta muy al fondo, cuando llegas a el, es imposible no verlo.

Metalize tiene unos bonitos iconos escondidos que salen a verte cuando los estas seleccionando.

En Comingupforair están estos iconos sostenidos por unos niños. Muy atractivo.

Si bien el ultimo icono es muy grande, se puede ajustar el tamaño del dibujo (como se ve en el mismo blog de Comingupforair) para que no moleste al usuario. Los iconos de RSS deben ser siempre amigables para el usuario, no como el icono más grande del mundo.

¿Dónde incluir tus iconos de RSS?

El diseño mas lindo que puedas encontrar no servirá de mucho si el que visita la página no puede encontrar de forma fácil como suscribirse a tus RSS.

Algunos diseñadores ponen iconos gigantes en el medio de la página, otros ponen sus iconos de RSS en el final de la pagina (haciendo que los usuarios tengan que encontrarlo, y haciéndoles la tarea mas difícil).

La mejor posición para situar tus iconos de RSS es en la pare superior del sitio, lo mas cerca posible del logo de tu pagina. Mientras mas lejos del principio de la pagina este tu icono de RSS, menos suscriptores tendrás en la misma.

Adicionalmente, si los feed están declarados de forma correcta en el código fuente, la mayoría de los navegadores lo reconocerán y le ofrecerán al visitante la opción de agregarse a la suscripción de los RSS. De todas formas, aunque los navegadores puedan encontrar los RSS, agregar iconos visuales no solo sirve para que los visitantes se suscriban; sino que remarcan que la suscripción a los RSS esta disponible.

Como último comentario, se puede decir que la mejor opción a la ora de colocar estos iconos dependerá siempre del diseño que tengamos. No hay una formula mágica para hacerlos efectivos, y el diseñador tendrá que poner un poco de su imaginación para que estos sean atractivos a los usuarios.

Iconos RSS para descargar gratis

Aquí tendremos una lista de muchos iconos de RSS que se pueden encontrar libremente en la web. Todos estos iconos (tanto como este artículo) fueron elaborados gracias a la influencia de otras páginas de las cuales se pudo obtener mucha información.

• Iconos RSS gratis del tipo cristal.
  Set de iconos RSS en varios colores y con efecto cristal. 213 iconos, 8 tamaños, una gran variedad de formatos: AI(5), EPS (16), SVG(1), PNG (64), JPG (128).

• Feedicons
  34 iconos en 32*32 y 16*16 Pixeles – Formato PNG.

• Iconos RSS 3D
  1 Icono en 3D, en 4 tamaños diferentes. Por Dirceu Veiga.

• Iconos circulares
  4 variaciones circulares, en 4 tamaños.

  

• Iconos RSS gratis
  16 Iconos

• 30 Iconos vectoriales gratis

• Iconos RSS
  Aquí hay un solo icono en 8 tamaños.

• Iconos RSS para bloggers guitarristas
  Estilo de púa de guitarra. En formato PSD o PNG.

• Iconos RSS orbitales
  4 Iconos RSS “orbitales”.

• Iconos RSS
  4 Iconos por Valentina Olini

• Botones RSS estilo Web 2.0

• Iconos RSS
  Iconos en tamaño 256×256, 512×512, formato “.png”.

• Iconos RSS: Variaciones del estándar
  Varios templates de RSS por Dirk Metzmacher.

• Noticias RSS
  2 iconos RSS.

• Set de iconos de favoritos sociales
  12 iconos .png, dentro de los cuales hay un icono RSS.

• Paquete de iconos frescos
  Iconos .png, tamaño 256×256. Dentro del cual hay un icono RSS.

• Iconos con profundidad
  Iconos RSS con otra perspectiva. Paquete de Iconos 3D, dentro del cual hay un icono RSS.

• Favoritos sociales Web 2.0
  12 Iconos gratis del estilo “iphone” de favoritos de redes sociales. Dentro de ellos un icono RSS.

• Iconos Web 2.0
  Incluye iconos de tamaño de 48×48 y 32×32.

• WebFruits

Set 1

Set 2

• FeedIcons
  FeedIcons provee una serie completa de estándares de iconos RSS en casi todos los formatos: AI, EPS, SVG, PSD, PSD, PNG, JPG, GIF.

• Iconos RSS animados
  Iconos animados por Abdussamad.

• Icono RSS “Mis Circulos”

• Icono RSS con reflejo

• RSS Acido

• Iconos estilo sucio
  

• RSS Owl

• Iconos RSS Web 2.0

• Iconos RSS de la esquina
  Tamaños disponibles: 256×256, 128×128, 96×96, 80×80, 72×72, 64×64, 48×48, 32×32, 24×24, 16×16

• 51 RSS Icons for weblog

• Iconos 3D planos
  

• Iconos RSS a color por NewsNiche

• Icono RSS por Hopka

• Iconos RSS por StylishLab

• Iconos RSS alternativos por MouseRunner

• Icons RSS

• Coleccion de iconos RSS

• Iconos RSS de NewsFire

• Mini-Iconos RSS por xeddddyx

• Icono RSS por petemh

• Icono RSS Web 2.0 en PSD

• Paquete de Iconos RSS por graphix

• Iconos RSS navideños

• Iconos RSS de corazones

• Icono RSS Lector

• Iconos RSS por kurumizawa

• Iconos RSS por serega

Fuentes

Esta entrada no habría sido posible sin todos los recursos en los que consulte.
Vale aclarar que la misma es una adaptación (y traducción en ciertas partes) del articulo RSS: Best Design Practices And Icons ~ de Smashing Magazine (en ingles).
Otras de las fuentes que fueron consultadas para lograr este post fueron: RSS: kreative Icons für mehr Leser ~ de Dr. Web Weblog (en alemán), Free RSS Feed Icons, The Ultimate List ~ de Hongkiat (en ingles), Over 35 Different Styles of RSS Icons ~ de Design Bliss, tanto como de deviantART.