Amazing work by Camila Carlow
Amazing work by Camila Carlow
last few months been rather hectic with alot of things going on. There are quite a few side projects that I’ve been meaning to do but haven’t got around to… including writing the blog. So about time that I treat everything like a Agile Scrum project.
To start with I signed up for ASANA.com and started creating list of all the projects that I meant to be doing and broken them down to small tasks… That way I have a record of all the things.
Also I want to develop regular habbits… Inspired by my friends Lorelle I myself decided I am going to write a blog each day. It would be either something I conjured up or something I found interesting in the web.
I am currently in the process of updating my website from ground up. Please bare with me
I am having some spare time. So I am taking the liberty to compile Semantic Snippets.
I’m using few handpicked resources to ensure everything is consistent. So all the code will be mash up of
At this stage I do not intend provide comprehensive guide to how html5 should be used as above resources are more than enough. Just compilation of snippets inline with best practice for different use cases with references to additional reading materials.
Some of this issues may be subjected to debate. I certainly welcome that
You can view the progress here:
With alot of people using their mobile to view emails It’s important to make it easier for the user to contact you. However whenever you put a telephone number appears in email google / hotmail and mobile email clients by default they get treated as a link and get highlighted in blue. Not the best thing at all.
So following fix will solve the issue and allows you to style them any way you like.
<a href="tel:00442087654321" style="color:#999999; text-decoration:none;"> <font color="#999999">+44 (0) 208 7654 321 </font> </a>
Number: 7654 321
NB: this is catering for the international recipients so they can contact you where ever you are. However if they are locally based it would look something like this.
<a href="tel:02087654321" style="color:#999999; text-decoration:none;"> <font color="#999999">0208 7654 321</font> </a> in Gmail: style="color:#999999;" get stripped off. so need to use <font color="#999999"> within the <a></a>
That’s seems straightforward however, If you are using Email marketing software like dotMailer you may encounter issues because html get formatted by these software. This is done in good intention ofcourse to avoid people making mistakes (but sometimes as a there are unique cases so you would want the option to code to behave as you want it to!).
for instance following code by default when get sent to the recipient get translated from
<a href="tel:02087654321" style="color:#999999; text-decoration:none;"> <font color="#999999">0208 7654 321</font> <a/>
<a href="http://domain.com/t/2L-3J-IK-1/c.aspx" style="color:#999; text-decoration:none;"> <font color="#999999">0208 7654 321</font> </a>
This will break the telephone link!! So you need to make sure this link is not tracked.. So switch to the HTML mode and enter the modified code with URL query string to stop it being a tracking link
<a href="tel:02087654321?campaignkw=notrack" style="color:#999; text-decoration:none;"> <font color="#999999">+ 44 (0) 208 7654 321</font> </a>