Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

S13 lecture 11 html lists and links


Published on

Published in: Education
  • Be the first to comment

  • Be the first to like this

S13 lecture 11 html lists and links

  1. 1. LSC 532: Class Session #11Progress Update, Lists, Links and Images Don Stanley 3Rhino Media | UW-Madison DON STANLEY | @3rhinomedia |
  2. 2. Step 1: Visualize DON STANLEY | @3rhinomedia |
  3. 3. Step 2: Info Arch DON STANLEY | @3rhinomedia |
  4. 4. DON STANLEY | @3rhinomedia |
  5. 5. DON STANLEY | @3rhinomedia |
  6. 6. HTML STEP 3: Lists
  7. 7. ORDERED UNORDERED DEFINITION1. Chop potatoes into quarters • 1kg King Edward potatoes Sashimi2. Simmer in salted water • 100ml milk Sliced raw fish3. Heat milk and butter • 50g salted butter Scale4. Drain potatoes and mash • Freshly grated nutmeg A device used to5. Mix in the milk mixture • Salt and pepper to taste accurately measure weight
  8. 8. Ordered Lists (numbered)<ol> <li>Chop potatoes into quarters</li> <li>Simmer in salted water for 15-20 minutes until tender</li> <li>Heat milk, butter and nutmeg</li> <li>Drain potatoes and mash</li> <li>Mix in the milk texture</li></ol>
  9. 9. Unordered Lists (bullets) <ul> <li>1kg King Edward potatoes</li> <li>100ml milk</li> <li>50g salted butter</li> <li>Freshly grated nutmeg</li> <li>Salt and pepper to taste</li> </ul>
  10. 10. Definition Lists <dl> <dt>Sashimi</dt> <dd>Sliced raw fish served with condiments.</dd> <dt>Scale</dt> <dd>Device used to measure the weight of ingredients.</dd> <dd>A technique by which the scales are removed from the skin of fish. </dd> </dl>
  11. 11. Nested Lists (lists inside of lists) <ul> <li>Mousses</li> <li>Pastries</li> <ul> <li>Croissant</li> <li>Milles-feille</li> <li>Palmier</li> <li>Profiteroles</li> </ul> <li>Tarts</li> </ul>
  12. 12. LIST SUMMARY »Ordered Lists use # »Unordered lists use bullets. »Definition lists are used to define terminology. »Lists can be nested DON STANLEY | @3rhinomedia |
  13. 13. HTML STEP 4:Links
  14. 14. THE PAGE THE LINK TAKES YOU TO<a href=>Empire</a>
  15. 15. <a href=”index.html”>Home</a><a href=”about.html”>About</a><a href=”movies.html”>Movies</a><a href=”contact.html”>Contact</a>
  16. 16. <a href="">Email Jon</a>
  17. 17. <a href="” target="_blank">IMDB</a> (opens ina new window)
  18. 18. • Lists• Links (internal, external and opening in new Window)• Directory Structure• If we have time, we’ll upload.
  19. 19. • Take your site map and create HTML documents for each page in your site and link them.• Get ready to upload your sites and review what we’ve covered by using any online resource, the recommended course text or the W3Schools Website.• NEXT TIME: We’ll upload your sites AND work with images. • We’ll also discuss the DIV tag.