Como os ícones de "sites principais" na nova guia do Firefox são renderizados?

Question

Quando abro uma nova guia no firefox, obtenho os principais sites com base no meu histórico ou com base no que seleciono para exibição. Uma linha dessa lista de sites principais é mostrada aqui. Alguns são simplesmente retangulares (por exemplo, yahoo finance, lichess.org), enquanto alguns estão tendo um retângulo menor no canto inferior (por exemplo, google news, yahoo mail). > Alguns são simplesmente a letra inicial única (por exemplo, N), enquanto alguns estão tendo o favicon relevante (por exemplo, Y, whatsapp, lichess.org).

Por que tal variedade inconsistente?
Por que o firefox trata sites diferentes de maneira diferente?

    

Answer 1

Isso parece ser baseado no tamanho do favicon fornecido pelo site. Com um favicon de 48 x 48 pixels eu vi o pequeno ícone na parte inferior, mas ele mudou para o maior quando eu atualizei meu favicon para 512 x 512 pixels png.

    

Answer 2

O Firefox usa os ícones de dispositivos móveis para websites para exibir os ícones grandes, e estes são definidos pelo designer / proprietário do site no cabeçalho (seção principal) do site por meio de meta tags - originalmente planejados para quando você salva / bookmark o website em um dispositivo móvel, para mostrar como um ícone de aplicativo.

Por que a equipe de desenvolvimento do Firefox decidiu que essa era a melhor maneira de representar sites, nunca saberei. Mas o resultado é que os sites que não apresentam esse ícone de aplicativo móvel são apresentados como um instantâneo do site, com o favicon do site no canto inferior direito da miniatura do instantâneo.

Portanto, tudo se resume a se um site foi ou não projetado para ser exibido como um aplicativo para uso móvel. Espero que isso ajude a compreendê-lo - mesmo que seja uma escolha de design ridícula.