February 11, 2015
A ‘visuals first’ design impacts people’s behavior on the web greatly. Because users do not normally prefer to read large batches of text, beautiful visuals are required to make a website attractive. People appreciate visual beauty in all aspects of their lives, so why should web development be an exception?
What You See Is What You Get (WYSIWYG) editors have become more and more popular as tools for website creation. This type of editing tool is fast, easy to manage, and immediately gratifying: you immediately see the result of the changes you apply to the website design. Alternating between tabs to preview the design is now seen as somewhat of a burden, and learning HTML/CSS rather than simply creating beautiful things? Visual creators don’t have time to build complicated code lines. They just need their awesome super duper website to be ready in an hour. And WYSIWYG seems to be the kind of magic that creates a well-built website with almost no effort.
Have you seen the “Big Hero 6” movie? Remember the way Hero Hamada projects an armor for Baymax?
Credit: Walt Disney Animation Studios and Walt Disney Pictures
Just like a WYSIWYG editing tool, this required little or no code and the possibility to change, remove or replace any element with simple drag-and-drop movements.
However, many developers and programmers blame WYSIWYG editors for creating excessive ease for novice designers and web amateurs. What’s behind this attitude?
Daryl Koopersmith in his report for WordCamp 2009 stated that it’s a WYSIWYkoG – “what you KIND OF get”. Especially when optimizing your page for mobile devices that offer a variety of display sizes and screen resolutions, it’s pretty hard to be sure that what you see is really what you’re going to get.
Ease of use is the main advantage of the WYSIWYG editors. Among other pros there are:
- Focus on design. Since visual editors don’t require coding knowledge and use, designers can pay more attention to the way layout look;
- Less time and effort from a person. With properly built CMS that is based on a WYSIWYG editor one is able to perform many actions from arranging layout, structuring content, designing the website look and building the UI with no need to ask a developer or other professional for help;
- Responsiveness. With the use of visual editors it gets much easier to fit images, typography and other content into any size of screen. Moreover, some content management systems, like MotoCMS, today offer responsive editor where you can instantly see how your website will look on different screens including portrait and landscape mode;
- More control over specific tasks. It’s obvious that some tasks like creating tables or fitting an image into the text is much easier to do with the use of a WYSIWYG;
- Code included. It may seem nonsense, but modern visual editors include tools that write tags for you, so you may create tables with perfectly written in tags without any mistakes.
Another benefit of visual editors is that they allow creating and arranging chunks of information that are easy to rearrange without any hassle. This makes a lot of sense, especially for mobile. Previously, you would have to use the ‘blob’ which was filled with content including headings, body text, author info, etc; this was very hard to fit onto a mobile screen. Remember again the “Big Hero 6” movie, when Hero tried to squeeze Baymax into his armour. And now imagine you try to fit large blob with all your content into a smaller smartphone screen. It doesn’t make anyone happy.
Credit: Walt Disney Animation Studios and Walt Disney Pictures
The other situation is with “chunks” – smaller pieces of information that can be rearranged in a way you need to fit into the area. For a long time WYSIWYG was blamed for creating clumsy blobs that couldn’t be manipulated, and made for content that could only be used for one specific platform or device. Today WYSIWYG editors offer more control over any text field, image, or widget.
Considering that WYSIWYG are relatively new editors that are used in website creation, there are still some issues that present large obstacles.
Web designers still criticize visual editors for inaccurate code that is not compliant with standards. Today’s most popular WYSIWYG editors claim to have solved this problem and offer clean code without errors. This gets extremely handy for web designers, allowing them to create web pages with ease.
Another drawback of WYSIWYG editors is that each uses such a unique editing product, which makes it confusing to move between different platforms. But a growing trend is showing that there is a universalization of editors’ interfaces. Take a look at some examples of different website builders that use WYSIWYG editors. You will notice that most of them include popular and well-known icons for “Add Image” or “Add Text” functionality. With further evolution of visual editors, this drawback seems to be overcome.
One of the main concerns about the WYSIWYG editors use is that they still don’t cover the entire functionality of regular HTML editors. In many cases you still need to add some tags manually to add extra grooming or more complicated look to your layout. But again, in future we may get visual editors to become more complex and include all the necessary functionality of the text ones.
What About the Future?
Yes, it seems that trend for visual editing and less coding will continue. Today the use of WYSIWYG editors depends on who you are and what your end goal is.
Web programmers who mostly write code for unique websites with complicated structures will continue use HTML and CSS. It’s their primary work, and this cannot be done with a WYSIWYG editor. Coders still have to use code. Simple logic.
As for web designers and web developers, here we must admit that visual editing becomes more and more handy. Web designers are the kind of users who perceive a world in a visual form and seeing the result immediately is essential for them. Actually, today more and more non-amateur web designers turn to WYSIWYG editors and website builders with this functionality. With many people wishing to have their own websites and looking for a budget solution, web designers can create numerous beautiful websites without having to write code from scratch.
With more and more services starting to use WYSIWYG, its popularity grows and helps make visual editors more user-friendly. Many services that are not connected to site creation, like MailChimp, also implement WYSIWYG editing features into their UI.
Credit: MailChimp Email Designer
With the evolution of popular CMS platforms like Shopify, MotoCMS, Weebly and many others, HTML knowledge is not such an urgent thing for website creation anymore. Most of the website builders using WYSIWYG today allow their users to apply code when they need more refining. It looks more like a game when you can create a fully-functional website in a few hours without special knowledge about the depths of this process.
Did you like this article?
Get more delivered to your inbox just like it!