Advanced Web Interfaces with CSS3 and HTML5  Short Courses

Course Information

Start DateStart TimeDurationCostCourse CodeApply
Monday 9 October 2017 18:30 - 20:30 10 weeks £490.00 CS2604 Enrolment Closed
Monday 15 January 2018 18:30 - 20:30 10 weeks £490.00 CS2604 Apply Now
Monday 30 April 2018 18:30 - 20:30 10 weeks £490.00 CS2604 Apply Now

Course Content

This short course fast-tracks learners with a basic practical knowledge of CSS and confident grasp of (X)HTML to a foundation professional standard of CSS.

Students get a thorough grounding in CSS theory combined with practical strategies for turning graphical mockups and textual content into functioning CSS-styled websites. Emphasis is on techniques that make sites accessible to users and search engines alike.

A variety of common layout issues and code patterns is covered, and where CSS3 techniques are becoming mainstream these are included in the discussion. This course involves hand coding, and is not a taught Dreamweaver/WYSIWYG course, so good keyboard skills are essential.

Tutor Info

Sonya Smith got hooked on CSS and web standards before they were mainstream. She then spent several years honing her frontend skills hand-coding websites and blogs for SMEs using clean, cross-browser, accessible code. What she loves about CSS is there's always something new to learn.


This is aimed at students with a basic practical experience with CSS - perhaps you've already completed our beginner web authoring course Building Websites with HTML5 and CSS3 or have built one or two simple sites using CSS.

You'll need a confident grasp of (X)HTML. Good keyboard skills are essential as this is not a taught Dreamweaver / WYSIWYG course and work will be hand-coded.

English Requirements

Applicants must be proficient in written and spoken English

What will I learn?

  • Fundamental concepts:
    The cascade, inheritance, specificity. Types of stylesheet. CSS selectors. Organising your stylesheet. Managing multiple stylesheets. CSS resets. The box model. Effect of source order on rendering. Layout modes: inline, block, floats, positioning, flexbox. Fixed, fluid, elastic & responsive layouts.
  • Web standards and browsers:
    Importance of semantic markup, validation, accessibility. Browser landscape, standards compliance, doctypes, rendering modes, dev tools.
  • Practical CSS:
    Styling common elements e.g. lists, navigation, forms, photo galleries.
  • CSS3 for designers:
    Colour & colour models. Using background images & sprites. Transparency, drop shadow and CSS shapes. Typography & web fonts. CSS3 transforms & animation. Resolution-independent interfaces.
  • Implementing designs:
    Design decisions for the web, markup strategies, from mockup to functioning web page, progressive enhancement, source order, accessibility & SEO considerations.
  • Introduction to Responsive Design:
    Media queries. Modernizr. Screens, pixels and viewports. The fluid grid. Ready-made grids. Flexible images. Flexible HTML. Content decisions. Strategies and tools.

By the end of the course you should be able to:
*    understand how CSS works, and what makes it break
*    avoid common design pitfalls
*    code using best practises that benefit accessibility and SEO
*    translate graphical mockups into websites without reliance on WYSIWYG tools

Teaching and Assessment

Lessons will consist of theory followed by real-world problems for you to solve in class, followed by class discussions. Self-assessment quizzes will also be available for you to take at your own pace.

Leads To...

Web Programming using PHP/MySQL Part 1

Career Outcome

Would be useful to:

  • front-end engineer or designer
  • designer/developer
  • UI or app designer
  • web editor
  • web project manager
  • small web business owner

Application Deadline: