equalizer-landing-page

Community feedback

• 

  T

  Chamu•13,150

  @ChamuMutezvaPosted almost 3 years ago

  • alt values should be able to convey a message to users especially assistive technology users . What is the message being portrayed by the image or what is the purpose of the image? If the image has no meaningful purpose then an empty alt value should be used. Values that include the following words should be avoided - logo, image, icon etc.
  • <h2>Premium EQ</h3>, this is a mismatch
  • use semantic elements , <p class="button-item">iOS Download</p> . Semantic elements comes with many added advantages over general elements like divs. In this particular case the p element will not be accessible to assistive tech users as a button but as a p element.
  • the social icons are links to social media sites , hence the need to wrap them in anchor elements and add attributes that make them hidden to assistive tech users but visually presented to sighted users. Content text must also be added to tell users the purpose of the anchor element. That can be in the form of a span with a sr-onlyclass (google to find more information about css sr-only class. ) The other thing will be to wrap the anchor elements in an unordered list.

  Javascript

  • Separation of concern is very important , let css does your styles and leave interaction to js. It makes easy to debug your code. You need to redo your styling in regards to the styling in your Js file.

  general

  • Site is not responsive

  Marked as helpful

  2

  ---

  

  Nicholas Tapia•60

  @tapzx2Posted almost 3 years ago

  @ChamuMutezva thanks for detailed the feedback!

  I appreciate all the accessibility info, it certainly is a place I could improve and this helps.

  Not responsive is a big deal! I tested it in multiple browsers' dev tools at different widths and on my personal phone. It responded. Is there a testing methodology you suggest? How did you reach the conclusion the site isn't responsive?

  Re Js separation of concerns: https://css-tricks.com/the-differing-perspectives-on-css-in-js/ Not saying I couldn't (or shouldn't) have done it all in css. Just food for thought.

  0
• 

  T

  Chamu•13,150

  @ChamuMutezvaPosted almost 3 years ago

  Not some major changes that you really need to do to fix the responsiveness, The device that i am using is about 300px and If you use dev tools there is the horizontal scroll that shows that the content is not fitting on the available screen width. On desktop it looks ok . Px values do not automatically scale up and down in the same as REM and that has an impact on responsiveness as well.

  I will look into the article that you have sent

  Marked as helpful

  0