At the start of April I finally found a few evenings to plan out a new site for myself. I had purchased a domain some time last year and hadn’t wanted to hurriedly dive into yet another WordPress install, find a basic theme to get it going and maybe, maybe come back later with my own.
Byandyparker.com needed to be different, it needed to have an objective to drive me to keep it going. I’ve always had test beds somewhere to try out ideas but this time I wanted to show my working out in the public eye and decided that I would publish my changes at the end of each day for my colleagues to review. Around that time I had just purchased an iPad, never even using one up to that point my first download was Readability. I was so impressed by the concept, the ease of use and crucially how much better it made one of my own blog posts look.
My objective was set. I wanted to create a page that would read well on apps like Readability or instapaper.
The following evening I started writing the content for a single page site. I got a few friends to check over the copy until it was concise enough and threw it into a HTML page.
To start with, I just entered the copy semantically marking it up and using html5 markup where applicable.
The next evening I looked at how I was going to format the copy so that if it was treated as a document it would be aesthetically pleasing and legible. I confessing that I dug out inspector in Chrome, headed to the Readability site and took a look at the colour ways they were using and then applied them to the page. Instantly the page started to take some real shape.
I began running through the content looking for where I could apply added value. First hyper linking anything that would be useful, such as my other sites, people I have worked with and my social profiles. Using micro formats I added in functionality for vCard into several parts of the page, there is a traditional contact block in the footer but also a few paragraphs where this could be applied, this was to make some key areas later for adding functionality in for mobile devices.
The layout markup came last taking reference from Andy Clark’s 320andup, along with classes and rules i have always used in projects.
My intention with the page, and possible other pages in the future is to use these to test and show my ideas and refinement techniques for web development.
It was interesting to see Zeldman around the same time redesigned his website, also referencing Readability as one of the main drivers. He talks about this in his 2012 Manifesto.
I want to use byandyparker.com as an evolving design and development, since taking on jobs that are solely focused on User Experience tasks early in 2011 i have not had a great deal of opportunity to keep up my front end coding skills and they’re something i don’t wish to lose.
