Levels of expertise in CSS — Are you ready for the tutorial? by@brianbest

Levels of expertise in CSS — Are you ready for the tutorial?

The following is a guide to help understand Cascading Style Sheets (CSS) tutorials. To help students gauge if a tutorial is right for them, I’ve come up with a scale to indicate what prior knowledge a student should know before taking on a tutorial. For each level, students should know or have:Beginner CSS, Basic CSS, Intermediate CSS, Advanced CSS, and Advanced CSS. The scale is only a guideline, of course, there are plenty of cases where some overlap of knowledge will be required.
Brian Best Hacker Noon profile picture

Brian Best

Senior Frontend Developer

If you like this come check out my site www.brian-best.com for more blogs!

The following is a guide to help understand Cascading Style Sheets (CSS) tutorials. To assist with those who are creating tutorials, as well as my future tutorials, I would like to quantify levels of expertise in CSS. I’m planning on making a guild for HTML and JavaScript! I have found that sometimes these skill levels are not well defined. So as a resource for students to gauge if a tutorial is right for them, I’ve come up with the following. For this scale, I will use Beginner, Basic, Intermediate, and Advanced to indicate what prior knowledge a student should know before taking on a tutorial. For each level, the student should know or have:

Beginner CSS

  • No previous knowledge of CSS

Basic CSS

  • Requires a basic or intermediate knowledge of HTML.
  • How to make a style rule.
  • Understanding of the differences between a tag, ID, and class rule declaration.
  • Understand on how styles ‘cascade’ downward.
  • Some basic style rules, like color, font-family, background-color.
  • How to insert CSS files into HTML documents.
  • What pseudoclasses are, and how to target rules on to them.
  • What web fonts and system fonts are.

Intermediate CSS

  • What the rule !important does and why not to use it in most cases.
  • What the browser defined styles are and why reset files are needed.
  • Most of the style rules.
  • How to target rules based on HTML attributes.
  • Understand the various ways of positioning and when to use them.
  • Understand the box model, when to use position, margin, border, padding, height, and width.
  • How to nest styles within styles.

Advanced CSS

  • Requires an advanced knowledge of HTML.
  • All style rules and when they apply to specific tags.
  • Sibling selectors, like > and +.
  • How to solve style issues caused by browser compatibility.
  • How to use media queries to build responsive sites and elements.
  • How to create animations with keyframes.
  • How to use :before:after to make style driven elements in the DOM.
  • Understand what CSS preprocessors are and how to use at least one.

This blog is only a guideline, of course, there are plenty of cases where some overlap of knowledge will be required. Example being a basic tutorial requiring some intermediate knowledge. For students, just remember Googling for terms you don’t completely understand is encouraged. For educators, it’s not a bad thing to go into more detail on what you think might be necessary knowledge.

Tags

Join Hacker Noon

Create your free account to unlock your custom reading experience.