Crédito: Walt Disney Animation Studios y Walt Disney Pictures

El diseño de “visualizaciones en primer lugar” influyen en el comportamiento de la gente en la web extremadamente. Es porque los usuarios normalmente prefieren no leer grandes cantidades de texto, las visualizaciones hermosas se necesitan para hacer atractivo el sitio web. La gente aprecia la belleza visual en todos los aspectos de sus vidad, así que ¿por qué el desarrollo web tiene que ser una excepción?

Los editores de lo que usted ve es lo que usted obtiene (WYSIWYG) se han convertido en muy populares como una herramienta para la creación de sitio web. Este tipo de herramienta de edición es rápido, fácil de manejar, e inmediatamente gratificante: usted puede ver de inmediato el resultado de los cambios que usted ha hecho en el diseño de sitio web. ¿Alternando entre pestañas para obtener una vista previa del diseño ahora se ve como una carga, y el aprender el HTML/CSS en lugar de simplemente crear cosas bellas? Los creadores visuales no tienen tiempo para construir las líneas de código complicadas. Ellos simplemente necesitan tener su sitio web guay listo en unas horas. Y el WYSIWYG parece ser un tipo de magia que crea un sitio web bien estructurado párcicamente sin esfuerzo.

¿Ha visto usted la película “Big Hero 6”?¿recuerda como el Héroe Hamada proyecta la armadura para Baymax?

Crédito: Walt Disney Animation Studios y Walt Disney Pictures
Crédito: Walt Disney Animation Studios y Walt Disney Pictures

Como la herramienta de edición WYSIWYG, ello requiere un código pequeño o hasta ningún código y la posibilidad de cambiar, eliminar o sustituir cualquier elemento con los movimientos simples de arrastrar y soltar.

Aúnque muchos desarrolladores y programadores culpan a los editores de WYSIWYG por la creación de facilidad excesiva para los diseñadores principiantes y los amateurs web. ¿Qué se encuentra detrás de esta actitud?

Daryl Koopersmith en su reportaje para WordCamp 2009 dijo que es un WYSIWYkoG – “el que usted supuestamente obtiene”. Especialmente cuando la optimización de su página para los dispositivos móviles que ofrecen una variedad de tamaños y resoluciones de pantallas, es bastante difícil estar seguro de lo que usted ve es realmente lo que usted obtiene.

WYSIWYG: Pros
La facilidad de uso es la mayor ventaja de los editores WYSIWYG. Entre otras ventajas son:

El enfoque en el diseño. Desde que los editores visuales no necesitan el conocimiento o el uso de códigos, los diseñadores pueden prestar más atención a cómo se ve el diseño;

  • Menos tiempo y esfuerzo de la persona. Con el CMS construido de forma apropiada que está basado en el editor WYSIWYG la persona tiene la posibilidad de realizar muchas actividades empezando por la organización de diseño, estructuración de contenido, diseño de apariencia de sitio web y la construcción de UI sin necesidad de pedir ayuda de algún desarrolador u otro profesional;
  • La adaptabilidad. Con el uso de editores visuales se ha hecho más fácil encajar las imágenes, tipografía y otros contenidos en cualquier tamaño de pantalla. Además, algunos sistemas de manejo de contenido como MotoCMS hoy en día ofrecen un editor adaptable donde usted puede ver instantáneamente como se verá su sitio web en diferentes pantallas incluyendo en el modo vertical y horizontal;
  • Más control sobre las tareas específicas. Es obio que algunas tareas como la creación de tablas o el encajar la imagen en el texto es más fácil para hacer con el uso de WYSIWYG;
  • El código incluido. Puede parecer no absurdo, pero los editores visuales modernos incluyen las herramientas que escriben los tags para usted, así que usted puede crear las tablas con los tags escritos de forma perfecta y sin ningún error.

Otra ventaja de editores visuales es que permiten la creación y organización de trozos de información que son fáciles de reorganizar y sin ningún tipo de molestia. Esto tiene mucho sentido, especialmente para los móviles. Anteriormente, usted tenía que utilizar un “borrón” que fue rellenado con el contenido incluyendo los encabezamientos, texto, información de autor, etc; esto era muy dificil de encajar en la pantala de móvil. Recuerde otra vez la película de “Big Hero 6”, cuando Héroe intentaba meter a Baymax en su armadura. Y ahora imagínese que usted tiene que encajar un borrador grande con todo el contenido suyo en la palntilla de teléfono móvil que es más pequeña. Eso no hará contento a nadie.

Crédito: Walt Disney Animation Studios y Walt Disney Pictures
Crédito: Walt Disney Animation Studios y Walt Disney Pictures

 

WYSIWYG: Cons

Considerando que WYSIWYG son los editores relativamente nuevos que se utilizan en la creación de sitio web, todavía hay algunos problemas que presentan grandes obstáculos.

Los diseñadores web aún critican los editores visuales por su código erróneo que no es compatible con los estándares. Los editores WYSIWYG más populares hoy en día dicen tener resuelto este problema y ofrecen un código límpio y sin errores. Esto se vuelve muy útil para los diseñadores web, que les permite crear páginas web con facilidad.

Otra inconveniencia de los editores WYSIWYG es que cada uno usa el producto de edición tan único que lo hace tan confuso para moverse entre diferentes plataformas. Pero la tendencia creciente muestra que hay la universalización del interface del editor. Mire a unos ejemplos de diferentes constructores de sitios web que utilizan los editores WYSIWYG. Usted notará que la mayoría de ellos incluyen los íconos populares y bien conocidos para la función de “Añadir Imagen” o “Añadir Texto”. Con la posterior evolución de editores visuales, esta inconveniencia parece ser superada.

Crédito: Cloudcannon.com
Crédito: Cloudcannon.com

Una de las principales preocupaciones sobre el uso de los editores WYSIWYG es que ellos aún no cubren todas las funcionalidades de los editores HTML regulares. En muchas ocaciones usted necesitará añadir algunos tags a mano para añadir el grooming extra o un aspecto más complicado a su diseño. Pero otra vez, en futuro quizá hagamos que nuestros editores visuales sean más complejos y que incluyan todas las funcionalidades necesarias de los de texto.

¿Qué pasa con el futuro?

Sí, parece que la tendencia para la edición visual y menos codificación continuará. Hoy en día el uso de editores WYSIWYG depende de quién es usted y cual es su objetivo.

Los programadores web quienes mayormente escriben códigos para los sitios web únicos con las estructuras complicadas continuarán usando el HTML y CSS. Es su trabajo principal, y esto no puede ser hecho con el editor de WYSIWYG. Los codificadores aún tienen que usar los códigos. Una lógica simple.

Respecto a los diseñadores y desarrolladores web, aquí tenemos que admitir que la edición visual se hace cada vez más práctica. Los diseñadores web son el tipo de usuario que percibe el mundo de la forma visual y ver de inmediato el resultado es esencial para ellos. Realmente, hoy en día cada vez más diseñadores web no aficionados vuelven a los editores WYSIWYG y a los constructores de sitio web con esta funcionalidad. Con muchas personas que desean tener sus propios sitios web y están en búsqueda de una solución económica, los diseñadores web pueden crear numerosos sitios web hermosos sin tener que escribir el código desde cero.

Cuanto más servicios empiecen a usa el WYSIWYG, su popuaridad crecerá y ayudará a hacer el editor visual más fácil de usar. Muchos servicios que no están conectados a la creación de sitio web, como MailChimp, también implementan las características de la edición WYSIWYG en su UI.

MailChimp Email Designe
Crédito: MailChimp Email Designe

Con la evolución de las plataformas de CMS populares como MotoCMS, Shopify, Weebly y muchas otras, el conocimiento de HTML ya no es una cosa tan urgente para la creación de sitio web. La mayoria de los constructores de sitios web utilizando el WYSIWYG hoy en día permiten a sus usuarios aplicar el código cuando ellos necesitan más refinación. Se parece más a un juego cuando usted puede crear un sitio web completamente funcional en unas horas sin ningún conocimiento especial sobre las peculiaridades de este proceso.

Por Diego Cambiaso

Comunicador Social, Desarrollador de Software y UX Designer. Blogger desde el 2006, creador de Pixelco Tech. Viajero y fotógrafo. Entusiasta del diseño, apasionado por la tecnología y el social media. EN-ES-IT