• Like
Html5 for designers
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Html5 for designers

  • 384 views
Published

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
384
On SlideShare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
2
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. For designerszaterdag 29 december 12
  • 2. coding dojozaterdag 29 december 12
  • 3. coding dojo • Strive for completion of character. • Don’t give up, be faithful. • Strive to be your best. • Respect the others.. • Refrain from violent behavior. • Each pilot flights for 15 minuteszaterdag 29 december 12
  • 4. Geschiedeniszaterdag 29 december 12
  • 5. XHTML2.0 “The future is xml based markup” 1998zaterdag 29 december 12
  • 6. <br /> <img src=”..” />zaterdag 29 december 12
  • 7. WHATWG Apple Mozilla Opera Web Hypertext Application Technology Working Groupzaterdag 29 december 12
  • 8. HTML5 “Don’t break the web” 2004zaterdag 29 december 12
  • 9. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">zaterdag 29 december 12
  • 10. <!DOCTYPE html>zaterdag 29 december 12
  • 11. nieuwe html elementen http://html5doctor.com/element-index/zaterdag 29 december 12
  • 12. class names id names Rank Value Frequency Rank Value Frequency 1 footer 179.528 1 footer 1.085.482 2 menu 146.673 2 table 482.760 3 style1 138.308 3 img 471.807 4 msonormal 123.374 4 input 372.905 5 text 122.911 5 a 319.619 6 content 113.951 6 form 266.886 7 title 91.957 7 td 230.312 8 style2 89.851 8 ul 192.453 9 header 89.274 9 span 180.553 10 copyright 86.979 10 object 165.628 11 button 81.503 11 li 91.022 12 main 69.620 12 body 90.883 13 style3 69.349 13 p 81.128 http://devfiles.myopera.com/articles/572/elementsusingid-url.htm http://devfiles.myopera.com/articles/572/classlist-url.htmzaterdag 29 december 12
  • 13. <section> <header> <footer> <article> <aside> ...zaterdag 29 december 12
  • 14. XHTML2.0 <div id= “header”> <div class= “post”> <div id= “sidebar”> <div class= “post”> <div id= “footer”>zaterdag 29 december 12
  • 15. HTML5 <header/> <article/> <aside/> <article/> <footer/>zaterdag 29 december 12
  • 16. zaterdag 29 december 12
  • 17. zaterdag 29 december 12
  • 18. <section> Represents a generic document or application section. In this context, a section is a thematic grouping of content, typically with a header, possibly with a footer. Examples include chapters in a book, the various tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A web sites home page could be split into sections for an introduction, news items, contact information.zaterdag 29 december 12
  • 19. <header> Represents the "header" of a document or section of a document. The header element is typically used to group a set of h1–h6 elements to mark up a pages title with its subtitle or tagline. header elements may, however, contain more than just the sections headings and subheadings — e.g., version history information or publication date http://html5doctor.com/the-header-element/zaterdag 29 december 12
  • 20. • color • date • datetime • datetime-local • email • month <input> • • number range • search • tel • time • url • weekzaterdag 29 december 12
  • 21. internet explorer?zaterdag 29 december 12
  • 22. <h1> <p> <strong> <em> <div>zaterdag 29 december 12
  • 23. display The display property defines how a certain HTML element should be displayed.zaterdag 29 december 12
  • 24. <b> <strong>zaterdag 29 december 12
  • 25. <i> <em>zaterdag 29 december 12
  • 26. display • none; • inline; • block; • inline-block; • list-item; • compact; • table; • inline-table; • table-caption; • ...zaterdag 29 december 12
  • 27. positioning • relative (container object) • absolute • static (iOS4+)zaterdag 29 december 12
  • 28. <ul> =! <ol>zaterdag 29 december 12
  • 29. basic ccs selectors <div class=”header”> .header { ... } <div id=”header”> #header { ... } <a href=””> a { ... } <article> article { ... } .item > .first-subitem @media (min-width: 130px)zaterdag 29 december 12
  • 30. reset.css normalize.csszaterdag 29 december 12
  • 31. Boilerplate 3.0 http://html5boilerplate.com/zaterdag 29 december 12
  • 32. SCSSzaterdag 29 december 12
  • 33. zaterdag 29 december 12
  • 34. zaterdag 29 december 12
  • 35. Lee Brimelowzaterdag 29 december 12
  • 36. Paul Irishzaterdag 29 december 12
  • 37. http://dochub.io/ http://html5please.us/ http://livedom.validator.nu/ http://codex.wordpress.org/Function_Reference http://stackoverflow.com/questions/tagged/html http://jqapi.com/ http://jsfiddle.net/zaterdag 29 december 12