Trabucchi_PyconDE_2012.pdf

Transcript

1. STEFANIA TRABUCCHI Python Konferenz 2012 Toolkit zur Gestaltung von (Python-)Webanwendungen am Beispiel von Plone Twitter Bootstrap „Schweizer Messer“ für Webanwendungen?
2. STEFANIA TRABUCCHI Python Konferenz 2012 Idee + Prototyp Designer + Entwickler Kunde
3. STEFANIA TRABUCCHI Python Konferenz 2012 Das populärste Projekt auf Github Beobachter 39.127+ Forks 9.448+ Commits für V2 852 Issue closed 1.400+ https://github.com/popular/forked Stand 10-2012 http://www.ohloh.net/p/bootstrap-from-twitter (see also HTML5 Boilerplate oder Kickstart)
4. STEFANIA TRABUCCHI Python Konferenz 2012 Exzellente Konventionen
5. STEFANIA TRABUCCHI Python Konferenz 2012 Mix and Sketch – – Styles (940 Pixel Grid mit 12 Spalten) – – Components (Button, Navbar, Dropdown, Progress bar, Label, Pager usw.) – – Plugins (Collapse, Carousel usw.) – – Custom (Klick + Download)
6. STEFANIA TRABUCCHI Python Konferenz 2012 Profil? Profit?
7. STEFANIA TRABUCCHI Python Konferenz 2012 – – LESS als Pre Processor erspart viel Arbeit (passt für jede Python-Anwendung) //LESS @base-color: #111; @red: #842210; #footer { color: @base-color + #003300; border-color: desaturate(@red, 10%); } – – Zusammenstellen einer gewünschten Version – – Komprimierte .css und .js Files (YUI Compressor) – – Forms, Table Grid – – Help __styling
8. STEFANIA TRABUCCHI Python Konferenz 2012 Responsive? Responsiveness?
9. STEFANIA TRABUCCHI Python Konferenz 2012 – – 480px, 768px, 980px, 1200px – – Smartphones – – Tablets portrait +landscape – – Desktop small + large – – jQuery-Mobile-Bootstrap-Theme
10. STEFANIA TRABUCCHI Python Konferenz 2012 Deployment with Plone, Trac, Mailman, Django… – – Buildout – – Bootstrap – – plone.app.theming – – Diazo Server (XSL-Transformation) – – Diazo-Bootstrap-Framework – – plone.bootstraptheme
11. STEFANIA TRABUCCHI Python Konferenz 2012 – – Work in progress (v.2) – – Plug-in Entwicklung (z.B. pnotify) – – Styling/Colors, Buttons, Themes – – Built with bootstrap – – Free + Commercial Themes – – Jetstrap (Interface Builder) – – LESS – – Browser Support (mit IE7) – – UI: Erweiterung von data attributes in alle HTML Elemente (z.B. popup/toolkit) Beispiel 1 und Beispiel 2
12. STEFANIA TRABUCCHI Python Konferenz 2012 – – Overkill 5000 Zeile code CSS – – keine komplexeren typografischen Aspekte – – LESS (?) es geht auch ohne
13. STEFANIA TRABUCCHI Python Konferenz 2012 Quelle: http://evolutionofweb.appspot.com/
14. STEFANIA TRABUCCHI Python Konferenz 2012 info@trabucchi.de Fragen? berlin-based webdeveloper