El artículo de hoy lo alienta a adoptar el hábito de dedicar tiempo a pequeños experimentos. Probar ideas y resolver problemas en un entorno de baja presión y, posiblemente, incluso divertido, puede mejorar enormemente su educación y conducir a una innovación impresionante.
Comenzaremos con algunos beneficios y consejos para experimentar con proyectos de desarrollo web y terminaremos con un breve vistazo a algunas de las herramientas que personalmente uso para componer mis propios experimentos. ¡Empecemos!
Los beneficios de la experimentación
La experimentación es algo muy poderoso. De hecho, lo llamaría un elemento absolutamente crucial en la educación continua de cualquier desarrollador web, ya sea que haya estado en ello durante diez días o diez años. Todo el conocimiento de diseño web en el mundo no significará sentadilla si no te metes y te ensucias las manos.
"La mejor manera absoluta de aprender algo en este campo es encender un editor de texto y darle una oportunidad a mí mismo".Regularmente leo libros de diseño web y al menos navego, si no consumo completamente varios tutoriales de diseño web a diario. Estos son excelentes recursos; sin embargo, la mejor manera absoluta de aprender algo en este campo es activar un editor de texto y darle una oportunidad a mí mismo.
La teoría y la instrucción parecen tener un lugar bastante temporal en mi cerebro, pero un proyecto práctico se entierra profundamente en mi memoria a largo plazo. La razón suele ser bastante simple: la frustración. La verdad es que regularmente fallo al intentar realizar una idea o experimento específico. La mayoría de las veces las cosas no funcionan tan bien como me imagino que lo harán y el resultado es que me quede sentado y jugueteando con un problema durante horas y horas.
La frustración me desafía. Una vez que enfrento un problema que no puedo resolver de inmediato, resuelvo vencerlo a cualquier costo. El proyecto en sí tiene poca o ninguna consecuencia, es el acto de resolver las cosas lo que me obliga a aumentar mi base de conocimientos, lo que a su vez ayuda a que todos los proyectos futuros sigan avanzando.
Consejos para experimentar
Antes de que echemos un vistazo a algunas de las herramientas que personalmente utilizo para eliminar rápidamente mis ideas, repasemos algunas cosas básicas que debemos tener en cuenta a medida que se embarca en sus propios experimentos de desarrollo web.
No necesitas necesariamente una meta
Es absolutamente útil tener una meta o un destino en mente cuando juegas con algún código, pero en verdad no debes evitar la práctica solo porque no tienes una gran idea o un dilema.
Los escritores a menudo se involucran en este ejercicio en el que simplemente se sientan y escriben sus pensamientos a medida que llegan, es un gran hábito y realmente pueden generar algunas ideas de escritura sólidas. Como desarrollador, deberías intentar lo mismo. Si una tarde te aburres y tienes treinta minutos para matar, simplemente comienza a programar para ver a dónde te lleva. Esto suena pecaminosamente aburrido para los forasteros, pero confía en mí, si estás en la profesión correcta, te encantará cada minuto.
Cavar alrededor en el código de otras personas
No tienes que empezar de cero cuando experimentas, una de las mejores maneras de aprender nuevas técnicas es abrir el código de otra persona para ver qué hace que funcione. Una vez que esté dentro, no solo navegue, comience a cambiar las cosas y comente las secciones para ver cómo responde la página. Recuerda siempre preguntar ¿por qué? Cuando ves algo que no entiendes!
Algunos de los mejores lugares para comenzar son marcos de referencia y placas de compilación, como HTML5 Boilerplate. Estos tipos de herramientas se crean para una navegación fácil, por lo que además de ser bastante avanzados, también tienden a estar extremadamente bien documentados y organizados.
Olvida las reglas
Cuando esté codificando un sitio web profesional, asegúrese de estar en su mejor comportamiento con un código semántico válido y compatibilidad con varios navegadores. Sin embargo, cuando estés experimentando, no temas arrojar precaución al viento y prueba cualquier cosa que se te ocurra.
Al resolver un problema, es importante saber qué funciona y por qué, incluso si su solución resulta inaceptable en un entorno web en vivo, podría ayudarlo a alcanzar uno.
Además, entre HTML5 y CSS3, hay un montón de nuevas técnicas esperando a que intentes echar un vistazo al diseño web en el futuro. Muchos de ellos solo funcionan en dos navegadores o menos, pero eso no significa que no valga la pena investigar y ver cómo funcionan.
Una vez que haya terminado de crear su monstruo web Frankenstein, ejecútelo a través de un validador o una herramienta de pelusas para ver algunas explicaciones de por qué no es correcto y sugerencias sobre cómo solucionarlo.
Batir el tutorial
Otro gran catalizador para la experimentación es un tutorial de diseño web como los que ves en este sitio y otros. Cada vez que vea uno de estos, navegue por él y pregúntese si la solución presentada es la mejor.
No solo siga las instrucciones sin pensar, piense en cómo puede mejorar el proceso reduciendo las ineficiencias. La competencia entre ustedes encontrará que, cuando se enfrente a un oponente al que está tratando de hacer mejor, se lo llevará mucho más lejos de lo que normalmente lo haría.
Herramientas para experimentar
En lugar de brindarte una gran lista de recursos que tienes que ordenar por ti mismo para encontrar las gemas reales, decidí reducir la oferta en este momento y presentar solo las herramientas que personalmente uso para la experimentación.
Las herramientas a continuación son bastante similares en concepto, pero difieren lo suficiente como para usarlas para diferentes cosas. Cuando los pruebes y sientas cada uno de ellos, verás lo que quiero decir.
Espresso para Mac
Comencemos con el único recurso no libre en la lista. El espresso no es simplemente una herramienta para la experimentación, es un IDE completo que le costará alrededor de $ 80. Si eres un diseñador web profesional, vale la pena cada centavo.
Hay un millón de razones por las que es ideal para actuar como su entorno de codificación principal, pero la razón principal por la que es excelente para experimentar es la ventana de vista previa en vivo. A medida que codifica, la vista previa de HTML se actualiza en tiempo real sin una actualización manual.
Use Divvy o alguna herramienta similar para dividir el espacio de su pantalla entre su código y las ventanas de vista previa, y obtendrá un flujo de trabajo de experimentación inigualable. Otro beneficio increíble que a menudo no encontrará en las herramientas en línea gratuitas es la autocompletar, lo que realmente le ahorra un montón de tiempo de escritura y le permitirá realizar esos experimentos en un tercio del tiempo.
Si ya eres un fanático de Espresso, ¡echa un vistazo a la versión de Kaboom de Espresso 2!
CSSDesk
¿Quiere un entorno de codificación que se actualice en vivo pero que no le cueste un centavo? Echa un vistazo a CSSDesk. Esta pequeña herramienta impresionante se compone de tres áreas principales: CSS, HTML y vista previa. Al codificar en el pequeño cajón expandible en el lado izquierdo de la pantalla, la vista previa de las actualizaciones correctas en tiempo real, es una manera fantástica de probar rápidamente cualquier idea de diseño web que pueda tener.
CSSDesk es extremadamente útil y tiene algunas funciones realmente geniales, incluida la posibilidad de compartir o descargar sus creaciones. Una cosa única que no he visto en ningún otro lugar es la posibilidad de personalizar el fondo para tus experimentos. Esto es realmente genial cuando no estás codificando una página completa, sino que quieres centrarte en un solo elemento.
También te encantarán los beneficios de la numeración de líneas, el resaltado de código y la capacidad de ocultar completamente el cajón de código para ver tu experimento en el tamaño completo de la ventana.
jsFiddle
jsFiddle se parece mucho a CSSDesk, solo con un gran aumento en la funcionalidad (que puede ser una ventaja o una desventaja para un experimento simple). Para empezar, como su nombre lo indica, hay un gran énfasis en JavaScript aquí. Sin embargo, no tiene que escribir una sola línea de JavaScript para que esto sea útil.
En jsFiddle, tienes cuatro áreas redimensionables, una para HTML, CSS, JavaScript y una vista previa. A diferencia de las dos opciones anteriores, la vista previa debe actualizarse manualmente cada vez que quiera verla.
Una característica impresionante de jsFiddle es la capacidad de cargar rápidamente en las bibliotecas de JavaScript populares como MooTools y jQuery. También puedes guardar, compartir y compartir tu trabajo y hay botones para ordenar tu código y dejar comentarios sobre los experimentos de otros.
Realmente me gusta el entorno CSSDesk simple y efectivo, pero en verdad jsFiddle es mi lugar de acceso en línea para experimentos rápidos. Simplemente me encanta esta herramienta y no puedo recomendar lo suficiente como para que adquiera el hábito semanal de dedicar tiempo a venir aquí y probar ideas o problemas que haya tenido.
Conclusión
En resumen, la experimentación frecuente es fundamental para su crecimiento como diseñador y desarrollador web. Es demasiado fácil caer en la trampa de recurrir a los mismos métodos antiguos en cada proyecto que asume, lo que puede fácilmente resultar en un estancamiento del talento. ¡No hay nada más peligroso para la carrera de un diseñador web que quedarse atrás y volverse obsoleto!
Los consejos para experimentar anteriormente están dirigidos principalmente a los codificadores, pero también pueden aplicarse fácilmente a los impulsores de píxeles. Aquí, su área de juegos sería simplemente Photoshop, Illustrator y / o Fireworks, pero las sugerencias generales de la experimentación de forma libre, buscando inspiración en el trabajo de otros y rompiendo sus hábitos típicos aún se aplican.
Deje un comentario a continuación y háganos saber cuánto tiempo dedica a simplemente jugar y probar cosas nuevas. ¿Cuánto valor recibe de este tiempo y qué herramientas utiliza?