Web Design & Architecture -- LIS 9723 logo


Keep an eye out for the comments in the CSS that Dreamweaver gives you -- you can learn a lot from them.

Exercise 4: CSS Layout

Make your own!

Create a layout that is entirely of your own devising. Use one of the CSS layouts available in the resources section and then make it your own.

Change the colors, backgrounds, fonts, add a div or move them around. Whatever you would like to do, just have some fun!


If you need artwork, you can try Flickr and many other sources.


You may want to check out this Flickr group for fake logos.

Sidebar Fix

If you'd like to try your own special sidebar, ask me and I can show you how to create it in Photoshop. But here are a few you could use as is -- I've set all these to 250 pixels.

grey gradient

dark grey








And finally, find some interesting background images to work with as well. These are more difficult to source, but there's lots of good stuff at Flickr. Here's the search results on their Creative Commons, using the term "background images". You may also want to search for background pattern generators, such as this one, at DinPattern, or Fractured Sanity.


Back to Top
Last updated:

Course Outline | Assignments | Exercises | Schedule | Resources & Links | Lab Tutorials

About the Site | Site Map | About Mark | ©2013-2014 Mark A. Rayner