I recently decided to revamp my website and content as it was finally time I got off the fence between being a web designer and developer. Web technology and trends have changed massively in the last year with AJAX making headway, CSS3 and HTML5 being born too. So know there is only so much one man can learn, I need to concentrate on what I wanted and what I loved. I have traditionally always lived in the front-end development side of things and love created websites through layout. So design was really the bit I loved and I want to expand on that. With an excellent knowledge of HTML and CSS, a good understanding of what AJAX can do I can offer design with the idea of the needed functionality. I have always flirted with design, but never to the level that you see around us. It is time I fixed that and so with concentrated efforts to see the best out there was born the idea of frozendesigns.co.uk V7 ( I am currently on V5, but I abandoned V6 as I did more research, I got better ideas).

Through my google reader feed where I seek daily inspiration and current trends I came across this article about how designing a website should be content driven and so logically built using content as the base, then onto layout and finally the look and feel. Makes perfect sense, but industry has always designed static images in Photoshop first. Whilst at first it makes sense for resources and giving the client an idea of the concept, there are numerous issues involved. These include how fonts render and also trying to make content fit the design, so later on changes have to be made to the design. This format of working is residue left over when content, design and layout were all held on the same page. Today the design and layout are separate, which means you can nail down the content and functionality tesing early on  then build the layout around the content, experiment with the how users read the website, then improve on that with effective design methods to drive website users where you want them, be it looking a some nice photos, buying a toy car or socially interacting.

The other advantages of the ‘content – layout – design’ process is you can take care of those often under-rated issues of accessibility easily. Imagine someone was listening to your website being read out, it needs to make sense and often the layout and design is relied on to help it make sense, no good for someone who is blind. So when you add content without layout or design you naturally order it to make sense. Bingo! Along with certain other attributes in the code like image descriptions, headings and keyboard shortcuts your website becomes more accessible, which in turn also helps search engines get the best information out of your site. It really does make sense.

So frozendesigns.co.uk v7 then, well I am on day 2 of my two week leave from my job as a ‘Web Project’ bod to rebuild/redesign my website and I am already seeing the advantages.  I first listed what I wanted on the site (using my wonderful wipeboard), what would be on the landing page and the menu/website structure. As I began to add content, at this stage mostly just feeds from my twitter account, journal, google reader shared items and creative writing website ‘imaginetales.co.uk‘ ideas of the layout have formed, a natural way for it all to sit together.  I still have more content to add with a summary about what the purpose of the website is along with featured design/photography I have created. Then I can play with layout and finally the even more fun exciting bit of design and making it look awesome. From there I can take the layout and design to the child pages and also my wordpress powered blog to bring that into my website. Up till now I have used templates by others, now I need to use my own.

You can see my progression here and I will posting more on my journal as my journey to build my site and become a better web designer continues.

Till next time…

Read part 2 – Website Layout