This is assuming a student who has minimal experience with the command-line, and moderate experience writing standalone HTML+CSS webpages that only contain links to absolute URLs. In other words, the learner doesn’t know how relative paths or URLs work.
Given that the hypothetical lesson is only supposed to be 10 minutes, I may be teaching/assessing way too much here—could be more prudent to solely focus on relative paths in the command-line, or relative URLs, but not both.
Pre-Lesson Novice vs. Practitioner MCQ
Suppose we are in the directory /home/bip/cats. Which of the following commands would get us to the directory /home/bop/llamas?
-
cd /../../bop/llamas -
cd ../../bop/llamas -
cd ./../bop/llamas -
cd /bop/llamas
Teaching Exercise
Suppose we have a folder somewhere on our computer with the following subfolders and files.
index.html
img/
cat.gif
llama.gif
css/
style.css
Fill in the blanks for the following contents of index.html to ensure that it loads without errors, regardless of where its containing folder is located.
<!DOCTYPE html>
<meta charset="utf-8">
<link type="stylesheet" href="______style.css">
<title>Yay Cats and Llamas!</title>
<body>
<img src="_____cat.gif">
</body>
Finally, fill in the blank for the contents of style.css to make it load without errors.
body {
background: url(______llama.gif);
}
Post-Lesson Assessment MCQ
Given a base URL of http://example.org/foo, which of the following relative URLs would not resolve to http://example.org/bar?
-
./bar -
bar -
/bar -
bar/