Tee oma web-sivu, osa 1



Oma kotisivu on hyvä käyntikortti sekä yksityiselle että yritykselle. Sivulla voi esitellä itsensä harrastuksineen, perheineen ja yhteystietoineen eikä oman kotisivun teko ole edes vaikeaa.


Uusimpien selainten HTML-editorit sekä myös erilliset HTML-editorit tekevät kotisivun ilman, että tarvitsee tietää juuri mitään HTML (Hypertext Markup Language) -kielestä.

Kielen tunteminen helpottaa kuitenkin työtä ja tarjoaa paljon paremmat mahdollisuudet tehdä juuri sellainen kotisivu kuin itse haluaa. Itse HTML-dokumentin kirjoittamiseen käy hyvin esimerkiksi windowsin tekstinkäsittelyohjelma, kunhan muistaa tallentaa dokumentin tekstimuodossa.

HTML - dokumentin tiedostonimen päätteenä käytetään joko .HTML tai .HTM , esimerkiksi INDEX.HTML tai INDEX.HTM .

HTML-kielen käskyjä kutsutaan nimikkeellä TAGI. Tagi sijoitetaan <> - merkkien väliin, esimerkiksi <BR>. HTML - dokumentin perusrakenne on seuraava:

<HTML>                (HTML-dokumentin aloitus)
<HEAD>                (Otsake - osa alkaa)
<TITLE>               (Sivun otsikko, näytetään mm. selaimen otsikkopalkissa)
Otsikko			
</TITLE>              (Otsikko päättyy)
</HEAD>               (Otsake päättyy)
<BODY>                (Sivun sisältö alkaa)
Varsinainen sivun
sisältö tulee tähän.
</BODY>               (Sisältö päättyy)
</HTML>               (HTML-dokumentti päättyy)

Esimerkissä on kaikki HTML-dokumentin pakolliset tagit. Kuten esimerkistä näkee tagi kumotaan tagilla jonka edessä on kenoviiva /, esim. <HTML></HTML>. Tageissa tulee huomioida järjestys, eli tagit kumotaan päinvastaisessa järjestyksessä kuin ne on asetettu (katso esimerkkiä).

Tekstin muotoilu

Tekstin muotoiluun on monia vaihtoehtoja. Tekstiä voi paksuntaa, sen voi kirjoittaa kursivoituna tai vaikka alleviivattuna. Dokumenttiin voi myös tehdä rivivaihtoja tai kappaleenvaihtoja.

Tekstin muotoilussa on huomioitava, että peräkkäiset välilyönnit tulkitaan yhdeksi välilyönniksi, eli pidemmät välit on toteutettava keinoin, joihin palataan myöhemmin.


<BR>

Pakotettu rivinvaihto (break), eli teksti jatkuu uudelta riviltä.
Esimerkki:
Tämä<BR>on<BR>esimerkki.

Dokumentissa:
Tämä
on
esimerkki.


<P>

Kappaleenvaihto (paragraph), eli teksti jatkuu uudelta riviltä, väliin tulee yksi tyhjä rivi.
Esimerkki:
Tämä<P>on<P>esimerkki.

Dokumentissa:
Tämä

on

esimerkki.


<H1><H2><H3><H4><H5><H6>

</H1></H2></H3></H4></H5></H6>

Otsikko (headings). Otsikkoja on 6 eri kokoa. Otsikkotagi täytyy aina kumota koska teksti kirjoitetaan valitulla otsikkokoolla otsikon lopetustagiin saakka.
Esimerkki:
<H1>Otsikkokoko 1</H1>
<H2>Otsikkokoko 2</H2>
<H3>Otsikkokoko 3</H3>
<H4>Otsikkokoko 4</H4>
<H5>Otsikkokoko 5</H5>
<H6>Otsikkokoko 6</H6>

Dokumentissa:

Otsikkokoko 1

Otsikkokoko 2

Otsikkokoko 3

Otsikkokoko 4

Otsikkokoko 5
Otsikkokoko 6

<B></B>

Lihavoitu teksti (bold).
Esimerkki:
tämä on <B>esimerkki.</B>

Dokumentissa:
Tämä on esimerkki.


<I></I>

Kursivoitu teksti (italic).
Esimerkki:
tämä on <I>esimerkki.</I>

Dokumentissa:
Tämä on esimerkki.


<U></U>

Alleviivattu teksti (underline).
Esimerkki:
tämä on <U>esimerkki.</U>

Dokumentissa:
Tämä on esimerkki.


<TT></TT>

Tasalevyinen teksti (teletype) eli kaikki merkit ovat yhtä leveitä.
Esimerkki:
<TT>Tämä on esimerkki.</TT>

Dokumentissa:
Tämä on esimerkki.


<PRE></PRE>

Tasalevyinen teksti (preformatted text) joka esitetään asettelultaan samanlaisena kuin se on kirjoitettu. Muuten samanlainen kuin teletype -teksti, mutta peräkkäiset välilyönnit esitetään. Esimerkiksi taulukoiden teko on helppoa.
Esimerkki:
<PRE>
Nimi    Osoite
Matti   Hakakatu 12
Jukka   Koivutie 6
</PRE>

Dokumentissa:

Nimi    Osoite
Matti   Hakakatu 12
Jukka   Koivutie 6

<BLOCKQUOTE></BLOCKQUOTE>

Tekstin sisennys (block quote).
Esimerkki:
<BLOCKQUOTE>Tämä on esimerkki.</BLOCKQUOTE>

Dokumentissa:

Tämä on esimerkki.
MARKO HAKALA
6.2.1998

AJASSA -SIVULLE