Ultimate UX Design Guide to SaaS On-Boarding, Part 2: Welcome Email

SaaS customer onboarding is the process that users have to experience while initiating their journey as a customer on a company's software application. Customer onboarding comes from the experience that employees previously had to undergo while joining a firm.

The onboarding process sets the tone for a good user experience. Long story short, special emphasis should be given to make the on-boarding process as flawless as possible.

The SaaS customer on-boarding process is based on 6 comprehensive aspects:

Sign up form

Welcome email

Drip campaigns

First login & product tutorial

Data import & notifications

Check up calls & swag

All the aspects of the process play an equally important part in forming a desirable reputation of the brand in the eyes of the customers during the on-boarding process. Last time we discussed the first step to the on-boarding process, the sign up forms. Today we will be focusing on the welcome email.

A welcome email is a critical component of the signup process. It is the first time you are getting directly in touch with your customer and, therefore, is key to creating and building up momentum of the signup process to the point of using your product. ReturnPath conducted a research study, which revealed that:

There was a strong correlation between good welcome messages / emails and user engagement. Moreover, good welcome messages are an important predictor of user behaviour and potential revenue in the long run.

A welcome email is the point where you can quickly communicate the value of your product and can make or break a conversion. The email can contain a lot of things you would want your customer to know, and therein lies the risk. Bombarding the customer with too much information can be a conversion killer.

 

Summing Up: The Point of the Welcome Email

Build signup momentum

Get users to take the next step (not reach the end goal)

Give them an idea of what the experience of your product is going to be like

Any welcome email needs to be drafted with a specific purpose in mind (apart from just a greeting). The following are examples of specific goals that you could keep in mind:

Getting the user to complete their profile

Getting them to "create their first <whatever your product offers>"

Getting them to "import data"

Getting them to "download your app"

Keep in mind that the rate at which your welcome email is opened and the CTA is clicked on, is not a measure of how successful it is in achieving its purpose. Adjusting the subject of the email and optimising the body can be helpful measures, but the true objective over here is to ensure that your customers are moving through the steps of your on-boarding flow. So the real measure of success is the rate of conversion.

How many customers responded to your CTA?

 

Drafting the Email: Things to Keep in Mind

Simplicity: Like we said, you probably want to let your user know about a bunch of things. But don't let them know it all at once! Let them spend some time using your product so that they can get acquainted.

Resources: Give your users some additional links or resources that help them engage better with your product.

Thanking them: You can choose any way to express your gratitude. It could be simply thanking them or telling them that you're excited that they've signed up for you.

Actionable: As mentioned above, there should be clarity in the content of the email; it should have relevant information and, above all, it should be actionable. It should be clear to the user what you want them to do, now that they've received and opened the email.

Check out the following welcome emails by well-known SaaS companies:

 

Zapier

Zapier's welcome email is an excellent example. It's simple; users are being told what the application does, along with a link to user examples. Conditions of the trial period are clearly mentioned. Additional resources, such as the help documentation are mentioned clearly. The email starts with a thank you of sorts, because Zapier is excited to have the user on board. The next step Zapier wants the user to take is developing a profile, which makes the email actionable.

Zapier welcome email screenshot

 

InVision

Users who are signing up for InVision's prototyping application receive a welcome email that is crystal clear in terms of what it wants to achieve: Get the user to start using the app. Hence the email is clearly actionable.

In order to help with that, users don't get a list of things they need to do to start using the app. Users get to see some quick videos in succession to understand what they need to do. Considering that the app is highly interactive and visually appealing, the nature of the email coincides well with the nature of the product.

The email is simple in its content, it links users to videos which are excellent resources to quickly understand and engage with the product. There's admittedly no thank you, but that is more than compensated by the simplicity of the email.

InVisionApp welcome email screenshot

 

Basecamp

Basecamp's welcome email is simple and not long at all, with a clear welcome message along with a thank you for signing up. There's proof given in the form of mentioning how many organisations use the product. There's a clear link for downloading the app for Android or iPhone, which serves as a resource for users to better engage with the product. The purpose behind the email is clear, i.e. logging in to your account. Hence the email is actionable.

Basecamp's welcome email screenshot

 

Convertize

After signing up with Convertize you will receive a straight-forward, simple welcome email from the CEO, in which he will thank you for signing up in the first sentence. Then, throughout the email, there are actionable questions prompting you to reply directly to the CEO, and respond with the reason why you signed up. This highlights their appreciation for every single user. Convertize thus shows that they care about your feedback. At the very end, they also give you a link to their promotional video as a resource, it makes the platform come alive, creating a more human emotional connection. In the long run, this helps build a strong engagement with the product.

Convertize's welcome email screenshot

 

Conclusion

As the saying goes, the first impression is the last impression over here. In customer on-boarding, the success of the signup flow heavily hinges on the initial points of interaction between you and your customer. The level of customer engagement can be imagined in terms of an exponential curve.

Successfully designing each point of the customer on-boarding flow ensures that the customer's engagement with your company increases exponentially after each point. The customers that your business will get will be happier ones. There is a higher probability of them being able to understand, value and like what you have to offer. And if the first impression is thoughtfully and skilfully designed, it has the potential to develop customers that will be long term.

 

Source: Ultimate UX Design Guide to SaaS On-Boarding, Part 2: Welcome Email

Web Designer vs Web Developer – What’s the Difference?

Giving people the ability to create their own website is a large part of the success of WordPress. With WordPress, you no longer need a web designer or web developer to create your own Internet presence. Basically anyone can set up a website in minutes.

On the other hand, for many users the platform has been a gateway to learning web design and development. It makes sense. You start off with a simple site, then look for ways to customize it. After that, it's only natural to pick up basic design or programming skills and keep going from there.

Yet, there are still times when you need a professional designer or developer. However, when do you need to hire which of the two? And what even is the difference between web designer and web developer? After all, the two terms are often thrown around synonymously.

In this article, we want to shine a light on these very questions. We will look at what web designers and developers each do in their field work to find out the difference between them. After that, we will also have a look at whether the division between the two is even that clear.

In the end, we want you to end up with a clear understanding of the job descriptions and who you need in which case. Or, if on the other side of the fence, give you enough information so you can decide for where you'd like to take your career.

What Does a Web Designer Do?

"Web designer" is the most common term for people creating websites. However, it is usually a stand-in for a very broad set of skills. So, in order to show the difference between web designer and web developer, let's peel the onion and see what web designers actually do.

Work with Graphics and Visuals

Web designers typically do the visual design of a website and create the overall look and feel of it. The result are templates for websites that can later be put into practice.

To do this kind of work, web designers usually first have to sit down with the clients to understand their needs and then come up with a concept that fits it. While doing so, they also need to consider existing branding in order to preserve a unified experience across all marketing channels.

Once they have a concept, web designers start creating the visuals. Usually their tools of choice are graphic design software like Photoshop, Illustrator, and InDesign. With their help, designers put together wireframes as well as necessary assets like graphics, buttons, images, and the likes.

In order to do it right, they need an understanding of things like colors and how they work together, contrast, shapes, textures, typography, and more. Aside from that, you also need a certain amount of creativity and imagination and other things generally considered right-brain activities.

Guide User Interaction

However, web design is not just an art but also a craft. It not only needs to look good but be functional as well and accomplish its goal.

For example, most websites aim to move visitors to take an action such as make a purchase, sign up for a service, jump on an email list or something similar. In addition to that, they also need to be easy to navigate and intuitive to find your way around.

For that reason, web designers also need to understand user psychology and keep on top of the latest developments in interface design. Otherwise, the end result will not only be hard to use but might also look out-of-date and unprofessional.

In Contrast to That, What Does a Web Developer Do?

So, how is this different from development? Well, web development is usually the second stage of the website creation process. It's where you take the design and make it a reality. For that reason, a developer's job is usually much more technical. However, there are different kinds of development work.

Frontend vs Backend Development

Web development is most often divided into two camps: frontend and backend development. While their work often overlaps, they do serve two different purposes:

Frontend — Frontend developers take the finished design and translate it into code. They are usually skilled in HTML (which is used to create the site structure) and CSS (for adding styles and layout). Sometimes they also use JavaScript for advanced design and interactivity. If you have ever customized a WordPress theme (hopefully with a child theme), that's pure frontend work.

Backend — Backend work, on the other hand, is, even more, code intensive. It focuses on how the site works, for example, how it interfaces with the database. You might also need a backend developer for advanced functionality like user accounts or a shopping cart. In WordPress, backend developers need solid skills in PHP as the platform mostly runs on that language. In addition to that, they might also work with APIs and need to know how to connect different types of software with one another or create functionality from scratch.

As you can see, no matter which part of web development you end up working in, all developers need programming chops. For that reason, the tools include code editors and other development tools. Development work is also very analytical and detail oriented.

Of Full-stack Developers and Designers

The above shows the difference between web designers and web developers on paper. But is it really that clear-cut? The answer is no. In reality, the lines are often a lot more blurred.

Design and Development Have Lots of Overlap

Since both parts of the website creation process depend on one another and have a lot of overlap, many designers and developers have skills outside their main area of work.

For example, as a visual designer, it only makes sense to know how pages work and behave. Doing so makes you more effective at your job as you can put that knowledge into practice without having to constantly check back with the developer as to what is possible.

This is especially important in areas like responsive design which has put new demands on the work of both designers and developers. Having cross knowledge only makes it easier to stay afloat in an ever-changing field.

Many Choose to Branch Out

In addition to that, some people just continue adding to their skill set. The number of designers learning to code and developers learning to design is ever increasing. For that reason, we also have a growing group of people who are hybrids between design and development.

For example, someone might not stop at creating designs on paper but also want to do the frontend work necessary to bring it into existence. It's just a logical next step, since working with CSS is also a fun and creative task. Plus, it makes sense economically as you can do more for your client or work in different parts for different clients, giving you more earning potential and making you more marketable.

However, is this person a web designer or frontend developer? You tell me. (I've recently heard the term devigner, which I personally like a lot.) However, the fact is, we are seeing a lot more of them in today's online working world.

Embrace the Full Stack

Some people even go all the way and train themselves in all necessary skills to make websites a reality. Those are often called full-stack developers. They are able to build a website from scratch, from design all the way to frontend and backend development.

However, it is a challenge to keep up to date on all necessary skill sets and stay on top of multiple fields that are constantly evolving. That's why full-stack development is usually performed by a team where the knowledge can be compartmentalized and you have experts for different parts.

Web Designer vs Web Developer – The Verdict

Thanks to platforms like WordPress and the overall growing need for web presence, web designers and developers are more and more in demand. For that reason, anyone deciding to move into that field is probably making an investment in their future.

Above, we have talked about the difference between web designer and web developer. As we have seen, on paper, the two disciplines are very much different, call for different skill sets and take care of different parts of the website creation process.

Consequently, if you are hiring somebody for a major role in your web project, it absolutely matters whether you are looking for a designer or developer. Plus, most web projects need both in the long run.

However, when you are just starting out in your career, you don't necessarily need to make a decision and stick with it. While it's a good idea to make up your mind where to get started, we have seen that you don't have to stay in your particular area and can always branch out and add to your skill set.

My personal tip: learn what most interests you. Doing so makes the process most enjoyable while still making sure you are investing in an important field of knowledge. You can always move in another direction later.

However, no matter what you call yourself and which part of the process you oversee, the important part is to end up with a beautiful, functional and usable site. That should be something we can all agree on.

What do you see as the main difference between web designer and web developer? Where on the scale do you see yourself? Let us know in the comments section below!

Nick Schäferhoff

Nick Schäferhoff is an entrepreneur, online marketer, and professional blogger from Germany. He found WordPress when he needed a website for his first business and instantly fell in love. When not building websites, creating content or helping his clients improve their online business, he can most often be found at the gym, the dojo or traveling the world with his wife. If you want to get in touch with him, you can do so via Twitter or through his website.

Source: Web Designer vs Web Developer – What's the Difference?

Semantic Web Design Patterns

Semantic Web Design Patterns

The free book "Linked Data Patterns" is available online, as as PDF, and an Ebook. The articles will pick out some of the more useful patterns from the book that address commonly encountered problems.

Today's Lesson

Like a question on Stack Overflow, a design pattern is often posed as a question: how do we solve some design problem? However a design problem is, by its nature, nonspecific, and rarely has a single straight-forward answer. There might be several ways to solve the same problem, some better than others depending on the specific situation and the specific context of the problem.

So a design pattern also captures more context: when might the problem arise? What alternative solutions are there? And what trade-offs are part of a specific solution? A design pattern is intended to share not just solutions but a better understanding of both the problem and how it might be solved.

Why Design Patterns Are Useful

Let's look in a little more detail at design patterns and how they are different to a simple tutorial or an entry on a Q&A site. What are the benefits of a design pattern approach?

In my experience, design patterns have a number of different benefits.

Firstly, patterns have a well-defined structure (more on that in a moment). This consistent layout makes it easy to browse through a collection of patterns to find relevant help and then dive further into the material. The structure encourages the author of the pattern to think carefully about the knowledge they're sharing, whilst making the material more consistently accessible to a reader.

Secondly, unlike a tutorial or recipe which typically guides you through a single approach to solving a problem, patterns encourage discussion of related and complementary approaches. Design decisions are rarely clear cut, so it can be useful to understand the context in which a decision is made and the resulting trade-offs. Communicating these nuances is how we share knowledge rather than just fixes for a problem.

Finally, patterns usually have simple clear names. Whilst this makes them more memorable, the real benefit is that patterns can start to form a shared vocabulary that can help streamline discussion and communication between developers within a team or in an industry. It's often possible to clearly describe a technical architecture or piece of code by reference to a set of patterns, avoiding the need to get into the implementation details.

A knowledge of key design patterns has become an essential part of enterprise software development as it allows teams to quickly communicate their designs to one another. In particular software developers have embraced design patterns help document and share good practices in designing object-oriented systems. But the technique isn't limited to use in that context. Design patterns have been used to describe refactoring techniques, user interface design, architecture, and in many other different areas. Design patterns are useful wherever we encounter recurring problems with common solutions. And in particular, wherever there is a need to share good practices within a community.

Semantic Web technologies can be complex to learn and can be applied in many different ways. There is a growing body of experience in the wider community about how to create good semantic web applications and how to structure data using RDF that makes it easier to share and extend. A design pattern approach is useful for sharing this hard-won experience.

Anatomy of a Design Pattern

As I mentioned earlier, design patterns have a consistent structure. While there are a number of variations, a design pattern is typically organized as follows:

Problem Statement—a description of the problem or issue that the pattern attempts to solve. This is typically expressed as a simple question

Context—describes the circumstances when the problem might occur to help you identify it

Solution—a description of a recommended solution to the problem

Example—a worked example that helps to illustrate the solution

Discussion—a deeper discussion of the solution, typically highlighting advantages and disadvantages and alternate options

Related Patterns—references to other relevant patterns that offer alternate approaches to or build on this pattern

A collection of patterns is referred to as a pattern catalog. A catalog can also include anti-patterns: examples of poor design and things to avoid.

Linked Data Patterns

The Linked Data Patterns book is a pattern catalog that gathers a range of design patterns relevant to Semantic Web applications. Rather than focusing on individual technologies the patterns cover a number of broad topics. These are outlined in the following sections. Later articles in this series will focus on each of these topics in more detail.

Identifier Patterns

Identifiers are fundamental to RDF and Linked Data. Successful use of the technology requires having good, stable URIs that can be used to publish and share data. Patterns for defining identifiers can help answer questions such as:

How can we create URIs from existing identifiers, such as database keys?

How can we create stable URIs that are free from implementation details?

How can be make URIs "hackable" to make it easier for people to link together different datasets?

Modeling Patterns

Modeling is one of the richest source of design patterns. There are often many different ways to structure some data, each with its own impacts on flexibility and ease of evolution of the resulting data model. RDF modeling is, in essence, entity-relationship modeling and will already be familiar to many. But even so there are some graph data patterns and general RDF best practices that are useful to share. RDF modeling patterns can help answer questions ranging from the simple to the complex:

How can we communicate a preferred label for a resource?

How do we model complex relationships between resources?

How do we structure data to get the most from a graph model?

Publishing Patterns

Linked Data is intended to be published and shared: both privately within an enterprise and more openly on the web. There are a number of publishing patterns that can make data easier to discover, easier to consume, and more usefully inter-linked. Unlike modeling patterns—which emphasize the flexibility of an individual data model or data set—publishing patterns encourage thinking about data in a wider context, helping answer questions such as:

How can we discover data associated with a web page?

How can we integrate different datasets?

How can we remove a dataset, or move it to a new location?

Data Management Patterns

When working with RDF data its often necessary to partition a dataset into smaller chunks known as named graphs. A named graph is just a set of RDF triples that has its own identifier. Named graphs have been available as a feature in many RDF databases and as part of the SPARQL query language for many years. They are a very powerful feature that, when applied, can make an RDF dataset much easier to maintain.

However, there are several different ways that a dataset could be broken down into graphs to make it more manageable, and the right approach depends on the needs of the individual application. Data management patterns help document these alternate approaches to using named graphs, addressing concerns such as:

How do we track the source of some collection of RDF triples?

How do we organize a triple store to make it easier to manage individual resources?

How can we get a full description of a resource, regardless of how the data is organized into graphs?

Application Patterns

There are plenty of great design patterns that cover software design and architecture in general. However, the flexibility of RDF and SPARQL—coupled with their integration with web technologies—offers a lot of extra opportunity for creating dynamic data-driven applications. These applications have some fundamentally different requirements from traditional software applications, and require new, different design patterns.

RDF application patterns cover a range of different topics including how to apply SPARQL to more than just querying of data, as well as how to take advantage of RDF extensibility and merging capabilities to parallelize applications and data retrieval. Application patterns can help answer questions such as:

How can we validate or transform some RDF data using SPARQL?

How can we improve performance of data loading or retrieval?

How can we write applications to take advantage of new data, whilst being tolerant of missing data?

Conclusion

In this tutorial we've introduced the concept of a design pattern: a solution to a modeling or software design problem that is used to share knowledge and experience among developers. Design patterns complement tutorials and reference documentation by helping to share alternative approaches whilst also developing a shared vocabulary among practitioners. Design patterns have been successfully used for many years in many different areas.

Increasingly semantic web developers are starting to recognize the benefits of design patterns and how they can help share solutions that cover a wide range of different areas. These areas include creating good identifiers, data modeling, publishing data for re-use, managing large datasets, and building flexible semantic web software.

In future tutorials in this series we'll dig into each of these areas in more detail, exploring some of the key design patterns that can help you make the most of semantic web technology.

Source: Semantic Web Design Patterns

The modern web design process: final testing and review

Creating a new website can be a lengthy, involved process. From setting goals with stakeholders to creating content and building the design, there are tons of steps to take before you can flip the switch. Reviewing and testing functionality is key to a successful site launch.

Inspect the design ‍The website of furniture designer Jé-Rôm shows how the careful placement of visual elements leads to a sophisticated layout.

Before you get into testing the functionality, take a look at the visual elements of the design. Are you using the right final-final-final logo? Are there new photos to swap in? And did you increase the font size on the calls to action?

The design process almost always involves a wealth of feedback and suggested edits. It's easy to miss something. But it's these small details that will either delight or frustrate your audience when when the site goes live. So keep a running list of edits and changes — and make sure they get resolved before launch.

Check for inconsistencies. Font styles and sizes should be the same from one page to the next. It's easy to overlook an incorrect font or body text that's a point too big. After all, you've been staring at this design for a long time.

Have someone else look the site over for inconsistencies and details you may have missed.

At this stage, decision makers should be happy with how the design looks. It's normal for there to be minor tweaks and edits, but if there's been good communication and collaboration, there shouldn't be any major changes at this point.

If you're getting more time-consuming edit suggestions, evaluate their potential value before you tackle them.

Will these changes improve the user experience? Will they delay the website's launch?

It's okay to push back if what's being recommended won't enhance usability or improve a site's visual aesthetic. Stay professional, but be clear about why some edits aren't necessary — especially in the final stages of the design process.

Pay attention to the details ‍The review process is the time to catch your mistakes.

There are so many details to think about and check when it comes to web design. Especially for a business or an ecommerce site. It's important to verify things like hours of operation, nutritional information on a menu, addresses, and phone numbers.

Ecommerce sites need to have accurate photos and descriptions for each product. It's always a bummer to open a box of something you ordered, only to find it doesn't look at all like what you thought you'd bought.

Make sure a stakeholder who's a brand expert for the company and its products has a look before a site goes live. Ask your client who should do this review, and make sure that reviewer is well-aware of the timeline.

Test the functionality of integrations This ecommerce site design by Greg Dlubacz features a clean layout combined with easy-to-follow instructions that make buying the bike you want a smooth process.

Integrations can include shopping carts, newsletter sign ups, and quote request forms — and so, so much more.

Test any part of the site that requires data collection (and make sure you've set up SSL!). If a form submits to an email address, make sure it's the right one. And double-check email addresses with the client.

Forms should have clear instructions and fields. It's a good idea to have someone who's not involved with the company or the project fill out a test form and give feedback on their experience.

Same thing with the checkout process — have a couple people go through looking for glitches and ambiguity. How many of us have abandoned a shopping cart because the process was too complicated? Everything from shipping options to payment choices should be checked. Make sure everything is clearly defined and easy to navigate.

Before launch, find out what kinds of electronic payment your client plans to accept. Do they have PayPal or Stripe set up already? If not, make sure they tackle that — gathering last-minute info to get an account set up can be an annoying delay.

Check your links

Links are a major chunk of functionality, and you need to check them all. And don't forget to create that 404 error page — make this part of your standard protocol. This one can be easy to overlook.

Manually checking every link can be overwhelming. Good news — you don't have to! Use a link crawler tool like W3C Checker or Screaming Frog. Both will quickly scan for broken links and make sure the content is accessible.

Ensure your design is cross-browser compatible

Your design needs to function, look, and offer a similar user experience in every browser. Each browser has its own advantages and limitations. If your design only works well on one, visitors who use others will be frustrated.

You could download all the popular browsers and test your design in each, but that would be time consuming. There are cross-browser compatibility tools that make this step quick and easy, like Browsershots, Browser Sandbox, and Browsera.

Check design functionality on different devices ‍Make sure the user experience of your design is fantastic no matter what device it's viewed on.

People use different devices throughout the day to access content. Someone's out shopping and checks for nearby coffee places on their cell. Later, they order shoes on their laptop while catching up on Netflix. Your design should be seamless on every screen. The practical applications of responsive design result in websites that offer a more uniform experience.

Check that navigation, buttons, and other interactive elements remain functional on different screen sizes. Test the design on different devices and network speeds. If it's slow to load, see if your high-resolution images and animations are affecting the site's performance. Excessive dynamic elements could also hinder its usability.

It's not likely that you can get your hands on every major device for testing. Surprise — there's several apps for that! Browserstack, Google Mobilizer, and other tools let you see how your site will function on different mobile devices. And, once again, Webflow lets you preview your site on different screens as you build.

Just note that no emulator perfectly reproduces every on-device experience, so be sure to actually test on as many real devices as possible. You can't have every device on hand, but your friends, colleagues, and clients can lend a hand here too!

Take a look at the content

"The more you leave out, the more you highlight what you leave in."

–Henry Green, novelist

Rewriting a paragraph here or a sentence there (probably) won't have a major impact on the final design. Hopefully you had — at the very least — a rough draft of the site's copy before you began the design process, and iterated on it throughout your process. Designing with the content in mind allows you to make thoughtful decisions. Tweaks to the copy can always be made later, even after the site goes live.

But that doesn't mean you should skip a thorough content review right before launch. A simple typo or grammatically mangled sentence can seriously impact audience perception, so make sure your words are as polished as your design.

Make sure your content is useful and easy to scan

As sad as content creators might be about this, people don't come to a site to read it like a book. They wanna get in, get the information they're looking for, and get out. Delight them by making this possible.

Here's how:

Use descriptive headers

Write sentences with simple structures and limit paragraphs to three or four sentences

Group related ideas or items together in bulleted lists

Get rid of copy that doesn't add meaning

Check that your copy is concise, engaging, and consistent with the brand's voice

Proofread for grammar and spelling errors

Get help from a second and third set of eyes to help catch possibly embarrassing mistakes

Ask a skilled editor to look over your copy

Great news: more tools! Hemingway, Grammarly and Ginger can help you with the editing process. They'll also teach you some writing skills along the way.

Practice good SEO habits

Hopefully some well-researched SEO keywords and phrases have been carefully woven into the content. You should also make sure the code has proper heading and paragraph tags throughout. Meta titles and meta descriptions should be included for each page.

A meta title should define the focus of the page. Only use relevant keywords, especially at the beginning of the description, and keep things under 70 characters words. A meta description should be a bit longer, but keep it under 160 characters and write in a voice that connects with your intended audience.

When your website appears in search results, it's the meta title and description that (usually) appear. This helps your audience know they've found a site that matches their needs. Google uses the meta title to rank your content properly, so it should reflect the essence of your page. H1 tags also help with ranking and make it easier for web crawlers to determine your content's purpose. Make sure those tags are specific.

Meta descriptions don't really matter to web crawlers, but they're still important. A good meta description tells someone they've found what they're looking for. Use the same primary keywords from the title somewhere in the description. Google will bold words used in the search query that show up in your description. This also helps your audience see that your site matches their search.

Ready for liftoff Next step: stardom.

When everything has been tested and reviewed, it's time to reveal your hard work.

With a bit of patience and a lot of preparation, your design is ready to go live. Making time to review and test your site is an important step in your design process. Don't let impatience — yours or your clients' — push you to launch before it's ready.

Be sure that your work reflects the thought and dedication you've put into it. Use the lessons learned to make the next project you tackle even better.

What's essential to your design process?

The design process helps us build great sites and good client relationships. I'm always interested in what's working for other designers. Does your process have a step you think the design community could benefit from? I'd love to hear about it in the comments!

Source: The modern web design process: final testing and review

Selecting the Right Web-Design Firm for Your Association

by Tobin Conley And Jason Stone | October 01, 2017

Your association finally has the time, budget and organizational commitment to rebuild your website. This is a big investment, and certainly something you want to handle correctly. While every association's needs might differ, the following are five key steps to help guide you in selecting the right web-design firm.

1. CLARIFY OBJECTIVESUnderstanding your association's business needs, as well as the expectations of each staff member and department, is a good starting point. It is not uncommon for membership to want one thing and finance something else regarding your online presence. If this is the case, facilitate discussions about what the website is expected to accomplish.

If you are still unsure of what exactly is needed, break your requirements into three categories: mandatory (things you need), preferred (things you would like to have) and optional (things that would be great to have but you can live without).

2. KNOW YOUR MEMBERSHaving a good experience on your website helps increase member satisfaction. Determine how your members are currently using the site, as well as what they would like to be able to do there. Are they looking for general information, government advocacy efforts or fundraising opportunities? Do they want to be able to register for events online? Can they establish or renew membership online?

3. FIND TOP CONTENDERSSelect a pool of potential website vendors to bid on your business. Leverage your personal network, as well as community sites within your field, to find web designers with relevant experience. The last thing you want is to waste hours of your time (and theirs) meeting with unqualified vendors.  

4. COMMUNICATE AND REVIEW CASE STUDIESAn introductory phone call allows both parties to understand one another. You want to be certain that possible vendors understand your project goals and that they have developed solutions that have helped other associations reach these same goals.

5. WEIG H ALL OPTIONSAfter closely reviewing all the web-design firms on your radar, it is time to choose the best one to fulfill your vision. Note which firm does its homework, looks after its clients and is able to keep trust throughout the process. Never choose a firm just because it is the cheapest option. Your website is a vital piece of your business and not something you can afford to cut corners on, so make sure you weigh the options and call references.

6. CONSIDER THE FUTUREUltimately, you should select a vendor that will not only pay attention to you during the courtship phase, but after you've become partners. It is important to have a contact who will be immediately accessible to troubleshoot -- because issues inevitably will arise. Creating the site you want is the first step; keeping it running smoothly is an ongoing process.

Tobin Conley is senior consultant, technology management, for DelCor Technology Solutions.

Jason Stone is senior vice president, digital strategy, for Engage Software.

Source: Selecting the Right Web-Design Firm for Your Association