Enfrentarse al código es el desafío más grande que tiene cualquier diseñador web principiante.
La pregunta más común es: ¿puedo crear un sitio sin escribir todo este maldito código?
La respuesta es: Si y No…
Si estás comenzando en el mundo del desarrollo web, ya sabrás que la parte más difícil es la de pasar un diseño, a código funcional y entendible para los navegadores. O sea, lo que comúnmente se llama Maquetación Web.
Aquí es donde todos nos trabamos al comenzar porque nos tenemos que enfrentar al código, algo que a primera vista nos parece chino.
Recuerdo hace más de 10 años cuando comencé en el desarrollo web, la sensación horrible de pensar : “como ostia hacen para que el diseño se transforme en todo este código y que se vea igual en el navegador?”.
En aquel momento, si querías aprender seriamente a crear sitios web, no quedaba otra alternativa que aprender las bases que son HTML y CSS.
Luego de eso las cosas empezaban a tomar sentido.
LA REALIDAD DE HOY
Hoy en día la realidad es diferente, pero según lo veo, no lo es tanto.
Muchos alumnos me dicen que hoy se pueden crear webs sin escribir código utilizando los nuevos softwares y herramientas.
Herramientas que prometen hacer del proceso de creación web, algo absolutamente visual sin necesidad de escritura de código.
Alguna de estas herramientas son:
- Webflow
- LayoutIt!
- Brix.io
- Readymag
Algunas de estas son para usar en el navegador y otras son software que se instalan en nuestra computadora y que pretenden alisar el camino de la maquetación web haciéndolo más amigable.
He probado algunas y parecen entornos interesantes para la experimentación y para dinamizar el flujo de trabajo y presentación de propuestas al cliente.
Al avanzar en las pruebas que hice con estas herramientas me di cuenta que casi todas apuntaban a que usara los módulos que venían prefabricados y los asistentes.
Pero finalmente, si quería hacer personalizado en el sitio (como lo hago el 100% de las veces en mi trabajo), debía recurrir a la escritura de código.
¿SIRVEN LOS SOFTWARES?
Luego de más de 10 años de trabajo, puedo asegurarte que si te dedicas o te quieres dedicar seriamente al desarrollo web, vas a tener que meter los dedos en el código para personalizar lo que estás haciendo. Si o si.
De hecho, en un trabajo profesional se parte de un diseño hecho a medida para el cliente, y luego ese diseño de maqueta para que se vea igual en el navegador.
Este es el proceso básico, fundamental y clásico del desarrollo web profesional.
Y para esto, lo mejor que puedes hacer es aprender lenguaje HTML y hojas de estilo cascada CSS.
Luego podrás utilizar cualquier editor de código como SublimeText, EditPlus, Dreamweaver u otro, y asi construir el sitio.
Obviamente algunos programas te ayudan, por ejemplo, yo siempre uso Dreamweaver,no para usar los asistentes o las cosas prefabricadas que trae, sino simplemente para escribir código y usar el entorno visual al que me he habituado.
Lo mismo podría hacerlo en SublimeText o incluso en un Notepad de Windows. Solo es costumbre. De hecho a veces cuando tengo que modificar cosas simples, los uso en ves de abrir el Dreamweaver. (tarda más)
¿Y LOS FRAMEWORKS SIRVEN?
Mi consejo es sin dudarlo, que aprendas HTML, CSS y todo el proceso de maquetación clásico. Con esto tendrás un poder y un control total sobre lo que vas a hacer.
Sin embargo, reconozco que hay algunas herramientas que, si ya sabes de maquetación web tradicional, te alivian muchísimo el trabajo.
Una de estas herramientas que uso bastante es Bootstrap: gratuita y sin instalación.
Bootstrap es un framework que te permite, sabiendo de HTML y CSS, realizar rápidamente el proceso de maquetación y conversión de un diseño a sitio web funcional.
Y lo mejor es que esta maquetación queda 100% responsive, o sea, adaptable a diferentes dispositivos móviles como Smartphones y tablets.
Bootstrap evita que escribas cientos de líneas de código cuando estás maquetando tus sitios ya que muchos de los elementos tradicionales como menus, ventanas modales y demás, vienen pre-escritos y solo debes implementarlos y personalizarlos con CSS.
Lo mejor es que evitarás realizar toda la programación para que el sitio sea responsive y también podrás agregar algunos elementos interactivos con Javascript, que ya vienen pre-desarrollados.
Esto te ahorra muchísimo tiempo, de verdad lo recomiendo.
Pero insisto que esto solo te servirá si ya sabes de maquetación con HTML y CSS, sino poco te ayudará cualquier framework.
CONCLUSION
Mi consejo si estás empezando, es que primero aprendas maquetación tradicional con HTML y CSS.
Esto seguirá siendo la base del desarrollo web por mucho tiempo, sin importar si es HTML4/HTML5 , o CSS2/ CSS3 u otra versión que venga en el futuro.
Básicamente TODO es HTML y CSS.
Entonces, primero aprende HTML y CSS y serás el rey.
(si quieres aprender HTML y CSS puedes acceder a mi videotutorial gratuito de maquetación web AQUI)
Luego si quieres acelerar el trabajo, aprende algún framework como Bootstrap y verás cuanto tiempo te ahorras, pero sabiendo que las bases las comprendes.
(Aquí puedes encontrar el videotutorial de Bootstrap)
PARA IR A FONDO
Si te interesa meterte de lleno tanto en el tema de maquetación web como de Bootstrap, te recomiendo mi Curso Completo de maquetación web con HTML y CSS, y mi Curso de Bootstrap 3.
Déjame tus comentarios aquí debajo!!!
Saludos
Cristian
Gracias. Buen artículo en mi caso uso diariamente Sublime. Ánimo a todos los nuevos y viejos codera web. Saludos desde Mallorca