 Let me stay here for you. OK, hi, everybody. OK, so I've been running websites for many, many years. And one thing I actually appreciate is when users actually write to me and say, on this page, there's an error. You should fix it. No, I like that. Because, yeah, there is an error, and I need to fix it. So I fix it straight away. And I write back to them, I say thank you very much. And it's now fixed, and it's now better for everybody. And I think that's a really important attitude for anyone doing any kind of development, that if you've stuffed up in some sort of way, or there are improvements you can make, then you should try to make them. So I'm going to talk about texting images, and I'm going to tell you a little story about what I tried to do, and it was a complete fail. And I'll tell you what I mean. I'm talking about texting images. So the kind of thing I'm talking about is you fire up Photoshop, and you use the type tool, and you type a bit of text on there, and you save it as a JPEG, or a GIF, or a PNG, or something or other, so you have got text on an image. And what I'm here tonight is to say, please don't do it. OK, so case in point, the People's Association sends out emails about promoting the Industry Guru series. So I subscribe to this, and they send me out various mails that look something like this. Now, I read most of my mails when I'm on the train or something on my phone, and I'm trying to read something like this, and it's almost impossible to read on my phone. And there's too many things I have to leave until I get home to read, because it's just impossible to read on the train. And I'll talk about why that is in a minute. It looks fine. Everything's nice and big. We can see what we're doing. It's all pretty, but there's one key problem with it. It's all text on images. Total fail. So usually what I do with these things are maybe I read them quickly, and I archive them, and then I want to come back to them later. I think there was a talk on something or other that I wanted to go to. So I try and search in Gmail. And what was that deep dive thing? And so it's deep dive, no. Industry guru, no. Innovation playground, no. I remember the one I wanted to go to was actually the data analytics one. Data analytics, no. And I thought, I'm sure it was something like that. What the hell was it? So I have to go back through a whole pile of old emails and try and find something that looks a bit like the one that I'm actually looking for. And I eventually found it, and this was it. And so there you go. Now, I just want to show you what it looked like on my phone. I mean, you've all seen it, but just to make my point. So let me just be silly here and assume we're using an iPhone, iPhone 5. Now, it was just crazy small, especially this. This was a yellowish sort of font on a blue background. I just couldn't see that at all on the train. And whilst my years are advancing a little, I don't want to be on the train doing the uncle style and trying to see that, what the hell is this kind of thing? I just couldn't see it. So I had to wait until I got home and I read it at home like that. So I thought this is a bit awful. So I wrote to them. Now, this is actually the thread. And just to give you an idea, this was the original mail that I got. The only information I'm getting looking at this is thank you regards, lifestyle skills, and blah, blah, blah. I can't even see what's going on in that mail. I can't even say, come to the guru thingy, what's it, and you'll learn about data analytics or something. There's nothing like that. It's just like that. But what you can see is my text-based reply where I said, hello, I appreciate your hard work organizing these useful information sessions. However, using text on images in these publicity emails is not user-friendly. On a mobile phone, you have to scroll right and left to see the text. And many people have images turned off by default. So your mail will just contain empty frames with a gray border as per the screenshot. Now, what I was talking about there was, of course, some browsers and some apps and some combinations of the two will actually either do what you can see there, which is this kind of thing. This is Pui Jing's favorite activity here. Have you ever seen her do a talk? She does this about 18 times for every image. So I'm going to do this just to. Anyway, so it just gets ridiculously small. The other thing is the call to action is one of the most important things you can ever send out in an email. The call to action is click here to subcribe or click here to sign up or whatever. And when I was reading this on the train, which actually looked like this for me, I thought, well, when is it? And where do I sign up? What the hell is going on? And of course, it was because it was just hitting right there. And I didn't even realize there was anything on the right-hand side. Of course, if I'd scrolled across, oh, here's the sign up button right here. So if you're doing marketing, it's a total fail, isn't it? If half the people can't see it and another half of the people can't find it and another half of the people can't find the button, that's one and a half of the people already. Hey, mathematics. I told you I'd snick some mathematics in there just to keep her happy. So there you go. So it was all silly. So my other one is, oh, OK. So of course, in some browser and app and whatever combinations, you get this kind of nonsense happening where nothing resizes. And as I said, you have to scroll left and right like that. So total fail. So that's what I wrote. So she read, oh, OK. And I kept complaining. Also, with no text in the mail, not even any alt text, it is impossible to search for the desired workshop later. Search engines generally cannot find text on an image. Well, Google can, but that's in their main web index, not in Gmail. So it doesn't work. So could I suggest only use an image when it actually is an image, e.g. the photo of the presenter or the Star Hub logo, use actual text in the mail instead of text on an image and ensure the publicity mail is a mobile friendly by using responsive design, since more than half of your readers will be accessing them on their phones. And then I was a bit cheeky here, so I'm not going to read this out. So her response was, dear sir, thank you for your feedback. Taking your suggestions into consideration, we will be inserting alternate text for all our images from the next EDM onwards. Have a great weekend. And I thought, yeah, that wasn't the main point. So I said, well, thank you very much. Thank you for replying. However, I think you missed the main point I was making. Text should not be used in images at all. It should appear as actual text in the mail. Images should only be for photographs of people or events or for logos. I have come across too many instances where the publicity for an event is obscured by overuse and inappropriate use of images. So she replied, dear sir, thank you for your valuable feedback relating to your user experience. Your helpful comments are much appreciated. We will continue to improve for future EDMs. Well, I don't know what the hell an EDM is, but that's OK. This is Singapore, the acronym capital of the universe. While we are working on the enhancements, do let us know if you wish to be removed from the mailing list as we do not wish to send you emails with empty gray border frames. My male said, if you have got images turned off, then you're not going to see the images. You're not going to see anything. I didn't say I was complaining about the fact that the text was on images. But anyway, we look forward to your support in our programs. Have a great day ahead. So I just to show you these people, is this anyone's sister? Anyway, to show you what it looks like with images turned off or whatever. Of course, some people, because 99.9% of us in Singapore are using smartphones, and we've got good connections, and we leave images on and all that. Yeah, I get that. But of course, some people do not have sight at all. Some people are blind or very visually impaired. So we also have to consider those sort of people. Now, if such a person is using a screen reader for her mail, here is the mail. Here's a sneak peek of what's happening this weekend. Oh, no, this is another one. This is the best dinky one. But it's this kind of thing. All you get is just like no meaningful alt text and so on. I'll talk about the best dinky one in a minute. OK, so we go on to my next example down here, which is with alt tags. Of course, with alt tags, what Chrome does is just gives you an empty rectangle. And here I put in some alt text just to demonstrate what I'm talking about. At least if you've got that alt text in there, Gmail can actually find it, maybe. OK, so what I did was I said let me be kind and let me actually produce a page which is mobile-friendly and can be viewed just nicely on a phone and can be viewed on a desktop and so on. And here it is. Are you ready, Huijing? There you go. A happy foo. Beautiful. Small, readable. Whoa. Images are images. Text is nice and readable. I've used white on dark blue, so it's more readable. I'm a big fan of contrast. Contrast is key for reading, blah, blah. Bit more readable, yeah, yeah. So I did all this and I sent it to them. And I said, hello again. As an exercise, I worked on the most recent deep dive publicity mail, which as usual was difficult to read on a phone. Please try to read the original, which was like this, using your phone. So these are just the things I've just shown you. Now compare that to the following version, which uses text where it should be text and where it is friendly on any device, phone, tablet, or desktop, the one I just showed you. I haven't reproduced the whole thing completely, but I did 90% of it and I thought that was enough. The text is now searchable and readable. I hope you find it useful. And her reply was? No reply. Face palm, face palm, face palm. So as I said, I mean I would love one of my readers to do something like this. Go do my styling for me. Go reorganize it, whatever, if they've come across something that didn't work for them. I would love that. And I would write back in deep appreciation, say thank you so much. I have implemented 90% of it because the other 10% didn't work or whatever it actually was, and I would let them know. So I was kind of irritated that they didn't even bother to reply to that. So one of the things that she said she would do is to put all text in all of our forward mail and thank you for your feedback. We will continue to improve for future EDM. Does anyone know what the hell an EDM is? Dance music. Electronic dance music. That's it. I like it. It's very good. It's very good. Okay, so just wanted to... Oh, I knew I read something. So just this week, guess what we got? We got a... Where is it? In here somewhere. There we go. Sing health, no. Oh no, I'm not gonna try search. That's not what I'm gonna try. Oh dear, God, see it somewhere. Anyway, lost it now. But anyway, one of their mails came in today and guess what? No alt text or images. And you might have noticed this thread that I was showing you before was 16th May 2018. So it's almost two years and as soon as I went away and stopped annoying them, they didn't even bother putting alt text in. So I think there's a problem. There is a problem. So what else do I wanna say here? Let's just pin through all this. We've done all that, blah, blah, blah, blah, blah. Okay, so here's my speech. Please think mobile first. All of us should be designing for a phone first and then let it scale up to a full screen. Think user experience and when a user does write, please actually take what they've bothered to write. It means they care about what you're doing and whatever. So think about what they're doing. Think poor or zero vision users. Do you realize that Singapore is the myopia capital of the universe? Myopia means short-sighted. So anything that you produced in Singapore you have got to do with big font, easily readable font, clear font, and good contrast font. So don't be groovy. Don't be arty. Be readable is a key thing. Of course, if it's a logo, I mean Google or Microsoft or something or other, of course, you're gonna be using text on a logo, no problem. But even then it should have alt text and all images should have alt text. So it can be search friendly. Now, I've called these things poster style marketing. Back around 15 years ago, you produced a poster. And then you could multiple use it. You could send it out in emails. You could stick it up on the wall, whatever. It made sense 15 years ago, maybe, maybe. But it doesn't make sense at all now. So what I wonder about is our bosses saying to their publicity people, this is what I want it to look like. I don't know. So this was actually the title of my slide with a question mark, so I don't know the answer. How do we convince our bosses and the developers not to demand such things? Anyone got a story where you were successful in convincing somebody with this kind of thing? I think, frankly speaking, the PA at Nampo is a cave where an employee is skilled in Photoshop and they do not code it right. So I don't understand their perspective as well. And they have no incentive to reply you actually. So for the first reply, it was a very politically correct reply. Standard, yes. Please go away, man. Yes, I know. I get plenty of them. So I guess it boils down to the organisational structure. My, it's true. Yeah, I know. I get that. Hishi was probably already employed as a visual artist and they have to stick text here every now and then. Well, how do I put it in nicely and whatever? Yeah, I get that. However, as I said, if people can't read it and if people refuse to read it, the other thing, Neil Jacobson and all these people, one of the things they say is, if things are hard to read, people don't read it. And a lot of the time, people don't scroll left, right, actually. We all like to think people are used to scrolling left, right, but people very rarely scroll left, right, unless they absolutely have to and they're absolutely fascinated. If they're only moderately interested, they'll say, ah, forget it. It's too hard to read, move on, delete and move on to the next one. But just coming back to that, I still think it's easier if they just stick text in the webpage, right? It's much easier to stick text in the webpage and put some images around it. Actually, then it is. There are a few kind of things, because designers, if I could just one, certain kind of apography that is not available as a web font. So they simply just use a selectable font and images. Yes, that's why I put quite a bit of effort into trying to match their font. All right, I'm just using standard fonts here. There's nothing special here. But yeah, I get that too. There might be an issue also that the responsiveness works here because it's a browser with all the modern features. But email files are well-loaded here. They can be rubbish at this. So the problem might actually be a lot more complicated. Sorry, what's more rubbish? What? Email. No, no, no. I'm going to send this to myself in email. It's beautiful. But a lot of people are using a lot of different fonts and browsers and the CS engine in an email app. It's not the same as in the web browser. Correct, however. I have tested this in a bunch of things on the phone and it's fine. I mean, I agree, I agree. The newsletter I sent out, I have to use tables and all sorts of really ugly things to make that work. But I deliberately wanted to do this without... I think I did use tables somewhere here. A little bit. Maybe this was table. Sorry? This thing. Maybe this is what a very, very old browser, Netscape. Was it just... I remember Netscape. But I think really the key... The only way to make the anti-actions is really to shame them on Twitter or social media, right? Because what's from one user versus what's from many people is a very difficult fact. Actually, I think 99% of people don't care so you're not going to worry about doing that. However, I mean, I think... I'm just bringing this up here because I hope at least people are a bit more conscious of this and hopefully in their own design houses if you've got people doing this sort of stuff, please point out. What were you going to say? I was going to say you're asking like how you convince people to care about it. I think the way to do that is to get them to think that they were the ones That's what consultants say. Well, I am a consultant, so yeah. Good thinking, yes. If they think it's their idea, they're more likely to... Can you give a script? What? How would you... What example of how you would get people to think it's their idea? I mean, in this context, it's a little more difficult, but if you can get them to go, oh, maybe we should do this. They're the ones who sort of come up with the idea and do this, but they have to be the ones to say it. They have to be the ones to realize, oh, we should do this. Because if they're told to do something, then they won't do it unless they think it's their idea. But if you don't tell them, they won't know. Yeah. This general nudging, maybe you should... Okay. This came in from Sing Health. Guess what? But at least this here. Oh, no, no, no. I don't know what the hell this is. I thought it was text. Oh, it's text. It's all right. And then this one. By the time this one gets tiny, tiny, this program will provide you with regular monitoring of your condition. You just can't see it. I remember... I remember the one I was going to show you before. That's this one, Best Enki. Now, the other thing is the industry guru ones, of course, the technology ones. That's also why I'm sort of... was sort of okay to write to them, because you would think that they would know. Similarly with Best Enki, all of this, and what I was showing you before is what it looks like if you're using a text reader, like a screen reader type thing. So the thing is their marketing is being lost. I mean, one of the things I tried to do in my mail there was say, look, you're putting all this work into it, but if people can't read it, then your work is wasted, essentially. Okay, anyone else got a story? Along a similar line? Actually, most of the time, the people you write to and reply to are not one, not a technically inclined and two, not a correct person. So I once wrote into a famous job portal in Singapore and said, hey, your website doesn't work on my browser because I'm an app locker. Please disable an app locker. You know, they'll give you this kind of reply. Yeah. I've got something to share. So there's this interesting project called Project NAFTA. So just search, Project NAFTA. N-A-P-T-H. N-A-F-T-I? N-A-P-T-H. Yeah, that's the one. So this is a project that uses machine learning to convert any text in the image into Azure text. So a lot of my experience as a developer is that when you try to convince the product manager to do something, usually they just say, no budget, no time. So rather than asking them to do something, maybe we as developers could be able to implement extra features in the browser to automatically process the text within the image to make them into something better. Now, this is not an ideal solution, but at least there's something that we can do. So this is like OCR? Yeah. One thing, if you do this kind of thing, all of this is text on images. So what I searched for was inspirational quotes. So Google can read the text on there. It's using OCR, of course. As I said before, though, the search within mail doesn't do that. And maybe these people are assuming, well, because I can find this sort of thing, people should be able to find it in mail. I don't know. Are you going to write to Google next? Next time. No, I'll write back to... Okay, I'm done. Thank you.