This tutorial will explain how to create a website that works with and without JavaScript, using the same templates on the server and client.
This is an excerpt of the tutorial, which is available in the February issue of net magazine. Once the article is published online I will update this post to contain the full text.
Serving your sites content via HTTPS is a laborious and painful task. I went through this process, and thought I’d let you know how I managed to add SSL to my site for free.
I’ve been working on a simple, handy tool for drawing vector paths in Canvas. I’ll walk you through the what, why and how of drawpath.
It’s been an age since I’ve written a post on my blog. I’m going to break the habit and be updating it far more regularly.
My last post mentioned I was running some workshops in December. They went really well. Two intense one day workshops. At the end, the attendees learnt HTML and CSS, and managed to publish their first websites, all written from scratch!
Starting in November 2013 I will be running workshops which teach people how to build websites in HTML and CSS. If you would like to learn how to make a website then make sure to grab a ticket.
Whilst I’m improving the workshop, I’ll be giving tickets away for free. I expect that they’ll go fast! Be sure to check out the workshop details where you can subscribe to be notified when tickets become available.
I recently gave a talk at Front End London about creating resolution independent graphics. It was similar to the talk I gave at Responsive Day Out, except that I did a live coding session on animating SVG’s.
The talk went pretty well, but at the end someone noticed that I was exporting my SVG files with 4 decimal places of precision. They asked if that was a little overkill and if I had thought about reducing that down. Embarrassing.
Well in order to redeem myself, I’ve modified the amazing Fireworks plugin, Export and made the changes I wanted to it. These mainly relate to creating much smaller SVG files than the plugin made by default. The original plugin wasn’t bad, but it needed a bit of yak shaving. I’ve called my version SVG for Web.
I feel like I’ve learnt an important life lesson recently. Whilst it’s important to look to your peers for validation, if you can’t trust your own judgement it will always hold you back.
It’s not that I’m shy, and I generally embrace the new in a fearless manner. But when it comes to the role of mentor, I’m always feeling unqualified to put forward my knowledge and opinion.
The Raspberry Pi Foundation and Code Club have the same ultimate goal: to show people that engineering is creative, and improve the education system.
The aim of this event was to devise a way that schools and Code Clubs could teach kids to create something which uses the Raspberry Pi, hopefully by taking advantage of a unique feature of this device.
Whilst working on the upcoming redesign of the Clearleft website, I’ve been ensuring the website is resolution independent. In my last blog post I showed how to use SVG files on the web, and we are using this technique for the Clearleft Logo. There are a bunch of other assets, and for these we are using a custom web font.
Any single colour vector asset will work with this technique. Multiple colour vector assets will need to be a SVG file. But whilst SVGs don’t work in IE<9 and Android<3, web fonts work in almost every browser.
SVG is a vector format which can be used on the web. They often have smaller file sizes than their rasterised equivalent and more importantly are completely resolution independent. This means they’ll automatically look even better on a retina MacBook, any recent iPhone or any higher resolution device yet to be imagined.
However, there are a few additional steps involved if you want to use SVG graphics today. I’m just going to talk through the steps for using SVG graphics inline here. Most of these steps can be used for CSS background images too.