Three Layers of Every Document

We are learning to take any printed or online document apart into its three layers, content, structure and presentation, and to explain what would be lost if a reader or a machine could see only the words.

Before you startAbout 70 minutes · what success looks like · notes for the helper

About 70 minutes. It's fine to stop after the Quick Check and come back another day: the lesson opens where you left it, at the Quick Check.

You'll know you've got it when

I can mark a real document in three colours, one for its content, one for its structure and one for its presentation
I can use the change test to decide which layer a feature belongs to
I can explain what a screen reader or search engine loses when it can see only the words

For the helperhow to sit beside this lesson, and what this step is for

This step: Spark

Start with the question at the top and chat about it. There is no wrong answer here: it gets your learner thinking about what they already know.

Getting ready: A printed recipe, a page from the local paper or a leaflet from the letterbox, three coloured pencils or highlighters, and a little time to talk through what you both notice. Strip It Back needs a timer and a willing helper. All told this lesson is about 70 minutes, a little over one comfortable sitting, so the end of the check is a natural place to stop and come back to the chosen task another day.
What understanding sounds like: Listen for your young adult saying what a part IS, not only how it looks: 'that is a heading' or 'those four lines are a list'. Using the word 'role' or 'job' for a part of the page is a good sign.
A likely mix-up, and something that helps: A very common belief is that markup is just decoration, so a page with no colours or fonts would have no structure left. You might ask, 'If everything looked the same, which parts would still tell you what each section is?'
If it comes easily: A good argument to have if it comes easily: find a feature that sits between two layers, such as bold words, and argue about whether 'this is important' is structure and 'this looks heavy' is presentation.
If it's a struggle: If it is a struggle, you might work with only two colours first, words against everything else, and add the third layer once the first split feels solid. Reading the page aloud in a flat voice can help the roles stand out. If they shut down, marking just the headings on one page is real progress for today. Content, structure and presentation are the three words the unit rests on, so for a learner still building English, a colour key with each word written beside its colour can help.

Step 1 of 6 · Spark

Lesson 1 of 5 · Behind the Page: Markup, Styling and Squeezing Data Small

The same words with everything else taken away

For the helper

Start with the question at the top and chat about it. There is no wrong answer here: it gets your learner thinking about what they already know.

Here is a recipe the way a machine would see it if it had only the words, with every bit of layout and role stripped out: 'Pikelets Makes about 12 Ingredients 150 g self-raising flour 2 tablespoons sugar 180 mL milk 1 egg Method Whisk everything in a jug until smooth Heat a lightly greased frying pan over medium heat Drop spoonfuls of batter into the pan Flip when bubbles appear Cool on a wire rack More recipes'. Read it aloud. You can still work out what it is, but notice how much work you are doing. Where does the title end? Which lines are ingredients and which are steps? Is 'More recipes' the last step, or something you could click on?

One run of words, nothing else. Everything you had to guess is information a well-built page carries for you.

Today's question is simple to ask and surprisingly deep. When you look at a page, what are you actually looking at? The answer is three different things at once, and most people only ever notice one of them.