CSS Level 2 for Comptuing Science Teachers

Creating responsive web pages, styling forms and tables and creating interesting and effective layouts requires a detailed knowledge of some tricky CSS features and techniques.

Certain CSS concepts and techniques can be a little tricky to understand let alone teach. Responsive web pages, pseudo selectors, descendent selectors, box models and positioning can all be challenging even for experienced web designers. This one day course will give you a firm foundation in these intermediate CSS topics and set you up to be more confident in explaining and teaching them.

This course follows on from the Yuleblinker CSS Level 1 course and is aimed at those who have attended the Level 1 course or who are confident and competent in coding basic CSS.

The emphasis of this course is to develop real competence in hand-coding, reading and editing CSS code to create contemporary, up-to-date and responsive web pages.

This course is suitable for those teaching Computing Science courses at all levels but will be of particular interest to those supporting pupils at Higher and Advanced Higher as it will specifically address topics included in certain SQA assessments.

Course aims

  • To further develop Computing Science teachers' knowledge, practical skills and confidence in writing and editing complex Cascading Style Sheet code
  • To provide an opportunity for teachers to explore, discuss and practice workable methods of teaching CSS coding in the classroom that is relevant to activities and tasks that feature at the various levels of the Computing Science curriculum.

Who this course is for

This course is ideal for you if...

  • You are a Computing Science teacher, teaching web design and development at any level
  • You have previously attended the CSS Level 1 course and/or
  • You are comfortable, confident and have practical skills in writing basic CSS code and styling simple web page layouts
  • You'd like a refresher on more advanced CSS techniques and you are comfortable, confident and have practical skills in writing basic CSS code and styling simple web page layouts
  • You need to teach Responsive web page design

What you need to know

This is a second level course that definitely assumes a good knowledge of, understanding of and competence in hand coding basic CSS.

You must also have a good knowledge, understanding and competence in hand coding HTML.

You should already be familiar with coding basic CSS styles and creating basic CSS stylesheets and layouts before attending this course.

You should either have attended the Yuleblinker CSS Level 1 course or be certain that you are knowledgeable about, and skilled in, the topics listed in the course detail for the CSS Level 1 course which can be found here: CSS Level 1

This course will not cover basic CSS and will launch straight into the content listed below. If you're ready to take your next steps in CSS and build upon your existing skills then this course is for you.

Knowledge and skills needed to undertake this course

This course builds on topics and skills developed in one or more lower level courses.

It is vital that you have either attended the course(s) listed below or that you are confident that you are comfortable and competenent in the topics and skills it covers.

We want you to get the best from your time on our course and making sure you are attending a course at a suitable level is important for you and for the others on the course.

Please click the link and view the course details. If you are in any doubt about whether you are at the right level to do this course then please don't hesitate to contact us for further information

Courses that provide the necessary skills:

Content summary

Below is an overview of the topics covered in this course

  • Advanced selectors
  • Pseudo Selectors
  • Styling tables
  • Styling forms
  • Fluid web design
  • Responsive CSS
  • CSS Positioning
  • Image Sprites
  • CSS Optimisation

Course content in detail

  • Advanced selectors
    • element
    • ID
    • class
    • group
    • descendent
  • Pseudo selectors
    • nth
    • inputs [type]
    • pseudo classes
    • pseudo elements
  • Styling tables
    • Table headers, alternating rows, table and cell borders
  • Styling forms
  • Fluid web design
    • Relative units, auto-sizing regions and images
  • Responsive CSS
    • What responsive web page design is and why you should use it
    • Strategies used to provide a 'responsive' experience for users
    • Preparing web pages (HTML) to be styled responsively
    • Media queries
    • Responsive CSS workflow
  • Positioning
    • Normal document flow
    • Absolute vs relative positioning
    • Mixing positioning methods to achieve different effects
  • Image sprites
    • What they are and how they are used
  • CSS optimisation