DRUPAL + HTML5   JACINE LUISI @jacine
HI THERE!Front end developer @ Gravitek LabsCo-maintainer for Markup and CSS for Drupal 7Drupal 8 HTML5 Initiative OwnerCo...
DRUPAL 8  IS GOINGHTML5!                              http://drupal.org/html5             http://groups.drupal.org/html5/d...
HTML5 WILL BRING...Better and more semantic markupBetter accessibility out of the box with ARIA rolesMore intuitive and us...
NEW HTML5 ELEMENTS<article>     <details>     <hgroup>            <progress> <aside>      <summary>     <keygen>          ...
NEW FORM ELEMENTS & INPUT TYPES   <keygen>                     <input type="color">   <meter>                      <input ...
EXAMPLE      <input type="tel" required="required" placeholder="2125551212" name="tel" id="tel">                          ...
AND MORE AWESOMENESS!                              http://drupal.org/html5             http://groups.drupal.org/html5/drup...
SO... WHAT’S THE   PLAN?                            http://drupal.org/html5           http://groups.drupal.org/html5/drupa...
PHASE 1Implement a JavaScript fallback for non-supported browsers                        SUMMARY          ISSUE           ...
PHASE 2 POSSIBILITIES...Rich media handling with <video> and <audio>                                          SUMMARY     ...
A HUGE OPPORTUNITY  FOR FRONT END DEVELOPERS WITH     DRUPAL                                       http://drupal.org/html5...
SOUND FAMILIAR?You are frustrated with HATE Drupal’s markupYou are frustrated with HATE Drupal’s CSSYou know you can do it...
THIS IS YOUR CHANCE TO          GET INVOLVEDDevelopers are paying attention!Markup and CSS will finally get the focus need...
HERE’S HOW      YOU CANGET INVOLVED...                                 http://drupal.org/html5                http://group...
JOIN THE WORKING GROUP  http://groups.drupal.org/html5/drupal-8                                           http://drupal.or...
ATTEND THE INITIATIVE MEETINGS                       JOIN #DRUPAL-HTML5 in IRCWe have meetings everyother Tuesday at 16:00...
FOLLOW US ON TWITTER   http://twitter.com/drupal8html5                                       http://drupal.org/html5      ...
READ ABOUT THE INITIATIVE      http://drupal.org/html5                                   http://drupal.org/html5          ...
READ THE ROADMAP SUMMARIES      http://drupal.org/html5#roadmap                                       http://drupal.org/ht...
WRITE CODE. REVIEW PATCHES.drupal.org/project/issues/search/drupal?status[]=Open&version[]=8.x&issue_tags=html5           ...
HTML5 RESOURCESDive into HTML5http://diveintohtml5.org/HTML5 Doctorhttp://html5doctor.com/HTML5 technical specification fo...
THANKS FOR WATCHING!                             http://drupal.org/html5            http://groups.drupal.org/html5/drupal-8
Upcoming SlideShare
Loading in...5
×

Drupal 8 HTML5 Initiative

12,345

Published on

Published in: Technology
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
12,345
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
106
Comments
0
Likes
10
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Drupal 8 HTML5 Initiative

    1. 1. DRUPAL + HTML5 JACINE LUISI @jacine
    2. 2. HI THERE!Front end developer @ Gravitek LabsCo-maintainer for Markup and CSS for Drupal 7Drupal 8 HTML5 Initiative OwnerCo-author “The Definitive Guide to Drupal 7” http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    3. 3. DRUPAL 8 IS GOINGHTML5! http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    4. 4. HTML5 WILL BRING...Better and more semantic markupBetter accessibility out of the box with ARIA rolesMore intuitive and usable forms http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    5. 5. NEW HTML5 ELEMENTS<article> <details> <hgroup> <progress> <aside> <summary> <keygen> <section> <audio> <embed> <mark> <time> <bdi> <figure> <menu> <track> <canvas> <figcaption> <meter> <video><command> <footer> <nav> <source><datalist> <header> <output> <wbr> http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    6. 6. NEW FORM ELEMENTS & INPUT TYPES <keygen> <input type="color"> <meter> <input type="email"> <output> <input type="date"> + more variations <progress> <input type="number"> <input type="range"> <input type="search">Lots of new attributes too...http://wufoo.com/html5/ <input type="tel"> <input type="url"> http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    7. 7. EXAMPLE <input type="tel" required="required" placeholder="2125551212" name="tel" id="tel"> EASY PLACEHOLDER TEXTDIFFERENT KEYPAD CLIENT-SIDE VALIDATION http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    8. 8. AND MORE AWESOMENESS! http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    9. 9. SO... WHAT’S THE PLAN? http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    10. 10. PHASE 1Implement a JavaScript fallback for non-supported browsers SUMMARY ISSUE #1179520 #1077878Implement new input types and form elements in Forms API SUMMARY ISSUE #1183606 #675348Use new HTML5 elements in templates and theme functions SUMMARY ISSUE #1193054 #1077510Add WAI-ARIA roles to markup SUMMARY ISSUE #1179668 #966396Convert <head> contents to HTML5 SUMMARY ISSUE N/A #1174756Ensure filter functions accept HTML5 elements SUMMARY ISSUE N/A #732992 http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    11. 11. PHASE 2 POSSIBILITIES...Rich media handling with <video> and <audio> SUMMARY ISSUE #1174734 #1174892Ability to select wrapper elements in the User Interface SUMMARY ISSUE TBD TBDWYSIWYG editor that uses contenteditable. SUMMARY ISSUE TBD TBD http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    12. 12. A HUGE OPPORTUNITY FOR FRONT END DEVELOPERS WITH DRUPAL http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    13. 13. SOUND FAMILIAR?You are frustrated with HATE Drupal’s markupYou are frustrated with HATE Drupal’s CSSYou know you can do it betterYou want to get involved with core development http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    14. 14. THIS IS YOUR CHANCE TO GET INVOLVEDDevelopers are paying attention!Markup and CSS will finally get the focus neededfor us to get the job done.... IF we all come together and make it happen. http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    15. 15. HERE’S HOW YOU CANGET INVOLVED... http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    16. 16. JOIN THE WORKING GROUP http://groups.drupal.org/html5/drupal-8 http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    17. 17. ATTEND THE INITIATIVE MEETINGS JOIN #DRUPAL-HTML5 in IRCWe have meetings everyother Tuesday at 16:00EST to discuss issues/progress.Events are posted here:http://groups.drupal.org/html5The chat room is alwaysfull of people involvedwith the initiative. Useit. https://www.google.com/calendar/embed?src=drupal8html5%40gmail.com&ctz=UTC http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    18. 18. FOLLOW US ON TWITTER http://twitter.com/drupal8html5 http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    19. 19. READ ABOUT THE INITIATIVE http://drupal.org/html5 http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    20. 20. READ THE ROADMAP SUMMARIES http://drupal.org/html5#roadmap http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    21. 21. WRITE CODE. REVIEW PATCHES.drupal.org/project/issues/search/drupal?status[]=Open&version[]=8.x&issue_tags=html5 http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    22. 22. HTML5 RESOURCESDive into HTML5http://diveintohtml5.org/HTML5 Doctorhttp://html5doctor.com/HTML5 technical specification for web developershttp://developers.whatwg.org/When can I use...http://caniuse.com/HTML5 Accessibilityhttp://html5accessibility.com/index-aria.htmlHTML5 Security Cheat sheethttp://html5sec.org/ http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    23. 23. THANKS FOR WATCHING! http://drupal.org/html5 http://groups.drupal.org/html5/drupal-8
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×