A website should grow with you - web design and development that evolves

At the moment your website is launched it is already dated. The planning and ideas that went into it were often done months in advance. As time continues to pass your organization’s strategies evolve. The way and types of engagements that are most important are revised. Your website needs to change to address these needs as they arise to remain relevant.

The following are some examples of enhancements we have recently made to client partner sites.

• Add a feature so when you click on a partner logo you get a modal with information about why they give. We also include a link to their website.
• Add an ability to embed content from a new third-party service on a page. The solution ensures the content works on different device sizes.
• Add a new category filtering feature to a blog that is reactive. On click of a category and the blog list updates without a full page refresh.
• For a unique contest site, we added the ability for judges to enter and manage their own public-facing profile.

These changes are not part of larger website redesign efforts, but are changes driven by new strategies and tactics. Some websites are easier to evolve than others. This article explores the need and some key criteria for creating a website designed and built to change as your strategy and needs do.

You can partner with a studio like ours or leverage your in-house team. However you get there, make sure your plan to continue to evolve your website post launch.

Launching a new website and living with it as is for 3-4 years doesn't work for most websites

A common model for nonprofit organizations is to budget for a redesign, build a new site, and use it for years until a new redesign budget is set. While there are exceptions, for most organizations this is a flawed model. Even when you have a maintenance agreement to keep the site running, it’s often not enough.

Organizations create new content and explore new engagement strategies over time. For a while, building an email list may be the most important engagement. Later, building recurring donors through a membership program becomes the priority. These shifts may benefit from new calls to action treatments and/or landing pages, for example.

If the organization does not have the resources to evolve the website and meet new needs, problems arise and the website becomes a source of pain points. The website is not easy to use and is a piece of technology that loses relevancy for the organization. It becomes something to live with until money for a redesign is available.

What if your website could evolve as your organization does?

Wouldn't it be nice if your website's content and features could change over time? As your organization explores new ways to engage your audiences, your site can change to support these efforts. If planned for, it is possible.

Having a website built to evolve requires:

1. Thoughtful design system
2. Smart technology
3. Purposeful use of that technology
4. Committed resources to iterate

Thoughtful design system

A design system adds efficiency to evolving a website. It consists of a set of guidelines and components that help a team create designs across a site. It will detail things like the following:

• Font treatments
• Color palette
• Spacing of layouts
• Navigation
• Components like buttons, content cards, list views, categories/tags, and more
• Responsive treatment

The system serves as a shared visual language. It makes collaboration easier and ensures a unified look and feel. A design system can be elaborate and public, like that of Mailchimp's pattern library. It can also be an internal document in Sketch that a design team maintains.

This visual language comes to life in code. Foundations are set site-wide and components are coded to match.

Smart technology

Building a modern website is harder than ever and the technologies available to build a website are vast. From the CMS platform to the front-end framework, all can impact building a website that can evolve.

Your website technology needs to provide the following:

• Easy to use content management experience for anyone using the site. No one should have to wrangle with technology, read a 20 page guide, or use html to deliver great content that looks its best.
• Ability to add pages to your site structure.
• Ability to apply different templates and page layouts. This includes being able to add new layouts efficiently.
• Ability to deliver content components such as buttons, calls to action, logo grids, and more. These should be available on different page types. Components should be easy to change or add.
• A great templating system that lets you build and include components.
• Easy to update. Keeping site technology current is important for security and sustainability.
• A great workflow for making code changes, undoing code changes, and deploying code to servers.

Purposeful use of technology

Let's start with an important detail about technology tools. A tool provides a means to do something. But, in different hands and minds a tool can lead to a brilliant website build or a Frankenstein's monster. A team with experience and skill building websites that can evolve matters more than whether they use tool A or B to do the job. This is because they choose their tools wisely and know how to use them well.

One of our key tools is Craft CMS. It is our content management system (CMS) of choice. Craft falls within the same category of CMS tools as WordPress. We chose Craft because it fits the criteria of "Smart Technology" detailed above. This, and it helps us deliver a website that can evolve more efficiently than other tools we know, including WordPress. Our Craft CMS builds follow a few key principles.

• Keep our plugin use minimal. Plugins can add functionality to help a website evolve quickly. But, too many plugins increases technology debt and makes site updates harder. They also can introduce challenges in keeping site code and working with content consistent site-wide.
• Use as few custom fields as possible. Better to have a single "Summary" field for events, blogs, and pages than three different summary fields. Less fields lightens developer load and results in simpler template creation and evolution.
• Create content templates. We create a main content section for pages and use Craft's entry types to allow content authors to select different templates as needed.
• We build our templates with components in mind. We create a components folder with templates for things like buttons, logo grids, videos, and more. We add these to other templates. So, if we need to change a button design we can do so in one place and have it effect everywhere buttons are used.
• Always write comments in our code with a new developer in mind. Reducing the acclimation time for new team members, or those coming back to a project after some time has passed, increases efficiency when evolving a website.

Committed resources to iterate

Whether you have an internal team or an external partner, you will need design and technical support to evolve your website. Budget for this can vary depending upon the size of your website and the changes you might be making.

Beyond budget and people you need a process for iteration. Here are a few process suggestions.

• Maintain a short queue of priorities (5-10 tasks).
• A backlog of more tasks can be helpful to have as well. Draw from this when your working queue gets low.
• Schedule a recurring check in meeting to review completed items, discuss work in progress, and affirm priorities.
• Keep a log of the work completed. Showcase your continuous improvement efforts.

A website needs nurturing to continue to be effective

A website that has the support to grow to meet your needs maintains value. Left stagnant, it falls behind the good work your organization is doing. If you are a dynamic organization that tries new ideas and creates new content, you need a website that is designed to keep up.

Consider what happens after launch and plan for the continuous improvements that will keep your site relevant.