DEV Community

Cover image for 🤓🔥How To Make Websites Accessible To All 💯

🤓🔥How To Make Websites Accessible To All 💯

Ankit on June 04, 2020

Hey, I'm Ankit a lover of "Accessible & Fast Web". Have you ever thought that how blessed we are to be normal ? If not, then you better start. ...
Collapse
 
thinkverse profile image
Kim Hallberg • Edited

"tag is to bold the text and also mark this as important part of the text whereas tag is just a visual element to show text in bold format." - maybe want to specify which tag does what? I just saw @iannismccluskey commented about it, but I'll share my thoughts about it too.

I would also recommend reading the book Accessibility for Everyone by Laura Kalbag, I'm currently reading it myself and it's good.

Collapse
 
growthfyi profile image
Ankit

Sorry there was an error (technical error) where it wasn't detecting html tags I wrote in markdown. Would you mind rechecking the section again?

Collapse
 
thinkverse profile image
Kim Hallberg

Now it displays the tags. 🙂

Thread Thread
 
growthfyi profile image
Ankit

Do you like and understand it now?

Thread Thread
 
thinkverse profile image
Kim Hallberg

Yes, the <strong> tag and <b> tag both visually changes the text to bold but only <strong> mark it as important to screen readers if I read that correctly.

Hint, you can use single backticks (`) to indicate code in a paragraph.

Thread Thread
 
growthfyi profile image
Ankit

Ah thanks for the suggestion didn't knew I could use (`) to mark code I used &lt; and &gt; instead and it gets the work done.

Collapse
 
galdin profile image
Galdin Raphael

Hey, "Proper Labelling of Elements" is missing the aria-label attribute.... I think you intended to include it?

Collapse
 
growthfyi profile image
Ankit • Edited

Oopsie, thanks. Will fix it asap.

Collapse
 
iannismccluskey profile image
iannismccluskey • Edited

Nice article. But you may want to rewrite the "Knowing Use Of Tags" section. I read it three times and still don't really understand what you meant.

Collapse
 
growthfyi profile image
Ankit

Yeah, I got that. I'm trying to find a way. Any suggestions?

Collapse
 
iannismccluskey profile image
iannismccluskey

Is it due to HTML tags that were interpreted instead of being displayed ?

Thread Thread
 
growthfyi profile image
Ankit • Edited

Actually what I wanted to say is "Web Developers" don't know the difference between similar tags.

For example, strong tag and b tag both visually do the same thing but are semantically different.

Strong tag is to bold a text which needs to be emphasized or is important.
B tag is just a visual element for bold text.

Also I have updated the part and changed title to "Semantic Use Of Tags", how does it look? updated the content too.

Updated: Just understood what you wished to say, updated now with proper tags being shown.

Collapse
 
melvin2016 profile image
MELVIN GEORGE

Good content.

Collapse
 
growthfyi profile image
Ankit

Thanks, this is my first article here and glad to have such review. I'll try to add few more points too.