Web Design from Scratch - Free web design course, web basics, web page layout, free web design tutorials, design case studies, and web design examples
 

Free Guide to Web Design, web page design tutorials

Ben Hunt

A complete guide to designing web sites that work

Ben Hunt has been a successful web designer and developer for over 10 years who specialises in designing Web2.0 applications and user interfaces. He publishes Web Design from Scratch to share his experience in making web sites that are appealing, easy to use, and successful.

 
Save the Pixel web design book Download chapter 1 for FREE

BRAND NEW e-book from Web Design from Scratch

"Save the Pixel - The Art of Simple Web Design" is Ben Hunt's new e-book, which is a manifesto for simplicity in web design, and a comprehensive guide to achieving it.

It's over 100 pages packed full of guidance on how to approach the process of designing simple web pages, complete with 22 before & after examples of real home page redesigns.

Howie Jacobson, author of “Adwords for Dummies”, says...

“Save the Pixel is the best book on web design and usability I've ever read, and one of the best books on internet marketing in general. If … you haven't discovered the strategies and tactics in Save the Pixel, I guarantee you're throwing away money.

Save the Pixel is the one book I insist my clients read before I'll roll out an AdWords campaign for them.”

Only £15.00 GBP

Visit savethepixel.org for more info...

PDF download (7.4MB)
Get Adobe Reader
 

Latest

(1!) Usability Mistakes

I'm starting a collection of general usability cock-ups from round the web to use as positive examples of how things can be done better.

9 Functional Web Site Designs (for Inspiration) July 29, 2008

Number 3 in my series of inspirational home pages showcases some sites that have a strong functional element.

8 Clean Web Site Designs (for Inspiration) July 25, 2008

First of a new series is a diverse bunch of simple, clean designs illustrating a range of techniques from classic to Web2.0, with emphasis on minimal background and bringing content to the fore.

8 Rich Web Site Designs (for Inspiration) July 25, 2008

Next is a bunch of highly graphical, rich page designs that still embody the principles of “Save the Pixel”. Some great designs here.

5 more to follow in this series (Content-heavy, Minimal, Elegant, Cool, and Grunge)…

Some Great Web Logos for Inspiration July 24, 2008

Sharing my personal collection of almost 50 favourite logos gathered from round the web, with notes on what works & why.

How to Set Fire to a Web Site July 23, 2008

A pet theory I've been developing, and used successfully with several clients, based on the idea that getting a web site popular is very like starting a fire. You need to provide energy, people, and enough space, but keep it compact enough to build up enough heat to expand on its own.

The Top 5 Home Page Mistakes July 22, 2008

My list of the 5 most common, and serious, mistakes I see when reviewing web site home pages:

Opinion on Data Portability Row between Google & Facebook May 19, 2008

I tried to give both Google and Yahoo! a solution I'd developed to the core problem of identity & connection data portability, back in early 2005, but didn't get much of a reception.

10 Free Ways to Promote your Business Online May 30, 2008

A quick round-up of 10 essential sites that'll let you promote your (or your client's) local business on the web - for free.

New eBookNew eBook - Web page production with xHTML and CSS #1

Experience the thought process of a professional web producer as he guides you through the web page production process, from photoshop design to working HTML template.

The book tells you how to approach web production, beginning with semantic HTML, guiding you through how to slice up a photoshop document, and finally how to use CSS for presentation.

Buy Now for £9.00 GBP

New eBookNew eBook - Guide to Semantic HTML

Ben Hunt adds another great eBook to the collection with his "Guide to Semantic HTML". The book gives you advice and tips on how, and why to use semantic HTML.

Included is a comprehensive list of HTML tags, each with their semantically appropriate uses, along with a worked example taking you through the process of how to build a website using semantic HTML.

Get “Guide to Semantic HTML” now for £5.00

Scratch Web Design Forums April 25, 2008

We've launched our new web design forums, where anyone can go and discuss issues around web design: Best practice, Pixel-saving design principles, Web2.0 style, Production techniques using HTML & CSS etc., ... or anything else!.

Come along and join in!

Real Web2.0 Design & Branding April 9, 2008

The essence of what design means in Web2.0 terms is more than skin-deep. Web 2.0 design is not the same as star flashes and shiny table effects.

It's about a certain brand attitude that fits with the economic & technological Web2.0, which focuses on simplicity and pixel-saving to deliver a clean, honest, up-front, punchy experience.

This article attempts to illustrate the key factors with a handful of examples.

Introduction to Search Engine Optimisation

A layman's guide to the minimum that every web designer, producer, coder, or site owner should know about SEO (Search Engine Optimisation).

Web design versus “Design toss”

A bit of a splurge against the noisy and opinionated minority opinion prevalent in web design that argues that the only good design is intense and beautiful graphic art.

The fact is that most web design should help people quickly and easily find what they want, not stop them in their tracks with impressive graphical experiences. Sometimes, beautiful is not best. Everyday, “vernacular” design is the ideal for most projects.

Web 2.0 Design Style Guide in PDF

You can now download the Web 2.0 Design Guide and the Current Style summary article together in one handy ebook to read offline.

 

10 best-designed web sites in the world

My personal favourite sites today, with explanations of why they're so good.

How to design Web2.0 style web pages

My definitive guide to today's best web design style.

A new in-depth breakdown of the Web 2.0 design style, with explanations of why the various design features work, and when & how to implement them.

Web hosting providers compared »

Web hosting is now cheaper for everyone, but the difference between the best hosts and the rest is as great as ever. To pick the right host for your needs, you need real, useful info.

We've teamed up with RealMetrics to provide invaluable information on the best web hosting providers. You can now see real data gathered on shared, virtual private machine, and email hosting over the past few weeks, to help you decide on the best provider for you.

Supporters group hug

I've put up a page just to thank everyone who's supported this site with donations and stuff. Feel the love!

Summary of web design trends

A quick tour of some of the best designs on the web today, in which I analyse some of the design features they have in common.

Please support Web Design from Scratch

I'm committed to keeping Web Design from Scratch free. If you find the site useful, please support us by making a donation, which will go towards our hosting costs. Many thanks!