image blurry inside email signature - html

Question

I am having a problem with my image inside my email signature, what I have tried to export the image as retina with 300dpi. I also doubled the pixel size of the image. How can I make the image sharper than it is now?
<table width="430" cellspacing="0" cellpadding="0" border="0" bgcolor="#ffffff" style="display: inline-table;">
<tbody>
<tr>
<td width="5" height="1"></td>
<td width="9" height="1"></td>
<td width="182" height="1"></td>
<td width="57" height="1"></td>
<td width="30" height="1"></td>
<td width="98" height="1"></td>
<td width="37" height="1"></td>
<td width="37" height="1"></td>
<td width="37" height="1"></td>
<td width="37" height="1"></td>
<td width="37" height="1"></td>
<td width="9" height="1"></td>
<td width="5" height="1"></td>
<td width="1" height="1"></td>
</tr>
<tr>
<td colspan="13">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Met vriendelijke groet,</span>
</td>
<td width="1" height="22"></td>
</tr>
<tr>
<td width="570" height="13" colspan="13"></td>
<td width="1" height="13"></td>
</tr>
<tr>
<td width="248" height="10" colspan="3" style="vertical-align: bottom;">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">
<strong>Jaap Jacobs</strong>
</span>
</td>
<td width="30" height="66" rowspan="3" colspan="2"></td>
<td width="292" height="22" colspan="7" style="vertical-align: bottom;">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">[phone]</span>
</td>
<td width="1" height="22"></td>
</tr>
<tr>
<td width="248" height="22" colspan="3">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Managing director</span>
</td>
<td width="292" height="22" colspan="7">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
<a style="color: #222222; text-decoration: none;" href="mailto:emailtest#email.nl" target="_blank">emailtest#email.nl</a>
</span>
</td>
<td width="1" height="22"></td>
</tr>
<tr>
<td width="570" height="15" colspan="11"></td>
</tr>
<tr bgcolor="#ffd668" style="height: 50px;">
<td colspan="10" style="border-radius: 5px;">
<table>
<tbody><tr>
<td width="5"></td>
<td width="200" height="30" align="left" style="line-height: 0" colspan="2">
<a style="border: 0;" href="https://www.fingerspitz.nl" target="_blank">
<img width="138" height="22" alt="Fingerspitz" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Fingerspitz.png">
</a>
</td>
<td width="190" align="right">
<table style="width:100%;">
<tbody>
<tr>
<td width="30" height="30">
<a style="border: none; display: block; width: 30px; height: 30px;" href="https://www.facebook.com/Fingerspitz" target="_blank">
<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Facebook.png">
</a>
</td>
<td width="30" height="30">
<a style="border: none; display: block; width: 30px; height: 30px;" href="https://twitter.com/fingerspitzNL/" target="_blank">
<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Twitter.png">
</a>
</td>
<td width="30" height="30">
<a style="border: none; display: block; width: 30px; height: 30px;" href="https://www.linkedin.com/company/fingerspitz" target="_blank">
<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/LinkedIn.png">
</a>
</td>
<td width="40" height="30">
<a style="border: none; display: block; width: 30px; height: 30px;" href="https://www.youtube.com/channel/UCpovXRL4rEF8skjhle2z25Q" target="_blank">
<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/YouTube.png">
</a>
</td>
<td width="0.2" height="30">
<span style="background-color:#000;height:30px;display:table;width:1px;"></span>
</td>
<td width="40" height="30" align="right">
<a style="border: none; display: block; width: 30px; height: 30px;" href="https://www.google.nl/maps/place/Fingerspitz+Online+Marketing/#51.5904415,4.7595442,17z/data=!4m5!3m4!1s0x47c69f8ba6d2e709:0xbbf458d8e81294cb!8m2!3d51.5904382!4d4.7617329" target="_blank">
<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Maps.png">
</a>
</td>
<td width="15" height="30"></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td width="570" height="15" colspan="11"></td>
</tr>
<tr>
<td colspan="10" style="border: 1px solid #e6e6e6; border-radius: 5px;">
<table>
<tbody>
<tr>
<td width="2" height="30"></td>
<td width="30" height="50">
<a href="https://www.fingerspitz.nl/blog/434-fingerspitz-1-tradingdesks-volgens-onderzoek-emerce-100" target="_blank">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;"><img width="40" height="40" alt="Dutch Search Awards" src="https://www.fingerspitz.nl/files/Social_iconen/Emerce_100_2.png"></span>
</a>
</td>
<td width="10" height="30"></td>
<td width="512" height="50">
<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">Fingerspitz is #1 Tradingdesk van Nederland volgens Emerce! <b>Lees meer!</b></span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
Above you see the result the image Fingerspitz is a bit blurry. I'll hope someone could help me out on this.

Answer 1

You're changing the height-to-width ratio slightly. You could remove either the height or width definition, which would keep the ratio to scale.
So this:
<img width="138" height="22" alt="Fingerspitz" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Fingerspitz.png">
becomes this:
<img width="138" alt="Fingerspitz" src="https://www.fingerspitz.nl/files/Social_iconen/Retina/Fingerspitz.png">