Web Design

Web Tutorials / Examples / Resources and Exercises


The following are a comprehensive range of tutorials, examples and resources for all things webby. You should find what you need whether it's HTML, CSS (Cascading Style Sheets), JavaScript or PHP. If there's something you think is missing you can email me at mharrison.ict@gmail.com.

Better yet, search for it on the web and when you find it email me the info and we'll add it to the site.

Web Layout Design Principals


Step 1) Know Good Design & C.R.A.P.


Remember that good layout relies on the use of design principals such as: Contrast, Repetition, Alignment and Proximity. To discover what CRAP means read this article.


YouTube Videos - C.R.A.P. Principles of design

C.R.A.P. YouTube Video


You should also apply the Rule of Thirds or the Golden Ratio. There is a basic mathematical proportion within all well designed and balanced things.

Below are links to designs that will inspire and educate:


Step 2) Sketch Your Design Ideas

Before you begin to create a website you should sketch out your layouts to explore a range of possible design options and evaluate them against your brief. For a great example check out ReadyMadedesigns.co.uk for their base design sketches 

Download and printout sketchbook pages to create your layouts:


Photoshop Tutorials & Resources

Step 2) Mock-up the Concepts in PhotoShop

Create dummy page layouts and colour concepts to present your ideas for page backgrounds, navigation, buttons and use of fonts using dummy content.

The links below will help develop your Photoshop skills.

Web Design Technical Theory

HTML Tutorials & Examples


Scripting / CSS Resources


Online Tutorial Videos:


Web Design Exercise Files


Subpages (1): PhotoShop
Ċ
Matthew Harrison,
26 Apr 2010, 06:46
Ċ
Matthew Harrison,
28 Jun 2010, 05:40
Ċ
Matthew Harrison,
28 Jun 2010, 05:41
Ċ
Matthew Harrison,
28 Jun 2010, 05:42
Ċ
Matthew Harrison,
28 Jun 2010, 05:42
Ċ
Matthew Harrison,
28 Jun 2010, 05:42
Ċ
Matthew Harrison,
28 Jun 2010, 05:40
ĉ
Matthew Harrison,
28 Apr 2010, 22:55
ċ
SaveforWeb.ppt
(8839k)
Matthew Harrison,
29 Jun 2010, 20:11
ą
Matthew Harrison,
26 Apr 2010, 06:48
ċ
sketch_book_small_grid
(9k)
Matthew Harrison,
26 Apr 2010, 06:48
Comments