Your SlideShare is downloading. ×
Web Standards
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Web Standards

2,627
views

Published on

Published in: Education, Technology

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,627
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
73
Comments
0
Likes
2
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. by Helior Colorado
  • 2. History of the Internet
  • 3. History of the Internet 1991 - World Wide Web was born
  • 4. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol)
  • 5. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network)
  • 6. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www.
  • 7. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network
  • 8. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public
  • 9. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public HTML (Hypertext Markup Language)
  • 10. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public HTML (Hypertext Markup Language) Designed to link independent documents together
  • 11. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public HTML (Hypertext Markup Language) Designed to link independent documents together Designed by Tim Berners-Lee
  • 12. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public HTML (Hypertext Markup Language) Designed to link independent documents together Designed by Tim Berners-Lee Designed to markup document content in ways a computer could understand
  • 13. History of the Internet 1991 - World Wide Web was born HTTP (Hypertext Transfer Protocol) Successor of ARPANET (Advanced Research Projects Agency Network) ★ was the Internet before www. ★ first to use packet switching techniques over network ★ used by government and universities only - not the public HTML (Hypertext Markup Language) Designed to link independent documents together Designed by Tim Berners-Lee Designed to markup document content in ways a computer could understand Designed to be simple and easy for anyone to adopt
  • 14. History of the Internet
  • 15. History of the Internet After 1991...
  • 16. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool
  • 17. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog
  • 18. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog ★ nothing much you could do with it
  • 19. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog ★ nothing much you could do with it
  • 20. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog ★ nothing much you could do with it Web Design as a profession began
  • 21. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog ★ nothing much you could do with it Web Design as a profession began ★ through the demand from the market
  • 22. History of the Internet After 1991... Businesses took interest to use the web as a marketing tool Used as online brochure and catalog ★ nothing much you could do with it Web Design as a profession began ★ through the demand from the market ★ with limited set of capabilities
  • 23. History of the Internet After 1991...
  • 24. History of the Internet After 1991... Evolution of the Web (The Good)
  • 25. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades
  • 26. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0
  • 27. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element
  • 28. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element
  • 29. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps
  • 30. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2
  • 31. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2 ★ adopted Netscape’s visual elements
  • 32. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2 ★ adopted Netscape’s visual elements Browsers support for images, tables, frames
  • 33. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2 ★ adopted Netscape’s visual elements Browsers support for images, tables, frames Many companies embraced the Web
  • 34. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2 ★ adopted Netscape’s visual elements Browsers support for images, tables, frames Many companies embraced the Web ★ competition became fierce
  • 35. History of the Internet After 1991... Evolution of the Web (The Good) HTML version upgrades 2.0 ★ enhancement of <form> element ★ introduction of <table> element ★ introduction to image maps 3.2 ★ adopted Netscape’s visual elements Browsers support for images, tables, frames Many companies embraced the Web ★ competition became fierce ★ online presence became vital
  • 36. History of the Internet After 1991...
  • 37. History of the Internet After 1991... Evolution of the Web (The Bad)
  • 38. History of the Internet After 1991... Evolution of the Web (The Bad) Technologies were abused Table-based design
  • 39. History of the Internet After 1991... Evolution of the Web (The Bad) Technologies were abused Table-based design Browsers Wars!! Netscape vs. Microsoft
  • 40. History of the Internet After 1991... Evolution of the Web (The Bad) Technologies were abused Table-based design Browsers Wars!! Netscape vs. Microsoft Convoluted source code
  • 41. History of the Internet After 1991... Evolution of the Web (The Bad) Technologies were abused Table-based design Browsers Wars!! Netscape vs. Microsoft Convoluted source code Sneaky techniques were used
  • 42. Further into the future...
  • 43. More technologies are added
  • 44. More technologies are added CSS (Cascading Style Sheet)
  • 45. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation
  • 46. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted
  • 47. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow)
  • 48. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked!
  • 49. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked!
  • 50. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!)
  • 51. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape
  • 52. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape Inconsistent support across browsers
  • 53. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape Inconsistent support across browsers CGI (Common Gateway Interface)
  • 54. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape Inconsistent support across browsers CGI (Common Gateway Interface) Primarily written in PERL
  • 55. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape Inconsistent support across browsers CGI (Common Gateway Interface) Primarily written in PERL Commonly distributed with Javascript snippets
  • 56. More technologies are added CSS (Cascading Style Sheet) First attempt to separate content and presentation Although very slow to be adopted HTML (4.slow) Table-based design, because css sucked! Frames-based navigation, because css sucked! JavaScript (not Java!) Created by Sun Microsystems and Netscape Inconsistent support across browsers CGI (Common Gateway Interface) Primarily written in PERL Commonly distributed with Javascript snippets Plug ‘n’ Play - “Who cares how it works?”
  • 57. Sites created under different versions
  • 58. Sites created under different versions Different Browsers
  • 59. Sites created under different versions Different Browsers Inconsistent interpretation of technology
  • 60. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies
  • 61. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.)
  • 62. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate
  • 63. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate Layouts were broken
  • 64. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate Layouts were broken Different Media (print, screen readers, etc.)
  • 65. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate Layouts were broken Different Media (print, screen readers, etc.) Varying interfaces, methods, and purpose
  • 66. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate Layouts were broken Different Media (print, screen readers, etc.) Varying interfaces, methods, and purpose Rethink design approach to fit needs of users
  • 67. Sites created under different versions Different Browsers Inconsistent interpretation of technology No support for certain technologies Different Devices (mobile phones, PDA, etc.) Limited screen real-estate Layouts were broken Different Media (print, screen readers, etc.) Varying interfaces, methods, and purpose Rethink design approach to fit needs of users That’s if they bothered to support those other users!
  • 68. DHTML
  • 69. DHTML The dirty word of the web.
  • 70. WYSIWYG editors
  • 71. WYSIWYG editors Helped with Content Management
  • 72. WYSIWYG editors Helped with Content Management GUI interface for clients
  • 73. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers
  • 74. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages
  • 75. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters
  • 76. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters Generation which is referred to “Neighbors’ cousin’s nephew’s friend” who could build you a website
  • 77. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters Generation which is referred to “Neighbors’ cousin’s nephew’s friend” who could build you a website Created heavy file size pages
  • 78. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters Generation which is referred to “Neighbors’ cousin’s nephew’s friend” who could build you a website Created heavy file size pages Due to convoluted source code
  • 79. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters Generation which is referred to “Neighbors’ cousin’s nephew’s friend” who could build you a website Created heavy file size pages Due to convoluted source code Attempt to support all browser features
  • 80. WYSIWYG editors Helped with Content Management GUI interface for clients Made anyone believe they were web designers Common folk created pages Less experts and therefore more disasters Generation which is referred to “Neighbors’ cousin’s nephew’s friend” who could build you a website Created heavy file size pages Due to convoluted source code Attempt to support all browser features Generated by a machine
  • 81. Enter Web Standards
  • 82. 33% 33% 33%
  • 83. 33% 33% 33%
  • 84. Content 33% 33% 33%
  • 85. Content “Data” 33% 33% 33%
  • 86. Content Presentation “Data” 33% 33% 33%
  • 87. Content Presentation “Data” “Look & Feel” 33% 33% 33%
  • 88. Content Presentation “Data” “Look & Feel” 33% 33% 33% Behavior
  • 89. Content Presentation “Data” “Look & Feel” 33% 33% 33% Behavior “Manipulation”
  • 90. 33% 33% 33%
  • 91. html 33% 33% 33%
  • 92. html css 33% 33% 33%
  • 93. html css 33% 33% 33% javascript
  • 94. Content or “Markup”
  • 95. Content or “Markup” Semantic
  • 96. Content or “Markup” Semantic understand the meaning of tags; use them correctly
  • 97. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics
  • 98. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose
  • 99. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed
  • 100. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed using class or id attributes
  • 101. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed using class or id attributes use names that describe the content, not its visual distinction
  • 102. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed using class or id attributes use names that describe the content, not its visual distinction example:
  • 103. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed using class or id attributes use names that describe the content, not its visual distinction example: use “secondary_content” not “right_column”
  • 104. Content or “Markup” Semantic understand the meaning of tags; use them correctly Pragmatics the practical use; most comprehensible; clean; clear purpose Identify elements as needed using class or id attributes use names that describe the content, not its visual distinction example: use “secondary_content” not “right_column” use “alert_warning” not “bright_red”
  • 105. Presentation or “Styles”
  • 106. Presentation or “Styles” Separation
  • 107. Presentation or “Styles” Separation keep style sheets independent from other documents
  • 108. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” />
  • 109. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency
  • 110. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant
  • 111. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant Always style with CSS
  • 112. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant Always style with CSS Avoid using markup to style elements based on their default visual output
  • 113. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant Always style with CSS Avoid using markup to style elements based on their default visual output example:
  • 114. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant Always style with CSS Avoid using markup to style elements based on their default visual output example: don’t use <b>, <i>, <u>, <blink>
  • 115. Presentation or “Styles” Separation keep style sheets independent from other documents use: <link rel=”stylesheet” media=”screen” href=”styles.css” /> Consistency avoid styles that are not standards-compliant Always style with CSS Avoid using markup to style elements based on their default visual output example: don’t use <b>, <i>, <u>, <blink> use font-weight: 600, font-style: italic, border-bottom: solid 1px
  • 116. Behavior or “DOM Manipulation”
  • 117. Behavior or “DOM Manipulation” Unobtrusive
  • 118. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements
  • 119. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements
  • 120. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes
  • 121. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation
  • 122. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation make features that compliment pages without making pages rely on them for functionality
  • 123. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation make features that compliment pages without making pages rely on them for functionality If a technology isn’t available, pages still render correctly
  • 124. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation make features that compliment pages without making pages rely on them for functionality If a technology isn’t available, pages still render correctly Progressive Enhancement
  • 125. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation make features that compliment pages without making pages rely on them for functionality If a technology isn’t available, pages still render correctly Progressive Enhancement adding functionality after providing basic content and function
  • 126. Behavior or “DOM Manipulation” Unobtrusive separation without disruption of other elements Use DOM to select elements consistent use of id and class attributes Graceful Degradation make features that compliment pages without making pages rely on them for functionality If a technology isn’t available, pages still render correctly Progressive Enhancement adding functionality after providing basic content and function enhance experience of capable clients
  • 127. Advantages
  • 128. Advantages ★SEO
  • 129. Advantages ★SEO ★Smaller file sizes, better bandwidth
  • 130. Advantages ★SEO ★Smaller file sizes, better bandwidth ★Accessible to all user clients
  • 131. Advantages ★SEO ★Smaller file sizes, better bandwidth ★Accessible to all user clients ★Backwards compatible
  • 132. Advantages ★SEO ★Smaller file sizes, better bandwidth ★Accessible to all user clients ★Backwards compatible ★Future compliant
  • 133. Advantages ★SEO ★Smaller file sizes, better bandwidth ★Accessible to all user clients ★Backwards compatible ★Future compliant ★Minimal maintenance
  • 134. We’re past all that, aren’t we?
  • 135. Even a decade later....
  • 136. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool
  • 137. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design
  • 138. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags
  • 139. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM
  • 140. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS!
  • 141. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng!
  • 142. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng! WYSIWYG sGll exist (and aren’t too much different then yesteryear)
  • 143. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng! WYSIWYG sGll exist (and aren’t too much different then yesteryear) S0ll overly complex source code
  • 144. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng! WYSIWYG sGll exist (and aren’t too much different then yesteryear) S0ll overly complex source code Replaced table‐based design with un‐seman0c DIV tags
  • 145. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng! WYSIWYG sGll exist (and aren’t too much different then yesteryear) S0ll overly complex source code Replaced table‐based design with un‐seman0c DIV tags .mobi (top‐level domain)
  • 146. Even a decade later.... VVC teaches HTML as if it were a forma4ng tool Table‐based design Non‐seman0c use of tags VVC teaches JavaScript without acknowledging the DOM VVC doesn’t even teach CSS! S0ll having a hard 0me adop0ng! WYSIWYG sGll exist (and aren’t too much different then yesteryear) S0ll overly complex source code Replaced table‐based design with un‐seman0c DIV tags .mobi (top‐level domain) Influences people to believe that the mobile web should be a  different experience than a consistent Internet we experience on  the desktop
  • 147. Final Thoughts.
  • 148. Helior Colorado me@helior.info