CODEWITHSUNDEEP
htmlemailhtml-emailwebmail
Karn
Karn

Reputation: 1

Links in HTML email not clickable outside browser

I am sending out an email announcement which was an image I converted to HTML after hosting it online and mapping it to add clickable areas.

It looks perfect on both computer and mobile. Unfortunately though, the clickable areas only seem to work when viewing the email in a browser or on webmail from a desktop.

The links are not clickable when opening the email on mobile (whether in a mobile app or on a mobile browser) or on desktop when viewing through a mail app (such as the Outlook app).

Is something wrong with my code?

Edit: thanks a lot for everyone's answers! I really appreciate it.

<img src="https://www.jlgc.org.uk/en/wp-content/uploads/2021/08/JET-Alumni-Careers-Fair-Default-announcement-768x2172.png" usemap="#image-map">

<map name="image-map">
    <area target="" alt="https://www.eventbrite.co.uk/e/152680281833" title="https://www.eventbrite.co.uk/e/152680281833" href="https://www.eventbrite.co.uk/e/152680281833" coords="285,537,490,625" shape="rect">
    <area target="" alt="https://www.eventbrite.co.uk/e/152680281833" title="https://www.eventbrite.co.uk/e/152680281833" href="https://www.eventbrite.co.uk/e/152680281833" coords="281,1558,488,1649" shape="rect">
    <area target="" alt="https://www.linkedin.com/groups/9061378/" title="https://www.linkedin.com/groups/9061378/" href="https://www.linkedin.com/groups/9061378/" coords="257,1339,420,1377" shape="rect">
    <area target="" alt="https://forms.gle/MFK1U2XzE3G4vAscA" title="https://forms.gle/MFK1U2XzE3G4vAscA" href="https://forms.gle/MFK1U2XzE3G4vAscA" coords="440,1766,505,1803" shape="rect">
    <area target="" alt="https://www.jetaa.org.uk/events/uk-jet-returnees-online-careers-fair-2020/" title="https://www.jetaa.org.uk/events/uk-jet-returnees-online-careers-fair-2020/" href="https://www.jetaa.org.uk/events/uk-jet-returnees-online-careers-fair-2020/" coords="252,1848,468,1884" shape="rect">
    <area target="" alt="https://www.linkedin.com/company/69498145/" title="https://www.linkedin.com/company/69498145/" href="https://www.linkedin.com/company/69498145/" coords="154,2121,31" shape="circle">
    <area target="" alt="https://twitter.com/jlgclondon" title="https://twitter.com/jlgclondon" href="https://twitter.com/jlgclondon" coords="308,2122,30" shape="circle">
    <area target="" alt="https://www.facebook.com/jlgclondon" title="https://www.facebook.com/jlgclondon" href="https://www.facebook.com/jlgclondon" coords="471,2121,30" shape="circle">
    <area target="" alt="https://www.instagram.com/jlgclondon" title="https://www.instagram.com/jlgclondon" href="https://www.instagram.com/jlgclondon" coords="621,2121,31" shape="circle">
</map>

Upvotes: 0

Views: 844

Answers (2)

Eugene Astafiev
Eugene Astafiev

Reputation: 49395

The map tag is not supported. The fact is that Outlook uses Word for rendering message bodies. Read more about supported and unsupported HTML elements, attributes, and cascading style sheets properties in the following articles:

Upvotes: 0

Webber
Webber

Reputation: 5494

Email does not support just any html tag that you can use in the browser.

To see which tags are safe to use in emails you might also check out this answer.

Upvotes: 1

Related Questions