HTML Text Fundamentals – Mark up Text
Logical Text Markup refers to marking up single words or entire sections of text to highlight them semantically (or logically) in the text. The most important types of text markup are:
-
strong vs. bold – what is the difference?
-
emphasis vs. italic – what is the difference?
-
inserted vs. underline – what is the difference?
-
deleted vs. strike-through – what is the difference?
-
blockquote vs. quote – what is the difference?
Format Text Using Logical or Physical Markup
Text on web pages can be marked up using HTML tags to highlight it visually, e.g. in bold or italics. There is a difference between logical (semantic) markup and physical (visual) markup.
These two types of markup usually have the same visual appearance. However, Semantic Markup gives the text a special (content-related) meaning. This is not the case with visual markup.
Text on a web page should always be marked up logically according to its content-related meaning. This has the following advantages:
-
Accessibility:
Visually impaired people can read the text on web pages using a screen reader. If the text is logically marked up, then the layout, structure and content of the website is easier to understand.If you set the font size for normal text with CSS so that the text looks like a heading, then a user can assume that the text is supposed to be a heading when viewing the page on the screen. However, blind or visually handicapped people cannot recognize this. For them, it is just normal text without any special weighting or emphasis.
-
Reading by a search engine crawler:
The inclusion of a web page in the index of search engines is usually done by so-called spiders or bots. These are programs that crawl the web independently and add web pages to the search engine index. In order to recognize the structure and content of a page, they logically evaluate the content, including the HTML tags. -
Reading by other programs:
What applies to search engines is also significant for other programs that analyze a web page. Social Networks usually display a headline and a short preview of the web page when a link is shared.