{[ promptMessage ]}

Bookmark it

{[ promptMessage ]}

L03-HTML - Session 3 HTML Session 3 HTML Tim Berners-Lee 1...

Info icon This preview shows pages 1–6. Sign up to view the full content.

View Full Document Right Arrow Icon
Session 3 – HTML 9/19/2010 1 © Robert Kelly, 2001-2010 Session 3 HTML 1 Tim Berners-Lee Reading WebReference tutorials www.webreference.com/html/tutorials/ Wiki en.wikipedia.org/wiki/Html Character sets http://scripts.sil.org/IWS-Chapter03/ © Robert Kelly, 2001-2010 2
Image of page 1

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
Session 3 – HTML 9/19/2010 2 © Robert Kelly, 2001-2010 References WWW Consortium - HTML 4 (www.w3.org/TR/html4/) W3C HTML Validator - validator w3 org/ W3C HTML Validator validator.w3.org/ Web Design Group Validator www.htmlhelp.com/tools/validator/ nVu – http://www.nvu.com/ Tidy GUI - perso wanadoo fr/ablavier/TidyGUI/ © Robert Kelly, 2001-2010 perso.wanadoo.fr/ablavier/TidyGUI/ HTML character entity references www.htmlhelp.com/reference/html40/entities/ 3 Lecture Objectives Become familiar with HTML syntax Understand the relationship between an HTML document and the corresponding element tree Know the different versions of HTML Know the structure of an HTML page Understand the importance of HTML validation © Robert Kelly, 2001-2010 4
Image of page 2
Session 3 – HTML 9/19/2010 3 © Robert Kelly, 2001-2010 HTML Issue There are 2 approaches to HTML 1. “old-style” html – generated by tools, not consistent with standards and not using advanced features 2. Valid html in which styling information is contained within style sheets It’s easy to produce bad HTML, but a little more difficult to produce correct HTML Advanced Web applications almost always need the d h © Robert Kelly, 2001-2010 5 second approach Think of html as a programming language for which most compilers allow errors Anatomy of an HTML Page This Sun Learning Link Registration page is an example your major project (TBD in the next few days) Your project will use a reduced version of a form page – no J S l d d © Robert Kelly, 2001-2010 6 JavaScript, no long drop down lists, reduced number of components.
Image of page 3

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
Session 3 – HTML 9/19/2010 4 © Robert Kelly, 2001-2010 Example Document Structure An HTML page is a tree of html elements Doctype title meta style base head center form table h2 body html Document © Robert Kelly, 2001-2010 7 td tr An element (e.g., body) may contain other elements and/or text HTML Element <td><div align="center"> An element consists of a begin tag, an end tag, and element content <td><div align center > <img src="original_files/contact-us.gif" width="126" alt="" height="51" /> </div> Fill out the form below and your information will be sent to a sales representative. Be sure to specify what price range you are wanting to stay in. If you prefer, you can call us toll free at 877-456-7223 or </td> This html produces this browser display © Robert Kelly, 2001-2010 8
Image of page 4
Session 3 – HTML 9/19/2010 5 © Robert Kelly, 2001-2010 What are the Components of HTML? <html> tag <body bgcolor="#ffffff” element name © Robert Kelly, 2001-2010 9 An element name appears in a start tag and (usually) in an end tag <body> and </BODY> Element names are case insensitive in html Rules for Element Types An element type describes a start tag, an end tag, and the content Some element types allow the end tag to be omitted (e.g., p and li), but not in xhtml
Image of page 5

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
Image of page 6
This is the end of the preview. Sign up to access the rest of the document.

{[ snackBarMessage ]}

What students are saying

  • Left Quote Icon

    As a current student on this bumpy collegiate pathway, I stumbled upon Course Hero, where I can find study resources for nearly all my courses, get online help from tutors 24/7, and even share my old projects, papers, and lecture notes with other students.

    Student Picture

    Kiran Temple University Fox School of Business ‘17, Course Hero Intern

  • Left Quote Icon

    I cannot even describe how much Course Hero helped me this summer. It’s truly become something I can always rely on and help me. In the end, I was not only able to survive summer classes, but I was able to thrive thanks to Course Hero.

    Student Picture

    Dana University of Pennsylvania ‘17, Course Hero Intern

  • Left Quote Icon

    The ability to access any university’s resources through Course Hero proved invaluable in my case. I was behind on Tulane coursework and actually used UCLA’s materials to help me move forward and get everything together on time.

    Student Picture

    Jill Tulane University ‘16, Course Hero Intern