Menu

  •    
  • Home
  • Digital Accessibility
  • Web Accessibility Testing
    • Testing Principles
    • Automated Testing
  • Accessible Learning Materials
  • Development Principles
  • Inclusion in the learning process
  • HTML
    • HTML Syntax
    • Text Tags
  • CSS
    • CSS Syntax
    • Text Formatting CSS
  • PHP
    • PHP Syntax
    • PHP Functions

Contacts

  • t.todorov@ts.uni-vt.bg
  • 5003 Veliko Tarnovo, Bulgaria, Teodosii Turnovski St. #2

Text Tags

Tags for structuring text in HTML

From the point of view of the convenience of visitors, it is good that the text in web pages is divided into sections with headings, subheadings, paragraphs and lists. A solid line can be used as a separator between sections, reflecting the thematic break in the content.
Arranging and structuring text on a web page is not done in the code editor by the newline and tab keys, but by HTML text tags. The main tags for structuring text are:
  • <h1>, <h2>, …, <h6> – heading in the text
  • <p> – paragraph
  • <br> – line break
  • <hr> – horizontal line
<!DOCTYPE html> <html> <body> <h1>HTML5 Tutorial</h1> <h2>Syntax</h2> <p>The syntax rules in HTML5 are ...</p> <hr> <h2>Text Structuring</h2> <p>In HTML5, text is structured by headings and paragraphs ...</p> <hr> </body> </html> Peculiarities of using tags to structure text:
  • The most important heading in the web page is marked with <h1>, its subheadings with <h2>, and so on.
  • A line break with <br> means a new line within the same paragraph.
  • Search engines use titles to index the content of web pages.
  • CSS styles are used to format text in web pages, which determine the position of the text and characteristics such as font, color, background, bold, size, letter spacing, etc.
Lists allow visitors to more easily navigate the content of a web page. Numbered and unnumbered lists are the most used. The syntax of an unnumbered list is: 

    
 <li>element 1
    <li>element 2
    ...
<!DOCTYPE html> <html> <body> <h1>Colors:</h1> <ul> <li>red</li> <li>green</li> <li>son</li> </ul> </body> </html>
CSS styles allow you to choose the leading character of the list, as well as additional formatting of the elements. Lists can be nested to create more complex content structures.