nelsonbuildingreports.co.nz released to the wild
For some reason I thought it was about time to halt the outflowing tide in my bank account. Time for some paid work.
I’ve been somewhat quiet in the last six weeks, head down working on my latest website, the very static nelsonbuildingreports.co.nz.
It’s been designed to suit viewing on a phone primarily, although it looks OK on a desktop. There’s probably an awkward spot in the middle with a vertical iPad, 736px, that’s certainly too narrow for twin columns.
I used a free template from the range at html5up.com, my base is called Spectral, and modified it to suit. That probably saved me some time working out how to do new things, like the scrolly thing, the alternating images/text, and the sliding menu, etc. Spectral arrived with a huge amount of redundant CSS which I will attempt to eliminate. There’s a bit of optimisation work to do, actually a whole lot, but at least the main structure is there to fiddle around with.
I had a long hard think about how to present this new service, I think that on small screens you’ve got to be far more direct with what you say in the text, because your attention is more focused. It’s obviously verging on the narcissist end of the scale, it’s all about me, certainly has no corporate feel to it whatsoever, but I guess I am selling the personal service, showing the experience with the photos rather than telling. My friends who have seen it haven’t blinked so far, seems pretty normal in this day and age.
I put the major break point at 840px, ie, where the design changes from one column to two. It was pretty obvious that I needed the break around there because two columns started to look too narrow.
It’s all on one long page, the menu sends you elevator-style up and down, which gives it a fair page size, 3.39MB and a page load at 2.2s. There’s obviously some delays built in there as well with the js fades.
One thing for sure I learnt a whole lot about HTML5, seems that there is a heap of new stuff there which I’m only just starting to get my head around.