Remember Me
forgot your password?

Three Ways to Display Sample Html in a Web Browser

If you’re looking to write about web design and HTML, you’ve no doubt run into this problem. How do you display sample mark-up that the user can see?

The problem is simple. You want to display the sample markup. The user’s browser wants to render it as actual mark up. You need to come up with something to tell the browser - “Hey, this isn’t supposed to be rendered!”

There are a few ways to do this.

First, you could use an xmp tag.

The xmp tag was developed for displaying "example" HTML. Once the browser sees an xmp tag, it stops rendering all HTML until it sees a closing tag.

However, the tag is deprecated. It's no longer included in the HTML standards - which will prevent your site from validating - and it may not be supported by all browsers. Use at your own risk.

A second, more reliable method, is to include the markup in a textarea box.

When you create a textarea element, you can include text in between the opening and closing tags as "default" text. Any HTML in this text remains unrendered - which allows you to easily display your sample markup.

There are two problems with this, though. First, you can't include a closing textarea tag within your example - or it will prematurely close the textarea that you are using to display your example. You also cannot style the text at all with css.

The third solution - probably the best - is to escape all of the signs in the sample code.

If you replace < with <, the browser won't think that the tag is real html. It will simply display the markup.

This is by far the surest method of displaying your sample HTML, the only problem is that you need to escape all of the characters. However, you can take a shorcut - use this form to do the escaping for you.

Copy and paste your own code in, and the escaped code will be created on the spot.

Brian Rock

I'm the author of Web Cash - a blog about web design, writing, and making cash on the net. You can read more about How to Display Sample HTML, or check out the latest HTML Tutorials.

Rate this Article: 0 / 5 stars - 0 vote(s)
Print Email Re-Publish

Add new Comment



Captcha

  • Latest Web Design Articles
  • More from Brian Rock

Some Tips on Web Design

By: TravisOl | 02/12/2009
The very first function of html was to demonstrate mathematical and numerical data. With time designers tried to improve this situation by changing code in order to create more beautiful and pleasing code. Do you know how to do it?

404 Error – Fix It Fast!

By: James parker | 02/12/2009
The message “Not Found – The requested URL was not found on this server” is a clear indication that you’ve encountered the 404 error. In simpler terms, your web server was unable to find a certain entity you were looking for. Undoubtedly it’s a big turn-off for your website users, but you can turn this error page into not-so-irritating page by following the given tips:

Website design - Interpersonal Qualities of a good web designer

By: Grace | 02/12/2009
This is probably the most important. If the web designer you are dealing with doesn’t have any work to show you, or they cannot produce a few websites they have done entirely themselves, you should be careful in dealing with them. What do their website development portfolio tells you.

Choosing a professional web designer

By: Red Giraffe Search | 02/12/2009
Web site Designing is one of the key elements in establishing an online business and reaching your target audience. So, it becomes essential to hire professional website designers to make your website interactive and user-friendly. You should keep certain things in mind while you are going to hire a company or an individual for designing your website.

Utility of Drupal Development Services

By: Gaurav Kumar | 02/12/2009
The utility of Drupal, a powerful Content Management System (CMS) and the benefits of hiring the services of a professional Drupal development services company are highlighted in this article.

Why Do You Need Customized Web Development Solutions For Your Business?

By: Arun Kumar | 02/12/2009
The world has now come closer through the medium of Internet. Today, every thing is ruled by the web and most of our work is done instantly and effortlessly. A sizable number of businesses have migrated to the online space in the last few years. The rest of the businesses are also showing keen interest to make their presence felt online.

Create Your Corporate Identity With a Company Logo

By: Arun Kumar | 02/12/2009
Corporate logo is the foremost identity of a company that would reflect its business theme and is therefore the most important aspect as well. This logo is what will be seen everywhere your name goes, including your website, advertisements in every medium, brochure, letterheads and even business cards.

Why It's Important to Have Good Website Design

By: Alison Rothwell | 02/12/2009
It's important that your website layout is logical and easy to navigate. Internet users who land on your website can get easily frustrated if it is difficult to find information they need, and with fast internet speeds and search engines offering many alternatives, it can be easier for them to simply close your site and go somewhere else.

Syndicate RSS Feeds on your Website for Extra Content

By: Brian Rock | 09/02/2008 | Web Design
RSS feeds are a great way for you to keep up to date on your favorite websites. But they can be an even greater tool for a webmaster. You can syndicate RSS feeds on your own site, adding continuously updating content without any work of your own.

How to Encrypt and Hash Passwords in Php

By: Brian Rock | 02/02/2008 | Web Design
If you want to build a user-management system - or work on someone else's - you should know a few basics about how passwords are encrypted or hashed. In other words, how are they made safe for storage?

Submit Your Articles Free: Signup
Article Categories




Use of this web site constitutes acceptance of the Terms Of Use and Privacy Policy | User published content is licensed under a Creative Commons License.
Copyright © 2005-2008 Free Articles by ArticlesBase.com, All rights reserved. (0.26, 8, w1)