Manual de herramientas del diseñador web freelance

Manual de herramientas del diseñador web freelance

22 mayo 2018

Contar con las herramientas correctas puede hacer que cualquier trabajo o tarea se facilite y optimice. Tengo aproximadamente 4 años dedicándome al diseño web y he trabajado como freelance la mayor parte del tiempo. A continuación comparto algunas herramientas que creo te ayudarán a hacer procesos y tareas de manera más eficiente para ti y para tu cliente.

 

Bootstrap

Cuando comencé en esta área, generaba los estilos de un sitio web desde cero. La ventaja es que aprendí varias cosas que de otra manera no hubiera aprendido, lo malo es que al escribir el css de un sitio web sin ninguna forma de apoyo, es muy posible dejar cabos sueltos. Me ha pasado varias veces que empiezo a generar un css para un sitio web y se ve impecable en el navegador que estoy probando, pero cuando veo el mismo sitio en otro navegador la historia cambia.

Una ventaja de usar frameworks como bootstrap, es que te dan una base sólida de estilos y layouts para sólo modificar lo necesario. Cuenta con un sistema de grids que te permite crear diseños con un approach de mobile first.

getbootstrap.com

 

Slick Carousel

Un carrusel de imágenes es un elemento que se usa en varios sitios web. Recuerdo la primera vez que agregué un carrusel al sitio web de un cliente. Fue una tarea dificilísima, la razón? Codifiqué todo el carrusel desde cero usando javascript. En ese entonces no conocía sobre la gran variedad de plugins de Javascrpit y JQuery disponibles, muchos gratuitos.

Slick hace posible agregar un carrusel a un sitio web con gran facilidad. Además, es muy fácil de personalizar y adaptarlo a tus necesidades.

Slick slider

 

Font Awesome

Otro elemento bastante común en cualquier sitio web es el uso de íconos. En un principio generaba cada ícono que iba a usar en herramientas como illustrator, eso terminó cuando conocí Font Awesome.

Font Awesome básicamente es una tipografía de puros íconos. Puedes encontrar casi cualquier cosa que te imagines y tiene la ventaja de que es super ligero, por lo que no alentará tus sitios, y te ahorra tiempo a la hora de buscar iconografía.

Font Awesome

 

WordPress

Es el CMS (Content Management System) más popular. Por lo general mucha gente asocia WordPress con el uso de templates pero es muy sencillo adaptar un diseño propio para que funcione con la plataforma. Una de las ventajas que he visto de usar WordPress vs un sitio web construido con puro HTML es que es más fácil y práctico de manejar los assets de tu sitio como imágenes y también es más sencillo integrar herramientas como Google Analytics y SEO.

Hay que saber un poco de PHP para poder adaptar un sitio en HTML a WordPress, pero existe bastante material en línea para poder aprender del proceso. Recomiendo este curso impartido por Zac Gordon: WordPress Development

wordpress.org

 

Advanced Custom Fields

Si adaptas un diseño web a WordPress, es muy probable que necesites este plugin para agregar con facilidad campos personalizados a las entradas de blog y páginas. Básicamente uso este plugin en todos los sitios web que desarrollo en WordPress.

Advanced Custom Fields

 

and.co

Descubrí esta herramienta hace un par de meses y me ha ayudado bastante para organizar los gastos e ingresos de mi actividad como freelancer. Puedes mandar recibos a tus clientes desde los cuáles te pueden pagar en línea, puedes mandar contratos y puedes ver de manera gráfica tus ingresos en comparación con tus egresos.

and.co

 

Estas son algunas de las herramientas que uso prácticamente en todos mis proyectos y que creo que me han ayudado a contar con un proceso mucho más óptimo. Espero que te sirvan, para cualquier consulta puedes contactarme aquí.