Само изображение не размыто при доступе непосредственно к месту его размещения. Подпись HTML в электронной почте делает ее размытой в Chrome, даже если она открыта непосредственно в Chrome (не через почтовый клиент). Это HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>table{padding:0px;}td{padding-right:5px;}p{font-family:Arial;color:#002956;font-size:14px;margin:0;}a{text-decoration:none;color:#002956;}</style>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="226" align="center" style="padding-left: 0px; padding-top: 0px; padding-bottom: 0px; padding-right: 16px; border-right: 1px solid #cdcdcd;">
<a href="https://www.jccgci.org/" target="_blank"><img src="https://www.jccgci.org/wp-content/uploads/2018/10/JCCGCI_logo_email.png" width="226" height="auto"></a>
</td>
<td width="300" style="padding-left: 16px; padding-top: 0px; padding-bottom: 0px; padding-right: 0px;">
<p style="margin:0; font-family:Arial; font-size:14px; color:#002956;"><b style="text-transform: uppercase; font-family:Arial;">Name</b><br />
Job Title<br />
Department<br /><br />
<a style="font-family:Arial; font-size:14px; color: #002956 !important; text-decoration: none !important;" href="tel:7184495000,1234"><b style="color: #00aae7">T:</b> (718) 449-5000 x 1234</a><br />
<a style="font-family:Arial; font-size:14px; color: #002956 !important; text-decoration: none !important;" href="fax:3479623683"><b style="color: #00aae7">F:</b> (347) 962-3683</a><br />
<a href="https://www.google.com/maps/place/Jewish+Community+Council+of+Greater+Coney+Island,+Inc/@40.572754,-74.0043667,17z/data=!3m1!4b1!4m5!3m4!1s0x89c245c3a27e574d:0x104ef0508520982a!8m2!3d40.5727499!4d-74.0021727" target="_blank">3001 West 37th Street<br />
Brooklyn, NY 11224</a><br /><br />
<a style="font-family:Arial; font-size:14px; color: #002956 !important; text-decoration: none !important;" href="https://www.jccgci.org/" target="_blank"><b style="color: #00aae7">JCCGCI.ORG</b></a><br />
<span style="font-family:Arial; font-size: 12px;"><a href="https://www.nphd.org/" target="_blank"><b>nphd.org </b></a> | <a href="http://connect2ny.org/" target="_blank"><b>connect2ny.org </b></a> | <a href="http://friendlyvisitingny.org/" target="_blank"><b>friendlyvisitingny.org </b></a></span>
</p>
</td>
</tr>
</table>
</body>
</html>
Мне не удалось воспроизвести проблему ни в одном из моих браузеров, но я попытался добавить:
image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast; /* Chrome (and Safari) */
И это фактически привело к тому, что изображение появилось неровно в Firefox и Safari, поэтому я вынул его. Есть идеи, почему https://www.jccgci.org/wp-content/uploads/2018/10/JCCGCI_logo_email.png отображается размытым в Chrome при просмотре подписи электронной почты в формате HTML, но не при прямом доступе к изображению? Я в тупике, тем более что я не могу это повторить. Кто-нибудь видит изображение размытым при открытии вышеупомянутого HTML?