2. Oppitunti - Sisältö sivulle
1. Ota esiin tekstisisältö. Kopioi se sivulle reippaasti copy-paste -toiminnolla.
Ehkä tärkein tägeistä on <p>. Sen avulla teksti jaetaan kappaleisiin. Rivinvaihtoja voi tehdä myös <br/>-tägillä, mutta tulee huomata ettei tämä ole sama asia kuin <p>. Itse välttäisin <br/>-tägin käyttöä mikäli mahdollista.
2. Lisää p-tägi jokaisen tekstikappaleen ympärille. Mieti kuinka tekstisi jaksottuu ja erottele leipäteksti kappaleiksi. Älä unohda lopetuselementtiä!
Jos sinulla ei ole vielä juurikaan sisältöä luotuna, käytä kokeiluvaiheessa mitä tahansa pitkää tekstinpätkää. Asemoinnissa on perinteisesti käytetty ns. Lorem ipsum-tekstiä. (Joka itseasiassa on ote Ciceron teoksesta De Finibus, Bonorum et Malorum. Kyseistä tekstiä on käytetty täytetekstinä painokoneen keksimisestä saakka kirjasimien ja taiton ulkoasun testaamiseen. Jos vain Cicero parka olisi tiennyt...)
3. Sitten otsikot
Oletetaan että sinulla on erisuuruisia otsikoita. Isoin otsikko merkataan H1-tägillä
<h1> Omat sivuni</h1>
sitä pienemmät h2, h3, h4 ja niin edelleen
<h2> alaotsikko</h2> <h3> väliotsikko</h3> <h4> pienempi otsikko</h4> <h6>otsikko jolla ei ole kauheasti väliä</h6>
Seuraavilla tägeillä voit myös lihavoida
<strong>
tai korostaa tekstiä
<em>
Järkevien otsikoiden ja hyvän kappalejaon avulla tekstistäsi tulee selkeää ja luettavaa. Webissä kannattaa varoa liian suuria tekstimassoja; yhteen kappaleeseen voi laittaa pari riviä ja parin kappaleen jälkeen sopivan väliotsikon.
Asioiden listaamiseen ei yleensä kannata käyttää <p>-tägiä. Tätä varten html-ssä on olemassa omat täginsä <ol> ja <ul>. Nimet tarkoittavat ordered list ja unordered list, eli järjestetty ja järjestämätön lista. Ero on siinä, että järjestetyssä listassa rivit on numeroitu, kun taas järjestämättömässä on oletuksena pallo joka rivin alussa. Listoja tehdään siten, että koko lista ympäröidään <ol> tai <ul> -tägeillä ja jokainen rivi <li> -tägeilla. Eli seuraavasti:
<h4> Harrastukseni:</h4> <ul> <li>Jalkapallo</li> <li>Kalastus</li> <li>Postimerkkeily</li> <li>Kitaran soitto</li> </ul>
4. Esikatsele
(Jos sivu on jo selaimessa valmiiksi auki, paina refresh)
Nyt sinulla pitäisi olla sivujesi tekstisisältö nätisti jäsennettynä. Tätä vaihetta ei tulisi vähätellä. Liian usein ammattilaisetkin unohtavat että juuri selkeä jäsennys tekee sivuista mukavat käyttää.
Mikäli teksti näyttää hyvältä, voidaan siirtyä lisäämään kuvia.
« Edellinen: Aloitus - Seuraava: Kuvien lisääminen »
