Tag Archives: web development

Wireframing: Yes, You Can! (And Should)

5 Oct

The Blueprint for Web Success

designer drawing website development wireframe

bradley1

Guest Contributor:
Bradley Williamson, Interactive Developer

In putting together a new website or app, there are many business decisions to be made along the way. Sometimes businesses are tempted by change for the sake of change, adding in tech just because it’s cool, or a “modern” design just because it’s trendy.

But if your website is neither functional nor user-friendly, it’s not going to increase sales, traffic, or conversions. Though there is a time and a place for focusing on fanciful designs and flashing animations, the heart and soul of your web user experience is what matters, and wireframing can begin to solidify that. Build from a blueprint using these tips, and your website will be fleshed out with purposeful simplicity.

Wireframing 101

A wireframe is a basic, visual concept of a user interface that defines key user goals and content hierarchy. Often, they’re unrefined sketches or concepts made on grid paper, whiteboards, desktop programs, and other web-based tools. There is no perfect way to perform this vital step.

Wireframes are done with “block diagrams” to house content.

Wireframes are done with “block diagrams” to house content.

 

Acting as a “blueprint,” wireframes serve as the bones of your design and development processes. Wireframing should come after discovery and before getting into the nitty-gritty details of design.

Wireframe concepts are meant to be thoughtful, fast and fluid, representing a kind of visual brainstorm for internal and external teams. They enrich the conversation around how users will engage with your interface. Wireframes help answer those brewing questions of functionality by taking the abstract ideas from the planning phase and arranging them meaningfully.

Talking with a “Wiry” Voice

Wireframes are often developed in black and white; it’s not the time for discussing color palettes, font choices, imagery, and even branding. The discussion around wires includes:
Content: deciding what should and shouldn’t be displayed
Information hierarchy: arranging that content meaningfully
Functionality: investigating potential action-oriented components
Structure: interconnecting all parts to work seamlessly together
Behavior: evaluating how the user is impacted in their product experience

Wireframing is a time-saver in the long-term, keeping usability headaches or graphical head-scratchers down the road at bay. In other words, you’ll know very early what’s going on your B2B site, where it’s going, and why it’s important. By taking the time to work through wireframes, it’s much easier to throw out large blocks of content and alter key sections, instead of having to change the design concept down the road.

Wiring in the Right People

User interface and user experience designers or information architects are primarily responsible for the creation of wireframes by balancing the larger goals against the user’s needs. During this time, wireframing can inspire the creative and development processes. Developers and designers will use the wires to reduce the learning curve around site implementations and enhancements. Internal project managers assess the wires to ensure the process is within scope and strategy.

Down to the Wire: Final Thoughts

If you’ve ever jumped into a website and realized it was challenging to navigate, or been part of a website development project that went awry, a wireframe should become your new best friend. The process of wireframing a website is a tried and true method to help tackle the challenges for your B2B website.

Share via email

ADA Website Compliance: Get Ahead Before You’re Behind

26 Feb

design

New ADA Regulations Could Affect Your Website Design Practices

Corey1Guest Contributor:
Corey Morris, Digital Marketing Director

For a long time, the only constant related to the web and the Americans with Disabilities Act (ADA) has been confusion. Recent news and information floating around has caused many companies and web development firms to consider changes to website design and development practices to ensure compliance. Are we finally about to get clarity on the topic?

This topic has been discussed for years with many predictions of future actions with the Department of Justice (DOJ) and proposed amendments to ADA guidelines. For years, government organizations, some publicly traded organizations, educational institutions, and other entities have been concerned with ensuring their websites are ADA compliant. The bulk of other industries and focuses have worried only about certain usability aspects. Now, industry professionals are predicting that everyone will soon be required to comply with the ADA or face the penalties associated with breaking the law.

At this point I feel compelled to include a disclaimer that I’m not a lawyer and nothing in this post or on this site constitutes legal advice. I’m in the same boat as everyone else when it comes to rethinking how we build websites to ensure that all businesses, regardless of industry or sector are ADA compliant to the right standard.

Until now, many of us have followed the lead of Google in pushing for all image and video content to be labeled or marked up in a way that is friendly for the visually impaired by utilizing screen reading software. We have also emphasized rendering content in a user-friendly way for all sizes of screens and types of devices. And these have been great improvements—but we’re finding that they aren’t enough to meet the potential new standard.

While there has been a lot of talk and speculation about what the new standard will be and when it will be officially adopted, the consensus that I (and colleagues I’ve spoken with) have found is on WCAG 2.0 Level AA. That is a specific standard and level defined by the World Wide Web Consortium (W3C) that works to define standards for the web. This level of ADA compliance would require a decent amount of work for a lot of existing websites. But when integrated into design and development processes for new websites, it won’t add too much extra effort in the long-run.

The two biggest challenges that I see for digital marketers are:

  1. Finding a way to get our sites ready for the potential April DOJ mandate
  2. Finding the budget to invest to update existing sites in a cost-effective way.

The more you read, the more uncertainty you’ll find regarding predictions for what is going to happen. Interestingly, the DOJ has chosen not to amend ADA guidelines in the past, but has taken enforcement action. Regardless of all of the speculation and confusion out there, the time is now to start considering where your web properties stand regarding ADA compliance and start determining how your organization will prepare for these new standards, whether they are officially adopted or left to be just guidelines.

References and Further Reading:

Share via email