O arquivo png está na mesma pasta do arquivo bio.html, porém não aparece no browser.
O arquivo png está na mesma pasta do arquivo bio.html, porém não aparece no browser.
hoje, com a Alura e o Google Gemini
Amigo, Você poderia colocar o seu código aqui? para vermos como está tentando exibir o ícone.
Olá Felipe! Qual navegador você está utilizando? Se estiver utilizando o Edge, ele tem essa limitação. Esse ícone que colocamos na aba, favicon.png, não funciona em localhost, ou seja, quando a página está hospedada em sua própria máquina, funciona apenas em webserver, quando a página está hospedada em um servidor externo.
Teste em outros navegadores, se estiver aparecendo, o código está ok. Isso é uma peculiaridade deste navegador mesmo.
Olá Felipe! Se sua dúvida foi tirada é só marcar o tópico como solucionado, assim você ajuda outros colegas com a mesma dúvida.
Abraços!
Olá Felipe! Conseguiu solucionar sua dúvida?
<link rel="icon"href="favicon.png">
Eu também tive o mesmo problema de não aparecer o ícone, testei em outros browsers e o ícone em localhost não funcionou nem no Internet Explorer, nem no Edge e nem no Chrome. Então alterei a tag "Rel" assim:
<link rel="shortcut icon" href="favicon.png">e passou a exibir o ícone localmente no Internet Explorer e no Edge, no Chrome continuou não aparecendo localmente, então pode ser realmente que somente funcione no Chrome no Servidor Web.
Estou usando o Safari e para mim também não aparece. Nem quando eu coloco a página em Pin.
<link rel="icon" href="favicon.png">O arquivo está na mesma pasta do programa.
Rodrigo,
No meu post anterior disse que não estava funcionando para o Chrome, mas depois olhando com mais atenção ao meu html, a tag
<head>Estava com o nome errado, estava utilizando
<header>Quando ajustei o nome da tag, em todos os browsers funcionou, inclusive fiz um teste agora no Mozilla também, e está funcionando. Pode ser que tenha algo errado no seu arquivo html. PS: Mesmo com o nome da Tag errado, funcionou no IE e no Edge.
No meu caso já estava como:
<head> </head>Ainda assim não aparece nem com a aba aberta, nem quando eu faço o PIN TAB no SAFARI.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Biografia João da Silva</title>
<link rel="icon" href="favicon.png">
</head>
<body>
<h1 style="font-size: 60px" >Sobre mim</h1>
<p>Moro em São Paulo mas atendo clientes do mundo todo. Sou conhecido por fazer produtos de <em>qualidade</em>, <em>durabilidade</em> e que <em>agregam valor</em> para meus clientes.</p>
<p>Trabalho usando a web como plataforma, ou seja, respiro HTML5, CSS3 e JavaScript (ou melhor: ECMASCript). Crio sites para todos, seguindo as principais diretivas de acessibilidade, responsividade e web semântica, sem descuidar da qualidade de código.</p>
<h2>Como trabalho</h2>
<p>Satisfazer meus clientes é prioridade. Para isso, garanto um processo de desenvolvimento altamente interativo, baseado em feedback contínuo. <strong>Não trabalho com escopo fechado</strong>: o cliente é que decide quando o produto está pronto.</p>
<p>Também não trabalho com prazos fechados: <strong>qualidade é importante demais para ser sacrificada</strong>.</p>
<h2>Experiência</h2>
<p>Já desenvolvi projetos para grandes empresas como BMW, UOL e IBM. Neles, o foco principal era entregar uma experiência imersiva e impactante para o usuário final sem descuidar do desempenho e da acessibilidade da página.</p>
<p>Também já fui contratado para transformar grandes portais, como Terra e G1, em páginas responsivas. Fui responsável por renovar o layout, reorganizar o conteúdo e re-escrever o código de forma mais reaproveitável.</p>
<h2>Comunidade</h2>
<p>Procuro repassar meu conhecimento para a comunidade. Para isso, já dei diversas palestras e mantenho um blog.</p>
</body>
</html>Rodrigo copiei o seu código html, baixei a versão 5.7.1 do Safari para Windows, e seu código exibiu o ícone ali do lado do endereço http. Como estou rodando a partir de um PC, se tiver utilizando um MAC rodando SAFARI não saberia dizer por que não está funcionando na sua máquina. Já tentou utilizar outro arquivo, em um formato diferente do png por exemplo.