Pin Me

How to Insert a Special Character in (X)HTML

written by: Sam OBrien•edited by: Simon Hill•updated: 2/16/2010

There are times when (X)HTML documents need to contain symbols to reflect a copyright, registered trademark, or accent marks in various languages. In this article, I explain how to easily insert a special character in HTML whether working with a WYSIWYG web page creation program or text editor.

  • slide 1 of 5

    How to Insert a Special Character in (X)HTML

    The creation of web pages can be accomplished using what's known as a "What you see is what you get" (WYSIWYG) web page creation program or a text editor. I'll explain how to insert a special character in HTML using either. First, it's a good idea to have at least a basic understanding of what the Unicode character set is. Although Personal Computer (PC) users see various letters, numbers, and symbols on the monitor, each one of those letters, numbers, and symbols are actually numbers "inside" the computer. It's not difficult to see the need for uniformity, especially on the Internet because of the various platforms and operating systems that must exchange information. There are many symbols that have meaning that must be correctly represented to communicate their meaning. Also, communication in the diverse languages of the world using computers necessitated the need for standardization in the representation of "special" characters. This is why we have a Unicode character set.

  • slide 2 of 5

    Using WYSIWYG Programs

    The characters in the set that you need to display can be accessed using their specific numeric character reference or their character entity. I prefer the use of the character entity because it's easier to remember as it has a more descriptive name. However, beware that depending on the character you need, you may have to use the numeric reference because there isn't an entity for every character. For example, let's say you want to insert the registered trademark symbol () in an (X)HTML document and you're using a WYSIWYG web page creation program. It doesn't matter what program you're using, you should have a menu option allowing you to insert special characters or symbols. You would simply locate this symbol or the character you need and click to insert it. Each program is slightly different, but if you can insert a character in one WYSIWYG program, you should be able to achieve the same in another.

  • slide 3 of 5

    Using XHTML

    True web development involves understanding how Extensible HTML, simply known as (X)HTML works. Popular WYSIWYG web page creation software such as Microsoft FrontPage and Adobe Dreamweaver require no knowledge of this mark-up language. However, things can go wrong with the code when there's a lot of automation so it's a good idea to know the basics of (X)HTML. Also, if you learn this language, you'll be able to create W3 compliant web pages with nothing more than a simple editor. Notepad++ in Windows, SimpleText on Mac, and a number of text editors available in Linux will suffice if there's a browser to parse the code and see what you've created.

  • slide 4 of 5

    How to Insert a Special Character in HTML

    Therefore, I'll now explain how to insert a special character in HTML when you don't have access to a WYSIWYG program. Returning to the example of the registered trademark symbol (), you would simply type "®" exactly where the symbol should appear (next to the name) if you use the numeric character reference. You would type "®" if you use the character entity. When you open the .html or .htm file in a web browser, the code will be parsed to display the actual symbol to your readers.

  • slide 5 of 5

    Adding a Cedilla in HTML

    Now let's say you need to display the proper foreign accent marks in someone's name. In your code you would have something like: "<p>His name is Fran&ccedil;ois.</p>" which, when opened in a browser, would display the small c cedilla and read, "His name is François." I could also have used the numeric character reference for this French accent mark (&#231;) to achieve the same result. Again, I prefer the more descriptive character entity. There's really no need to ever memorize these references and entities because they are freely available on the Internet. It's really that simple. So, now you too can explain how to insert a special character in HTML.