2. Kdo jsme?
• Jaromír Kavan - Grafika
• Tomáš Musiol - Kodování a koncept
• Patrik Illy - Nápady a připomínky
• Moravio - Podpora :)
pátek, 8. března 13
3. Co je CEZET Map?
• Mapa ČR jako vektorové písmo
• Jednotlivé kraje jsou samostatné písmena
• Jednoduché změny barev a rozměrů
• Databáze s polohou 110 největších měst ČR
• OSS - Creative Commons Licence CC BY
• Dostupné na GitHubu
pátek, 8. března 13
4. Proč CEZET Map vzniklo?
• Časová náročnost a pracnost tradičního postupu
• HTML AREA ta' = WTF
• Responsivní přístup k tvorbě webu
• HD zařízení (Retina)
• Optimalizace webu (rychlost, velikost, requesty)
• Moderní technolo'ie
pátek, 8. března 13
5. Použité technolo'ie
• HTML - Skturktura
• CSS3 - Stylování
• SVG - Vektorové podklady pro tvorbu písma
• Font face - Jádro projektu
• jQuery - Interaktivní události
pátek, 8. března 13
6. HTML AREA ta' = WTF
<AREA
class = "area"
rel = "regionEurope"
data-startregion = "state_31"
SHAPE = "poly"
ALT = "Evropa"
COORDS = "422,133, ... 426,131"
HREF = "#"
ONMOUSEOVER = "changeImages('mapa_zaklad_01', 'state1.gif'); return true;"
ONMOUSEOUT = "changeImages('mapa_zaklad_01', 'state2.gif'); return true;"
pátek, 8. března 13
7. HTML AREA ta' = WTF
<AREA
class = "area"
rel = "regionEurope"
data-startregion = "state_31"
SHAPE = "poly"
ALT = "Evropa"
COORDS = "422,133, ... 426,131"
HREF = "#"
ONMOUSEOVER = "changeImages('mapa_zaklad_01', 'state1.gif'); return true;"
ONMOUSEOUT = "changeImages('mapa_zaklad_01', 'state2.gif'); return true;"
pátek, 8. března 13
8. HTML AREA ta' = WTF
<AREA
class = "area"
rel = "regionEurope"
data-startregion = "state_31"
SHAPE = "poly"
ALT = "Evropa"
COORDS = "422,133, ... 426,131"
HREF = "#"
ONMOUSEOVER = "changeImages('mapa_zaklad_01', 'state1.gif'); return true;"
ONMOUSEOUT = "changeImages('mapa_zaklad_01', 'state2.gif'); return true;"
pátek, 8. března 13
9. HTML AREA ta' = WTF
<AREA
class = "area"
rel = "regionEurope"
data-startregion = "state_31"
SHAPE = "poly"
ALT = "Evropa"
COORDS = "422,133, ... 426,131"
HREF = "#"
ONMOUSEOVER = "changeImages('mapa_zaklad_01', 'state1.gif'); return true;"
ONMOUSEOUT = "changeImages('mapa_zaklad_01', 'state2.gif'); return true;"
pátek, 8. března 13