The basic design

Before designing the layout in Inkscape, it can help to plan the placement of the main areas of a web page—in essence to help with the design's overall alignment of items and proximity of similar items. For our purposes, we'll create a simple main web page for a small business. This main page will have these areas:

Each web page project is different and you may have to add more page elements to this list or delete some so that the final list of elements fits the needs of the overall design. For the purposes of getting agreement from a team working on this project, a good practice is to create a basic layout showing where each of the areas will be placed on the screen—and is often referred to as the web page wireframe. Typically, wireframes are completed before any graphics are created. The following screenshot illustrates a basic layout or wireframe:

This high-level approach is a great start to actually building...