TEXT TAGS AND A LITTLE CSS3 - HTML5 - page 41

h rowing a Web page together works i ne but may leave much to be desired in terms of what
the user sees and whether she wants to visit the site again. Let's look at a Web page with no
structure but with the fundamental elements of a Web page:
<! DOCTYPE HTML >
< html >
< head >
< meta http - equiv = ”Content-Type” content = ”text/html; charset=UTF-8” >
< title > Fundamentals </ title >
</ head >
< body >
This is text. You don't need a tag for Plain Old Text (POT).
< a href = ”anotherPage.html” > Click here for another page </ a >
< img src = ”logo.png” >
</ body >
</ html >
As you can see in Figure 3-1, everything is jumbled. h e image appears right in the middle of
the link (blue underlined text), the image appears right in the middle of the page, and
generally it doesn't make much sense.
45
Figure 3-1: The most basic Web elements.
When you're organizing a Web page, the links should be organized into a navigation system that's
easy for those looking at your Web page to use. In the page shown in Figure 3-1, the link is
broken up by the graphic and seems to be part of the text rather than part of a navigation system.
A LITTLE MORE ORGANIZATION
One of the basic conventions in Web design is placing the logo in the upper-let corner of the
page. Likewise, Web pages place links organized into a coherent system of navigation. By
adding two more tags, you can go a long way toward organizing your page:
<br> : Generates a single-space line break
<wbr> : Generates a line break opportunity