Responsive Advice Generator App

Community feedback

• 

  Amer Shah•260

  @fggdbdsbfdPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  Buttons with discernible text are essential for creating a user-friendly and accessible website. Here are some tips to help you ensure that your buttons are clear and easy to understand:

  👀 Make sure that each button has discernible text that clearly communicates its purpose.

  📝 Use descriptive, action-oriented text on your buttons, such as "Submit," "Cancel," or "Add to Cart."

  🚨 Avoid using generic or vague labels, like "Click Here" or "Read More," as these can be confusing for users.

  🔍 Use ARIA attributes, like aria-label or aria-describedby, to provide additional context for users who may be using assistive technologies.

  📱 Keep in mind that buttons should be designed with mobile devices in mind, and should be easy to tap with a finger.

  💻 Consider the layout and design of your buttons, including their size, color, and placement on the page. Make sure that they are easy to find and interact with.

  By following these tips, you can create buttons that are easy to use and understand, regardless of a user's abilities or device. Remember, the goal is to make your website as accessible and user-friendly as possible, so that all users can enjoy a positive experience.

  enjoy the jopurny of coding

  write in comfertable way use emojis make headings

  Hello there! 😊 I'm glad you're enjoying your journey in coding! Here are some tips to help you create buttons with discernible text in a comfortable and easy-to-understand way:

  🧑‍💻 Make sure to take breaks and stretch your fingers and arms to avoid discomfort while coding.

  📝 Use descriptive text that clearly conveys the purpose of your buttons, such as "Submit Form" or "Sign Up."

  👩‍🦯 Consider the needs of users with disabilities when designing your buttons, and use ARIA attributes to make them more accessible.

  📱 Keep in mind that many users will be accessing your website on mobile devices, so design your buttons with touch screens in mind.

  💻 Use contrasting colors and appropriate sizing to make your buttons stand out and easy to click.

  🎨 Experiment with different button designs and styles to find what works best for your website.

  By following these tips, you can create buttons that are both comfortable for you to code and easy for users to interact with. Have fun on your coding journey and don't forget to take care of yourself! 💪

  0
• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have other recommendations regarding your code that I believe will be of great interest to you.

  ---

  BUTTONS 🖲️:

  • This solution had generated accessibility error reports due to lack discernible text for <button> element

  ---

  • The <button> must have discernible text that clearly describes the destination, purpose, function, or action for screen reader users.

  ---

  • Screen reader users are not able to discern the purpose of elements with role="link", role="button", or role="menuitem" that do not have an accessible name.

  ---

  • The <button> name rule has five markup patterns that pass test criteria:

  
  <button id="al" aria-label="Name"></button>
  
  <button id="alb" aria-labelledby="labeldiv"></button>
  
  <div id="labeldiv">Button label</div>
  
  <button id="combo" aria-label="Aria Name">Name</button>
  
  <button id="buttonTitle" title="Title"></button>
  
  

  • Ensure that each <button> element and elements with role="button" have one of the following characteristics:

    • Inner text that is discernible to screen reader users.
    • Non-empty aria-label attribute.
    • aria-labelledby pointing to element with text which is discernible to screen reader users.
    • role="presentation" or role="none" (ARIA 1.1) and is not in tab order (tabindex="-1")

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  0