Nämä  ohjeet on laadittu käytettäväksi Kompozer web-editorille, joka on ilmainen, helppokäyttöinen ja hieman tekstinkäsittelyä muistuttava ohjelmisto. Tarkimpia tietoja löytyy ohjelman kotisivulta,  josta myös onnistuu sen laataaminen.

CaScadeS - tyylit

Ensimmäisenä pieni varoitus. Käytettäessä valmista mallipohjaa sivujen pohjana on muistettava, että sivujen ns. tyylitiedostossa on määritelty valmiiksi sivujen ulkoasua. Siinä on määritelty käytettäviä fontteja, taustavärejä, -kuvia, palstoitusta, marginaaleja yms. Tämä tyylitiedosto on aina nimetty .css päätteellä. Kompozerissa on oma työkalunsa .css-tiedostojen käsittelyyn ja se löytyy joko valikkoriviltä Tools ja Css Editor tai työkaluriviltä CaScadeS. Tehtävät muutokset näkyvät heti editorissa ja vaikuttavat tietenkin sivuston kaikkiin sivuihin, joten kannattaa harkita mitä tekee. Vinkkinä ota kopio tyylitiedostosta ja tallena se itsellesi toiseen kansioon.

Tekstin lisääminen

Helpoiten tekstin luominen onnistuu suoraan kirjoittamalla. Jos kuitenkin haluat hyödyntää tekstinkäsittelyohjelmien oikolukuominaisuuksia, on Kompozerissa muistettava tehdä liitä -toiminto valikkoriviltä komennolla Edit ja Paste Without Formating. 

Edellistä tapaa käyttäessä joutuu Kompozerissa toiminnon suorittamaan kappale kerrallaan, jos mallisivun kappaleet sisältävät omia määrityksiään. Ja onhan muutenkin kappalejako aivan suotavaa.

Kuvat sivuille

Kuvat kannattaa ensin muokata oikean kokoiseksi jollakin kuvankäsittelyohjelmalla. Tähän riitää ominaisuuksiltaan erinomaisesti esim. Xnview. Kuvista on syytä tarkistaa resoluutio,  se voi hyvin olla 72 pistettä/tuuma, näin ne eivät vie turhaa tilaa palvelimella. Samoin kuvien tallennuspaikka eli hakemistorakenne on syytä olla samanlainen kuin se palvelimella tulee olemaan. Kuvat lisätään joko valikkoriviltä Insert ja Image tai työkaluriviltä painikkeesta Image.

Edellisillä valinnoilla ruudulle avautuu Image Properties –ikkuna, jonka ensimmäiselle riville haetaan kuvatiedosto. Kohtaan Tooltip voidaan kirjoittaa viesti, joka aukeaa kun hiiren osoitin viedään kuvan päälle ja kohtaan Alternate text kannattaa laittaa yksinkertainen selitys kuvasta, jos syystä tai toisesta ei kuva latautuisikaan näkyy ainakin tämä selaimessa. Näillä määrityksillä kuva tulee yleensä sivun vasempaan reunaan. Kuvan tarkemman paikan ja muita ominaisuuksia voi määritellä helpoiten ns. sisäisten tyylien avulle (nämä vaikuttavat vain aktiiviseen elementtiin ja vaikutus näkyy ruudulla). Napautetaan hiirellä kuva aktiiviseksi, jolloin Kompozerin alarivin <img> merkintä muuttuu lihavoiduksi ja kuvan ympämille tulee laatikko.

Painetaan hiiren oikealla painikkeella <img> merkkiä ja valitaan sieltä Inline styles. Paikan määrittämiseksi valitaan välilehti Box ja sieltä esim. Float, josta voidaan valita sopivat arvot.

Linkit toisaalle

Html-kielen perusominaisuus, sivujen linkitys tehdään myös kahdella vaihtoehtoisella tavalla. Valitaan valikkoriviltä Insert ja Link tai työkaluriviltä painike Link. Link Text –osaan tulee mitä sivulle tulee näkymään (tämä voidaan myös maalata tekstistä ennen valintaa). Link Location –osaan tarkka osoite minne linkki ohjataan. Paras tapa tähän on kopioida osoite selaimen osoitekentästä, koska usein osoitteet ovat tosi monimutkaisia. Ja onhan vaihtoehtona myös hakea linkkitiedosto omista kansiosta.

Tietoa taulukkoon

Taulukoilla havoinnollistetaan usein lukuja tai muuta tietosisältöä. WWW-sivuilla taulukoilla voi myös jäsentää sivun ulkoasua palstoituksen tapaan. Kompozerin valikkorivilla on oma valinta taulukoiden luontia varten, se löytyy valikosta Table ja Insert sekä sieltä vielä Table tai ehkä helpommin työkaluriviltä ja valinta Table. Sieltä aukeaa alla olevan kuvan oikean puoleinen välilehti, josta voi suoraan hiirtä vetämällä ja napsauttamalla valita sopivan kokoisen taulukon. 

Muista kahdesta välilehdestä voi taulukon ominaisuuksia säätää halutessaan tarkasti. Näitä ovat mm. rivien ja sarakkeiden määrä sekä tekstin tasaus.

Listat

Monet asiat saa järjestykseen listoilla ja listat saa sivulle kuten monet muutkin kahdesta paikasta. Valikosta Format löytyy valinta List, josta pääsee valitsemaan erilaisia listoja. Samoin työkaluriviltä löytyy valinnat, joista voi valita Järjestetyn, Järjestämättömän tai Määritelmälistan.

Tiedostojen nimeäminen

Muista aina tallentaa mallina käyttämäsi tiedosto valikosta Save As, jotta malli säilyy muuttumattona. Nimeä tiedostot yksinkertaisilla kuvaavilla nimillä, joissa ei ole skandinaavisia aakkosia tai erikoismerkkejä eikä välilyöntejä. Pääsivun nimen tulee olla aina index.html samoin muidenkin sivujen tiedosto pääte on oltava .htm tai .html. Kompozerissa kannattaa tarkistaa valikosta Format valinta Page Title and Properties ja sen arvot, jotta ne pitävät paikkansa sivun kanssa.