Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
For a sighted developer, it can be tempting to arrange HTML elements based on how they appear on the page visually. That can, and probably should, usually result in a reasonably well-structured HTML document. Relationships between elements should be very clear from the way they’re nested together.
For a sited developer,
it can be tempting to
0:00
code html elements based on how
they appear on the page, visually.
0:03
That can and should, usually, result in a
reasonably well-structured HTML document.
0:08
Relationships between elements should be
very clear from the way they're ordered
0:14
and nested together.
0:19
Suppose you have a main content area and
a sidebar.
0:21
At first, you've got the main content on
the left-hand side of the screen, and
0:24
the aside on the right-hand
side on larger screens.
0:29
In HTML, the main element is
written first, then the aside.
0:33
Suddenly your boss asks you to
swap the two element's positions.
0:37
You leverage your CSS skills to take
care of it and everyone's happy, right.
0:42
It might not be immediately apparent but
we've introduced a problem here.
0:48
Now the order of your mark up
doesn't match the visual display.
0:52
At best,
your user gets a bit confused at first and
0:57
shakes their head disapprovingly at you.
1:01
>> Hm.
1:02
At worst, they get confused,
frustrated, and upset, and
1:03
refuse to use your site again.
1:07
Always keep in mind that
your browser settings
1:09
are not necessarily your
user's browser settings.
1:12
Your user may have turned off CSS and
JavaScript for various reasons.
1:16
In that case,
they're essentially reading your HTML.
1:20
Look up how to disable styles in your
own browser of choice, and try it for
1:23
yourself.
1:27
Your users might keep this
is as their default setting.
1:29
Some might be easily distracted if
too much is happening on a page.
1:32
Others may simply not want
the web content they consume and
1:36
to take up any more space
than is strictly necessary.
1:39
Your page, stripped down this way,
should still be easily understood.
1:43
You need to sign up for Treehouse in order to download course files.
Sign up