Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Uno stile per ogni occasione

decarola
March 19, 2018

Uno stile per ogni occasione

Keynote di chiusura del CSSday 2018 (http://2018.cssday.it/).

Dopo una giornata di talk su tecnologie nuove e più o meno complicate, nel talk di chiusura ho provato a tirare le somme.

Partendo dal punto di vista di Jeremy Keith e Frank Chimero, ho provato a spiegare che le tecnologie sono solo strumenti che valorizzano il nostro lavoro.

decarola

March 19, 2018
Tweet

More Decks by decarola

Other Decks in Technology

Transcript

  1. UNO STILE PER OGNI
    OCCASIONE

    View Slide

  2. View Slide

  3. https://www.youtube.com/watch?v=uHhn4QPCrKA
    1:43 - 2:07

    View Slide

  4. View Slide

  5. View Slide

  6. View Slide

  7. JEREMY KEITH

    View Slide

  8. EVALUATING
    TECHNOLOGY

    View Slide

  9. WWW
    Internet
    Computers
    Electricity
    Industrialization

    View Slide

  10. WWW
    HTTP URL HTML
    TCP/IP DNS SGML

    View Slide

  11. Principles

    View Slide

  12. GOAL
    PRINCIPLES
    PATTERN
    Visione
    Come ottieni la visione
    Principles applicati

    View Slide

  13. Progressive
    App
    Web

    View Slide

  14. •App-like-interactions
    •Connectivity independent
    •Responsive
    •Fresh
    •Safe
    •Installable
    •Discoverable
    •Re-engageable
    •Linkable

    View Slide


  15. View Slide

  16. HTTPS +
    Service worker +
    Manifest file =
    PWA

    View Slide

  17. –Aaron Gustafson
    “Your Site—Any Site—Should Be a PWA”.

    View Slide

  18. https://www.youtube.com/watch?v=jOUrYJEQKoI

    View Slide

  19. 1. How well does it work?
    1. How well does it work?
    2. How well does it fail?

    View Slide

  20. View Slide

  21. View Slide

  22. SERVICE WORKER

    View Slide

  23. View Slide

  24. 1. How well does it work?
    2. How well does it fail?
    3. Who benefits?

    View Slide

  25. • Sass
    • Less
    • Git
    • Gulp
    • Npm
    • jQuery
    • Bootstrap
    • Angular
    • React
    • Ember
    User
    Developer

    View Slide

  26. 1. How well does it work?
    2. How well does it fail?
    3. Who benefits?
    4. What are the assumptions?

    View Slide

  27. Philosophy

    View Slide

  28. View Slide

  29. View Slide

  30. FRANK CHIMERO

    View Slide

  31. View Slide

  32. View Slide

  33. INUTILMENTE ESIGENTE
    NECESSARIO
    NUOVO

    View Slide

  34. 20 YEARS
    EXPERIENCE

    View Slide

  35. View Slide

  36. { float: left; }

    View Slide

  37. View Slide

  38. View Slide

  39. 20 = 4 × 5

    View Slide

  40. View Slide

  41. https://www.youtube.com/watch?v=uHhn4QPCrKA
    5:54 - 6:21

    View Slide

  42. View Slide

  43. Pattern

    View Slide

  44. View Slide

  45. View Slide

  46. View Slide

  47. • simple, responsive layout
    • web fonts and nicely set text
    • performant, scalable images

    View Slide

  48. Work philosophy

    View Slide

  49. View Slide

  50. https://www.youtube.com/watch?v=rPIDfadBz-w

    View Slide

  51. View Slide

  52. • Pattern library
    • Performance
    • Progressive Web App

    View Slide

  53. View Slide

  54. Wrap up

    View Slide

  55. Criterio di valutazione
    Valorizza il lavoro
    Cosa Perché
    Persone

    View Slide

  56. View Slide

  57. Grazie @decarola

    View Slide