Project: Website Replication

Abstracting

I often hear that replicating website design is common territory for developers, so I wanted to get some practice with the basics.

Researching

replication process image 0

After exploring a few sites, I found a great model to imitate on CSS Zen Garden. I spent time studying the layout and eventually narrowed my focus to a handful of areas to work on: color palette, contrast, linking, and positioning.

Coding

replication process image 1

Once I got down to coding, the window-toggling began. To make sure I was working on the fundamentals, I reserved peeking at their code for the moments I was really stuck. Ultimately I produced an adaptation rather than a replication, but I gained an appreciation for the level of precision needed to create a pixel-perfect replication.


Back to portfolio