Buy Now
Download
Buy Now Try Free
NovaBACKUP Data Protection Blog

An Introduction to HTML Code

by Sean Curiel on Mar 28, 2016 1:16:00 PM

HTML, short for HyperText Markup Language, is a form of code that programmers use to create the Web pages that the Internet now relies on for mass communication. While some content exists in alternative forms such as Shockwave Flash or Java, the majority of Web pages and websites primarily rely on HTML code to display information due to its relative ease of use. Most online content is made up of plain-text files called HTML documents. HTML documents mainly consist of a combination of human readable content arranged into a specified layout with the use of tags. Tags are the actual code or commands that determine the layout of a page, like the code used by traditional desktop publishing software. Unlike desktop publishing software, which uses underlying code that is not readable by humans to arrange content, HTML tags are a form of plain-text code, or underlying code that is readable by Web page designers. Newer desktop publishing programs also help designers automate the creation of Web
pages and even entire websites. However, at some point, most Web designers will find themselves needing to understand HTML code in order to make the best use of HTML’s powerful layout features.

Basic Structure of a Web Page

The typical Web page is highly structured. It starts with a header tag, the tag, which instructs Web browsers to treat the incoming text file as an HTML document. At the end of the HTML document, the tag marks the end of the layout information and counts as the end of the file when it’s being read by a Web browser. Web documents also traditionally contain other header-class tags such as the tag, which provides information about the Web page. This information includes things like the page title, which is defined by the tag. A properly designed page will then include the <body> tag, after which all human-readable content is arranged into its proper layout by the use of additional HTML tags.

The structure of HTML code dictates that almost all HTML tags are paired up, which means that they begin with an opening tag such as <div> or <span> and they must be closed by using a closing tag, like </div> or </span>. In the case of nested tags, such as the header and title tags, the first tag should close last, as in <head><title>This is the title. All HTML tags are enclosed by greater-than and lesser-than characters, < >. This indicates to the Web browser that it is receiving layout commands rather than actual human-readable text.

Common HTML Tags

Content within the Web page is typically arranged by the use of very common formatting and paragraph tags. These include the paragraph command, or <p> tag. After this tag, traditionally, a Web designer will place some human-readable text, then end the paragraph with a </p> closing tag. Text-formatting tags like <strong> bold and <em> for italics are useful for modifying text. It is also possible to give text different font faces by enclosing text within <font> tags. Web page content also traditionally uses human-readable headline text, which is larger than regular text and provides titles for sections of content within a page. These header tags are not the same as the <head> tag, however, as they are actually visible and appear within the readable content itself. The largest header text is defined by <h1>, while <h2> and <h3> (and so on) produce smaller text headers.

Modifications to the <background> tag can add a background image or change the background color of a page. For a background color, use the format #RRGGBB, where RRGGBB is a color code in RGB format. For instance, the color code “#FF0000” would produce a pure red background.

Another highly useful, common and often necessary feature in Web pages is the ability to link to other pages. This is achieved by the use of link code, which looks like this: <a href=”http://site.com/page.html”>Visit this Page</a>. Additional common HTML commands include tags that don’t need to be paired with a closing tag. These include tags like line breaks, <br />, and the horizontal rule command, <hr />.

The image tag, which places pictures within Web pages, is <img src=”http://imageurl.com/image.jpg” /> and does not need a closing tag. The IMG command can also define the height and width of an image. For instance, <img src=”http://imageurl.com/image.jpg” style=”height:100px; width:200px” /> will place an image and resize it to 100 vertical pixels by 200 horizontal pixels.

Additional Resources

See all

See all