Estilo do resumo de e-mail alterado como renderizado no Gmail?

Em resumos de e-mail enviados em setembro, eu os vejo formatados desta forma no Gmail:

Em seguida, para os enviados no início de dezembro, eu os vejo mais estreitos, mas centralizados:

Para os enviados no final de dezembro, eu os vejo mais estreitos e alinhados à direita:

Não fiz nenhuma alteração na formatação de e-mail em relação a como ele é enviado, e tenho acompanhado todas as versões em tests-passed.

Não vejo nenhuma dessas diferenças no ProtonMail; eles parecem os mesmos durante todo esse tempo.

Eu sei que a formatação HTML de e-mail é uma bagunça, e estou ciente de que há toda uma indústria de serviços em torno do teste de formatação de e-mail (por exemplo, o serviço de teste de e-mail da Litmus). Mas estou curioso se essa foi uma mudança intencional, ou um efeito colateral de alguma outra correção, ou “o Gmail está sendo aleatório”…

5 curtidas

Consigo reproduzir isso em resumos no meu Gmail também.

Como @awesomerobot não mexe nesse código desde

Eu realmente não sei por que isso está acontecendo. Alguma ideia, @awesomerobot?

4 curtidas

Enviei para mim um resumo de teste do Meta e ele ainda está centralizado para mim no Gmail… Estou imaginando que talvez haja algum bloco de conteúdo condicional que não estou vendo no teste e que foi esquecido na alteração anterior, que está empurrando o layout para o lado… @Falco você poderia encaminhar um dos e-mails onde você consegue ver o problema?

1 curtida

Enviei :mailbox_with_mail:

Ahhh, agora que você mencionou, acho que foi causado pelo tópico da revisão anual!

2 curtidas

ahhh sim :100: — quando o conteúdo é muito longo, a mensagem é cortada pelo Gmail:

Em um e-mail não cortado, há um td vazio à esquerda e à direita do td width=\"650\" (o td width=\"650\" contém o conteúdo, e os tds esquerdo/direito ajustam suas larguras para preencher o espaço restante igualmente, o que centraliza o conteúdo)

Quando o e-mail é cortado, esse td direito não está lá:

Screenshot 2023-01-17 at 1.03.56 PM

…então o td esquerdo se ajusta para preencher a largura disponível e empurra o td de conteúdo totalmente para a direita…

Acho que posso consertar isso fazendo com que cada bloco de conteúdo no e-mail se centralize independentemente, então, no caso de o e-mail ser cortado, talvez apenas a seção cortada esteja alinhada incorretamente…

3 curtidas

Aha! Confirmo que, ao abrir o e-mail de final de dezembro alinhado à direita (no meu caso, antes do resumo do ano) com "Ver mensagem inteira", ele é exibido centralizado.

Que bug de renderização bizarro e não maravilhoso do Gmail. Certamente explica por que não apareceu no ProtonMail.

Apenas para esclarecer, minha pergunta sobre isso não tem a intenção de implicar qualquer obrigação de alterá-lo para contornar o bug do Gmail, e sou apenas grato por entender o que aconteceu. :tada:

3 curtidas

Acabei de resolver um problema de e-mail que estava inativo por um tempo, fiz alguns testes e é isso que está chegando no meu Gmail, tudo está à direita, exatamente assim.

Alguma sugestão de correção?

No momento, o e-mail está centralizado por colunas de espaçamento no início e no final; quando o final é cortado, o contêiner no início empurra o conteúdo para um lado. A correção separará cada seção para que elas se centralizem independentemente; dessa forma, quando o e-mail for cortado, apenas a última seção ficará desalinhada. É um pouco tedioso, mas chegaremos a isso eventualmente.

Outra maneira possível de contornar isso seria remover uma grande parte do conteúdo do resumo para que ele nunca seja longo o suficiente para que o Gmail o corte.

1 curtida

Tudo bem com um resumo abreviado, como faço para gerenciar isso, não vejo como um modelo?

1 curtida

Acabei de mesclar uma atualização, esta foi uma alteração mais fácil do que eu esperava. Isso deve evitar a maioria das quebras de layout quando for muito longo para o Gmail.

Não é um modelo editável como os outros, está no código-fonte do Discourse aqui: discourse/app/views/user_notifications/digest.html.erb at main · discourse/discourse · GitHub

3 curtidas