HTML/CSS-taiton perusteet - hyvin. Tämä pitää sisällään mm. ymmärryksen selainten float/clear-käyttäytymisestä, position-attribuutista, marginien cascade-ominaisuuksista sekä box-modelista (HTML <= 4 vs. HTML 5, sekä selainten väliset erot tulkinnassa).

Tekstin joustavan taiton CSS:llä. Tähän vaaditaan erinomainen ymmärrys fontin ominaisuuksien periytymisestä, erilaisista "reset CSS" -vaihtoehdoista sekä CSS:n yksiköistä ja niiden eroista (esim. em vs. px).

Printtiä tullaan taittamaan entistä vahvemmin HTML/CSS:n avulla, joten ymmärrys font-facen käytöstä ja vaihtoehtoisista menetelmistä custom-fonteille on hyvä hankkia nyt, kun web-maailmassa voidaan saavuttaa edes kohtuullista typografiaa.

JavaScriptin käytön inside out. Meidän tapauksessa vahvistettuna jQueryn kertotaululla. En kuitenkaan suosittele hyppäämistä minkään kirjaston käyttöön ennen kuin JavaScript on syntaksin ja kielen erityispiirteiden osalta hyvin hanskassa (mm. eventit ja closuret).

HTML 5 & Canvas. Canvas-osaamisella tullaan vielä korvaamaan monta savitiilianimaatiota.

---

CSS 3 - laajana oppituntina. Tämä CSS-päivitys korjaa monta puutetta vanhemmissa standardeissa. Versio 3 sisältää lukuisia tutustumisen arvoisia uusia määrityksiä, mm. uudet border-ominaisuudet, uudet background-ominaisuudet sekä erityisesti box-sizing-määritys. Ominaisuuksia on mahdollista hyödyntää jo nyt - sillä edellytyksellä että tarjotaan vanhemmille selaimille turvallinen fallback-ratkaisu. Tutustumisen voi aloittaa vaikka osoitteessa: www.css3.info

Käsite semanttinen web. (X)HTML ei ole ensisijaisesti merkkauskieli layouttien tekemiseen. Hakukoneet ja muut robotit arvostavat (entistä enemmän) osaamistasi merkkauskielen semanttisista piirteistä. Äläkä unohda mikroformaatteja!

Käytännöt hyvän tietoturvan puolesta. Front-end-kehittäjänä sorrut ehkä ennen kaikkea XSS-haavoittuvuuksiin tai tarjoat kaikki lomakkeet autocomplete-tilassa. Panosta siis erityisesti kultaisen säännön - Filter Input, Escape Output - jälkimmäiseen osioon.

Keskeiset optimointimenetelmät. WPO, Web Performance Optimization, on nouseva trendi ja siihen liittyvällä osaamisella on vielä mahdollista erottua massasta. WPO on osa ammattiylpeyttä, mutta se tuo myös aitoa hyötyä asiakkaalle ja loppukäyttäjälle mm. paremman käyttökokemuksen myötä.

HTTP-protokollan perusteet. Tutustu erityisesti selaimen, käyttämäsi HTTP-palvelimen ja proxy-palvelinten välimuistiominaisuuksiin. Opettele lukemaan niihin liittyviä request/response headereita. Opettele myös käyttämään oikeita metodeja (erityisesti GET vs. POST) oikeissa paikoissa. Älä unohda, että selain kertoo paljon itsestään HTTP-otsakkeiden avulla, mutta muista myös, ettei mihinkään tietoon voi luottaa varmasti.

Erot merkistöjen välillä. Keskeisimmät merkistöt (meille) ovat 7-bittinen Ascii-merkistö, 8-bittiset Latin-merkistöt (erityisesti ISO-8859-1/ISO-8859-15) sekä 8-bittinen UTF-8-merkistö. Tutustu myös vaihtoehtoihin ohjata selaimen käyttämää merkistöä (HTTP vs. HTML) sekä merkkien enkoodaukseen HTML-kielessä ja URL-osoitteissa.

Selainten quirksit. Näitä ei taida oppia kuin kantapään kautta. Hyvää tutkimusta, jo vuodesta 1998: www.quirksmode.org.

Perusymmärryksen väreistä ja väriavaruuksista. On turhauttavaa tallentaa jälkikäteen kuvia uudelleen tai päivittää CSS:n värisävyjä vain, koska PSD sattui olemaan Adobe RGB-väriavaruudessa. Asiakkaalle on myös osattava perustella, miksi vihreä hänen näytössään ei nyt aivan vastaa sitä käyntikortin nurmenvihreää.

Työkaluista en välitä sanoa enempää, kuin että PSD:n pilkkomiseen ei tarvita 800 euron softaa.

Loppusanat

Edellä esitetty lista voi vaikuttaa epäjohdonmukaiselta käsitelleessään toisia osa-alueita ylimalkaisesti, toisia yksityiskohtaisesti, attribuuttitasolla. Olen kuitenkin pyrkinyt erottamaan tähän listaan asioita, joiden kanssa kehittäjä joutuu erityisesti painiskelemaan. Olen myös tarkoituksella jättänyt listasta pois asiat, joita jokaiselta front-end-kehittäjältä edellytetään joka tapauksessa.

Seuraavana kirjoitusvuorossa: "Jos tulet meille back-end-kehittäjäksi..."