Design Workflow and Amazon S3

Jan 11, 2010
Episode 7
Nick divulges details about the early stages of his web design workflow, and Jim explains how to get started with Amazon S3.

Thanks to those who make Doctype possible!

Design Workflow

Page Layout

There's an infinite number of ways to design a web page, but I always try to start from the inside, and then work my way outward. This helps ensure that I focus on the content first, and build the site in such a way that it supports the user's primary goals (like reading a blog post, for example).


Skilled web programmers will often create written tests to make sure their code works. There's no direct analogy to this on the design side of things, but there are a few things you can do in an image editor to make sure your design holds up to scrutiny. For example, you can view your web page in black and white to look for contrast problems and to make sure that people with varying degrees of color blindness can still use your site. Another good exercise is to flip your page horizontally or vertically, to look for problems with the composition.

This episode offers a high level overview of the design steps I usually go through, but here are some links that give more specific tips:

Amazon S3


Amazon Simple Storage Service (S3) is a service that allows you to store an unlimited amount of data and only pay for the storage and bandwidth you use. It is part of the Amazon Web Services suite of products and utilizes Amazons infrastructure to securely host your files. You can use S3 as a private file store or make your files accessible over the internet. Everything is managed through an API which makes it a great solution for storing user uploads, pictures, and avatars in your web applications.

Signing Up

The Amazon Web Services site can be a little confusing to get started with, so here is a quick overview on getting set up.

  1. Visit and click "Sign Up For Amazon S3".
  2. Register or log in with your Amazon account.
  3. Fill out your address and billing information.
  4. Confirm your S3 sign up.
  5. Navigate Back to the home page.
  6. Click on "Security Credentials" under "Your Account".
  7. Your access keys are on this page.

Using S3

Your Access Key IDs and Secret Access Keys are what allow you to interact with Amazon S3 over the API or through a desktop client. On the Mac, we recommend S3Hub as a desktop client. For Windows Cloudberry Explorer is a popular choice. There is also a Firefox plugin called S3Fox Organizer that will allow you to manage S3 files from your desktop.

First you will need to enter your Access Key ID and Secret Access Key into the application. The next thing you will want to do is create a bucket. A bucket is like a folder for a site. It's name will be used in the URLs for your files (eg. and must be globally unique. You can now upload files and folders directly into your bucket. By default your files will be made private, but you can share them with the world or specific people by editing the Permissions, or Access Control Lists (ACL)