Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Ohjeet nettisivujen valmistukseen

1. Valitse ohjelma, jolla valmistat sivun. Voit valmistaa nettisivun muiden muassa Adoben Dreamweaverillä, Textwranglerillä tai käyttöjärjestelmäsi notepadilla.

2. Avaa valitsemasi ohjelma ja luo uusi dokumentti. Valitse DocType-ponnahdusvalikosta haluamasi tyyli ja luo tiedosto.

3. Valmiin pohjan ensimmäiseltä riviltä näet dokumentin tyypin. Esimerkiksi käyttäessäsi HTML5:tä, koodissa lukee <!DOCTYPE HTML>

Image Removed

4. <title> </title> merkkien väliin laitetaan sivun otsikko, jonka halutaan näkyvän selaimessa välilehtien kohdalla.

5. <body> </body> merkkien väliin kirjoitetaan sivun varsinainen sisältö:

  • <h1> </h1> merkkien väliin laitetaan sivun pääotsikko, <h2> jne. väliotsikot
  • linkkejä voit lisätä esimerkiksi tällä komennolla <a href=¨nettisivu.fi¨>paina tästä</a>
  • voit katkasta rivin <br> -komennolla
  • <p> on kappalejako
  • <b> </b> -komennolla voit tummentaa, <i> </i> -komennolla voit kursvioida ja <u> </u> -komennolla voit alleviivata

Image Removed

6. CSS-tyylimääreitä voit muokata lisäämällä <head> -tagin alle style sheetin

  • sen alle voit määritellä esimerkiksi taustan värin ja fonttiperheen

7. Kuvan voit lisätä Dreamwaverin avulla painamalla ylälaidasta insert, valitsemalla image ja seuraamalla ohjeita.

  • koodi näyttää tältä: <img src="images/kuva.jpg" width="465" height="106">
  • kuvan tulee löytyä head directorystä ja niille voi tehdä oman kansion

Image Removed

8. Faviconin, eli välilehden nurkassa näkyvän kuvan, voit lisätä käyttämällä koodia <link rel="shortcut icon" href="kuvan nimi">

  • faviconin tulee olla 16 x 16 pikseliä ja se tulee lisätä head directoryyn muiden sivujen joukkoon

9. Muista validoida sivu, eli tarkistaa sen mahdollisten virheiden varalta täällä.

Tekemämme sivu löytyy täältä.