Info box linking to FE Web Developer course is repeated in multiple pages

[caldwell-63]

MDN URL

https://developer.mozilla.org/en-US/docs/Learn/Front-end_web_developer

What information was incorrect, unhelpful, or incomplete?

What is the purpose of this content? All it does is basically links to the sidebar items, in the same exact order, adding some imaginary "X-Y hours" numbers and repeats bunch of text. The only exclusive article being "Learning and getting help".

The main problem is the card:

in almost every guide, creating unnecessary circular references.

What did you expect to see?

Just put a link to the pathway somewhere, maybe as first item on the sidebar, or create Guides>Pathways header navigation link, and for the love of God remove these cards from every article...

Do you have any supporting links, references, or citations?

The pathway doesn't serve any purpose except the original "Learning and getting help" article, it just copies the sidebar, so even extracting the article to somewhere, a blog post for example and removing the entire pathway could be a way to go too.

Do you have anything more you want to share?

No response

MDN metadata

Page report details

• Folder: en-us/learn/front-end_web_developer
• MDN URL: https://developer.mozilla.org/en-US/docs/Learn/Front-end_web_developer
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/learn/front-end_web_developer/index.md
• Last commit: 8e2641e
• Document last modified: 2023-02-23T23:55:46.000Z

[hamishwillee]

Front end development covers many disciplines, which are spread across several disconnected modules. The point of this article is to provide a central location for people who want to know the complete set of things they need to learn for front end development, all in one place, spelled out in English. Yes you can infer most of it from the sidebar.

Cross linking back to the document from the other parts makes sense in this context, and the box is what does that. I really don't understand why you find it so annoying.

Upshot, I don't see this as an error. I'm not going to close it though in case someone else in the maintenance team feels differently.

[bsmth]

Thanks for providing the feedback. We have readers who enter the site via pages such as https://developer.mozilla.org/en-US/docs/Learn/CSS/First_steps via search ("CSS first steps") - this card directs complete beginners to a page that suggests other areas that are useful.

The pathway page itself is not likely to be removed for the reasons Hamish has mentioned above and that it recommends modules as prerequisites / an order for reading and learning.

[caldwell-63]

Makes sense

Ideally, the card should show up only in the circumstances you described, where it's opened "out of context", and should not show when opened from the pathway, to avoid these annoying or even confusing circular references/navigation

Another suggestion would be making the card clearly distinctive from other article-specific "standard" cards. A subtle gradient background color and some symbol, for example

[bsmth]

the card should show up only in the circumstances you described

That's a good idea. I'll bring this up with the team, maybe there's an opportunity for having this displayed less often / ability to dismiss it (x "close", etc.)

[Jo-with-vision]

Hi,

This is an old thread, but I just searched for this issue myself to see if anyone else found it off-putting. Were any decisions made in the end?

The reasons given above are totally understandable, but as a first-time user of the front-end web developer learning pathway, I did feel momentarily confused by the repetition of the callout and the journey I took, especially at the beginning.

My initial user journey

1. I began the learning pathway via 'Front End Web Developer' https://developer.mozilla.org/en-US/docs/Learn/Front-end_web_developer
2. I then followed the first suggested link in the 'The Learning Pathway - Getting Started' list - 'Installing Basic Software' https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/Installing_basic_software - note this section does not contain the sect1 callout and makes no reference to being part of the FE learning pathway on the page
3. I could see I was now in a section called 'Getting started with the web' but as this made no mention of being part of the FE pathway, I navigated back to the Front End Developer page and followed the second recommended link 'Background on the web and web standards' https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards - note this is also does not contain any callout or mention of being part of the FE learning pathway. From the breadcrumb it says you are in 'Getting started for the web' but it is not listed in the left-hand navigation and has no current page highlight (potential new issue?)
4. By now, I assumed I was supposed to just open the links one at a time in a new tab, read the material and then go back to the FE Developer page. So that's what I did for the next listed page 'Learning and getting help'.
5. Next in 'Semantics and structure with HTML' I started the first recommended module 'Introduction to HTML' https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML. This page did have a callout and I immediately assumed I followed an incorrect link because I thought I was already following the FE pathway. So I clicked the link suggested in the callout and ended right back where I began on the FE Developer page.
6. Realising the callout was an 'ad' for the pathway (if you will) for people landing cold onto the page, I was able to continue on. But it definitely threw me as a new user to MDN web docs in general.

Why I think it is confusing

The modules have a pattern of the callout being in the section heading and the overview page - but the Getting started content in the FE developer pathway list doesn't. Seeing the callout only once I began the module section made me think I wasn't following the correct pathway - or that there was another course somewhere. This was also due to the way it is written (it's asking me a question, because it doesn't know I'm already following the pathway and have already visited the FE dev main page).

My experience grew easier once I understood the callout wasn't for me and also once the modules 'next' buttons started taking me through the sections in the same order suggested on main FE developer pathway page.

Suggestion

In addition to the 'close' option and other options mentioned above

Quick fix: Perhaps the callout paragraph should say something more like, 'These pages are (or this section is) part of our front-end developer course (or pathway) that includes all the essential information you need to work towards your goal.'
(and in a much smaller info box, so at the very least users don't get caught in the loop by thinking it's advertising a different course.)

Longer headache: As its currently called a course, I do expect, as a learner, to know where I am within the course (referred to by its name) by looking at a breadcrumb or a table of contents style navigation. This isn't currently what you see and a new user may feel disorientated and never quite sure if they're following the pathway correctly.

Thanks for your time! I am learning a lot from the pathway btw so it's a 98% positive experience.

[bsmth]

Thanks a lot for your feedback @Jo-with-vision, that's really helpful. Just FYI @chrisdavidmills is going to be working on this area soon, you can see more details in this discussion: https://github.com/orgs/mdn/discussions/633

[chrisdavidmills]

Thanks for bringing this to my attention @bsmth, and thanks for your input on this subject, @Jo-with-vision, @caldwell-63, and @hamishwillee.

This is very useful feedback on the confusion these boxes have caused. As you'll see from the discussion Brian linked to, we intend to replace the pathway page with a better thought-out and more helpful MDN Curriculum resource. And part of this work is figuring out what to do with those boxes. I will link this from the discussion so it is not forgotten about.

[Jo-with-vision]

Thank you so much for the update, that's great news. Thanks for the link to the discussion. Sorry for posting this in the wrong place!

[chrisdavidmills]

Sorry for posting this in the wrong place!

@Jo-with-vision No apology is needed, and I wouldn't call this "the wrong place". It was related and suitable. And with all the conversation threads going on around this project, no one can be expected to find all the things ;-)