Text in a Website - Differences tags strong, em, b, i, u

Sooner or later, every Web creator discovers that designing for the network is very different from developing something that is going to be printed.

Before releasing your graphical creator of interior web pages, you must overcome a few conceptual obstacles.

Consider the difference between a page made with HTML and one generated in a word processor.

These programs show the exact appearance of the document before printing, know how large the headers will be, what font they use, if the text wraps from one line to another, etc. If you see something you do not like, change it through the menus and format commands.

The word processor, in other words, gives you absolute control over every detail of your page.

The Web is a freer place. When creating an HTML document you have no idea how that page will look on another's computer.

That person may have their browser configured to not display images, or show large characters instead of standard dimensions, or they may have reduced the window and placed it in a corner of their desk.

In addition, visitors who access your site through phones will get another display (and completely different). In summary, you can not control the presentation details on the Web the way you can in a printed format.

However, it is possible to offer all the information that a web browser needs to present its pages properly.

This is done by structuring the pages so that the browsers treat the elements of the page in a consistent manner, regardless of the browser configuration of their visitors.

Logical structure versus physical format

Before starting to create Web pages with HTML markup, you must understand another concept: the difference between structuring a document (dividing its content into different components such as headers, paragraphs, lists, etc.) and formatting it (making make those elements attractive by applying italics, changing text size, adding color, etc.)

Novice Web administrators who do not understand this difference often end up formatting when they should be structuring, resulting in unordered pages and complicated HTML keep.

In the beginnings of the Web, this language used two types of elements to emphasize the difference between the structure of the document and its format:

• Logical elements: Sometimes called semantics, they define the individual components that make up the Web page. They identify what is a heading, a paragraph, a list, etc. In other words, it talks about the structure of the page. The logical elements, however, do not define the format of these components (what they will look like on the screen)
• Physical elements: Sometimes called typographical, they deal with the format. Some examples include elements that apply to cursive, bold, underlined text and different sources. They do not tell us anything about the way the page is structured; instead, they indicate to the browsers how to format the content

Logical elements have dominated the HTML markup since XHTML 1.0 was invented, strengthened its domain and eliminated many of its physical elements (such as <font> to change the font and <u> to underline text.)

HTML5 goes one step further ; changes the definition of two physical elements that the most stubborn Web programmers did not want to abandon: <b> and <i>. Now, <b> no longer means bold text, but statically displaced text, and <i> no longer mentions text in italics, but text in alternative voice, such as foreign words or technical terms.

Obviously, web browsers are not affected

They always display text <b> in bold and text <i> in italics, unless you use a style sheet that indicates otherwise.

But the definition change reinforces a fundamental modification in the way of thinking: HTML elements must write the logical function of the textual parts, not their typographic presentation

Surely you wonder why HTML gurus were so keen to eliminate the format of HTML documents. Let's see some reasons:

• The embedded format is problematic: After seeing the marking of an HTML page, you will not want to back down. To facilitate the changes you will have to make your way between the format labels that control margins, colors, fonts and alignment
• The logical documents are adaptable: By eliminating the format of a page, it increases its flexibility. You can use style sheets to alter the appearance of your Web page and modify them whenever you want. If you have to show the Web page in another way in another different device (or browser), it is also possible to do so
• Logical documents convey meaning: : Logical elements allow external programs to analyze the HTML of a page. For example, someone could create an automatic search program that will analyze web pages and foreign only top-level headings to produce a minimalist page summary. A program could search Amazon.com to find only book reviews. someone could make a junk mail list by reading <address> elements. A comparable program that will encounter only physical elements would not produce such interesting results
• Logical documents are accessible: Screen reading software and other automatic tools work much better with logically structured pages. For example, a screen reader can guide a blind person through the page by announcing titles or links, without having to read everything out loud

NOTE:
The vision of a Web in which the elements indicate that it contains a page (prices, sizes, email addresses, etc.) instead of what it looks like, is called Semantic Web. According to the visionaries who built the Internet, this could lead to a golden age of access to information and superintelligent searches.