Resourcio-Community/Resourcio_Community-Website

[BUG] : alt, aria-label, title, rel attributes in Form Section and Social Links Section and Other Issues in Some Files

NarendraKoya999 opened this issue · 4 comments

Description

Describe the bug:

  • alt, aria-label, title, rel attributes in Form Section and Social Links Section and Other Issues in Some Files
  • In src/components/profile/profile.jsx File , IT has an Image Element but not add alt attribute
  • In src/components/footer/footer.jsx File , Must need to add aria-label, title, rel attributes to Respective All Social Icons in Footer Section Area.
  • In src/scenes/login/login.jsx File , Must need to add aria-label and aria-labelledby attributes to 2 Form Sections.

Expected behavior:

  • We can expect from these changes like proper accessibility and screen reader related Issues Solved using aria-label, target, rel attributes

Actual behavior:

  • The above Issues are existed in Multiple Files

Reproduction Steps

Steps to reproduce the behavior:

  1. Go to 'https://www.resourcio.tech/'
  2. Click on '....'
  3. Scroll down to 'Footer Section'
  4. 4. See error on Respective Social Icons have no title(Tooltip) along with accessibility and screen readers Validations are Missing`

Expected result:
A clear and concise description of what you expected to happen at each step.

Actual result:
A clear and concise description of what actually happened at each step.

Screenshots

If applicable, add screenshots to help explain your problem.

Additional Information

Device (please complete the following information):

  • OS: [Windows]
  • Browser [Chrome]
  • Version [Version 115.0.5790.110 (Official Build)]

Additional context:
Add any other context about the problem here.

  • The aria-label attribute provides a way to place a descriptive text label on an object, such as a link, when there are no elements visible on the page that describe the object. If descriptive elements are visible on the page, the aria-labelledby attribute should be used instead of aria-label.
  • The title attribute gives users an important indication as to where they will be directed to when they click on a link. If the user hovers with the mouse over a link reference, the title text, which was defined in the attribute, will be displayed.
  • The rel attribute specifies the relationship between the current document and the linked document. Only used if the href attribute is present.
  • The required alt attribute specifies an alternate text for an image, if the image cannot be displayed. The alt attribute provides alternative information for an image if a user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader).

Hello NarendraKoya999, thanks for opening a issue, your contribution is valuable to us. The maintainers will review this issue and provide feedback as soon as possible.

Hi @Abhirup-02 . Kindly Review on this Issue as soon as Possible

Hi @Abhirup-02 . Kindly Take a Review on this ISSUE as soon as Possible.

I have given a PR: #354 regarding this Issue