1) In the core criteria, I think it is misleading to use the phrase "selected state" because that is not something that they can reasonably achieve at this point of the course without JS. That is, I interpret "selected state" as meaning "an option in the left navbar has been selected, and the user has been navigated to another page, and so that option should be styled to show that you are on that option/page". From looking through past cohort submissions, some have not even included the :active pseudo-class and still passed the core criteria!
So when I'm on the home feed for my real Twitter, this is what I would interpret as "selected state" - the Home option is selected. Explore is in hover state. Notification is idle/non-state-specific.
2) Simiarly re img vs svg - the wording of the criteria implies that they must use SVGs and that they should be in the HTML:
Get the source for the icon images from the Twitter website as SVG and include them with svg tags
But, again, some past submissions have not even used SVG icons at all and passed. Some have used SVGs as files and referenced with img tags and passed.
Answers
Good questions. Your response was 👌
1) using the :active pseudo class is the intention.
2) images are part of the extension criteria - the intention here is that they practice using SVGs. Historically, it's been difficult for students to find the correct icons as SVGs from the Twitter site (if i remember correctly). At least one tag each is fine
In general the assessment criteria should be much clearer, you're right
Copy and paste of my question in Discord, and Ed's response, about Twitter challenge criteria, which was confusing some students. https://github.com/boolean-uk/html-twitter-challenge
Context
Questions
1) In the core criteria, I think it is misleading to use the phrase "selected state" because that is not something that they can reasonably achieve at this point of the course without JS. That is, I interpret "selected state" as meaning "an option in the left navbar has been selected, and the user has been navigated to another page, and so that option should be styled to show that you are on that option/page". From looking through past cohort submissions, some have not even included the :active pseudo-class and still passed the core criteria!
So when I'm on the home feed for my real Twitter, this is what I would interpret as "selected state" - the Home option is selected. Explore is in hover state. Notification is idle/non-state-specific.
2) Simiarly re img vs svg - the wording of the criteria implies that they must use SVGs and that they should be in the HTML:
But, again, some past submissions have not even used SVG icons at all and passed. Some have used SVGs as files and referenced with img tags and passed.
Answers
Good questions. Your response was 👌
1) using the :active pseudo class is the intention. 2) images are part of the extension criteria - the intention here is that they practice using SVGs. Historically, it's been difficult for students to find the correct icons as SVGs from the Twitter site (if i remember correctly). At least one tag each is fine In general the assessment criteria should be much clearer, you're right