It's a couple of years since this was done, but I thought it was worth reposting as the level of skill involved is fantastic. The artist that created it is a UK based Illustrator called Kyle Lambert, who has done work for companies such as the BBC, Adobe, Wacom and IDG.
With this post I am going to share with you my basic HTML5 skeleton and discuss why I have set it up the way I have. This is nothing complicated, but I always get questions about how to set up a basic page with HTML5. First off a simple html, head, and body tags…
If you’ve been using Illustrator for any length of time you’ll be aware of the Transform functions that reside under the Object menu. Go to Object>Transform and you’ll find Move, Rotate etc all grouped in one submenu.
If you find yourself constantly configuring the same settings every time you create a new document in Illustrator then you may be glad to know we can save you the time and spare you the monotony.
When we create a New Document in Illustrator we choose from a Document Profile to pre-configure settings for Web, Print etc. But have you ever wondered what these profiles are, or where they live...?
The Appearance Panel in Illustrator is the place to go to view and edit the appearance attributes of elements within your document.
To show you how easy it is to create and use svg elements, here is a simple example.
<svg xmlns="http://www.w3.org/2000/svg" width="500px" height="300px" viewBox="0 0 1500 300">
<text x="250" y="150"
What do you do when you want a crisp logo or infographic, and have to worry about the plethora of screen resolutions and sizes? Apart from using hi-res images or make different versions of said images and then having to work out how to serve them up, SVG is a good way to go. It means that you just need one file, and no matter the resolution of the display screen or wether you zoom in a lot or not, it will always be as sharp as possible.
Below you can see an example of an SVG on the web, and if you zoom in you will see the image retains it's quality and there is no pixelation.