introduction

01  Introduction
development planning imagery design graphics coding frameworks backups content analytics

Development.

Scroll down to see the stages of my development process and some of the tools I use. I like to think I have an open mind and I'm always keen to learn new ways of streamlining this.

FigmaBootstrapGIMPGitHubAtomWP

Google Docs.

Google Docs allows multiple people to work on the same document so it's a great place to gather information, draft a sitemap and start working on content. Establishing the purpose of the website and its target audience should be done at this early stage. Thought should also be given as to whether a CMS will be required.

Pinterest.

Pinterest is a great place to discover, bookmark and share images related to your project. Other great sources for royalty free imagery include Unsplash together with Pexels and Pixabay both of which also feature video content. Finding the correct images for your target audience is time consuming but vitaly important if you want to properly engage your customers.

Figma.

Once the websites purpose, scope and sitemap have been defined we can start with the design. Figma is a collaborative interface design tool which is great for rapid prototyping. It runs in the browser and can be used on any operating system.

GIMP.

Having used Photoshop for most of my career I found it easy to transition to this open source image manipulation software. Image optimisation and compression are vital when designing a fast, responsive website. Adaptive image selection (using srcset) can help reduce bandwidth and vastly improve page load speed on mobile devices.

Atom.

Atom is a customisable free and open-source code editor. I recommend installing the Emmet package which speeds up development by expanding your code abbreviations. In the past I have used Sublime Text and Visual Studio Code.

Bootstrap.

In my previous job we used Bootstrap for many of our websites. It helps speed up development with CSS and JavaScript templates for many common web components. One thing to bear in mind is that websites built with Bootstrap can end up looking similar unless heavily customised.

GitHub.

GitHub is a great place to backup and host your code. It supports version control and team collaoration. Please feel free check out my repositories and criticise my code!

WordPress.

WordPress is still the most popular CMS by far and I’ve been using it to create websites since 2017. My latest project was an image slider plugin called Lightweight Slider which is now hosted at wordpress.org.

Google Analytics.

Often the last step in the development process, it is essential to add analytics to your website in order to guage how well it performs. Google Analytics also provides invaluable data about your visitors age, device, location, gender and even their interests. I've been using Google Analytics to analyse traffic and produce management reports since it launched in 2005.