PhoenixDev22• 16,990
@PhoenixDev22
Posted
Hi Riikis,
Congratulation on finishing this challenge. Great job on this one! I have few suggestions regarding your solution:
HTML
- Page should contain
<h1>. The<h1>is most commonly used to mark up a web page title. This challenge is supposed to be one component of a web page. To tackle the accessibility issue in the report , you may use an<h1>visually hidden withclass=”sr-only”.You can find it here.
- You can upload the two sets of Google fonts in one CSS link , after selecting both font family, you can copy the CSS link that contains both font families.
- In this challenge, the images are much likely to be decorative. For any decorative images, each img tag should have
aria-hidden="true"attribute to make all web assistive technologies such as screen reader ignore those images .
- Adding
rel="noopener"orrel="noreferrer"totarget="_blank"links. When you link to a page on another site usingtarget=”_blank”attribute, you can expose your site to performance and security issues.
line-height: 1.8rem;Use a unitless line-height value to Avoid unexpected results. You can read more in mdn
- Consider using rem for font size , it' not recommended to use px for font size as absolute units don’t scale for example 15px will always be 15px on the same device. Using pixels is a particularly bad practice for font sizing because it can create some accessibility problems for users with vision impairments.
You absolutely did great job readable and reusable code.
Hopefully this feedback helps.
0
