design samples

Please note: this page is very much work in progress and will be updated in due course.

page layout methods

3 given examples of layout, to be implemented with 3 different layout methods: float / flexbox / grid

Ten principles for good design quoting Dieter Rams

view →

experiments with type

and layout / colour

quoting from A Designer’s Code of Ethics by Mike Monteiro

view →

3 SVG methods

for using SVG on webpage: inline / symbol definition / image tag

includes mini tutorial to create SVG, view source for demo of methods

view →

SVG sprites

notes on graphic file, demo of SVG sprite for rollover and icons

view →

CSS border-image

using images for borders

view →