Development and Coding
We style sites in an object-oriented method, which means (for example) we first define what a standard button looks like (round corners, padding amount, background/border colour etc), then extend that for a secondary button (just different border colour), active button, small button etc.
We also use a BEM class system, which is a best practice method of having a class structure you can call upon to make new layouts and elements. It means that code is simple to read (for example the site header is class=”site-header” and then elements within are classed as “site-header__logo”, “site-header__button” etc, which then may have modifiers (for example two header buttons but one needs to be more visible might have a class=”site-header__button–standout”.
Lastly, utilising BEM we employ a system of objects and components to split out our styling templates. Objects are things such as buttons, input fields, modals, tables, and components are things like a video banner block, or a call to action grid. We first define the objects, then reference them within the components. It means that elements don’t have an array of classes, making it harder to read (e.g. class=”site-header__button button button–standout margin–top”), but simply have the one class (e.g. class=”site-header__button”).
The frontend developer will be involved in early design meetings, plus reviewing design work from a technical point of view, to ensure that the work meets with platform functionality, and not to have an effect on site speed or performance.
All of this ultimately means...
- You own and have access to every part of the new site’s theme
- We follow best practice and consider how to make a website keep a solid code base
- Understand we may not be the only developers looking or editing our code
- We have a system in place so that building and editing new layouts is quick and easy without being hacky
Relevant Development Articles
Creating a New Website: The Development Phase
21 Nov, 2018
In this series I’ve taken a look at the different stages from a client’s point of view of creating a new website, so you know what to be looking out for and asking of your web designer or appointed studio/agency.
Is Your Website Working for Your Users?
25 Apr, 2017
Having a website is now commonplace as part of a business. No matter how big or small a company is, the fact that customers often look on the web first to solve a problem means you need to be there for them to find you. But what happens next?
Asking the Right Questions
31 May, 2021
Part of being a good UX designer isn’t having the right answers, its about asking the right questions. Knowing what the questions are will lead to moulding the design from a ill defined shape, to a considered and appropriate product.