srinivas.gs/meta/

About this site,
how I built it,
and how you can do the same.

In which I ramble about the philosophy of design, the tools of a designer, and how information should be structured.

To many people, design is something that makes an object look pretty; to others it's something that makes it appear pretentious. Not so: design isn't a fine veneer applied onto an object to cover superficial flaws, to hide structure, or to function as paint. Design is the act of thinking of how objects are constructed, how they should be constructed, and then making them.

Thinking about design can follow one of two schools: either you can look at the tools you have and dream of the magnificent structure these tools can build, or you can dream of the magnificent structure first, and then fashion the tools that will allow you to construct what you see in your mind's eye. The former is favoured by those who love their instruments, and who enjoy the use of hardware: engineers, technicians and owners of circular saws. The latter school is favoured by those who think more abstractly, who see patterns as one finished masterpiece rather than a laborious, iterative pastiche of scrawls: scientists, artists and owners of Apple products.

In designing websites, one is forced into a grey zone between these two schools. One is freed from the constrains of print and static two dimensionality but shackled by the chains of markup and stylesheets.

Nuts and Bolts

Build. Deploy. Test. All with the most basic tools.

TextWrangler

I wrote the HTML and CSS for this site using TextWrangler, Bare Bones Software's excellent and free text editor. It's a beautiful editor that supports code colouring and editing of remote files over FTP. You can really use any text editor to create a web site from scratch, from something as fancy as TextWrangler's big brother BBEdit to something as prosaic as TextEdit.

Cyberduck

Cyberduck is an excellent, free and open-source FTP client. You'll probably need a FTP client to get your web site from your computer to your server. If you want to make small changes, Cyberduck also makes it easy to edit live versions of your code, without having to manually download and re-upload files.

Firefox/Chrome/Safari

By sticking to web standards, I made sure this site rendered well on the three most widely used modern broswers: Firefox, Chrome and Safari. There are subtle differences in the way these browsers render text, as well as some quirks in the way they interpret HTML, and it's important to test your web site on these browsers before release.

"Design is the opposite of washbasin taps."
Anon.

The function of Design

Almost universally, washbasins are poorly designed. Taps have round knobs that are impossible to twist with wet or soapy fingers, and they empty into a small region close to the far wall of the basin, forcing you to manoeuvre to avoid hitting the germ-infested wall of the basin.

Why are washbasins built the way they are? Why is the faucet there, and why was that specific position for its outlet chosen? The only explanation is that the people who built it don't use washbasins, and don't care how people use them. The design of anything — from washbasins to computers to governments — affects the way people interact with these objects. The purpose of design, then, is to shape how people behave as they manipulate objects, either tangible or abstract.

Good design makes people interact with objects effectively and efficiently, bad design annoys and saps people, and drains vitality by forcing them into a Sisyphean struggle against seemingly immutable objects.

A simple principle in designing anything is thus not to build the equivalent of washbasins. The function of a device should be blindingly obvious to the novice. Every feature should be moulded by the needs and comfort of the user, any feature that is irrelevant or harmful to the joy someone experiences from using it should be removed. Minimalism is thus a natural consequence of good design principles: it is the constructive equivalent of Occam's Razor.

The home page of a web site reflects these principles: at a glance, you see everything that a site has to offer, and are informed immediately if what you are looking for is absent. The minimal design of the home page of this site lays out what this has to offer, and suggests that the reader follow a thread.