WordPress
Best Practice
WordPress bootstrap
We’ve developed a WordPress bootstrap that allows us to get started on your project quickly while maintaining a high level of quality. The bootstrap incorporates best practice, tooling and efficiencies that we have developed while working on WordPress projects over the last five years and is continually being refined.
Where possible we use code linting to enforce a consistent style. This eliminates discussion over code style and formatting issues, helping to save development and code review time. The end result is a more maintainable code-base that other developers can work on. Airbnb Engineering & Data Science best describe the need for consistent style in code using a painting analogy.
Git version control
Git version control tracks changes to code and allows collaboration between developers.Composer
WordPress and it’s plugins are managed via Composer, a dependency manager for php. Composer eases collaboration by allowing you to declare your project dependencies in code. Developers can then run a command to install specific versions of the dependencies.
Multi-Environment config
A multi-environment config allows the WordPress install to be configured differently depending on if it’s in a development, staging (preview) or production (live) setting.WordPress coding standards
WordPress php coding and documentation standards helps ensure code is consistent, secure and well documented. A pre-commit git hook ensures failing code isn’t committed to version control.ES6+
Modern Javascript is written using ES6. ESLint is used with the airbnb style guide to help ensure a consistent code style and structure and supports React when used in a project.SCSS
The website styles are broken-up into individual UI components for reuse and better maintainability. SCSS Lint is used to enforce a custom BEM component naming convention and consistent property ordering.Admin Experience
Ease of use
We build on WordPress’ solid foundation, tailoring the admin to fit your content and design. From simple article pages to complex modular layouts we build WordPress themes that allow you to focus on editing your content rather than code or complex configuration.
Browser Testing
Consistent experience
We carefully test our websites to ensure that they work correctly in a range of browsers on mobile and desktop devices. Our SCSS and JavaScript build tools use Browserslist to target a consistent group of browsers based on usage data from Can I Use.
Performance
Speed matters
Now that around 50 percent of users1 are accessing the web from smart phones or tablets it’s more important than ever to optimise the performance of your website. According to google “53% of mobile site visits leave a page that takes longer than three seconds to load.”2
Speed has been a ranking factor3 for google mobile searches since January 2018. We employ a range of optimisation techniques to help ensure that your website loads quickly.
Lazy loading
Lazy loading ensures that images and embedded content such as Youtube and Vimeo aren’t loaded while they appear offscreen.HTTP Caching & Asset revisioning
A hash of each file is appended to asset filenames. As the hash changes whenever a file is updated it allows assets to be cached indefinitely using HTTP caching. It also ensures users never need to manually empty their browser cache 🎉Service worker
A service worker can intercept network requests, loading assets such as CSS, JS and fonts directly from the cache. It can also add additional functionality such as offline access, push notifications and background sync.Templates
We have a thorough understanding of the WordPress internals and it’s underlying data model and use this to help ensure pages are generated quickly and Time to First Byte (TTFB) remains low.Hosting
Quality website hosting plays an important role in the overall performance of your website and can be the difference between a great and a poor experience for your website users.Lighthouse
We test our websites with Google Chrome’s Lighthouse tool to ensure we’re meeting key performance metrics.Plugins
Extending core
WordPress plugins add functionality that isn’t available in core. New plugins are carefully audited for any potential performance or security issues. Here are a selection of plugins that we find indispensable.
Gravity forms
Gravity forms is a form builder that can be used for simple enquiry forms or more complex multi-page forms. It can be easily extended and integrated with third-party services.Yoast SEO
Yoast SEO is a leading plugin for Search Engine Optimisation (SEO) and adds many features such as sitemaps, content analysis and open graph-tags for supplying preview content when sharing on social media.Advanced Custom Fields Pro
ACF Pro allows developers to create rich editing experiences that are flexible and simple for clients to use.Query Monitor
Query Monitor is a developer tool that allows us to monitor the number and performance of database queries used to generate a page as well as identity php errors and notices.SpeedRunner
Our in-house performance plugin for lazy loading and asset revisioning.Terminator
Our in-house plugin for removing WordPress features when they aren’t required.Hosting
Not all hosts are created equal
Quality website hosting is often overlooked when developing a new website. A proactive hosting company will help to keep your website fast and secure ensuring a good experience for your customers. Things we look for are a modern server stack, tools that allow us to automate deployments and responsive developer friendly support.
For most clients we recommend Kinsta who offer premium WordPress hosting on Google Cloud.