Blog
Magnifying Glass Blog Image

WYSIWYG: What You See is What You Get (Part 1: An Overview)

By Mac Moyer

Some of the stranger technical terms aren't technical at all. WYSIWYG (which we like to pronounce “wizzy-wig”), for example, is an acronym for a familiar phrase: “what you see is what you get.” When we talk computers, it describes a type of interface that can bridge the gap between non-technical content authors and the kind of strict programming or markup languages that underlie the web. A markup language is a set of codes or tags that can be embedded in digital text to change the formatting, like making your text bold, adding line breaks between paragraphs, centering a photo on your page, etc. In the image to the left, you can see an example of some of the "behind-the-scenes" structure of our website.

What do you see?


A WYSIWYG is a tool that lets you edit the text and graphical content of something complex, like a print layout, a slideshow presentation, or a web page, in an interface that closely resembles the final result. All of these final products have an underlying technical structure that's computer-readable, but may be difficult or even impossible for a human content author to read.

Think of programming and markup languages as foreign languages with a completely different set of words and rules than English. Just as it takes time to learn a foreign language, it takes quite a bit of studying and practice to learn these “behind-the-scenes” languages. Thus, a WYSIWYG tool is like a translator that allows you to edit and create a website without understanding these languages.

Web content is ultimately formatted with HTML code. Not actually a programming language, but a markup language, HTML uses markup tags to indicate the presence of an image, where text should be bold or italic, how a list should be structured, and hundreds of other formatting options. In addition, CSS code can be used to adjust even more complex styling options, and [JavaScript (which is a programming language) can be employed to add specific behavior to the web pages. The WYSIWYG handles all of that for you, behind the scenes, while you edit the content in a way that is easier for the average user.

WYSIWYG is a feature that you can find in several different types of software. It can be a standalone application on your computer that works like a word processor, or it can be a tool within your content management system, a.k.a. your CMS. A WYSIWYG editor in your content management system— like TinyMCE and CK Editor allows you to enter and edit content, without knowing any html, CSS, or JavaScript code.

What do you get?


A WYSIWYG can be a great tool, but it’s not without its flaws. When the content is simple, with basic formatting, or when your content authors aren't tech experts, a WYSIWYG excels. However, a WYSIWYG can be limiting and you may not be able to maintain consistency with your brand, or achieve more complicated functions on your website. It may also be difficult for you to update your website in the future if you want to switch to a more complicated and customizable set-up. If you lean to the more tech-savvy side, a more direct interface with the code may suit your needs better. At Lunar Logic, we can help evaluate your needs and put the right web content editor to work for you so you and your customers can get the most out of your website. Contact us today, to learn more and watch out for next week’s post WYSIWYG: What You See is What You Get (Part 2: Pros & Cons) for more information on this subject.

Image Credit: http://tinyurl.com/hh74q6w
Are You Ready to Start Your Project?