visit tradeandpack.com

design

The completed design is the result of the continuing collaboration with Raffael Rottler of bi.sign Werbeagentur.

process

Starting from a Photoshop mockup of the page, the page was turned into a simple table based layout in under 24 hours. Shortly after the site had gone live the tables were stripped and replaced with a proper CSS based layout.

In a non-trivial update the PHP Markdown library was added so that content can be easily altered by non-technical users. For example, instead of writing:

<a href="http://example.com/" title="Link to Example.com">Click Here</a>

You can simply write:

[Click Here](http://exmample.com "Link to Example.com")

As you can see it’s somewhat shorter, but more importantly it’s much easier to read and contains 4 characters of code as opposed 14 making the syntax more approachable and ensuring that someone who has never seen HTML can produce valid markup.

result

The result is a site that maintains a constant appearance in all A-Grade browsers and successfully presents large amounts of information in a rather confined space.