..


Sponsored Links

Basics of HTML mark-up (essential) of the text

The purpose of this guide is to illustrate to the reader the syntax of the HTML markup language would be advisable for the good web-writer, you know the basic rules: the text on the Web, in fact, turns into hypertext only thanks to the magical powers of the mark HTML-up is, we must remember, the basic structure of each web page.

In the previous lesson we talked about alignment, font selection, etc.. Let's see now, in a very practical way, how to make a vital of a text format for its online publication.

We omit here the analysis of the structure of a web page (for those interested in suggersico read here ) and get straight to the formatting of our text.

Titles

The title of a website is content, and header tags within <title> and </ title>, within the header tags (h1, h2, h3, ..., h6).
The title itself, normally, is marked by <h1> and </ h1>. Example:

 



 <h1> This is the title </ h1>

 
The sub-title is contained within <h2> and </ h2>. Example:
 



 <h2> This is the sub-heading </ h2>

 
Any other titles (hierarchically below them) will be defined the same way using h3, h4, h5 and h6 (the higher the number following the "h" decreases the importance of the title).

Paragraphs

Normally, the text within an HTML page is contained between the tags and <p> </ p>, which respectively open and close a paragraph of text. Example:

 



 <p>







 My text here ... ...







 </ P>

 

Manage the alignment

To make the horizontal alignment of text within a paragraph you must use style sheets (CSS) through text-align property.
The property in question accepts four values:

  • left (left justified; default)
  • right (right-aligned)
  • center (center alignment)
  • justify (align justified)
Here's an example:
 



 <p style="text-align:center">







 ... Example of centered text ...







 </ P>

 

Bold, italic and underlined

These three aspects of the text manages, respected by the <b> tags (bold), <i> (italic) and <u> (Underlined). Example:






 <b> Teso bold </ b>







 <i> Teso italic </ i>







 <u> Teso underlined </ u>



Worth noting that the tag has an equivalent in bold <strong> tags:
 



 <strong> Teso bold </ strong>

 
and italic tags in <em>:
 



 <em> Teso in italics </ em>

 

Add Web Link

A hyperlink (or, more commonly, links) can be inserted through the <a> and its href attribute. Vedaimo an example:

 



 <a href="http://www.sito.com/mario.html"> Mario Go to page </ a>

 
As you can see in the href attribute is specified in the web address of the destination page that opens when you click on the linked text.
Obviously nlla prohibits both be linked to an image rather than text (as in our example).

Insert image

To insert an image is, of course, necessary that this be available online that maintains its own URL.
To insert an image is used to <img> this:

 



 <img src="http://www.sito.com/foto.jpg"/>

 
As you can see the src attribute contains a reference to the location of our image.

Obviously the information given in this lesson are very simple partial and represent the bare minimum. And 'only through a thorough knowledge of HTML and CSS that we will be able to format our content in a truly accurate and complete.

Web Writing Guide
E-Learning
CSS (Course) CSS (Course)
Web Design and Accessibility according to W3C CSS and XHTML. Starting from 29 €.
Web Design (Course) Web Design (Course)
Design Web Sites with HTML, CSS and Dynamic HTML. From 39 €.
Webmaster Advanced (Course) Webmaster Advanced (Course)
Become a professional Webmaster. From 39 €.
Sponsored Links