Don't use links for headings in Ember Times

[mansona]

This is an issue that currently affects the production blog, so it could be done after the release 👍

If you look at any of the Ember Times posts you will see that all of the headers are also links. This is not the best experience from an accessibility perspective and we need to change the structure of these headers

Right now the HTML is something like this:

<h2 data-embertimes-section-title="0"><a href="https://jamescdavis.com/using-ember-concurrency-with-typescript/">Using ember-concurrency with TypeScript 🤝</a></h2>

and we should really change it to something more like:

<h2 data-embertimes-section-title="0">Using ember-concurrency with TypeScript 🤝</h2>
<a href="https://jamescdavis.com/using-ember-concurrency-with-typescript/">External Link (->)</a>

Once we figure out how this should work in the Markdown then we should write some sort of script to update all of the posts that have this problem

Example:

• https://blog.emberjs.com/2020/07/17/the-ember-times-issue-156.html
• https://deploy-preview-7--ember-blog-legacy.netlify.app/the-ember-times-issue-156

[amyrlam]

I think this done, article title can be a link or not a link now?

[amyrlam]

@mansona I think this is done, closing. We have links and non-links for titles here: https://blog.emberjs.com/the-ember-times-issue-177

But if I'm wrong, please let me know / reopen!

[mansona]

I think this was more of an accessibility issue that @MelSumner brought up and if I remember correctly we should not have any titles that are links.

I've lost track of this issue a bit 🤔 I remember starting a conversation to ask if there was any guidance in WCAG that explained why we cared about this but I think other things came up and I didn't chase it. I'm going to open this up again and leave it for @MelSumner to let us know if it's something that we care about 👍 I hope that's ok @amyrlam ?

[amyrlam]

Sure sounds good! Sorry, I think I misunderstood the issue before. If you can explain the a11y issue, let me know! I did some googling and found this https://css-tricks.com/link-header-header-link/, but it's not exactly the same, glosses over the a11y bit.

Wanted to note: We can stop making headers links altogether for future issues, and just have the link in the paragraph text below the header if preferred...?

[mansona]

@amyrlam I think this is the crux of the problem. I don't fully understand the issue, I just remember that we had a long conversation about it in a learning team meeting and @MelSumner was demoing some alternative HTML that we can use.

Even that article you link to punts on the a11y question:

Accessibility concerns
I’m not sure, I’m afraid. Are there any?

😫

Personally I wouldn't want to make any change until we are sure of the A11y impacts of this and therefore are sure of the right remedy. @MelSumner do you think you can help us on this one? if not then do you know someone that we might be able to ask?