Tapahtumapaikka:

Pe 16.10.2020 klo 9–16

Koulutus on kumppanimme Corellian järjestämiä ja avoimia vain DigiMaMan jäsenille. Kurssien päivämääriin saattaa tulla jotain muutoksia Covid-19 -tilanteen vuoksi, joten pidätämme oikeuden muutoksiin.

HTML ja CSS kehittyvät nopeasti ja selaimet ovat alkaneet tukemaan uusia ominaisuuksia, joiden avulla verkkosivujen toteuttaminen voidaan tehdä aiempaa fiksummin. CSS -kieleen on tullut uusia asemointitekniikoita, valitsimia ja mittayksiköitä. Näiden tehokkaalla hyödyntämisellä voit helpottaa omaa työtäsi merkittävästi. Tällä kurssilla opit hyviä käytäntöjä koodin toteuttamiseksi siten, että se on helpommin hallinnoitavissa ja muokattavissa myös tulevaisuudessa ja, että sivustosi toimii kaikissa selaimissa.

HTML ja CSS -jatkokurssilla opit mm.

• Uudet CSS asemointitekniikat; Flexible box ja CSS Grid
• Käyttämään skaalautuvaa tekstiä
• Hyödyntämään CSS uusia ominaisuuksia (mm. feature queries, calc()…)
• Lisäämään sivustollesi aidosti responsiivisia kuvia (näytön koon mukaan valikoituvia kuvia)

Kurssin kohderyhmä

Kurssi on suunnattu kaikille websivustojen tuotantoon osallistuville, jotka haluavat viedä osaamisensa perusteista ylemmälle tasolle. Kurssilla oppiminen tapahtuu hands-on-harjoitteluna.

Kurssin esitietovaatimukset

Esitiedoiksi riittävät HTML- ja CSS-perusteiden hallinta.

Mitä uutta perusteiden jälkeen

• harvinaisempia HTML-elementtejä
• Hyviä käytäntöjä sivurakenteen toteuttamiseksi

Taulukoiden käsittely ja muotoilu

• taulukot ja käytettävyys
• taulukoiden muotoilu
• responsiiviset taulukot

SVG vektorigrafiikkaa sivuille

• vektori- vs. pikseligrafiikka
• skaalautuminen
• SVG tiedostojen liittämistavat
• SVG ja animointi / tapahtumat

Responsiiviset kuvat verkkosivuilla

• kuvien tuottaminen verkkosivuille
• responsiivisten kuvien tekniikka; kuvan vaihtaminen – ei skaalaaminen
• Picture-elementti
• srcset ja sizes

CSS Flexbox -asemointi

• selaintuki ja käyttötapa
• container elementtien ominaisuudet
• child-elementtien ominaisuudet

CSS Grid -asemointi

• selaintuki ja käyttökohteet
• Grid-tekniikka, ominaisuudet

CSS eri asemointitekniikat yhdessä, esimerkkisivu

• float ja absoluuttinen asemointi
• Flexbox komponentit sivulla
• CSS Grid sivun taittopohjana

CSS-uutuuksilla muotoilut joustavammaksi

• skaalautuva teksti
• uudet mittayksiköt
• tilan jakaminen laskennalla, calc() -funktio
• feature queries, @supports

Kurssin aiheita harjoitellaan luomalla sivusto, jossa hyödynnetään kaikkia kurssin aiheita siten, että saat kurssilta mukaasi joukon valmiita esimerkkejä tekniikoiden hyödyntämiseksi käytännössä.

Kurssin kouluttaja

Kari Selovuo

Partner, CPWA saavutettavuusasiantuntija, Adobe Certified Instructor

Viimeinen ilmoittautuminen 9.10. mennessä. ILMOITTAUTUMINEN ON SITOVA. VERKKKOULUTUS!

Lisätietoja tapahtumasta:

Sanna Koivusaari

sanna.koivusaari@digimama.fi

040 837 7878

Peruutusehdot

Huomioithan, että koulutuksiin ja tapahtumiin ilmoittautuminen on sitova. Kurssin hinta voidaan palauttaa vain sairaustapauksissa todistusta vastaan. Mikäli ilmoittautujia ei ole riittävästi, koulutus voidaan peruuttaa. Mahdollisista peruutuksista ilmoitamme erikseen ja palautamme osallistumismaksun.