Emoticonos en una página web

Estuve buscando soluciones para poder añadir emoticonos a una página web, concretamente para este weblog, tanto en las entradas como en los comentarios. Quería que fuera una solución de cliente, en javascript, ya que no quiero que el html generado incluya los emoticonos de ninguna manera.

Encontré dos soluciones:

La primera, llamada CSS Emoticons, es la más sencilla y tiene un soporte para emoticonos muy básico. Como ventajas tiene que es una solución pura CSS, no utiliza imágenes. De hecho, realmente lo que hace es girar realmente el texto mediante css, y meterlo en un circulo amarillo. Tiene además un efecto muy curioso: cuando se pasa el ratón por encima (por lo menos en Chrome), el emoticono se anima convirtiéndose en el texto original. Por ahora es la que he utilizado en el weblog. Aquí lo podemos ver en funcionamiento en un codepen:

See the Pen XJoGRR by Juanjo Navarro (@juanjonavarro) on CodePen.

La segunda, llamada emojify.js, es una librería más potente. Como desventaja tiene que se basa en imágenes, que se tienen que cargar de una manera u otra. Como ventaja tiene que la calidad gráfica de los emoticonos es mayor y además tiene mayor variedad, con objetos, vehículos y hasta la caca con ojos. De hecho, se puede usar cualquiera de los emoticonos estándar (sí, hasta para esto hay estándares :-) ). Aquí lo podemos ver en funcionamiento:

See the Pen EaGMvv by Juanjo Navarro (@juanjonavarro) on CodePen.