I’ve decided a new design of my website is in order. The current way that my website works and adjusts for displays is hard to manage and not future proof. After a lot of reading about responsive design over the past few months, and putting it to the test recently, I’ve decided that it wouldn’t be right not to implement it.
Currently, my website uses PHP to detect whether a mobile device is accessing my website, such as an iPhone, and changes the to a new controller that includes the files for the mobile site. This gave me the ability to implement unique features for mobile devices, such as the swipe slideshow, but was difficult to manage as I needed to update a number of files to add new features and text.
For those that don’t know, a responsive design detects the screen size with CSS media queries and lets you write CSS specifically for these screen sizes. For example two paragraphs can be side by side when on a desktop screen, but can be placed on a single column for easier reading on a mobile screen.
This article by Web Designer Wall explains the Responsive Design idea much more, and gives more examples:
So, my new design will be responsive. What else?
I’ve decided that now, instead of the current tabbed interface, I will display all sections on the page, with smaller sections being side by side and larger sections taking up the entire width of the browser. After some recent success with WordPress, I’ve decided to implement it fully into my website instead of on an external WordPress domain. On a personal level, I will also extend my custom CMS further to be able to change more data on my website without going back to code, and extend it further to be able to create, edit and delete sections for the homepage. The website will also finally implement HTML5 tags, such as article and header.
What I haven’t nailed yet is what colours to have. Initially I was going for a white and grey colour scheme, but have found myself going back to dark colours again. This is something I will continue to experiment with, and may even add the ability to change the colour scheme from the page itself.
My work so far can be found at http://josephshambrook.com/previews/anotherdesign
Any feedback would be hugely appreciated!