freeCodeCamp: Sentences ending with code blocks

Woops, dropping my phone accidentally pushed a button.

I personally wasn’t thinking of every code tag but rather lengthy verbatem blocks like urls, required strings, that sort of thing. Sort of how you see it in math textbooks where short things go inline and long things go on a separate line.

To ease the burden on translators, it would be good to separate the code block into its own paragraph. If we just tweak the grammar, that may only fix the English.

hey @RandellDawson 👋

I think the aim of making things concise was more so users didn’t have to read so much. This change is the same amount of reading. It does make the box taller - which isn’t preferential - but, it’s not a whole lot taller.

I went through the first chunk of steps. Here are the step numbers and what we should put on its own line:

1 CatPhotoApp 2 Cat Photo 3 Click here to view more cat photos. 
4 TODO: Add link to cat photos 8 https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg
 9 A cute orange cat lying on its back

Stop Here? 17 Cat Lists

These are all/mostly the last thing in the instructions. I think if we change the first few through step 9, we would be alright. There’s quite a few more after that, but I’m thinking users will pick up on things by then.

Yeah, starting with the first project is good. I’d do it by putting these long chunks on separate lines so that it’s the same across all translation efforts.

The open PR changes one of the hints - so I guess I wasn’t sure. If we only do it to the instructions, then I would be fine putting that one codeblock on it’s own line across these steps - and I think I would lean towards doing that.

Also, I can’t be sure, but I think users may be copy/pasting with the period included which leads them to this problem. I have done that myself - this would stop that.

I’m not against putting code blocks on their own paragraph, but I think it could potentially look a little rough. Here’s what one of the hints on step-2 would look like if we did that:

Your
`h2`
element's text should be 'Cat Photos'. Only place the text
`Cat Photos`
between the opening and closing
`h2`
tags.

Maybe it needs to be a judgement on a case-by-case basis of what ones to put on their own paragraph. Only the specific text that is problematic?

An alternative might be to change the tests so the period is optional. Specifically, only for the first part of this practice project. Since it’s the first project users do, they might not understand that codeblocks are the exact thing they need to add/change/etc - and they will probably pick up on that after half a project or so? I’m just guessing. It’s an idea.

Edit: How problematic has this been @jeremylt? I feel like I would prefer to just leave these.

I’ll second this motion. Part of accessibility is attempting to make the content as clear as possible and it is becoming obvious in the forum that this is causing unnecessary confusion. One method would be to reword the the sentence:

Add the comment TODO: Add link to cat photos above the p element.

Another approach would be to separate the comment completely from the sentence:

Add the following comment above the p element:

TODO: Add link to cat photos

The second approach would make it much easier for people using touch devices to copy/paste.