ivanprego.com | Diseño y desarrollo web

Themes para WordPress gratis con diseño adaptativo (Responsive Web Desing)

Publicado el 17 mayo, 2013 por Iván Prego

WordPress pasa por ser el CMS por excelencia para sitios web hoy en día, al igual que el diseño adaptativo la solución ideal para el diseño multidispositivo.

La filosofía en la que está basada la estructura de WordPress, separando la lógica del CMS y la visualización, a base de themes personalizables nos permite fusionar las ventajas de ambas soluciones seleccionando temas para wordpress que incorporan el diseño adaptativo como funcionalidad.

Themes de Alienwp.com

Alienwp.com es una empresa que se dedica profesionalmente a la creación de themes y plugins para WordPress. Entre ellos podemos encontrar un par de ellos gratuitos de gran calidad.

Origin es un theme gratuito con diseño adaptativo y minimalista ideal para sitios de moda o recetas de cocina.

Oxygen es otro de los temas que ofrecen gratuitamente. Su diseño, fluido y adaptativo es ideal para sitios con una estructura compleja y gran cantidad de contenidos. Mantiene la misma limpieza de diseño que Origin pero con una mayor cantidad de formatos y secciones en su portada.

Themes de Designwall.com

Designwall está especializado en la creación de temas para WordPress orientados a revistas digitales. Sitios con una gran cantidad de contenido en sus portadas y una buena estructura jerárquica de la información.

WallPress es un theme para WordPress orientado a una revista digital con una presentación basada en una rejilla muy bien estructurada que resulta ideal para un sitio web con gran cantidad de contenido en portada e incluso para una tienda en línea. Una maquetación pulcra, funcional y limpia, unida a su diseño adaptativo lo convierten en una magnífica solución para este tipo de funciones.

Themes de mythemeshop.com

Mythemeshop es una tienda de temas para WordPress con una gran número de themes especializados. Entre sus opciones, ofrece una sección de descarga gratuita en la que podemos encontrar un par de buenas opciones.

Playbook es un tema para WordPress multipropósito con una estética cuidada que requiere ser algo prudente en su uso. Es perfecto para sitios de viajes o para aquellas webs en las que siempre acompañemos nuestras entradas con una imagen.

JustBlue pone el diseño adaptativo en manos de cualquier bloguero. Su layout dispuesto en modo lista es perfecto para un blog en el que la jerarquía de la información la marca su fecha de publicación.

Themes de Wpexplorer.com

Wpexplorer.com es otro proveedor de productos para WordPress en el que podemos encontrar tanto themes como plugins para el popular CMS. Cuenta con un directorio de temas gratuitos para WordPress que no podemos dejar de visitar.

Photo es un theme para WordPress con diseño adaptativo ideal para crear un portfolio fotográfico o un diario de viajes basado en fotografías.

Adapt es un theme para WordPress con diseño adaptativo perfecto para un sitio web corporativo. Su diseño limpio es ideal para personalizar su estética y su estructura, perfecta para este tipo de funciones.

Themes de Northeme.com

Northeme es una empresa especializada en la realización de themes adaptativos para WordPress y que nos ofrece uno de ellos gratuitamente.

Workality es otro tema con diseño responsive ideal para la creación de un portafolio de trabajos de diseño gráfico, fotografía, etc…

Themes de Dessign.net

Los themes de dessign.net son, en general, muy visuales. Con un gran contenido de imágenes, están orientados fundamentalmente a la creación de portfolios, catálogos en línea y sitios web corporativos. Entre los muchos temas premium que ofrece, permite descargar unos cuantos themes para WordPress gratuitos de gran calidad.

Unique es un tema orientado a blogs con una presencia fotográfica relevante. Se presenta con la típica ordenación jerarquizada por fecha de publicación pero con un espacio muy relevante dedicado a las imágenes de cada entrada.

architekt, basado en una cuadrícula de imágenes muestra una presencia fotográfica impactante. Su diseño adaptativo parece orientado a sitios de viajes o blogs fotográficos también parece interesante pasa sitios web corporativos.

Publicado en Diseño adaptativo, Diseño web, Wordpress | Deja un comentario

Google Tag Manager: implementa Google Analytics de forma sencilla

Publicado el 11 mayo, 2013 por Iván Prego

Google Analytics pasa por ser la herramienta estándar de analítica web. Aunque cuenta con una versión profesional, la potencia de su versión gratuita la convierte en la solución preferida de muchos sitios de tamaño medio.

La implementación de Google Analytics en nuestra web pasa por insertar una serie de etiquetas en nuestras páginas y, en muchas ocasiones, convive con los tags de otros proveedores: redes publicitarias, analítica especializada, etc.

La analítica es algo vivo y en muy raras ocasiones una primera implantación resulta suficiente durante un largo período de tiempo. Medir eventos, crear embudos de conversión… son procesos que van surgiendo a medida que nuestro nivel de analítica madura o nuestra página web crece. Es en ese momento en el que nuestras etiquetas de analítica se convierten en interminables líneas de código en las que realizar cambios se traduce en un proceso complejo y poco práctico.

Google Tag Manager: La interfaz de etiquetado de Google Analytics

Google Tag Manager se muestra como la solución de Google para implementar de manera sencilla nuestras etiquetas de Google Analytics, además de servir de contenedor para otros proveedores que requieran una “instalación” similar.

Una de las facetas más interesantes de Google Tag Manager es la de ofrecer una interfaz gráfica para la configuración de los distintos parámetros de Google Analytics. Lo que antes suponía un cambio en el código que incluíamos en nuestras páginas ahora se convierte en una nueva versión de nuestra etiqueta, publicada a través de Google Tag Manager, y totalmente transparente para el código de nuestra página.

Esta ventaja se multiplica si tenemos en cuenta que los distintos cambios que realizamos quedan inmediatamente disponibles en todas las páginas en las que tenemos insertado Google Tag Manager. Además, cada cambio realizado queda disponible, ya que los conserva en versiones, con lo que podemos volver atrás a cualquier implementación simplemente republicando la versión anterior.

Google Tag Manager no se ofrece como un sistema cerrado a productos de Google. Más bien al contrario. Ofrece plantillas predefinidas para añadir fácilmente las etiquetas de otros proveedores, algunos tan conocidos como Comscore o AdAdvisor.

En definitiva, Google Tag Manager facilita la configuración y la gestión de las múltiples etiquetas que usamos en nuestros sitios web para monitorizar o implementar la analítica web, los proveedores publicitarios u otras etiquetas de nuestras páginas.

Publicado en SEO, tools | Deja un comentario

Presentaciones a distancia y multidispositivo con presentation.io

Publicado el 7 mayo, 2013 por Iván Prego

Cuando tenemos que hacer algún tipo de presentación, casi siempre tenemos que pasar por distintas peripecias para que todo salga bien. Aunque el Mac suele ser bastante fiable (si llevamos con nosotros un adaptador a VGA o HDMI), no podemos arriesgarnos a hacer perder el tiempo a nuestra audiencia o causar una mala impresión por falta de previsión.

Siempre conviene llevar algún tipo de copia de nuestra presentación en un formato estándar, como PDF, para poder usar cualquier otro equipo para reproducir nuestra presentación. Tampoco viene mal llevar una fuente de conexión a la web alternativa, como un pincho o la propia conexión de nuestro smartphone, y para los más prudentes, una copia local de los recursos online que queremos mostrar en la presentación.

Otra de las dificultades que nos podemos encontrar es que algunos de los asistentes no puedan presenciarla en vivo y pretendan asistir en línea o visualizarla en su propio dispositivo.

Presentation.io, lleva tus presentaciones a la nube y hazlas multidispositivo

Presentation.io nace para resolver todos los problemas que puedan surgir. Su funcionamiento se basa, fundamentalmente, en subir nuestras presentaciones a la nube para poder mostrarlas o seguirlas desde cualquier tipo de equipo que cuente con un navegador, ya sea un ordenador de escritorio, un tablet o un teléfono móvil.

La comodidad del sistema es evidente pero quedaría un tanto coja si no contase con funcionalidades añadidas muy interesantes. En primer lugar, podemos crear una presentación pública o privada, de manera que al subir nuestros archivos al sistema no quede abierta a que cualquier usuario pueda ojearla.

Además, permite activar la presentación en línea y compartirla con nuestros asistentes virtuales. A medida que avanzamos y pasamos las diferentes diapositivas, los asistentes virtuales seguirán de manera automática el avance de nuestra exposición.

Presentation.io cuenta, además, con opciones para poder crear una presentación más dinámica, pudiendo realizar anotaciones en las distintas diapositivas o poniendo a nuestra disposición un chat para fomentar la participación.

La posibilidad de seguir en vivo una presentación desde cualquier lugar y en cualquier dispositivo es, tal vez, la función más interesante de Presentation.io, una alternativa más que interesante a trasladar físicamente nuestros archivos Keynote o PowerPoint al centro en el que realizaremos nuestra charla.

Publicado en Utilidades | Deja un comentario

Descargar e instalar Windows 8 en tu Mac, fácil y gratis

Publicado el 3 mayo, 2013 por Iván Prego

En muchas ocasiones los poseedores de un Mac necesitan instalar Windows por diversos motivos, ya sea para usar algún programa disponible únicamente para Windows o, como es mi caso, para probar diseños web en Internet Explorer.

Una de las formas más sencillas de instalar Windows o cualquier otro sistema en un Mac es mediante software de virtualización, es decir, un programa que permite crear sistemas virtuales en nuestro propio equipo para hacerlos “compatibles” con todos los sistemas que necesitemos.

Aunque existe una gran cantidad de software de virtualización que nos permitiría instalar Windows en el Mac, como VMWare o Parallels, en este caso vamos a recomendar Virtualbox, por su calidad, facilidad de uso y el hecho de que se trata de una solución totalmente gratuita.

Paso 1: Instalar Virtualbox en tu Mac

El primer paso para instalar cualquier versión de Windows en nuestro Mac mediante esta vía pasa por instalar Virtualbox en nuestro sistema.

En su página de descargas, procederemos a bajar Virtualbox para OS X y, una vez en nuestro equipo, lo instalaremos como si de cualquier otro software se tratase.

Paso 2: Descargar la versión de Windows para nuestro Mac

Microsoft pone a disposición de los desarrolladores la posibilidad de descargar gratuitamente cualquiera de sus sistemas, de manera que podemos bajarnos la versión de Windows que necesitemos para ejecutarla en nuestro Mac.

Si nos dirigimos a la página de desarrollo de Internet Explorer 10 veremos una franja en la que bajo el epígrafe “Download a Virtual Machine” podemos desplegar un selector en el que elegir el sistema operativo deseado que usaremos, en este caso Mac, y en el segundo selector el software de virtualización que emplearemos, Virtualbox para Mac.

Tras la selección podremos descargar los distintos sistemas de manera totalmente gratuita:

Windows 8 con Internet Explorer 10
Windows 7 con Internet Explorer 10
Windows 7 con Internet Explorer 9
Windows 7 con Internet Explorer 8
Windows Vista con Internet Explorer 7
Windows XP con Internet Explorer 8
Windows XP con internet Explorer 6

Centrémonos en Windows 8 y Windows 7. Simplemente tenemos que bajar cada uno de los archivos en los que dividieron la descarga, uno de ellos con la extensión sfx, y varios, dependiendo de la versión, con extensión rar.

Paso 3: Instalar Windows en Mac: La forma más sencilla

Una vez descargados los archivos, procederemos a instalar Windows en nuestro software de virtualización para poder ejecutarlo en nuestro Mac.

Para ello tenemos que situarnos en la carpeta en la que hayamos descargado los archivos y ejecutar una ventana del terminal de Mac OS X.

Una vez en el terminal ejecutaremos el siguiente comando:

chmod +x MacVirtualBox.part1.sfx

1	chmod +x MacVirtualBox.part1.sfx

Posteriormente descomprimiremos e instalaremos el sistema en nuestro Virtualbox escribiendo, de nuevo en el terminal:

./MacVirtualBox.part1.sfx

1	./MacVirtualBox.part1.sfx

Bien, ya tenemos el sistema Windows en nuestra Mac en forma de fichero con extensión ova, ahora tenemos que importarlo dentro de Virtualbox para poder ejecutarlo.

Paso 4: Ejecutar Windows en Mac con Virtualbox

Lo único que hemos de hacer es abrir Virtualbox e importar la máquina virtual Windows en él.

Para ello nos dirigimos al menú superior de Virtualbox, Archivo, y pulsar la opción “Importar servicio virtualidado”. Seleccionaremos el archivo que descomprimimos en el paso anterior (con extensión ova) y esperamos a que el proceso concluya.

Una vez terminado este paso ya tenemos nuestra versión de Windows 8 lista para ejecutarse en nuestro Mac. Con sólo pulsar sobre ella y posteriormente sobre “Iniciar” ya estaremos disfrutando –si lo podemos definir así- de una versión de Windows plenamente funcional en nuestro OS X.

Windows 8 ejecutándose en Mac mediante Virgualbox

Paso 5: Modificar la configuración de Virtualbox para ejecutar Explorer 10 en el Mac

Si como es mi caso, lo único que se pretende de Windows es la posibilidad de ejecutar Internet Explorer 10 para probar vuestros diseños web, sería interesante cambiar la configuración por defecto de la máquina virtual. Tal como os aparecerá instalada, tiene asignados dos gigas de RAM que, lógicamente, se restan a los que tenéis disponibles en el sistema. Para ejecutar Internet Explorer 10 en vuestro Mac, un giga es más que suficiente. De esa manera dispondréis de más memoria para que la ejecución de Windows en OS X no merme demasiado el rendimiento del sistema.

Windows 8 ejecutándose en un Mac con Virtualbox

Publicado en Apple, Mac | 3 comentarios

Herramientas para crear prototipos de tus aplicaciones móviles

Publicado el 30 abril, 2013 por Iván Prego

Aunque todos los trabajos de diseño han de hacer especial hincapié en la usabilidad, en la creación de sitios móviles el diseño de interacción centra gran parte de los esfuerzos de los diseñadores o de los expertos en experiencia de usuario.

Cuando diseñamos sitios web o aplicaciones móviles en las que la interacción del usuario con el diseño compromete especialmente el éxito del sitio –si no lo hace siempre– el prototipado es una fase de desarrollo que no nos podemos saltar aunque contemos con mucha experiencia a nuestras espaldas.

Aunque creo que un sitio web o el desarrollo de una aplicación móvil es un trabajo constante de construcción de prototipos y mejoras hasta llegar al resultado final, es bueno establecer un punto de partida base sobre el que empezar a desarrollar. Existen varias herramientas que nos ayudarán a sentar las bases del proyecto.

Codiga: Crea prototipos de aplicaciones móviles con HTML5 y jQuery Mobile

Codiga tiene una de sus fortalezas, precisamente, en la tecnología usada para la creación de sus prototipos móviles. Todos los elementos que gestionamos para crear prototipos (botones, selectores, barras deslizables…) están construidos con HTML5 y jQuery Mobile, lo que implica que una vez generado nuestro proyecto podemos aprovechar el código y el tiempo empleado en la creación de nuestra aplicación móvil. Gratuitamente podemos gestionar un único proyecto con un máximo de tres pantallas. Suficiente para evaluar Codiga o para pequeñas demos iniciales.

Fluid: Creando prototipos para iOs, Android y Windows 8

Tal vez lo más destacado de Fluid sea su extensa librería de elementos personalizados para las plataformas móviles más populares: iOS, Android y Windows 8.

Otros puntos fuertes de Fluid son su capacidad para el trabajo en equipo (facilitando el flujo de tareas) y la facilidad con la que podemos enviar nuestros prototipos a distintos dispositivos para probarlos en su entorno habitual.

La cuenta gratuita permite generar un proyecto con diez pantallas, pudiendo compartirlo de manera ilimitada y probarlo en las distintas plataformas objetivo –iOS, Android o Windows 8– también sin restricción.

Proto.io: Crea prototipos de aplicaciones para cualquier dispositivo

Proto.io cuenta con las funcionalidades necesarias y comunes a este tipo de herramientas, pero una de las cualidades que lo hacen destacar es la posibilidad de crear tu propio entorno de desarrollo para dispositivos no soportados por defecto. Smart Tvs, consolas de videojuegos, sistemas de navegación, relojes inteligentes, etc. Simplemente define la resolución de la pantalla y crea una plantilla de diseño. Ya puedes empezar a crear prototipos de tu aplicación para ese dispositivo.

Por lo demás, Proto.io, permite probar nuestros prototipos en distintos sistemas operativos móviles y trabajar en equipo con otros miembros de nuestro grupo de desarrollo.

Con la cuenta sin coste podemos crear un proyecto con cinco pantallas, aunque nos limita la exportación del HTML resultante, así como compartir el proyecto o imprimirlo y exportarlo. En cualquier caso, podemos probar cualquier plan de pago por 15 días.

Publicado en Diseño web | Deja un comentario

Typetester: Compara tipografías para tu diseño web

Publicado el 27 abril, 2013 por Iván Prego

Hace tiempo que conocía typetester. Aunque la encontraba útil el limitado número de fuentes que podía usar en el diseño de páginas web (web safe fonts) hicieron que quedara algo aparcada en mi cabeza.

Actualmente, con la aparición de CSS3 y la cantidad de servicios que facilitan el uso de web fonts su funcionalidad vuelve a parecerme interesante.

Typetester un aliado para el uso de tipografías en la web

La mayoría de los servicios que han nacido alrededor del uso de tipografías web nos proveen de fuentes y las distintas versiones de archivos que aseguren su compatibilidad con los distintos navegadores existentes. Algunos, como Google Web Fonts, alojan dichos archivos y nos proveen del código necesario para su inclusión en nuestras páginas.

Esto cambia si nos referimos a Typecast, que ofrece unas funcionalidades orientadas tanto a la implementación, como al diseño visual de nuestra web usando tipografías web.

Typetester pone énfasis en el factor visual. Nos ayuda a diseñar y seleccionar, mediante comparación, la colección de tipografías mas adecuada para nuestro proyecto.

Nos encontramos con 3 columnas con diversos párrafos de texto independientes, que renderizan las distintas variantes de la tipografía seleccionada. Para cada columna podemos elegir una fuente distinta y observar visualmente las diferencias en cuanto a estética y legibilidad que nos proporciona cada elección.

Typetester pone toda la potencia de las hojas de estilo en cascada en nuestras manos, pues no sólo podemos seleccionar una tipografía determinada, sino que podemos modificar los múltiples parámetros que los CSS poseen con respecto al uso de web fonts:

Tamaño
Alineación
Espacio entre palabras
Interletrado
Interlineado
Color de fuente y fondo
etc.

En definitiva, Typetester puede ser un gran (y gratuito) aliado a la hora de seleccionar entre el numeroso catálogo de tipografías web actual. Algunas características extra, como la posibilidad de marcar un tamaño de fuente por defecto y asignar a las distintas columnas tamaños relativos, nos ayudarán en nuestros trabajos de diseño web adaptativo, algo que muchos apreciamos enormemente. ¡A probar Typetester!

Publicado en Diseño web, Webfonts | Deja un comentario

Desarrollar aplicaciones para iOS y Android con HTML5, CSS y Javascript

Publicado el 23 abril, 2013 por Iván Prego

Últimamente el trabajo me está llevando a encaminar mis esfuerzos en documentarme e investigar algo más sobre el desarrollo de páginas web para dispositivos móviles. Ya sea mediante diseño adaptativo, o aplicaciones nativas para las distintas plataformas, es evidente que la movilidad ocupará un porcentaje importante del tiempo de desarrollo de los diseñadores de páginas web.

Aunque estoy convencido de que el diseño adaptativo y la tecnología HTML5 eclipsarán el boom de las aplicaciones móviles nativas, en algunos casos los límites de las tecnologías web hacen que tengamos que recurrir a ellas si queremos usar intensivamente los recursos de los dispositivos móviles.

En otros casos, la creación de aplicaciones nativas es una cuestión meramente estratégica. Presencia, prestigio o ciertas ventajas a la hora de la comercialización de una aplicación como producto son algunos de los motivos que justifican el uso de las plataformas oficiales que nos bridan los distintos sistemas, la App Store o Google Play. Lo cierto es que existen recursos que nos permiten seguir desarrollando aplicaciones con estándares web, HTML5, CSS, etc. y tener presencia en las tiendas sin obligarnos a enfrentarnos a un nuevo proyecto.

Creando aplicaciones nativas con estándares web

Tras el éxito de la tienda de aplicaciones de para iOS comenzaron a nacer herramientas de desarrollo de aplicaciones ajenas a Apple y que los californianos vetaron durante un período de tiempo. La prohibición iba encaminada, especialmente, –eso creo yo– a limitar la creación de programas para el iPhone y el iPad mediante Adobe Flash. Actualmente es posible este tipo de herramientas sin saltarse los estrictos términos de uso de la App Store, y eso abre la posibilidad de emplear alguno de estos frameworks de desarrollo para crear aplicaciones con tecnologías web y “empaquetarlas” como una app nativa que pueda ser publicada en la tienda oficial de Apple.

Lo bueno de este tipo de herramientas es que no solo se ciñen al canal de distribución de aplicaciones de iOS, la App Store, sino que, además, permiten hacerlo para Google Play a partir de la misma base.

Esto abre a los desarrolladores web la posibilidad de crear aplicaciones nativas usando las tecnologías que dominan (HTML, CSS y Javascript) y hacerlo para múltiples plataformas sin realizar una adaptación específica.

Adobe PhoneGap: Empaqueta tu HTML5, CSS y Javascript como aplicación nativa

Tal vez una de las más conocidas, PhoneGap permite empaquetar tu código como aplicación para distintas plataformas: iOS, Android, Blackberry, Windows Phone, etc…

Fundamentalmente PhoneGap pone a nuestra disposición una serie de librerías que, incrustadas en las plataformas de desarrollo de cada uno de los fabricantes (SDK’s), permiten programar a través de su API funcionalidades del SDK nativo.

Si queremos distribuir nuestra trabajo en distintas plataformas, construiremos una aplicación nativa para una de ellas con la ayuda de Phonegap y luego, usando el mismo código base, la portaremos a las restantes con la ventaja de mantener el mismo código base creado usando las tecnologías HTML5, CSS3 y Javascript.

Icenium: Tu plataforma de desarrollo en la nube para crear aplicaciones iOS y Android mediante HTML5, CSS y Javascript

Una de las facetas más interesantes de Icenium es que hace que nos olvidemos de las SDK’s de cada una de las plataformas. Mediante su propio IDE de desarrollo podemos crear aplicaciones usando estándares web (como HTML5 o CSS) y publicar directamente en las distintas tiendas de aplicaciones a través de un sencillo paso a paso.

La ventaja de Icenium con respecto a PhoneGap radica precísamente en esa funcionalidad. Un único entorno (Icenium Mist), al que podemos acceder desde cualquier navegador, y una publicación directa de nuestra app simplemente seleccionando la plataforma deseada (Android o iOS).

AppCelerator: Conectando tu aplicación nativa a la nube con node.js

AppCelerator, al igual que Icenium, posee su propio IDE de desarrollo, mediante el cual podemos programar funcionalidades comunes a las distintas plataformas sin tener que crearlas de manera específica y en lenguajes diferentes. Una de las cualidades más interesantes de AppCelerator es lo fácil que resulta conectar nuestras aplicaciones con distintas fuentes de datos mediante sus servicios personalizados de conexión con node.js.

Aunque requiera hacerse con la plataforma y su funcionamiento, AppCelerator ofrece funcionalidades muy interesantes con su sencilla forma de integrar la información de múltiples servicios en nuestras aplicaciones.

Publicado en CSS, HTML, iPad, iPhone, Javascript, Programación | 1 comentario

SEOstats: La librería de PHP para obtener métricas SEO

Publicado el 21 abril, 2013 por Iván Prego

Todos los profesionales que se dedican al posicionamiento web basan su estrategia en un profundo conocimiento sobre cómo funcionan los buscadores (estudio), la aplicación de distintas técnicas centradas en sacar partido a dichos conocimientos (acción) y el posterior análisis de los resultados obtenidos (medición).

Medir los resultados de nuestras acciones es de vital importancia, pues el proceso cíclico de estudio, acción y medición tiene un alto componente de experimentación.

Aunque el propio Google pone a nuestra disposición herramientas para facilitar los distintos procesos, como Google Analytics o Google Webmaster Tools, es muy posible que existan datos valiosos que nos permitan medir de una manera más eficiente nuestros resultados y, por lo tanto, actuar en consecuencia.

SEOstats información de valor para “medir” nuestro posicionamiento

SEOstats es una librería de PHP que nos permite obtener distintos valores procedentes de diversas fuentes y construir nuestro dashboard personal de métricas SEO. PageRank, resultados en SERPS, velocidad del sitio, etc., son algunos de los datos que SEOstats recoge de distintas fuentes como Alexa, Google o SEMRush.

Publicado en Programación, SEO | Deja un comentario

Diseño adaptativo en WordPress: themes basados en el framework Bootstrap

Publicado el 17 abril, 2013 por Iván Prego

Bootstrap es uno de los framewors de diseño adaptativo más usados, en parte, debido a que fue creado para ser el soporte de diseño de la conocida red social Twitter.

La popularidad de Bootstrap como framework de diseño adaptativo ha provocado que sea la base de otros muchos desarrollos. Algunos de las “evoluciones” más interesantes son aquellas que unen WordPress y el diseño adaptativo, dos de las tecnologías más usadas por los diseñadores web. Los frameworks de diseño adaptativo nos aportan la estructura de diseño y el código HTML y CSS que la soporta y WordPress la lógica y un CMS para gestionar nuestro sitio. En el caso de querer usar Bootstrap en nuestros desarrollos con WordPress necesitaríamos añadir la lógica de WordPress a nuestras maquetas, lo que supondría un trabajo extra considerable.

Para ahorrarnos esa labor, varios desarrolladores han adaptado Bootstrap a themes de WordPress, eliminando la tara adicional de implementar nosotros mismos esa integración.

Themes para WordPress basados en Bootstrap

Si nuestra intención es crear su site en WodrPress con diseño web adaptativo merece la pena echarle un vistazo a alguno de estos desarrollos gratuitos:

Publicado en Diseño adaptativo, Diseño web, Programación, Wordpress | Deja un comentario

Aprender a programar gratuitamente con Codeacademy

Publicado el 14 abril, 2013 por Iván Prego

Recientemente escribía sobre cómo aprender a programar a tu ritmo. En concreto, recomendaba CodeSchool y Treehouse por la calidad de sus cursos y la riqueza de recursos que ponen a nuestra disposición.

Ambos sistemas, pese a ofrecer un período gratuito, son servicios de pago y orientado a personas que poseen, al menos, una base previa sobre la que comenzar a trabajar.

Aprende las bases de la programación con Codeacademy

Codeacademy propone un sistema igual de rico que los anteriores, pero ofrece cursos básicos en los que empezar a desarrollar conceptos de programación sencillos.

El sistema es un paso a paso y combina en cada uno una sencilla explicación y un ejercicio práctico, de manera que nos obliga a ejercitar lo aprendido en cada momento. Además, guarda nuestros logos gráficamente, quedando archivados los hitos que vamos logrando a medida que avanzamos en los cursos.

El sistema de Codeacademy es realmente bueno, sobre todo si nuestra base es nula y queremos comenzar desde cero. Los ejercicios prácticos son muy sencillos y nos ayuda a ir adquiriendo poco a poco conceptos generales de programación.

En castellano podemos encontrar, por desgracia, pocos cursos todavía:

Curso de HTMl y CSS
Curso de programación en Javascript
Curso de programación en jQuery
Curso de programación en Python
Curso de programación en Ruby

En inglés cuenta con algunos cursos más, como fundamentos de diseño web, creación de proyectos web o programación con API’s.

Codeacademy es una buen punto de inicio para aquellos que, sin conocimientos previos, se quieren acercar al mundo de la programación y, además, totalmente gratis.

Publicado en Programación | Deja un comentario