Helposti luettavaa ja ylläpidettävää CSS -koodia

Oletko koskaan turhautunut CSS –muotoilusääntöjen suureen määrään, tuleeko sivustosi tyylitiedostoista ajanmittaan pikiä ja sekavia, kaipaatko koskaan CSS –sääntöjen kirjoittamiseen ohjelmoinnista tuttuja ominaisuuksia? Haluatko tuottaa sivustosi CSS-koodin tehokkaasti, nopeasti ja helposti ylläpidettävänä. Jos vastaat edes yhteen kohtaan myöntävästi, on tämä kurssi sinulle.

CSS-tyylittelyyn on kehitetty tehostavia tekniikoita joista esiprosessoitavat tekniikat ovat niistä ehkä tärkeimmät. CSS esiprosessorit ymmärtävät omaa määrittelykieltä, joka käännetään (esiprosessoidaan) selaimen ymmärtämäksi CSS-koodiksi. Esiprosessorien käyttämä kieli on tekijälleen helpommin luettavaa ja ymmärrettävää kuin tavallinen CSS.

Tavoitteena helposti ylläpidettävä CSS-koodi

CSS esiprosessoreilla toteutettuja CSS-tyylejä käytetään myös paljon käytetyissä valmiissa frameworkeissä kuten Bootstrap tai Foundation. Bootstrap on rakennettu käyttäen LESS –tekniikkaa mutta sillä on myös virallinen SASS –tuki. CSS Frameworkin käyttöönotossa on syytä osata muokata valmista koodia omiin tarpeisiin ja siksi käytetyn tekniikan osaaminen on edellytys.

Kurssin kohderyhmä

Kurssi on suunnattu kaikille verkkosivujen ulkoasusta vastaaville tai CSS -tyylitiedostoja ylläpitäville henkilöille.

Kurssin esitietovaatimukset

HTML ja CSS perusteet riittävät hyvin kurssin esitiedoiksi.

CSS esiprosessorit SASS ja LESS

Perusteet

Kesto: 1pv
Hinta: 890 €
hinnat ALV 0 %

Kurssit


Päivän aiheita

  • Mitä ovat esiprosessoidut CSS tekniikat
  • SASS ja LESS erot
  • Tarvittavat työkalut ja kehitysympäristön vaatimukset
  • LESS ja SASS syntaksi
  • Muuttujien käyttö
  • Uudelleen käytettävät koodit, mixins
  • Parametrien käyttö
  • Sisäkkäiset säännöt
  • Valmiit funktiot
  • Matemaattiset operaattorit
  • Tiedostojen tuominen
  • Valmiin CSS –tiedoston tuottaminen
  • Parhaita käytäntöjä


Kurssin kouluttajat


[vcex_staff_grid include_categories=”selovuo” columns=”1″ filter=”false” thumb_link=”nowhere” img_width=”150″ img_height=”150″]
Aiheeseen liittyviä kursseja

Esiprosessoijilla CSS -koodista luettavampaa ja helpommin ylläpidettävää