Enlaces interesantes sobre diseño y desarrollo web
Hoy en día, con la cantidad de información que hay en Internet, ya no es necesario estar constantemente comprando libros para estar al día de los temas que a uno le interesan. De hecho, no es que no sea necesario, es que sería imposible pretender estar bien informado de algo contando únicamente con la ayuda de los libros que se publican, especialmente en temas relacionados con Internet y las nuevas tecnologías.
Aquí van, como referencia y sin ningún orden en particular, algunos enlaces útiles relacionados con el diseño y desarrollo de páginas web, para tener a mano y consultar.
La mayoría de estos enlaces los he ido publicando en Twitter, pero he pensado que estaría bien ir recopilándolos para poder acceder a ellos más fácilmente.
HTML5 for Web Designers
En 2010 A Book Apart publicó HTML5 For Web Designers, un libro conciso y fácil de leer especialmente interesante para entender la evolución de este lenguaje y conocer las posibilidades de la última versión, particularmente desde el punto de vista del diseñador web, ya que incluye consejos de utilización, novedades a nivel semántico, nuevas etiquetas y elementos, mejoras en formularios, etc.
Ahora el libro está disponible para leer online de manera totalmente gratuita:
http://html5forwebdesigners.com/
WhatFont: inspecciona fácilmente las tipografías de una web
WhatFont es una extensión para Google Chrome gracias a la cual podemos averiguar fácil y rápidamente las tipografías que vemos en cualquier página web, y encontrar información relacionada: tamaño, interlineado, color, etc.
Es mucho más rápido que utilizar Firebug o el inspector de Webkit. Además, detecta tanto fuentes comunes como servicios externos como Typekit o Google Web Fonts:
http://chengyinliu.com/whatfont.html
pShadow: sombras con jQuery
Con esta extensión de jQuery podemos añadir sombras a cualquier elemento HTML. Funciona en los navegadores principales y se puede usar libremente.
Como se ve en la página de demostración, las sombras que consigue pShadow son bastante convincentes, aunque lo que hace esta extensión es añadir una imagen de la sombra en PNG en la parte inferior del elemento y posicionarla mediante Javascript, no crear la sombra en sí:
http://www.matthewdawkins.co.uk/2011/10/pshadow-a-jquery-extension-for-gorgeous-drop-shadows/
Cursos de programación online con Codecademy
Codecademy es un servicio de aprendizaje online. A través de su web nos ofrece cursos de programación con los que podemos aprender a programar de forma gratuita, interactiva y entretenida directamente desde el navegador.
Hace unos días publiqué un pequeño artículo sobre Codecademy, por lo interesante que me pareció:
https://www.danielnabil.com/blog/cursos-programacion-online-codecademy/
Herramientas SEO gratuitas de Google
Un estudio de las principales herramientas y aplicaciones gratuitas enfocadas al posicionamiento en buscadores que Google pone a nuestra disposición para analizar, monitonizar y optimizar el posicionamiento en buscadores de una web.
En esta lista se habla de Google Analytics, Alerts, Insights for Search, Webmaster Tools, Trends, Adwords Keyword Tool, Website Optimizer y algunas herramientas más:
http://blueblots.com/tools/google-seo-tools/
Animatable, galería de animaciones CSS
Animatable es una guía de transiciones CSS básicas en la que podemos ver, desde una misma página, varios tipos de animaciones y la gran cantidad de posibilidades que ofrece CSS a través de una solo propiedad. Es una buena manera de ver cuales son las propiedades que permiten animaciones.
Lógicamente, estas transiciones solo funcionan en los navegadores en los que está incorporada esta tecnología:
Permalink
Muy interesante. He encontrado tu web buscando temas de wordpress y me me parece muy bueno tu trabajo.
Yo estoy empezando a utilizar wordpress para realizar webs para empresas, pero tengo muchas preguntas sobre todo a la hora de personalizar o retocar temas y todo lo que se refiere a derechos de copyright y demás…Quizás podrías publicar una entrada hablando un poco de esto
Un saludo
Permalink
Hola Javier.
Muchas gracias! Me apunto el consejo para futuras entradas…
Permalink
Gracias por el primer enlace, lo he encontrado bastante interesante.
Javier yo suelo utilizar wordpress para todo, wordpress nunca deja de sorprender.
Permalink
Estoy buscando alguna extensión que añada un borde de color sobre la imagen de perfil del usuario, dependiendo de su rol.
Alguna idea?
Permalink
Tal vez bastaría incluir unas líneas de CSS en los archivos del tema, o con algún plugin como Simple Custom CSS. Algo así:
.editor img { border: 2px solid orange; }