~~SLIDESHOW~~
====== The Structural and Presentation Layers ======

**Contact Hour 3**: To be discussed on Thursday 2nd February, 2012.

**Lecturer**: [[C.P.Jobling@Swansea.ac.uk|Dr Chris P. Jobling]].

Revision of the most commonly used subsets of the Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS).

Material covered here is expanded in Chapters 3 and 4 of the module textbook: Nigel Chapman and Jenny Chapman, //Web Design: A complete introduction//, Wiley, 2006.



===== The Structural and Presentation Layers =====

  * These notes revise the most commonly used subsets of the Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS). 
  * Because it //is// revision, you are expected to read these notes and if necessary work through the exercises in your own time. 
  * More detailed notes and examples are to be found on-line.

These slides and notes are based on Chapters 2 and 3 of Robert W. Sebasta, //Programming the World-Wide Web//, 3rd Edition, Addison Wesley, 2006. The examples presented there use XHTML markup. I have updated these to HTML5.

----
A different treatment of XHTML given in Part I (Chapters 2-3) of the textbook Chris Bates, //Web Programming: Building Internet Applications//, 3rd Edition,
John Wiley, 2006.. However, you should note that though that book tends to use a simpler, non-validated form of XHTML, the examples are actually valid HTML5 which has a simpler more forgiving syntax. You will find additional information about cascading style sheets and further examples in Chapters 4 and 5 of Bates and in Elisabeth Freeman and Eric Freeman, //Head First HTML with CSS & XHTML//, O'Reilly Media,Inc., 2006.



===== Learning Outcomes ====

  * There are quite a few for this lecture. 
  * See the [[eg-259:lecture2#Review Questions|review questions]] in the individual sub-lectures.
===== Contents of this Lecture =====

**Revision: To Be Read Offline**

  * [[eg-259:xhtml|The Structural Layer: HTML]]
  * [[eg-259:css|The Presentation Layer: CSS]]

**New Material**

  * [[eg-259:html5#browser_support|HTML 5 Browser Support]]
  * [[eg-259:html5#video|HTML 5 Video]]
  * [[eg-259:html5|XHTML 2 and HTML5]]
  * [[eg-259:css3|CSS 3]]










===== Review Questions =====

  * [[eg-259:review:xhtml|XHTML]]
  * [[eg-259:review:css|CSS]]
  * [[eg-259:review:html5|HTML 5]]
  * [[eg-259:review:css3|CSS 3]]

===== Homework Exercises =====

  * All the exercises in this lecture were taken from Chapters 2 and 3 of Robert W. Sebasta, //Programming the World-Wide Web//, 3rd Edition, Addison Wesley, 2006. They are gathered together here in a [[eg-259:homework:2|homework sheet]] for your convenience.




===== What's Next? =====

**Forms and Web User Interfaces**

  * [[eg-259:lecture3#forms|Forms]]
  * [[eg-259:lecture3#user_interface_components_widgets|User Interface Components (Widgets)]]
  * [[eg-259:lecture3#two_examples|Two Examples]]


[[eg-259:lecture1|Previous Lecture]] | [[eg-259:home]] | [[eg-259:lecture3|Next Lecture]]