home of the “design for the web” coursean adult course focused on webstandards based webdesign

webeyedea logo design for the web

boxes and more boxes

28/09/2012 2 Comments

The idea for this project is to allow you to create a mini site, a demo for the box model which will show some distinct styling and positioning via CSS. Your code needs to validate and your page ready to be viewed online.

To practise your newly learnt box model technique – create a colourful web page on the subject of boxes. Find some images and text to use about anything relating to boxes, this could be gift boxes, cardboard boxes, chocolate boxes – anything you like. Do some research, collect images (remember to keep track of the original sources, to be quoted on your site) and plan out your design before starting to code.

project brief

tags:

2 Comments

  1. 1 Gravatar
    yargs

    just wanted to say that I have really enjoyed the process. from the birth of the idea to the final site going through the different revisions and peer feedback, as well as the (many) hours spent designing the artwork. I have learned loads and it’s given me new confidence in my skills.
    As a curiosity, I also wanted to mention that I’ve had my first encounters with browser-specific behaviour and found it quite bizarre… between ff and chrome/chromium, ff seems to be the more permissive browser… also, in this case chrome/chromium and ff didn’t interpret width percentages the same way –had my navigation width set to % displaying the left nav and the content separate with a nice little gap in ff, but then chrome/ium displayed them touching. how weird is that? ended up using width in px because that seemed to have the same result in both… (my overall width was set in px, may it have something to do with that?…)

  2. 2 Gravatar
    Ali

    @ Yargs.
    No doubt it was fun as well as learning process. My site did behave OK in different browsers but again I used width in px.
    Will try to check other way around.