Question 43153 in Html Question posted in
Some basic documentation can be found here.

Adding alt text and aria label to fav icon – Html

How can we add alt text and aria label to a fav icon?

Tried the following but has no effect.

I am questioning whether a fav icon even needs these details but see no references in W3 to confirm whether it is needed or not.

Pls advice.

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link 
    rel="icon" 
    type="image/x-icon" 
    href="https://www.company.com/favicon.ico" 

    <!-- This doesn't do anything. And do I even need this -->
    alt="some sample" 
    aria-label="I AM ARIA LABEL"
  >
</head>
<body>

<h1>This is a Heading 12</h1>
<p>This is a paragraph. 1</p>

</body>
</html>
Tags:

3

Answers


  1. 0

    alt or aria-label are not required or needed in the <link> tag that you have identified as a favicon to your page . as an addition to alt:

    • the alt attribute only works if a specific image in the website could not be displayed.
    Login or Signup to reply.
  2. 0

    The favicon is 1.) not an img tag and 2.) does not appear in the body of the HTML code, so you don’t need an alt attribute or aria label attribute for it since it won’t be read by screenreaders.

    Login or Signup to reply.
  3. 0

    Technically, since the <link> element referencing the favicon is in <head>, it isn’t rendered in the page, and hence, can’t have any alternative text or label.

    In fact, the favicon is a pure decorative icon to help you quickly identify your website without the need for the user to read the URL or domain name.
    As such, it doesn’t bring any useful information to blind and partially sighted users who can’t distinguish enough detail allowing this quick visual recognition.

    Note that, for the reasons just explained, if an alt text had been required, it should have been empty.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search