June 3, 2016 All sit down

Hey All! Welcome to my weekly(ish) standup! You know, it’s just occurred to me why we have to stand up at ‘Stand up’ meetings. It keeps them short. Well, I’m sat down so this might take some time ūüėČ

So what’s been happening in my¬†world? Not much design, but loads of front-end development, but that’s cool, as I’ve learnt loads! Firstly I’ve had a rare opportunity to create a print.css for some course information pages on the new Feabhas website. I say rare as no one¬†really asks for them anymore, but we’re using the print.css in this project to create downloadable PDF’s. If you don’t already know, you can use print.css to hide the stuff you wouldn’t want to print, for example, menus, footers & buttons. Basically anything clickable and maybe the odd image. They’re applied easily by including them last in the list of style sheets and setting the media type to print. With regard to images, I did discover that background images are not shown when you try to print and there’s no reliable way to show them, that is you can get them to work in Chrome and Safari with this code¬†-webkit-print-color-adjust:exact; but that’s your lot!

Pointless events

Another¬†brain ache I had was when I used¬†position:absolute; to put a shadow effect on a menu. The problem was that once I’d done this I couldn’t click on the links below the shadow layer. I should have seen this one coming, but I found I could fix the issue by adding the line¬†pointer-events:none; to the shadow layer, which make invisible to the mouse. BOOM!

Fonts in SVG images

So I created some SVG’s with text in, and what I should have done was to convert the letters to vector, I didn’t, and went onto embedded them in my usual way, that is converting to base 64 and applying as a background image. Anyhow, shortly after, Rose (the project manager at Versantus) asked me if the fonts were¬†supposed¬†to look, well umm a bit crap – she has a wonderful way with words. No! I exclaimed, but it was clear what had happened as the text was being rendered in Time New Roman, so watch out for that one!

Google Maps can be a bad UX

One of my pet hates is Google maps that take control of scrolling as soon your mouse/finger gets within spitting distance, and your left zooming all over the place, unable to move away from the map. IMO this is a bad user experience. Anyway, I discovered a jQuery little solution that allows the user to choose if they want to interact with the map by clicking/tapping on it.

Well, that just about wraps it up for today, that is I’m off for a pint. Be cool, and look out for my next rant!