Archive for the ‘Blogs’ Category

BlogDay 2008: Feliz día del Blog

Sunday, August 31st, 2008

Bueno ha llegado el BlogDay 2008 y aquí les dejo los 5 blogs que me han parecido interesantes y ampliamente recomendables:

Palabras Textuales: Es un blog que recopila frases en donde lo absurdo es protagonista, situaciones en las cuales la falta de información hacen que personas pidan milagros.

Super Luchas: Blog y página oficial de la revista Super Luchas, es un blog que informa acerca de lo último que pasa en el mundo de la lucha Libre y Artes Marciales Mixtas, para fans del Wrestling.

Todo Series: Excelente blog dedicado a las series de televisión lo llevo leyendo desde hace mucho, muy bien organizado, y si te gustan los spoilers como a mí, entonces este blog podría interesarte.

Kozmica: Un blog personal de una estudiante Mexicana de diseño gráfico, hace poco sigo este blog pero me entretiene mucho leer sus posts, lo del diseño gráfico es algo que a mí no se me da, pero habla de diversos temas.

Kioner: Un Weblog de un programador empedernido (como muchos), escribe sobre casi cualquier tema, desde lo cotidiano, hasta cosas técnicas.

Feliz BlogDay 2008!

Recomendaciones para crear un WordPress Theme

Wednesday, June 11th, 2008

Bueno, básicamente cualquiera puede crear a su gusto un theme de WordPress, pero aquí les dejo las recomendaciones que para mi gusto son las más importantes, basándome en el diseño, accesibilidad, manejo, optimización (servidor) y SEO. Claro que en gustos se rompen géneros y cada uno puede elegir la apariencia que mejor le parezca a su blog, desde degradados, hasta diseños super minimalístas.

Me hubiera gustado mucho hacer este post con el nuevo diseño de este blog, lamentablemente por falta de tiempo (y sobra de trabajo) ha sido imposible terminarlo, incluso no he bloggeado en más de una semana ni siquiera twitteado :-( .

Para empezar.. los colores. ¿Qué colores usar? eso es muy importante y quizá sea la médula de un buen diseño. Yo recomiendo los colores claros, tenues, simples, sin tanto adorno. De hecho nos podemos guiar por los mismos colores que la naturaleza nos brinda.

Paleta Nature

La imagen de arriba contiene abajo colores que fueron tomados al azar de la misma fotografía y como podrán ver, el resultado son colores que se pueden combinar de muchas maneras para la elaboración de nuestro Theme de WordPress. Pueden ver más ejemplos de este tipo en este post (inglés) que contiene muchas más fotografías y paletas de colores.

Como dije anteriormente, en lo personal recomiendo usar colores tenues y contrastarlos con colores oscuros muy sutilmente. ¿Por que? Para resaltar lo importante, el diseño del contenido debe(ría) ser agradable para leer, y los títulos resaltarlos (no demasiado, no molesto).

El header, no voy hablar de como hacer un header, definitivamente eso es a gusto de cada uno, pero si hablare de las imágenes a usar en él. Usar imágenes moderadamente, de hecho lo mas livianas posible y de preferencia en .gif, que es un formato de imagen de muy poco tamaño que aunque también es de muy pobre calidad, en él perfectamente puede usarse los colores de la paleta de la fotografía de arriba. ¿Por que usar imágenes livianas? Para que cargue mas rápido, de hecho la mayoría de los bloggers posteamos gran cantidad de imágenes en cada una de nuestras entradas, si en portada tenemos 12 imágenes entre fotografías, screenshots y logotipos de buena calidad, el tamaño total de nuestro blog podría llegar a pesar demasiado, y si le sumamos el peso del header de gran tamaño pues podría resultar contraproducente para nosotros, recomiendo usar las imágenes del header con moderación y ¿Por qué no? también optimizar las imágenes que ponemos en nuestras entradas.

Las barras laterales (sidebar), lugares dedicados a la navegación y creo que el theme por default de WordPress Kubrick es un claro ejemplo del uso y diseño que debería tener. Las cosas que debes de poner en esa sección tu las decides, si quieres hacerlo dinámico, widgetizalo, ¿Como? Bueno la guía completa esta en el codex de WordPress (como todas las funciones y APIS que necesitas).

La siguiente estructura es la que debes de usar para tener un sidebar dinámico

<ul id=”sidebar”>

<?php if ( !function_exists(’dynamic_sidebar’)
|| !dynamic_sidebar() ) : ?>
<li id=”saluda”>
<h2>Seccion Saluda</h2>
<p>Hola mundo</p>
</li>
<li id=”despide”>
<h2>Adios mundo</h2>
<ul>
<li><a href=”http://www.wordpress.org”>WordPress</a></li>
</ul>
</li>

<?php endif; ?>
</ul>

solo falta registrar tu sidebar al archivo functions.php de tu theme

<?php
if ( function_exists(’register_sidebar’) )
register_sidebar(array(
‘before_widget’ => ‘<li id=”%1$s” class=”widget %2$s”>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h2 class=”widgettitle”>’,
‘after_title’ => ‘</h2>’,
));
?>

Como ya te habrás dado cuenta, en la función register_sidebar podemos especificar que mostrará antes y después del contenido de cada widget y de su título.

Si quieres ahorrarte un poco de memoria puedes incluir un contenido estático en esa sección, y para ahorrarte aún más, puedes usar algun plugin (es más deberías) para almacenar el contenido en cache WP-Cache, con esto aumentará un poco el tiempo de carga de tu blog :) .

La parte de la navegación es muy importante si quieres usar Breadcrumbs (Home -> Categorías -> Apple -> iPhone) que faciliten la navegación a tus visitantes web puedes instalar varios breadcrums plugins dedicados a esto.

Aplicando SEO puedes instalar un plugin para robots.txt que ayude a ignorar contenido duplicado (tags, categorías, archivos, búsquedas, etc).

La paginación puede resultar más fácil de lo que te imaginas, tus visitantes te lo agradecerán, les harás la lectura más fácil, y aunque WordPress incluye una función específica para esto en su código…

<div class=”navigation”>
<div class=”alignleft”>
<?php next_posts_link(’« Older Entries’) ?>
</div>
<div class=”alignright”>
<?php previous_posts_link(’Newer Entries »’) ?>
</div>
</div>

Puedes reducir un poco más el codigo (y aumentar su función) con un plugin muy sencillo escrito por Jaimie Sirovich.

<div class=”navigation”>
<?php
pager_fix(” “,” “,” “,”« Previous page”,”Next Page »”,”strong”);
?>
</div>

Mejor no? ;)

Los enlaces permanentes, yo recomiendo usar enlaces permanentes con esta estructura:

/%year%/%monthnum%/%day%/%postname%/

sin embargo, algunos bloggers insisten que la mejor es una más simple:

/%postname%/

en lo personal, creo que los visitantes saben solo con leer la url (incluso cuando se ven desde los resultados de google) de que fecha es el post, quizá busquen información reciente y la fecha en la url ayude a identificarla, pero dejemos que las Chicas SEO den su opinión al respecto.

Se me ocurren muchas otras cosas, pero continuaré hablando del tema cuando publique mi nuevo Theme, por cierto… estrenaré logo, un poco más patriótico.

Google Adsense y Comic Sans

Wednesday, June 11th, 2008

Ya se ha hablado mucho en la red de la tipografía de los anuncios mostrados por google, comic sans.

Pero bueno me ha tocado verlo, esperemos que esa tipografía no se vuelva la tipografía por defecto, por que realmente se ve muy, muy pero muy…. horrible.

Adsense Comic Sans

Adsense en Feeds: rentable?

Monday, June 2nd, 2008

De acuerdo al blog de feedburner propiedad de google, se anuncia que adsense en los feeds se implementara la próxima semana. Los términos y condiciones para los participantes (que en un principio serán pocos) será igual a la de adsense en web.

La pregunta es, ¿Será rentable? mi pronostico es NO ¿la razón?, simplemente creo que los lectores de los feeds los usan (me incluyo) por la comodidad de leer de un solo vistazo sin imágenes innecesarias, de una manera clara y limpia el contenido de la información (posts, noticias, alertas, etc). No creo que el mercado de adsense sea grande en este sector que busca comodidad y limpieza en la lectura.

Habrá que ver de que manera se imprimirán los anuncios en los feeds, aun cuando el diseño no sea del todo molesto, surgirán servicios para filtrar exclusivamente la publicidad en los feeds.

No cabe duda que Google se mete hasta en la sopa, en lo personal uso Google Reader, si empieza a llenarse de publicidad creo que me tendré que mudar de lector de feeds, y no es que esté en contra de la publicidad, para nada, pero me resulta sumamente cómodo leer lo que necesito y nada más, ya que mi trabajo no me deja mucho tiempo para andar navegando entre blogs que aunque tienen buen contenido, las imágenes y la publicidad de todo tipo se encargan de complicarme las cosas.

Solo resta esperar a ver el diseño de los anuncios y la manera en que se muestran.

Más iconos RSS

Monday, May 12th, 2008

Hace unos días hablaba de los estándares de los íconos en la web. Para aquellos que quieran tener un poco más personalizado el ícono RSS en sus aplicaciones Web, blogs o cualquier otro sitio que ofrezca un feed, aquí les dejo una colección de íconos RSS muy completa (y bonita).

RSS

RSS

RSS

Lista completa en Malevi4

Estandarizando los íconos en la web

Wednesday, April 30th, 2008

La mayoría de los bloggers usan íconos en sus blogs, rss, share this, etc., para hacer de la web un lugar más agradable y menos complejo.

Si cada quien inventara su propio ícono para sus feeds sin seguir un patrón resultaría difícil identificar de un solo vistazo el enlace directo a esta herramienta de sindicación.

El ícono del RSS fue introducido por Mozilla en su navegador Firefox invitando a adptarlo para usarlo en aplicaciones y sitios como manera de reconocer fácilmente los feeds.

Bueno pues hay una propuesta para seguir los estándares en los íconos web y así hacer de la web un lugar más facil de usar.

Open share icon

Me llamo la atención un ícono en particular, el “Open Share icon” que pretende sustituir al de sharethis. El ícono de sharethis tiene copyright, por lo tanto nace un nuevo ícono, que es libre y propone remplazar al anterior (sharethis).

Los principales motivos de este cambio:

Tabla diferencias

El ícono se puede descargar desde google groups en formato psd y ai.

Existen sitios destinados a ofrecer archivos para modificar estos íconos y adaptarlos a nuestros sitios.

Feed – http://www.feedicons.com/ Feed icon

OPML – http://www.opmlicons.com/ opml icon

Geotag – http://www.geotagicons.com/ Geotag

Tags, estructura de un website para SEO y consecuencia de mal uso de tags.

Wednesday, April 30th, 2008

Hace unos días leí un articulo en ChicaSEO recomendando utilizar tags HTML para mejorar la indexación de los robots de sitios de búsqueda.

El articulo hablaba sobre los tags HTML más importantes, entre los cuales destacaban los tags <title>, atributos keywords y description del tag <meta>, <strong>, <p>, <a>, <h1>, <h2>, <h3> y atributos alt y title

Seomoz nos ofrece un documento en formato PDF con las recomendaciones que a su experiencia ayudan a mejorar el posicionamiento.

En el documento hacen énfasis al número de links que es recomendable tener por página, así como al tamaño del html y al número de variables en una dirección URL, también nos aconsejan usar una estructura del tag <title>, la cual en lo personal lo veo sumamente productiva, ya que nos ofrece reconocer la parte de un sitio simplemente con ver su título. La estructura que recomiendan es la siguiente:

Website Title | Category > Subcategory – Item

Modificar el archivo .htaccess, así como usar un sitemap en formato XML exclusivo para robots y otros tips importantes se pueden apreciar muy bien en el documento.

Yo agregaría usar el tag <acronym> como complemento, aunque se que no es un tag protagonista como los antes mencionados, pero el mal uso de este tag perjudica la óptima indexación de nuestro sitio. En algunos foros y blogs no recomiendan usarlo y pronostican que se perderá en un futuro. Sin embargo mi opinión es que los tags <abbr> y <acronym> son tags que ofrecen que los lectores tengan una lectura más amena. W3C recomienda usar estos tags, sin embargo hay personas que tienen problemas para diferenciar su función y creo que es la principal razón por la cual los buscadores no tengan resultados óptimos en sus algoritmos con estos tags.

La diferencia entre <abbr> y <acronym> es muy simple:

<abrr>: se usa para denotar una abreviación, no hay vuelta de hoja. Ejemplo WWW

<acronym>: se usa para denotar un acrónimo. Un acrónimo son siglas que se leen como una palabra. Ejemplo ovni

El problema surge cuando aplicamos usar <abbr> y <acronym> como remplazo de paréntesis para tener una mejor apariencia.

Mal uso de <abbr> y <acronym> : El día de ayer actualicé mi blog bla bla bla

W3C deja muy claro el correcto uso de estos tags, y los robots de los buscadores se apegan (o deberían) apegarse a él. Es por eso que usar estos tags para fines distintos a los destinados ofuscan los resultados de la indexación web (aunque no es para tanto, pero se debería de usar correctamente).

Un tag que si me parece importantísimo es el tag <em> que en sirve para hacer énfasis a lo que contiene, en otras palabras, usa este tag para resaltar lo importante.

Usar los tags correctamente hace más fácil el trabajo a los robots y ayudamos a tener una blogsfera muy limpia al mismo tiempo que cumplimos los estándares webs.