MDST 3703 F10 Studio 4

331 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
331
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Ask Ellie Stanton, Kathryn Corcoran, and Jonathan Guerra
  • (theoretically)
  • MDST 3703 F10 Studio 4

    1. 1. Studio 4 XML and HTML<br />Introduction to the Digital Liberal Arts<br />MDST 3703 / 7703Fall 2010<br />
    2. 2. Business<br />Quiz 1 – next week (sorry!)<br />Wanted to include WWW and HTML<br />WordPress sites with missing plugins – working on this<br />Ellie Stanton, Kathryn Corcoran, and Jonathan Guerra<br />Questions about the new synthetic post system?<br />
    3. 3. Overview<br />Gentle introduction to XML and HTML<br />Some historical background<br />Exercise on using HTML in WordPress<br />
    4. 4. What is text?<br />
    5. 5. page o’ text<br />Real world text comes packaged in documents<br />
    6. 6. A document is a material artifact<br />How is meaning conveyed in a document?<br />
    7. 7.
    8. 8. What is text?<br />
    9. 9. Visual Signifiers<br />Small caps<br />Indentation<br />Alignment<br />Italics<br />Space<br />All used to signify aspects of text<br />
    10. 10. 3 Levels: Text, Structure, Layout<br />Text = characters, e.g. /A/ <br />Not to be confused with any particular representation<br />Exists only as a category<br />Structure = units, e.g. paragraphs, and other elements (e.g. titles, foreign words, etc.)<br />Layout = size, color, space, shape, etc.<br />
    11. 11. XML is a language to describe the structure of documents<br />
    12. 12. So, how are docs structured?<br />
    13. 13. Hierarchically …<br />(theoretically)<br />
    14. 14. XML looks like this<br />
    15. 15. also in-line mark-up<br />
    16. 16. Two kinds of elements<br />Divisions – blocks of text<br />Spans – inline elements<br />spans don’t always nest<br />
    17. 17. XML<br />Stands for eXtensible Markup Language<br />Actually invented after the web<br />A simplification of SGML, the language used to create HTML<br />HTML (now XHTML) is written in XML<br />Based on some premises about what a document is …<br />
    18. 18.
    19. 19. XML Premises<br />All documents are comprised of elements.<br />Elements contain content.<br />Elements have no layout.<br />Elements are hierarchical.<br />Elements are to be indicated by “markup” – tags that define the beginning and end of an element<br />
    20. 20. XML Markup Rules<br />All elements have a start tag and an end tag<br />Start tags look like this:<br /><stanza><br />End tags look like this:<br /></stanza><br />Tags can have attributes<br /><stanza type="tercina"> … </stanza><br />
    21. 21. XML Rules<br />Tags cannot overlap<br /><header> This is not <para>cool</header> at all.</para><br />Attributes must be quoted<br /><stanza type=whoa><br />
    22. 22. XML is used everywhere<br />HTML<br />Embed codes<br />TEI (Text Encoding Initiative)<br />RSS<br />Civilization IV<br />Playlists (e.g. XSPF or “spiff”)<br />
    23. 23. TEI<br />Represents an alternative strand in the history of digital text<br />Focused on recovering the past<br />Core of “humanities computing”<br />Tutorial:www.tei-c.org/Guidelines/Customization/Lite/U5-eg.html<br />Resources for scholars:www.rilune.org/europelitteraire/database.htm<br />
    24. 24. HTML<br />
    25. 25. HTML<br />Paragraphs = <p> … </p><br />Headers = <h1> … </h1><br />Images = <br /><imgsrc=“http://foo.com/img.gif”></img><br />Links = <a href=“http://foo.com/page.html”>Label of link</a><br />Other elements<br />Lists, tables, etc.<br />See http://www.w3schools.com/html/default.asp<br />
    26. 26. Exercise: Create a WordPress post in HTML mode using content from the Web<br />Start a new post in your blog.<br />Put the editor in HTML mode.<br />Go to the following URL and copy the text with your mouse http://hd.housedivided.dickinson.edu/node/1937<br />Paste the text into your editor<br />Go through the text and mark up text for emphases<br />Add at least one<br />Block quote<br />External link to an article illuminating the subject linked <br />Flip back and forth between Visual and HTML modes<br />
    27. 27.
    28. 28.
    29. 29. WordPress Quirks<br />Does not use paragraph tags<br />Strips out advanced HTML (such as embed)<br />Will accept things not listed in the toolbar<br />

    ×