# What is a WYSIWYG?

If you’re not a web developer, adding content to your site or editing existing content may seem daunting. Luckily, WYSIWYG editors make it easier for you and your team to make changes to your site without diving into lines of code. Read on to learn what WYSIWYG editors are, the pros and cons of using them, and tips on how to perform error-free updates using this type of interface.

## What Is WYSIWYG?
WYSIWYG stands for “what you see is what you get.” WYSIWYG interfaces allow you to edit content in a convenient way, even if you don’t know any code. Microsoft Word is a good example of a WYSIWYG interface. Word gives you a blank page with tools that allow you to add and format words, images, tables, and more. What you see on the screen is exactly what you’ll see when you print the document out – hence the name, “what you see is what you get.”

## How do you pronounce WYSIWYG?
You pronounce WYSIWYG like “wizz e wig”.

## Advantages Of Using WYSIWYG To Edit Your Site
There are many advantages to using a WYSIWYG editor. Some of the top benefits include:

- Usability: WYSIWYG editors are relatively intuitive. The interface allows users to add, remove, or reformat text, images, videos, and more without having a background in web development or programming. This can be especially advantageous if you want to make small updates to your site quickly, or you have non-developers adding content to your site.
- Error-proofing: It can be hard to catch a mistake in a block of code, and even harder to correct it. WYSIWYG editors make it easier to catch and resolve errors quickly.
- Templates: Many WYSIWYG editors have templates you can choose from. By using a template, you can speed up the development process and focus on the content you’re creating for your site.

## Disadvantages Of Using WYSIWYG To Edit Your Site
Of course, there are some drawbacks to using WYSIWYG editors, including:
- **You don’t always see what you’ll get:** Websites can be viewed on tablets, phones, and desktops of all sizes, which can make it more difficult to ensure your site looks great on all devices. Some WYSIWYG editors don’t offer responsive designs, which can make your site more difficult to navigate for mobile or tablet users.
- **Limited functionality:** Templates and drag-and-drop interfaces can only take you so far. Depending on your needs, you may need a web developer to create new code or edit the WYSIWYG templates to give you the result you’re looking for.
- **Bloated code:** Some editors generate excessive code. While this won’t make a difference in the final appearance of your site, excess code can increase the loading time of your site.

## Tips For Using A WYSIWYG Editor
WYSIWYG editors can make it easy and convenient for your team to update your site, but there are some tips and tricks to make using a WYSIWYG editor as easy as possible:

- **Paste as plain text:** If you write content in another application, like a word document, don’t directly copy and paste your work into the WYSIWYG editor. Word processors often add hidden characters and formatting that make your content look great on that platform, but can create formatting issues in a WYSIWYG editor. To avoid this issue, Instead, paste your copy in as plain text to remove characters and formatting.
- **Remove Excessive &nbsp:** In HTML, &nbsp indicates a line break. These can pile up in a WYSIWYG editor, especially if you’re editing in the application itself. It can be difficult to spot &nbsp indicators since they can only be seen in the code of the website. To see the code, look for the “Text” button on WordPress Sites or a “Source” button on other platforms. If you’re seeing a lot of huge spaces on your page, check the code and remove instances of  &nbsp as needed.
- **Simplify the slug/URL Alias:** The part of the URL that describes the page’s content is called a “slug” in WordPress and a “URL Alias” in Drupal. For example, this page’s slug or URL Alias is /what-is-wysiwyg. WYSIWYG editors automatically assign new pages a slug, but they may be too long, not descriptive enough, or missing valuable keywords. Check the slug to make sure it follows best practice before the page goes live. If you change the slug after the page has launched, you’ll create a 404 error that will need to be addressed.
- **Use headings appropriately:** Many WYSIWYG editors have heading options. Headings provide a stylistic break in the content, but most importantly, they provide SEO value. Search engines like Google crawl your site and scan titles, H1s (Heading 1) and H2s (Heading 2) to understand the content and serve it up to users. Each page should only include one H1, but you may use several H2s per page. To gain more traffic, be sure to use H1s and H2s to capture keywords and crawlable content, rather than using them as a stylistic choice.
- **Use Preview:** When you’re editing content in a WYSIWYG editor that has a preview feature, it’s good practice to preview your work before you update it. Previewing allows you to view any new work before you fully commit to the update. If you notice something you don’t like about the new work, you can always click the back button to start over or make changes.

Do you need help editing or adding content to your website? Let us know! Our website developers are here to help with your Wordpress support and Drupal support requirements.

Dive deep into the world of WYSIWYG editors. Learn how to effectively use them, their advantages, alongside some useful tips for a seamless editing experience.

large_Fru-Blog-WYSIWYG-New.png

Strategy & Research

Digital Marketing

Web Development

Creative

AI Data & Analytics

WYSIWYG Editors Explained: Usages, Advantages and Useful Tips

Tony Diaz

Related Articles

International SEO Tips for Business Success: Localization, Translation & Domains

Ben Smith

Don't 'Enhance' AdWords Until You Read This!

Ben Smith

Fruition® Client Wins Industry Award for Outstanding Website

Ben Smith