Markup versus WYSIWYG

In this blog article, we compare WYSIWYG editors with markup languages. We briefly discuss their origins and then explain their respective advantages. Are you interested in a direct comparison of different markup languages? Then take a look at our comparison of AsciiDoc with Markdown, LaTeX and reStructuredText.

First of all: We are not looking for the Swiss army knife of word processing programs. Each concept has its own benefits and area of application. Our aim is to compare these benefits so that you are equipped with the right tool for your next project.

What is WYSIWYG?

WYSIWYG stands for "What You See Is What You Get". This means that your text looks exactly as it does in the output - for example in print or digitally as a PDF. The formatting is applied directly to all text, images and other elements in the editor. Well-known examples of WYSIWYG editors are Microsoft Word, Google Docs and Apple Pages.

The term originated - like so many technical innovations - at Xerox PARC. The Palo Alto Research Center (PARC) was the research center of the printer manufacturer Xerox. They developed the first WYSIWYG editor called Bravo for the Xerox Alto, the first computer with a graphical user interface. Thanks to this invention, users could display texts on the screen before printing. However, this solution could not guarantee "real WYSIWYG". It was not possible to display on the screen exactly what was later output. This was due to the fact that the printer resolution of 300 DPI differed from the 72 PPI fonts of the Xerox Alto.

The first "real WYSIWYG" came with MacWrite and MacPaint, the first text and image processing programs from Apple. The screen of the Apple Macintosh had a resolution of 72 PPI. Apple's ImageWriter II printers, meanwhile, had a resolution of 144 DPI. It was easy to double the screen resolution for the printer and thus print an exact image. However, the real WYSIWYG did not last long. With the introduction of laser printers, different resolutions were again introduced.

What are Markup Languages?

Markup languages, also known as markup languages, are machine languages. They describe a text so that computers can understand its structure and format. Originally, the term "markup" comes from the printer's language. Authors marked the text by hand to indicate text passages that should be laid out differently. For example, certain words could be displayed in a different color or font size. Accordingly, markings indicated to the typesetter how the artwork should be created. In digital typography, markups are represented by tags. These tags serve as instructions to the computer on how individual elements should be designed in terms of structure and format.

A distinction is made in markup languages between the view as source text in the editor and the formatted text in the output. You write your text in the editor. Unlike WYSIWYG, your text is not yet formatted at this point, but is only displayed formatted in the preview or output. This separation of structure (in the editor) and presentation (in the output) is the cornerstone of markup languages. For this reason, they are often described with the abbreviation WYSIWYM for "What you See is What you Mean".

Examples of markup languages

IBM's description language GML (Generalized Markup Language) was developed by Charles Goldfarb, Ed Mosher and Ray Lorie and is considered to be the first markup language. It later evolved into the ISO-standardized SGML (Standard Generalized Markup Language). Many markup languages emerged from this standard. Well-known representatives are:

• HTML (Hypertext Markup Language): The core language of the World Wide Web. HTML is used to define the structure of websites.

• XML (Extensible Markup Language): XML is often used for the exchange of data between different systems.

• DocBook: DocBook focuses on the structuring and formatting of documentation. The language enables authors to create and organize technical content such as manuals, instructions and technical reports.

• LaTeX: LaTeX is widely used in the academic world, especially for scientific documents, research papers, reports and books. It enables the creation of high-quality typographic documents by using macros and commands to precisely control layout, formatting and mathematical expressions.

Furthermore, "simplified" markup languages that use shorter tags have been developed over time. This makes it easier to get started and keeps the source text much easier to read. These include

• AsciiDoc: AsciiDoc is used for writing technical documentation and is based on DocBook. Despite its wide range of functions, it has a simple syntax, which makes it popular with technical editors.

• Markdown: Markdown was developed to make writing content for the web quick and easy. It is often used in online platforms, forums and for documentation.

• reStructuredText (reST): This language emerged from the Python community and is used for its documentation. Like AsciiDoc, it is mainly used for creating technical documentation, but has a somewhat more unusual syntax.

You can find a more detailed comparison between AsciiDoc, Markdown, LatTeX and reStructuredText in our blog.

When do you use which Concept?

But when do we use which approach? As is so often the case, there is no one-size-fits-all answer. It depends more on your goals. However, there is a rule of thumb: the longer your document, the more useful markup languages are.

When do WYSIWYG Editors shine?

WYSIWYG editors are ideal for short, less complex documents. They are intuitive to use and require little to no training. This makes them ideal for users with little technical knowledge. Content can be visually designed and customized without having to understand the underlying code.

When are Markup Languages better?

However, as soon as documents become longer, WYSIWYG editors quickly become unstable. Markup languages, on the other hand, allow you to create long, complex texts (e.g. technical documentation) efficiently. They also have several advantages:

1. Create Multiple Outputs from one document:

You write a single document and create various outputs from it. These outputs can differ in terms of content (what is in the text?), format (what file format does the output have?) and style (what should the file look like in the output?). The concept behind this is known as single source publishing. WYSIWYG editors do not support this concept. You would have to manually create a separate document for each output.

In markup languages, on the other hand, you only need a single "master document" on the basis of which you can show or hide content and define individual formats and styles for each output. Traditionally, markup languages use the terminal and a converter to format your document into the desired output format. However, this is also much easier - there are first tools that allow you to output directly from the application.

2. Data management via Git

The concept of "Docs as Code" has become more popular in recent years. According to this philosophy, documents are treated like programming code and undergo the same work steps. Version management is an important element here. Simplified markup languages such as AsciiDoc, which create documents as plain text files, are better suited to version management systems such as Git. In contrast, Word documents are saved as docx files, which are based on XML files. These files are considered binary files in Git, which limits version control in Git. For more information on the use of Docs as Code in projects, we recommend taking a look at our article on Docs-As-Code.

3. Embed external Files in the Document:

Do you want to integrate external files such as tables, text files, code snippets and images into your document? In WYSIWYG editors, they are usually just copied into your document. In contrast, in markup languages such as AsciiDoc, you integrate the files dynamically into your document. The file becomes part of the document, but remains an independent file at the same time. If you want to change the file within your document, it is updated everywhere. This means you always work with the latest version - whether inside or outside the document.

Conclusion

WYSIWYG editors are useful for simple, short texts. Do you want to create more complex, longer documents? Then markup languages have a clear advantage. You create different outputs from one document. This simplifies your work process, makes you more efficient and you (and possibly your team) work in a single version of the document. You can also log changes in Git, as the documents are saved as plain text. In addition, all other files attached to the document are always up-to-date.

However, which markup language you choose depends on your area of application. As a technical writer, for example, we recommend AsciiDoc. The language has a simple syntax and yet a wide range of functions. You can find out what this might look like in detail in this blog entry, in which we have created a sample user manual in AsciiDoc. Why not try out adoc Studio at the same time? Create AsciiDoc documents directly in a graphical user interface and have your texts output directly via the app without a terminal or converter. Creating technical documents has never been so easy.