Tärkeiden asioiden korostaminen

HTML:ssä on olemassa kaksi erilaista rakenteellista elementtiä (tyyliä) kappaleen sisäisten korostuksien tekemiseen.

• strong-elementillä merkitsemme tekstin joukosta erityistä korostusta (vahvennusta) tarvitsevia osia. Graafisissa HTML-editoreissa vahvennuksen tekemiseen käytämme Vahvennus (engl. Strong) -tyyliä. Esimerkiksi FrontPage-editorissa vahvennus-tyylin saa käyttöön merkkimuotoilujen yhteydestä valikkokomennolla Format | Font (suom. Muotoile | Fontti). Tyylin käytössä kannattaa olla erityisen tarkkana, koska ulkoasultaan samannäköisen lopputuloksen saamme kirjasimen lihavoimisella (engl. Bold). Lihavointia ei kuitenkaan kannata käyttää, koska se määrittää ainoastaan tekstin ulkoasusta. Vahvennettava teksti ei ole välttämättä lihavoitu, vaikkakin selaimet näyttävät vahvennuksen usein lihavointina.
• em-elementillä merkitsemme tekstin joukosta lievenpää korostusta tarvitsevia osia. Graafisissa HTML-editoreissa vahvennuksen tekemiseen kannattaa käyttää Korostus (engl. Emphasis) -tyyliä. Esimerkiksi FrontPage-editorissa korostus-tyylin saa käyttöön merkkimuotoilujen yhteydestä valikkokomennolla Format | Font (engl. Muotoile | Fontti). Tyylin käytössä kannattaa olla erityisen tarkkana, koska ulkoasultaan samannäköisen lopputuloksen saamme kirjasimen kursivoinnilla (engl. Italic). Kursivointia ei kuitenkaan kannata käyttää, koska se määrittää ainoastaan tekstin ulkoasun. Korostettu teksti ei ole välttämättä kursivoitu, vaikkakin selaimet näyttävät korostuksen usein kursivointina.

Kuva 10. Esimerkki korostuksien käytöstä listassa ja tekstikappaleessa.

<p>Tässä tekstikappaleessa on sekä <em>korostettavaa</em> että
  <strong>vahvennettavaa</strong> tekstiä.</p>


<ul>
<li>Tässä listassa on <em>korostettavaa</em> ja
  <strong>vahvennettavaa</strong> tekstiä.</li>
<li>Tämä listan kohta vaatii <em>erityistä korostamista</em>.</li>
<li>Tämä listan kohta vaatii
<strong>erityistä vahventamista</strong>.</li>
</ul>