"Advanced styling effects": the navigation could be a lot better

Dmanersu commented 2 years ago

MDN URL: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Advanced_styling_effects

What information was incorrect, unhelpful, or incomplete?

Specific section or headline?

What did you expect to see?

I read tutorial topic by topic pressing "Next". Eventually I get to: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Creating_fancy_letterheaded_paper and I see that: "Add a filter to the logo to give it a subtle drop shadow."... How am I supposed to do that? That was not in the tutorial. I start to google "css filter shadow" and I find this page. How do I supposed to read this page in normal reading sequence? And how many other such articles I already missed earlier? This article is not even in the content navigator.

Then I started to search backward and found another article I have missed: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image

I think the navigation could be a lot better.

Did you test this? If so, how?

MDN Content page report details

* Folder: `en-us/learn/css/building_blocks/advanced_styling_effects` * MDN URL: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Advanced_styling_effects * GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/learn/css/building_blocks/advanced_styling_effects/index.md * Last commit: https://github.com/mdn/content/commit/358158b18ad8c2b90b83fe4dc03bdd7fd2e423da * Document last modified: 2022-03-19T16:52:08.000Z

wbamberg commented 2 years ago

Yes, I do agree with you.

I was confused by your report because it started off linking to https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Advanced_styling_effects , which does, of course, explain exactly how to do what the exercise is asking for.

But if I understand you right, the issue is that:

Advanced styling effects is needed in order to complete the exercise Creating fancy letterheaded paper
But if you work through the articles linked from CSS Building blocks, in order, then you come to the exercise before you come to the "Advanced styling effects" article.

If so then I think the right thing to do would be to:

remove the "See also" section from CSS Building blocks, and move the Advanced styling effects link under Guides instead (perhaps just before "Debugging CSS"?)
update the other nav elements (e.g. the Next/Previous buttons) to splice in the "Advanced styling effects" article at that point.

Does that sound right?

Dmanersu commented 2 years ago

I think yes.

And in my opinion all topics must be listed in the left navigation bar (and a button to find current topic in the navigation). For example, 4 sub-articles in this article: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors And this: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image If I move on using only the navigation (without the "Next" button, as I did indeed) I would miss these articles.

Thank you.

mdn / content