An interesting side effect of an
expanding digital participation programme has been outgrowing our first webpage. The main SCVO site (including the page you're reading now, but more about that later) runs on
WordPress, so for a year or so we simply added more and more boxes and widgets. But by the end of last year this was getting pretty unwieldy, and squeezing extra pages into a website that already has to do
so much for so many people was not a quick process.
Now, my team spends a lot of time encouraging other organisations to get online, and telling them it's possible to do this without spending thousands of pounds and many months working on it. So we decided it was time to
eat our own dog food, and
this is the result. We built our first prototype in a day, and are currently in beta as we continue to get things organised, so please take a look and let us know what you think.
If you want to follow our example then here are a few pointers about how we've put things together:
- Hosting. Our site is served by GitHub Pages, which is powered by Jekyll. This is a great option for building relatively simple static sites without all the overheads of a full-blown CMS. You can get a URL ending in github.io, or point your own URL at their servers (we're using digital.scvo.scot). Using GitHub gives us the added benefits of (a) the GitHub CDN and (b) using the GitHub Flow for collaboration. Oh, and it's free.
- Frameworks. Our site is built on Twitter Bootstrap 3. Sites using this often look a bit samey, but on the other hand it's mobile first, easy to use and very well documented. We've also used Font Awesome 4 for nice sharp vector icons.
- Social. We've put simple sharing buttons for Twitter, Facebook, LinkedIn and Google+ on all our pages. We've also included Open Graph tags in the HTML head so that Twitter Cards and other inline previews render nicely.
- Analytics. We're using Google Analytics to gather insights about our pages (things like what other sites link to us, and which of our pages are most popular). This will help us make better decisions when it comes to adding and improving content.
- Skills. We coded our site ourselves armed with a basic knowledge of HTML and CSS. If you prefer not to start from scratch then the GitHub Automatic Page Generator is a great springboard. And once you're going, Stack Overflow is a fantastic place to find help and advice from other people.
If you've been paying attention then you'll have noticed that our
blog posts have stayed here on the main SCVO site. It's straightforward to
use Jekyll as a blogging platform, but we wanted to keep our musings here alongside
all the other posts from our colleagues in other parts of the organisation.
So there you have it. If you're curious about the detail, or if you want to borrow what we've done and adapt it for your own needs, then you can find all of the source code
in our GitHub repository. Happy coding!
Last modified on 22 January 2020