HTML-sivu
HTML on lyhenne sanoista Hypertext Markup Language. HTML-sivu näkyy Internetissä WWW-verkkoselaimella ja sivu voi sisältää tekstiä, hyperlinkkejä, kuvia, videoita ja ääntä. HTML WWW-sivun koodi kirjoitetaan tekstitiedostoon, jonka tiedostotunnus on html tai htm. Tiedostonimi siis voi olla esimerkiksi "testi.html". Jokaisella HTML-tiedostolla on oltava tietynlainen perusrakenne ja omien tiedostojen perusrakenne voi olla esimerkiksi alla oleva:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>oma nimi</title>
5 </head>
6 <body>
7 Oma koodi tähän
8 </body>
9 </html>
1. rivi kertoo minkätyyppinen tiedosto on kyseessä ja nyt on HTML. Toinen vaihtoehto olisi käyttää XML-koodia.
2. rivin teksti <html> aloittaa HTML-koodin ja viimeisen 9. rivin </html> lopettaa HTML-koodin. HTML-koodissa aloitusta yleensä seuraa lopetus kuten näkyy riveillä 2 - 9.
3. rivin kohtaan <head> voit kirjoittaa esimerkiksi title-otsikkotekstin, joka näkyy WWW-sivun otsikkona verkkoselaimen välilehdessä. Otsikko kannattaa tehdä aina ja siihen voit kirjoittaa esimerkiksi oman nimen, jotta opettajan on helpompi tunnistaa tekijä.
6. Kohtaan <body> kirjoitetaan oma HTML-koodi, joka näkyy Internetissä WWW-sivuna verkkoselaimella.
Oman testi.html tiedoston sisältö voisi olla esimerkiksi alla oleva:
<!DOCTYPE html>
<html>
<head>
<title>Karin testi</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Tässä testailen. <strong>Tämä kohta on lihavoituna!</strong> Tässä taas normaalia tekstiä.</p>
<img src="koirakuva.jpg">
</body>
</html>
HTML-koodissa käytetään alla olevan luettelon mukaista merkintätapaa:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>oma nimi</title>
5 </head>
6 <body>
7 Oma koodi tähän
8 </body>
9 </html>
1. rivi kertoo minkätyyppinen tiedosto on kyseessä ja nyt on HTML. Toinen vaihtoehto olisi käyttää XML-koodia.
2. rivin teksti <html> aloittaa HTML-koodin ja viimeisen 9. rivin </html> lopettaa HTML-koodin. HTML-koodissa aloitusta yleensä seuraa lopetus kuten näkyy riveillä 2 - 9.
3. rivin kohtaan <head> voit kirjoittaa esimerkiksi title-otsikkotekstin, joka näkyy WWW-sivun otsikkona verkkoselaimen välilehdessä. Otsikko kannattaa tehdä aina ja siihen voit kirjoittaa esimerkiksi oman nimen, jotta opettajan on helpompi tunnistaa tekijä.
6. Kohtaan <body> kirjoitetaan oma HTML-koodi, joka näkyy Internetissä WWW-sivuna verkkoselaimella.
Oman testi.html tiedoston sisältö voisi olla esimerkiksi alla oleva:
<!DOCTYPE html>
<html>
<head>
<title>Karin testi</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Tässä testailen. <strong>Tämä kohta on lihavoituna!</strong> Tässä taas normaalia tekstiä.</p>
<img src="koirakuva.jpg">
</body>
</html>
HTML-koodissa käytetään alla olevan luettelon mukaista merkintätapaa: