You’ll also notice that I didn’t include a navigation section. I’m going with a fairly standard blog layout with a header section, an article section, a sidebar (which I’ll call “aside”) and a footer section. The next thing we need to think about is the site’s layout.

You may also want to consider making a special style sheet for the growing number of people accessing the web from their mobile phones. However, the dimensions you choose totally depend on your target audience (which may not be the US). Then choose the dimension for your website, I’ll choose 960 pixels wide by 2000 pixels high, but you can choose whatever size you’d like.Ī width of 960 pixels is popular for web design because most people in the US have a computer with a resolution of 1280 by 800 or greater. Open up a new document in Inkscape and edit the document size by navigating to File » Document Properties or just press Ctrl + Shift + D.

This tutorial will walk you through some basic techniques for creating websites with Inkscape using this very basic blog design as a guide. This program can be used on on its own without the use of photo editing software like Photoshop or Gimp to create professional websites.

It’s also an open source program released under the GPL, and is available for Windows, OS X, and Linux. It’s similar to Adobe Illustrator, but the user interface and tools are slightly different. Inkscape is a great program to have in your toolbox as a web designer.

Cool inkscape logo