Versions Compared

Key

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

...

-Ensin haimme googlesta oikean dokumenttityypin.

(http://www.google.fi/search?gcx=w&sourceid=chrome&ie=UTF-8&q=html+doctype)

2. Rakenne: (html, head, body)

-Teimme html:lle sen perusrakenteen:

<html>

...

<head></head>

...

<boby></body>

...

</html>

  1. Otsikko, teksti, kuvat, linkit -Lisäsimme otsikon, joka on photoshopilla tehty kuva bodyn sisään <h1><img alt="otsikko" id="otsikko" src="kuvat/logo.png" /></hi>.  Lisäsimme tekstin bodyn sisälle <p>teksti</p>. Lisäsimme myös linkit bodyn sisälle, jotka ovat kuvan muodossa <a href="sivun osoite"><img alt="kuvan nimi" src="kansion nimi josta kuvat löytyvät" /></a>

  2. Css-tiedoston luominen, tyylien määrittely -Loimme Notepadille css-tiedoston tallentaen tiedoston nimellä tyyli.css. Määrittelimme aluksi taustan tyylin, fontin ja fontin värin. Kaikki laitettiin bodyn sisään näin: body{} ja sulkujen sisään:background-color:värin nimi; font-family:verdana; color:värin nimi; Tarkat värien nimet etsimme googlesta. Samaan tyyliin määritimme otsikon tyylin h1{}, linkkien tyylin a{}, kuvien tyylin img{} ja otsikon tyylin.

  3. Sisältö -sisällön etsimme googlettamalla rumia nettisivuja ja lisäsimme sivut linkeiksi.

  4. Favicon

  5. Validointi + virheiden korjaaminen

  6. Z-asemalle siirtäminen

  7. VALMIS!