Eu criei um logotipo que é incrível e salvei no formato AI e SVG. Desejo usar o arquivo SVG no site a, pois o logotipo aparecerá muitas vezes em todo o site e seria melhor do que salvar o logotipo no formato PNG e ter solicitações desnecessárias do servidor. Agora, isso funciona muito bem usando:
<svg id="my-logo" height="60" width="60"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
<g transform="scale(0.1)">
<image x="0" y="0" height="600" width="600" xlink:href="my-logo.svg" />
</g>
</svg>
Agora, o problema surge ao usar a logo
marcação Schema.org . Usando:
<svg itemscope itemtype="http://schema.org/Organization" id="my-logo" height="60" width="60"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
<g transform="scale(0.1)">
<image itemprop="logo" x="0" y="0" height="600" width="600" xlink:href="my-logo.svg" />
</g>
</svg>
Como eu esperava, falha na validação do W3C e sou recebido com as seguintes mensagens de erro:
- O atributo itemscope não é permitido no elemento svg neste momento.
- O atributo itemtype não é permitido no elemento svg neste momento.
- O atributo itemprop não é permitido na imagem do elemento neste momento.
Agora eu sei que a validação do W3C não é uma coisa essencial, mas eu preferiria ter uma solução que satisfaça o Google e o W3C.
Tenho certeza de que algum guru do W3C será capaz de me apontar na direção certa; preferiria não usar o URI DE DADOS, se possível, pois sei que poderia ser uma solução, mas me corrija se estiver errado ou não. não são laváveis.
fonte
width: height:
a tag img teve efeitos indesejáveis. Vou tentar outra vez .... será uma dor ter que usar sprites png, pois isso adicionará 100kb vs 2kb.Você pode simplesmente consultar o seu logotipo por meio da tag meta / link, conforme sugerido na documentação oficial: http://schema.org/docs/gs.html#advanced_missing
Editar : alterado de
<meta>
para<link />
conforme sugerido por unor.fonte
link
vez demeta
se o valor for um URI (que é o que sugeri na parte (b) da minha resposta ).Outra alternativa seria salvar sua imagem como um
.svg
arquivo. Você pode usar qualquer editor de texto para criar esse arquivo e colar na sua marcação SVG. Em seguida, coloque a marcação da mesma maneira que você faria para um.png
ou.jpg
:fonte