Aug 272013
 

For the XML Sum­mer School this year, I’m teach­ing about HTML5, CSS3 and ePub in the Hands-on Web Pub­lish­ing course. The basic premise of the course is to show what tech­no­lo­gies are involved in tak­ing a bunch of Word doc­u­ments or XML files and turn­ing them into a decent-look­ing web­site or ePub. The course includes les­sons on rel­ev­ant bits of XSLT trans­form­a­tion (since Word is XML under the cov­ers, if you dig deeply enough), script­ing in Ruby to auto­mate as much as pos­sible, and, of course, enough inform­a­tion about HTML and CSS that people can make a decent-look­ing web­site in class in the hands-on part.

As a start­ing point for the exer­cises, we’ll use a gen­er­ated tem­plate from HTML5 boil­er­plate, since, if you pick the right options, it is rel­at­ively clean and simple to under­stand. Look­ing at the cur­rent com­mon design prac­tices used across a num­ber of options (HTML5 boil­er­plate, Boot­strap, Word­Press tem­plates for example) coupled with web com­pon­ents and the sheer size and num­ber of HTM­L5-related spe­cific­a­tions from WHATWG and the W3C, I’m won­der­ing just how much more com­plic­ated it can all get before the pen­du­lum starts swinging back again towards sim­pli­city and sep­ar­a­tion of con­tent from pro­cessing. Even a bare-bones tem­plate has a num­ber of lines in it to deal with older ver­sions of IE, or to load some JavaS­cript or (mostly) jQuery lib­rary. It’s no won­der we’re start­ing to see so many frame­works that try to cov­er up all of that com­plex­ity (Boot­strap again, or Ember, for example). 

In the mean­time, at least I have a reas­on­ably con­strained use case to help me decide which of the myri­ad pos­sib­il­it­ies are worth spend­ing time teach­ing, and which are best left for the del­eg­ates to read up on after the class. 

  2 Responses to “Teaching HTML5

  1. Pity I’m not attend­ing. Sounds really inter­est­ing Lauren. Will you make an art­icle of your notes after­wards, or a blog entry?

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

/* ]]> */