Friday, May 6, 2016

Theatre on the River - reskin

So,

My sister runs a very successful drama teaching company in London, and her current site is nice but it uses device detection (51degrees.mobi if you're interested) for mobile/tablet which is no longer the cool way to handle mobile traffic (as now enforced by our Google overlords).

Instead, sites must be responsive which is hardly a term new to anyone reading this drivel but for those of you who've been living in a cave eating beetle dung for the last few years, "responsive" is an HTML 5-based concept where the site's presentation layer (the HTML and CSS) must adapt to the device the site is rendering into.

This means no cop-out of sniffing the device server-side and redirecting to a /mobile set of layouts/masterpages/etc but instead - there is just one site to rule them all. Which is done using CSS media queries.

This isn't the first responsive site I've worked on, ohnono. My brother runs a very successful glass machinery oligarchy in Rugby (home of the game, Rugby fans!) and his site was the first independent site I rebuilt in a responsive style.

Glass Machinery Solutions Ltd














As you can see, it looks good on

a) desktop,
b) tablet, and of course
c) mobile

All served from just the one URL and this pleases our Google overlords, who will continue to rank your site in accordance with their holy scriptures. And not penalise you for redirecting to effectively another site (or worse, your site is not mobile-friendly at all and therefore you fail at everything).

I'm no front-end guru; never have been, don't want to be either. It'll push other, more useful stuff out of my head such as being able to order a beer, or pulling a wheelie between lanes of traffic. What I am good at doing with front-end stuff is glueing someone else's efforts together into an ASP.NET application.

I do understand media queries, they're not hard. I do not however have the necessary skill/patience to make sure the resulting CSS & HTML functions across all browsers, devices and small hairy marsupials.

So ! HTML5Up to the rescue. These guys offer a bunch of free, responsive skins (a bunch of CSS, JavaScript and sample HTML pages) for you to use, as long as you acknowledge their awesome efforts (no probs there guys!).

They also have even more elaborate skins you have to pay for, not a lot, but whether you choose to go the free or paid route, I can highly recommend their work.

The new site needs some image work and polishing (so don't mail me about images being different heights or whatever COS YEAH I KNOW) but I'm sure you'll agree, it looks better. For minimal outlay.

People dedicating their lives to making awesome HTML 5 skins - you have my utmost respect and infinite gratitude.

BTW please don't spam my sister's email using the Contact Us form.

BTTW I'll know who did it and I will find you

BTTTW Look at me. I'm the captain now.

:D