Introduction

What are delaware web essentials?

There are a lot of different steps to be taken when creating new components:

• Wireframing
• Design
• Specifications
  • Functional
  • SEO
  • Accessibility
  • Tracking
  • …
• Implementation
• Slicing (HTML + CSS)
• Testing

These steps require many different profiles with different skill sets.

There are several components that are considered to be essential for most websites. Most of these components allow a content editor to add body to a website. They are usually not the components for which it is important to create a specific version for your brand.

Creating them over and over again introduces a lot of repitition and a lot of places where people can misalign. Consequently, there are a lot of places where best practices can get lost or go wrong.

To answer this concern, delaware introduces web essentials. We’ve been doing this for years, and we’ve packaged all of our knowledge for you.

delaware web essentials consist of:

• wireframes that are coordinated with the implementation, meaning that designers can easily create designs while knowing the technical constraints.
• general (CMS-independent) HTML
• NPM package
  • Javascript for functionality, tracking, …
  • Optional CSS
• Technical specifications, guidelines and best practices
• Functional documentation

They have been reviewed by UX experts, SEO experts and accessibility experts and include functional and technical best practices.

Why use web essentials?

Next to the fact that they have been reviewed by many different experts and include many best practices, they can also be plug-and-play.

This means that when setting up a new project, these components can be set up in minimal time, allowing content editors to already start writing content at the very beginning, while everybody else can start focusing on the components that are very specific for your brand or which have very specific business logic.

When to implement web essentials

When using the web essentials as they are:

• The ‘refine all components’ block is shorter, as the standard components don’t need to be refined.
• The ‘implement + document’ block for the standard components is replaced by a very short ‘add’ block to initialize the web essentials package.
• The content editor can start the ‘configure content’ block much earlier.
• The implementation of the stand out and functional components starts sooner.
• The total timeline is shorter.

An optional bucket can be foreseen to implement small adjustments to the web essentials. We advise to keep this block towards the end of the project. Adding the web essentials as they are will mean that they already (at the very least) look good enough for content editors to start configuring them. Meanwhile, developers can start working on the other components.

The standard components are often components on which developers work in the beginning to allow content editors to start configuring as soon as possible. The pitfall here is that often a lot of time goes into details for these components, using up the budget for the more important components. The same may happen if you implement changes at the beginning. By keeping the bucket at the end, you limit this time to the time that’s actually left without losing track of the most important functionalities.

When not to use web essentials

If you want to offer up time and budget in order to be able to choose different configurations for all of these components, or if the design should be able to into any direction, then the web essentials probably aren’t for you.