Como deixar sua publicação lindona

A personalização no Medium nunca foi tão poderosa

Medium em Português
7 min readSep 15, 2016

A partir de hoje, as opções de personalização para publicações aumentaram exponencialmente.

Nem todo mundo é um designer (ou mesmo tem um olho visualmente artístico — falo com autoridade aqui), mas qualquer um pode fazer sua publicação no Medium parecer única e profissional, mantendo em mente alguns princípios orientadores.

Sobre migração

As publicações podem ser feitas a partir do zero no Medium, ou construídas a partir de trabalhos existentes migrados de outra plataforma. Nossa Central de Ajuda (por hora em inglês, mas logo teremos novidades) tem um guia que o ajudará a migrar seu trabalho para o Medium (e seu domínio personalizado, se for o seu caso).

Sobre logotipos, avatares e cabeçalhos

Comecemos pelo princípio: você vai querer começar a projetar sua publicação criando um logotipo, um avatar e um cabeçalho estilosos.
Nós expandimos e fizemos elementos mais poderosos que já existiam em publicações.

Use arquivos .png transparentes para logotipos, avatares e cabeçalhos. Isso fará seu logotipo ter um ótimo visual com todos os fundos e cabeçalhos. Você pode fazê-lo em programas de edição como Photoshop ou GIMP.

  • Os logotipos da publicação (o logotipo que aparece na parte superior de cada história) devem ter no máximo 600px de largura e 75px de altura.
  • Os avatares (o ícone que aparece ao lado do nome da sua publicação, como na parte de baixo de cada publicação) devem ter 60x60px no tamanho.
  • Os cabeçalhos podem ser pequenos, médios e grandes. Você também pode colocar uma imagem em um cabeçalho grande: a proporção é de 2:1 com o tamanho mínimo sendo 1500px de largura e 750px de altura.

Mais sobre os cabeçalhos

Como os cabeçalhos são novos, há diversas maneiras diferentes pelas quais você pode conseguir um visual único e personalizado, brincando com nossas diferentes opções.

Essa é a cara da nossa página de customização.

Sobre tamanhos de cabeçalho e opções de imagem

O cabeçalho para sua publicação pode ser pequeno, médio ou grande. Se escolher pequeno ou médio, você poderá escolher apenas uma cor de fundo.

Cabeçalho pequeno.
Cabeçalho médio.

Para cabeçalhos grandes, você também pode escolher uma imagem de fundo. Apesar de pedirmos que a imagem tenha pelo menos 1500px de largura e 750px de altura, recomendamos que você faça a maior imagem possível com uma proporção de 2:1 (o que significa ter duas vezes mais largura do que altura).

Cabeçalho grande.

As imagens de cabeçalho grandes podem ser cortadas, dependendo da área de visualização no computador ou dispositivo móvel, para que você possa personalizar o ponto principal para garantir que a parte da imagem que você quer que as pessoas vejam sempre esteja exatamente onde deveria estar.

Sobre logotipos em cabeçalhos

Se você tiver um logotipo dentro do seu cabeçalho, fazê-lo ter a resolução mais alta possível é a melhor maneira de fazer seu logotipo ter um visual impressionante, em todo lugar.

Presumimos que todos os logotipos são retina, o que significa que o logotipo é carregado com o dobro do tamanho do qual presumimos que será exibido.

Se você carregar um logotipo com 2000px de largura e 1000px de altura, o Medium interpreta como 1000px de largura e 500x de altura. Fazemos isso para que os logotipos tenham ótimo visual em todos os lugares, de um telefone celular até uma tela retina gigante.

Os logotipos diminuem para caber dentro do seu cabeçalho, se tiverem uma resolução maior do que a área que dedicamos aos logotipos, mas logotipos menores do que a área do logotipo não aumentarão.

Resumindo: faça seus logotipos com a maior resolução possível. Escolha um tamanho que você quer e dobre-o.

Sobre opções de layout de cabeçalho

Além do tamanho, você pode personalizar seu cabeçalho com um logotipo, texto ou ambos.

Opções para o layout do texto, de um logotipo, ou de ambos.

Seu logotipo ou texto pode ser justificado à esquerda ou centralizado dentro do seu cabeçalho. Experimente para ver o que fica melhor com vários tamanhos e cores. O mundo (ou melhor, cabeçalho) é seu parquinho de diversões.

Opções para alinhar títulos e logotipos em seu cabeçalho.

O Those People escolheu um cabeçalho do Medium com um logotipo pequeno e quadrado e duas linhas de texto para o título, as quais eles justificaram à esquerda.

O mesmo Medium; Infinitos estilos de publicação.

Sobre cores de cabeçalho e como elas afetam sua publicação

Você pode personalizar a cor de fundo da sua imagem do cabeçalho para ter qualquer tom do arco-íris que desejar. Nosso editor requer uma cor hexadecimal (cores hexadecimais são uma mistura de números e letras que dizem a um site que cor renderizar) para que possamos combinar com a cor exata que você procura. Você também pode escolher entre os temas “negrito” e “sutil”. Escolher negrito utilizará sua cor personalizada com mais destaque em toda sua publicação, enquanto sutil a implementará mais discretamente.

Quer encontrar a cor perfeita para seu cabeçalho e sua cor hexadecimal? Este site incrível, Color Hex, é exatamente o que você precisa.

VEJA TODAS AS CORES MARAVILHOSAS.

Experimente com essa paleta de cores. A escolha da sua cor personalizada afeta todas as cores dentro da sua publicação (incluindo destaques, botões e outras partes da interface do usuário), escolha tons complementares para que tudo funcione em conjunto.

A escolha da cor personalizada do site Backchannel altera a aparência do texto selecionado e do coração de recomendação.

Este é outro lembrete sobre por que é importante usar .pngs transparentes nos logotipos da sua publicação. Os .pngs transparentes aparecerão com a mesma cor que a cor de fundo que você escolher, fazendo sua publicação parecer profissional.

Pode ser necessário ajustar o arquivo do seu logotipo para adaptar isso (o que pode ser feito facilmente através do Photoshop, GIMP ou outro programa de edição de imagem).

Sobre seções de tag

Você pode personalizar a navegação da página inicial da sua publicação baseada em tags que você usa em sua publicação. Pense nisso como seções para sua publicação. O Talkback, publicação nossa aqui do Medium, por exemplo, pode usar o Feedback, Atualizações e Como para ajudar as pessoas a encontrar os tipos específicos de publicações que procuram rapidamente. Escolha as tags que você deseja apresentar na área de navegação da página inicial — você pode selecionar até sete. Sobre é sempre uma tag, então mantenha isso em mente ao projetar.

A ferramenta para personalizar as tags/seções da sua home.

Sobre favicons

Você não adora quando um site tem um ícone legal na guia do navegador, tornando fácil de reconhecer um site específico em uma olhada rápida?

Nós também.

Agora, sua publicação pode ter seu próprio favicon personalizado. Este recurso está disponível para publicações hospedadas em domínios personalizados. Quer saber como obter um domínio personalizado para sua publicação? Não tenha medo, há um artigo na Central de Ajuda para isso.

Favicons personalizados podem fazer sua publicação se destacar em uma guia.

Não quer ou não tem um favicon? Legal. Você pode usar o nosso.

Sobre o layout da sua publicação

Embora não seja um recurso novo, o layout é sem dúvida o aspecto mais importante de uma publicação.

A guia de layout da página inicial permite que você personalize a organização, o layout e a aparência da sua publicação.

As opções são quase infinitas.

Vamos começar com o layout: os artigos podem aparecer como uma grade, em um fluxo, como o fluxo da sua página inicial, ou como uma lista. Nesta primeira opção, eu escolhi ter uma seção, classificando as mensagens por data de publicação, e sendo exibidas como uma grade.

Talkback, como uma grade, classificado pelas histórias publicadas mais recentemente.

As publicações, à medida que crescem, muitas vezes precisam de mais organização do que esse primeiro exemplo. A organização também é crucial para aproveitar ao máximo as tags que você pode colocar nos cabeçalhos da sua publicação.

Para a organização, você pode criar seções para evidenciar artigos em destaque ou ordenar seu fluxo por data de publicação, tags ou publicações em tendências.

Vamos caprichar na nossa publicação, não é?

Neste exemplo, eu escolhi fazer a minha parte superior como uma área de destaque, mostrando duas das minhas publicações favoritas do Talkback, com o resto dos meus artigos exibidos como uma grade abaixo.

Talkback, agora com artigos em destaque.

Alterar uma parte pequena do seu layout pode afetar significativamente a aparência da sua publicação. Neste exemplo, eu alterei o layout da minha imagem para não ter margens e cobri as imagens com o texto do título.
A diferença é significativa (e, neste caso, não é boa).

Um layout de grade parece significativamente diferente quando as imagens não têm margens e as imagens são sobrepostas com texto do título.

Como eu disse antes: O mundo (das publicações) é seu parquinho de diversões.

Vá lá e deixe sua marca.

Saiba tudo sobre o Medium: dicas e muito mais.

--

--