WordPress, HTML5 and CSS3
WordPress, HTML5 and CSS3         Mike McCallister   Milwaukee WordPress Meetup       September 18, 2012
Who am I?●   Co-Author, WordPress in Depth    (with Bud Smith)●   Blogger,    Notes from the Metaverse●   Sr Document Arch...
Quick Audience Survey: Who             understands:●   HTML            ●   HTML5                    ●   CSS3    CSS       ...
Obligatory History Lesson●   W3C Set up 1990 to oversee Web●   1997: HTML 4.01: Standard for nearly every      web page ou...
HTML5 for WordPress Users●   Not much yet to shout about●   Get an HTML5-based theme●   Create content in an HTML5-aware e...
HTML5 Themes●   WordPress Theme Directory Search 9/16/12:    45 under “html5”●   WordPress.com: Two! Toolbox (Automattic) ...
Why use an HTML5 Theme?●   Loads faster●   SEO
HTML5 Editors●   WordPress Visual Editor does not (yet)    support HTML5 semantic tags●   Recent versions of TinyMCE do
HTML5 for WordPress Developers●   Make HTML5-based themes
What Can Devs Use Today?●   30 new elements in HTML5●   Browser support pretty solid for many●   Older versions of IE stil...
What Can Devs Use Today?●   Responsive Design    –   CSS Media Queries (Audio, video)●   Font-Face: Foundries solving the ...
What Can Devs Use Today?●   JavaScript: localStorage and sessionStorage●   Geolocation
Still a Little Dicey●   Transformations (especially 3D)●   Embedded media (waiting for codecs to    resolve)
Resources●   WordPress TV:    –   George Stephanis: Updating Kubrick to HTML5/CSS3    –   Jake Goldman: What HTML5 And Res...
Questions?●   michael@michaelmccallister.com●   http://metaverse.wordpress.com●   @workingwriter●   (414) 719-1362
Upcoming SlideShare
Loading in …5
×

WordPress, HTML5 and CSS3

1,408
-1

Published on

Presentation to the Milwaukee WordPress Meetup, September 18, 2012, updated with active links.

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

  • Be the first to like this

No Downloads
Views
Total Views
1,408
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
28
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

WordPress, HTML5 and CSS3

  1. 1. WordPress, HTML5 and CSS3
  2. 2. WordPress, HTML5 and CSS3 Mike McCallister Milwaukee WordPress Meetup September 18, 2012
  3. 3. Who am I?● Co-Author, WordPress in Depth (with Bud Smith)● Blogger, Notes from the Metaverse● Sr Document Architect, PKWARE● President, WI Society for Technical Communication
  4. 4. Quick Audience Survey: Who understands:● HTML ● HTML5 ● CSS3 CSS Canvas ●●● W3C
  5. 5. Obligatory History Lesson● W3C Set up 1990 to oversee Web● 1997: HTML 4.01: Standard for nearly every web page out there today● XHTML: The Bridge to XML● HTML5: If not the bridge, then the destination
  6. 6. HTML5 for WordPress Users● Not much yet to shout about● Get an HTML5-based theme● Create content in an HTML5-aware editor
  7. 7. HTML5 Themes● WordPress Theme Directory Search 9/16/12: 45 under “html5”● WordPress.com: Two! Toolbox (Automattic) and Soundcheck ($75)
  8. 8. Why use an HTML5 Theme?● Loads faster● SEO
  9. 9. HTML5 Editors● WordPress Visual Editor does not (yet) support HTML5 semantic tags● Recent versions of TinyMCE do
  10. 10. HTML5 for WordPress Developers● Make HTML5-based themes
  11. 11. What Can Devs Use Today?● 30 new elements in HTML5● Browser support pretty solid for many● Older versions of IE still a roadblock (surprise!)
  12. 12. What Can Devs Use Today?● Responsive Design – CSS Media Queries (Audio, video)● Font-Face: Foundries solving the license issue – Google Fonts – Font Squirrel● Transitions (Sliders) – Today with jQuery and browser-specific tags – Tomorrow IE
  13. 13. What Can Devs Use Today?● JavaScript: localStorage and sessionStorage● Geolocation
  14. 14. Still a Little Dicey● Transformations (especially 3D)● Embedded media (waiting for codecs to resolve)
  15. 15. Resources● WordPress TV: – George Stephanis: Updating Kubrick to HTML5/CSS3 – Jake Goldman: What HTML5 And Responsive Design C – Ray Villalobos: HTML5 and CSS3 Integration – Steve Heffernan: HTML5 Video for WordPress
  16. 16. Questions?● michael@michaelmccallister.com● http://metaverse.wordpress.com● @workingwriter● (414) 719-1362
  1. A particular slide catching your eye?

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

×