Maquetació CSS3 amb SASS i Compass
Descripció general:
La maquetació XHTML/CSS es quelcom que la majoria de desenvolupadors donen per fet. Ho consideren una tasca secundaria, si bé el front-end constitueix l'única interfície que posa en contacte a usuaris y la aplicació.
En el món del CSS, sass i compass aporten una mica de llum posant a l’abast dels desenvolupadors i dissenyadors conceptes àmpliament explorats en el món del desenvolupament com son la modularitat, reusabilitat, mantenibilitat o escalabilitat.
Aquest WORSHOP está orientat tant a dissenyadors com a desenvolupadors
Sobre SASS i COMPASS
SASS (http://sass-lang.com) és una extensió de CSS3 que afegeix suport per a regles nidades, variables, mixins, herència de selectors i més. Compil.la directament a CSS, de manera que comparteix el mateix suport i funcionalitats que el CSS convencional.
A primera vista pot resultar extrany per no estar acostumats a llegir codi basat en indentació. Però el format de SASS redueix la redundància i ajuda a mantenir una jerarquia clara d’elements.
sass i compass son dues eines que funcionen sobre ruby, però no depenen en absolut de cap framework de desenvolupament en particular; el seu output es simple i pla CSS. Existeixen especialitzacions per a determinats frameworks como Rails, en els que no s’entrarà en detall.
Al finalitzar workshop seràs capaç de:
• Desenvolupar les teves fulles d’estil de forma modular per a que creixin de forma ordenada a mida que ho faci el teu projecte.
• Plantejar-te molt millor la separació entre semàntica i presentació i les seves profundes implicacions.
• Refusar les teves pròpies llibreries de CSS entre diferents projectes
• Aplicar avançats trucs de CSS3 amb fallbacks per a navegadors menys avançats
• Divertir-te desenvolupant front-end si no ho feies ja
Igualment important és destacar lo que no aprendràs:
• A dissenyar. Encara que, molt probablement, el que hagis après et serveixi per a orientar millor al dissenyador del teu equip. I si ets tu mateix, molt millor! :)
• A ser més tolerant amb navegadors del paleolític com Explorer 6. És possible que el teu odi augmenti fins i tot una mica més.
Prerequisits
Para la realització d’aquest workshop, es recomanable:
• Certa Familiaritat amb conceptes bàsics de programació (variables, mètodes…)
• Tenir coneixements mitjans de XHTML y CSS
PROGRAMA
1. Introducció a SASS
2. El teu primer projecte
2.1. Instal·lació de sass i compass
2.2 Creació del teu primer projecte
3. Starter stylesheets: Uniformitzant estils entre navegadors
3.1. Algunes variables de configuració
3.2. Documentació completa de colores
4. Layouts: Imitant a Pinterest
4.1. Grid Systems
4.2. Layouts Líquids
4.3. Sobre el posicionament
4.4. Box sizing
4.5. Helpers
5. Interacció i eye candy: El botó perfecte amb pur CSS3
5.1. Ombras
5.2. Gradients
5.3. Border radius
6. Transformacions
6.1. Scale
6.2. Translate
6.3. Skew
6.4. Transform
7. Animacions i transicions
7.1. Propietats
7.2. Animacions
8. Disseny responsiu: Adaptació per a dispositius móbils
8.1. Viewports
8.2. Media queries
9. Performance: Cóm millorar la velocitat de càrrega
9.1. Sprites
9.2. Embedding assets
Per a realitzar aquest curs no es necessita disposar de cap titulació prèvia.
Calendari
Sessió 1: divendres 21 de setembre (de 9 a 14 hores)
Sessió 2: divendres 28 de setembre (de 9 a 14 hores)
Preu
190 euros
El WORKSHOP serà desenvolupat per l'equip de professionals de CODEGRAM
S'autodefineixen com programadors vocacionals, que construeixen aplicacions WEB amb “Ruby on Rails”, posant èmfasi en la calidad del código y la experiencia del usuario. Podéis ampliar la información en: http://codegram.com/team
- Inscriu-te