Skip to content

Instantly share code, notes, and snippets.

@senhorinha
Created April 28, 2016 11:47
Show Gist options
  • Save senhorinha/1471a31e297ff9b76e795c143029103d to your computer and use it in GitHub Desktop.
Save senhorinha/1471a31e297ff9b76e795c143029103d to your computer and use it in GitHub Desktop.
Estudo do layout do Facebook

Facebook

Comportamento das imagens baseado na sua resolução

Fatores que influenciam no preview

Imagem presente nos Link

Large Images (acima de 600x315)

Resulução Mínima: 600x315 Tamanho Máximo: 8MB Exemplo: O que eu gostaria de saber sobre Big Data quando comecei

Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images. Images can be up to 8MB in size.

Large Size

Small Images

Resulução Máxima: 600x314 **Exemplo: ** Mobilegeddon: seu site está preparado?

If your image is smaller than 600 x 315 px, it will still display in the link page post, but the size will be much smaller

Small

⚠️ Minimum Image Size

The minimum image size is 200 x 200 pixels. If you try to use an image smaller than this you will see an error in the URL Debugger.

Apesar do texto acima fiz um teste postando a imagem (128x128) abaixo:

pirate

e a postagem resultante foi

Postagem

Postagem como foto

No station se criarmos um post e adicionarmos uma foto, o post é criado como foto, ou seja, o formato da URL é diferente.

Pelos testes que fiz o tamanho da imagem é indiferente para o preview. O que acontece é apenas o ajuste de escala da imagem como mostrado abaixo:

Imagens via station

Ordem dos Links

  • O primeiro link do post define o preview

Link do Twitter antes:

Twitter Antes

Link do Twitter Depois:

Twitter Depois

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment