Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (19)
Destaque
Semelhante a WDIM268 Week 2 (Summer 2010)
Semelhante a WDIM268 Week 2 (Summer 2010) (20)
Último
Último (20)
WDIM268 Week 2 (Summer 2010)
- 1. WDIM268WEEK2
- 2. Get to know your doctype
- 3. HyperText Markup Language HTML ≈ SGML Standard Generalized Markup Language
- 4. Extensible HyperText Markup Language XHTML ≈ XML Extensible Markup Language
- 5. Why XML?
- 7. Closer to HTML than SGML.
- 10. How does it work?
- 11. Almost exactly like HTML 4.
- 12. Be sure to include a W3C DTD Document Type De nition and a couple other things.
- 13. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>(Page title)</title> </head> <body> (Page content) </body> </html>
- 15. <br> <br/> If a tag is empty and requires no closing tag, end it with a self closing slash.
- 16. <STRONG> <strong> XHTML is case-sensitive. Go easy on the CAPSLOCK key.
- 17. selected selected=selected selected=′selected′ selected=″selected″ Attribute values must be provided, with the value enclosed in quotes.
- 18. font s frameset iframe frame menu u dir applet basefont noframes isindex strike center Don’t use these tags anymore.
- 19. Block vs Inline
- 20. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nulla est, ullamcorper nec semper ac, bibendum at elit. Nulla dapibus facilisis sapien, quis feugiat tortor accumsan eu. Cras porttitor, nisl nec tempor luctus, ligula metus luctus ante, in malesuada justo massa eu velit. Block
- 21. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nulla est, ullamcorper nec semper ac, bibendum at elit. Nulla dapibus facilisis sapien, quis feugiat tortor accumsan eu. Cras porttitor, nisl nec tempor luctus, ligula metus luctus ante, in malesuada justo massa eu velit. Inline
- 22. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nulla est, ullamcorper nec semper ac, bibendum at elit. Nulla dapibus facilisis sapien, quis feugiat tortor accumsan eu. Cras porttitor, nisl nec tempor luctus, ligula metus luctus ante, in malesuada justo massa eu velit. Inline-Block (Yeah, I know...)
- 24. Semantic tags add context.
- 26. <acronym title=″North Atlantic Treaty Organization″>NATO</acronym>
- 27. <ol> <li>Thing 1</li> <li>Thing 2</li> </ol>
- 28. Sometimes, additional tags may be needed if there is no appropriate semantic tag or additional divisions of content are required.
- 29. div is your default block tag
- 30. span is your default inline tag
- 31. Meet the Web Stack
- 32. The Web is multi-layered.
- 33. The foundational layer is HTML, your text and markup. Ideally, your content (and accompanying annotations and hierarchy) should be able to stand alone. <html />
- 34. User agents capable of applying presentational rules to your HTML will then apply CSS, if provided. css { }
- 35. If the user agent is sophisticated enough to handle JavaScript (and doing so makes sense for the agent’s context), your client-side scripts can affect your markup and styles. javaScript();
- 36. In cases where typical web technologies lack functionality your experience needs, plugins (Flash, Silverlight) may be applied.
- 37. Your goal: Make each layer as functional as possible even when subsequent layers are unavailable.
- 38. If you succeed
- 39. Easier to debug.
- 41. No failure is utter failure.
- 43. If you fail
- 44. Updates will always impact multiple layers.
- 45. Fallbacks won’t always be graceful.
- 46. Your information will be bound by your own site’s requirements.
- 47. And this will happen.
- 48. This, too.