Raymart Pamplona• 16,120
@pikapikamart
Posted
Hey, awesome work on this one. Layout in desktop is smaller than the design but it's fine for now I guess, it is responsive and the mobile state looks great.
Some suggestions would be:
- Avoid using
vhunit onheightproperty on a large container like themainon this one , as this limits the element's height based on the remaining screen's height. Instead usemin-height: 100vh, this takes full height but lets the element expand if needed. - Also, don't use
width: 100vwas this create an extra vertical scroll since this doesn't account the vertical scrollbar's size. - All the images used in here are just decorative since they are only vector. Decorative image must be hidden at all times by using
alt=""and extraaria-hidden="true"attribute on theimgtag. - For every
buttonit would be great to have a default attribute ofaria-expanded="false"and when thebuttonis toggled, this will be set totrueand vice-versa. You will be needing to use.setAttribute. This way, users will know that is has expanded/shown something.
Aside from those, great work again on this one.
Marked as helpful
0
Amandeep715• 80
@Amandeep715
Posted
@pikamart First of all thanks a lot for your feedback. It was very informative, actually this was my first time learning about ARIA and now look more information about it on MDN.
1
