Creating a layout example

Now it's time for the fun part—creating your web page layout! This part of web development allows the most creative expression for web designers. It's creating a mock up of how the web page will look when complete. Mock ups are graphic images of the web page, so we don't worry about all the technical details in making the web page work, just how it looks.

For this layout example, we'll continue our simple web page design for a small business. We'll be using very basic shapes and limited effects. But don't worry, the next chapters will show how we can make these very simple elements into something much more polished and elegant.

Let's get started!

Designing the background

In Inkscape, since your canvas is white, it looks like your web page might have a white background. It does not, without creating a background image, currently it would be transparent or 0 percent opacity. So we need to start by determining which colors to...

Tech Concepts

Programming languages

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Inkscape 0.48 Essentials for Web Designers: LITE

By : Bethany Hiitola

Inkscape 0.48 Essentials for Web Designers: LITE

By: Bethany Hiitola

Overview of this book

Creating a layout example

Designing the background

Inkscape 0.48 Essentials for Web Designers: LITE

By : Bethany Hiitola

Inkscape 0.48 Essentials for Web Designers: LITE

By: Bethany Hiitola

Overview of this book

Creating a layout example

Designing the background

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access