Build by SCSS, BEM, flex-box, grid-box, vanilla JavaScript and jQuery.

Hi Matt,

First I want to say sorry for my late reply. (I was working on my challenge by the suggestions that you gave me yesterday.)

It's great to see your feedback, it means a lot to me, because I didn't expect I will get your feedback, so I'm really surprised by that.

And thanks for promoting my readme on slack and Twitter, If it can bring other people new ideas or inspiration, I think that's a very worthy thing to do.👍

Thanks for everything you have done. I really appreciate that.😊

Here is about your suggestion:

1. Fixed the accessibility report

   I have updated my code and make all errors clear, Haha!😆

2. Regarding the <h1> tag

   I was considering the SEO, for example, if I want to use google search for this site, I may use the keyword like "sunnyside"(like the company's name I guess?), It seems like that it has more representative about this website. Base on that so I didn't put <h1> for the "We are creatives" because I regard it as a subtitle. (just from my perspective💦).

   But your suggestion also makes sense, so I've updated the code.

3. Regarding the capital letter issue

   Honestly, I never know that would cause the problem for the screen reader software. now I get it. thank you for pointing that out.

4. Regarding the screen reader-friendly navigation

   I've read the article that you pasted, It takes me some time to read (because I have to translate by myself😂), but I think it's a great article. Just give me some times to get my head around this, when I get clear from it, I will update my code again.

   BTW, I also want to translate it to a Chinese version on my blog to share to other people. hope it can help more people know about how to increase accessibility.

In the end, hope you don't mind my English may not very fluid, I only can use some simple word and sentence to write this.💦

There's one last thing I gonna say: Frontend Mentor is really a wonderful place to learn how to develop.

I can see you really pay a lot of effort into it, and you really do a great job too, so hope you can keep it, and don't forget to stay awesome. Cheers!

@jubeatt, your English is good! 🙂

1. Great work on the accessibility errors! 🎉
2. Typically, you wouldn't put the logo/website name as the h1. This is because you back yourself into a bit of a corner because you're only supposed to have one h1 on any page. Therefore, people using screen readers would only ever hear "Sunnyside" as the main heading, and you'd also lose out on a lot of SEO ranking potential. The h1 should always be the main heading on the page that best describes and leads the following content.
3. 👍
4. Yeah, there is quite a lot to that blog post! Take your time and keep practising to improve with each project. I'm sure the author would be happy for you to translate it. It might be worth trying to contact them first to see if they're happy for you to do it, but I can't see why they wouldn't be 🙂

I'm delighted you're enjoying Frontend Mentor. We intend to stay around for a long time, so hopefully, everything keeps moving in the right direction! 🤞

@mattstuddert

Hi Matt,

I've just updated the design and also write the record on the README

1. Thanks for the explanation. I've tried to use a screen reader by myself to listen to the content. and I think I get it, it makes more sense to put meaningful content for the <h1>, so it can bring more information for people. anyway, next time I'll pay more intensive on this part and do more practice.

2. Yeah, it's a good suggestion, so I've asked the author and now I'm waiting for his reply, hopefully, everything will be fine!😎

3. That's a great message for everyone!😀

4. the one last question on my last update, I set the role="navigation" for the <nav>, but the report says it is unnecessary for element <nav>, and I also search something about this informations, what I get is some people say it actually would happen, but it just a warning and w3c didn't mean you can't use that, so I keep it.

@jubeatt yeah, the role="navigation" on a nav element is an odd one. It shouldn't be necessary, but I've read that there can be issues without it as well. It's fine to leave it in, as it's not going to cause any problems by having it on there 👍

@anh-vumartell

Hi Ngoc Anh,

I'm delighted the README is helping you learn something new.😊

Indeed, it's nice to have many members who can teach each other while we learn these techniques.

There are a lot of things need to learn on the front-end, so I'm still working hard on it, hope we can get more improvement day by day and keep going!👊

Regarding the structural drawing, actually, the pictures are all designed by photoshop, it's a great tool to use for me.