Web Design - Web Authoring / Intro to HTML: HTML Basics

Sections:  Introduction  |  Section 1  |  Section 2  |  Section 3

Section One:  Part A  |  Part B  |  Part C  |  Part D  |  Part E  |  Part F  |  Part G  |  Part H

HTML Issues HTML has some quirky behaviors, particularly in regard to creating spaces and new lines/line breaks in an HTML document. While these behaviors are quirky, they are by no means insurmountable. Creating Spaces Imagine you have created a web page. In the web page you have two sentences that you want to be spaced apart from each other. If you were creating a Word document or a PowerPoint presentation (as an example), you could simply press the space bar to create space between your two sentences. You cannot do that when creating HTML documents as HTML only renders (makes visible) one space in the web browser, even if your HTML document includes more spaces. To create a space between text or images (when they are introduced), you can use a special HTML character code for a non-breaking space. The code for a non-breaking space is: &nbsp; The code can be used repeatedly to create the desired spacing effect. NOTE: The non-breaking space is a quick fix for solving minimal spacing issues. If you have bigger spacing issues that can't be fixed with a couple of non-breaking spaces, you should use a different method (which we will address in the future) to achieve these ends. Creating New Lines / Line Breaks Imagine once again that you have created a web page. In the web page you have two sentences that you want listed on different lines. If you were creating a Word document or a PowerPoint presentation (as an example), you could simply press the Enter button to move the second sentence to a new line. You cannot do that when creating HTML documents as HTML still only renders (makes visible) one space in the web browser, even if the sentences in your HTML document are separated by multiple lines. To create new lines between blocks of text, web designers often use the HTML tag <br>. NOTE: The <br> tag does not have a closing tag. The <br> tag is one of those standalone tags that were referred to earlier. You may also hear standalone tags - tags with no closing tag - referred to as empty tags. Each <br> tag will create a new line break. If you wanted to create a double spaced appearance between two blocks of code you would simply insert two <br> tags between the text blocks. It's a Matter of Choice... When using more than one <br> tag to create your desired line spacing format, you can place <br> tags next to each other or you can list each of them on a separate line - it is a matter of preference. Just be sure no text is typed between the tags. See the examples below for acceptable uses of multiple <br> tags. Next

© 2008 KCDL. All rights reserved.