In a poignant moment during the last presidential debate, Joe Biden challenged Donald Trump to verify his comments on fracking by putting a video to prove his point on Trump’s campaign website. Rarely have I seen in politics an explicit mention of a campaign website in the middle of a debate and it dawned on me that these candidates' websites were a view into much more than what they say - it reveals how they speak.
Political campaigns are pushed forward with the framework that persuasion is the name of the game. Oftentimes, a candidate’s communication strategy - be it their story, speech or policy - will resonate with the voter in order to influence them in their direction. Communication extends beyond campaign speeches, state fairs, and bumper stickers - these conversations are also happening in the digital space.
This piece in no way is meant to endorse a particular candidate or position, but merely to understand how Donald Trump and Joe Biden’s communication style is mirrored in the design of their respective website’s user experience. To understand the user experience, we’ve focused on several UX principles - that are either followed or broken to the benefit of each respective candidate.
We’ll walk through three elements of UX that speak to how candidates' communicative style is reflected in them: Navigation, Call-to-Actions, and Accessibility.
NAVIGATION
Navigation is the system that enables users to explore and understand a website, product, or in this case, a candidate. The information architecture, or how the website is structured, directly impacts the amount of information gained by the user to make an actionable decision or, if it’s frustrating enough, abandon their task at hand. It’s been noted that users will leave a website within 10-20 seconds if a website doesn’t communicate a clear value proposition (Neilson Norman). Basically: if the website doesn’t have good footing, users will take the wrong step and leave.
When it comes to politics, the navigation is an opportunity for candidates to:
- Explain the candidate’s story
- Share their vision for the presidency
- Inform voters on how to get involved
As we walk through the respective candidate’s websites, keep these goals in mind. There are a myriad of ways these overall goals are actualized in terms of categories the user would follow. There isn’t a one-campaign-strategy that fits all nationally.
Several principles are important to keep in mind when designing the optimal navigation menu. The first we’ll discuss is Miller’s Law.
Miller’s Law states that the average person can only keep 7 (plus or minus 2) items in their working memory, meaning as a soft rule you should have around 7 menu items in your navigation. The implementation of this principle depends on the scope of the website and the clarity of its labels. Meaning, if you only sell iPhone chargers, you’re probably not going to need 7 different pages or categories to help the user find what they’re looking for. But leave a comment to correct me if you’re a professional iphone charger salesman and I’ve undermined the nuances of iphone chargers.
Biden’s campaign website has a limited navigation, with four menu items categorized in a clear, direct way. By limiting the navigation to 4 items, the site directly communicates the campaign’s goals with potential voters: learn about his vision and team, understand how to vote, volunteer with the campaign, and shop to promote the candidate. These four navigation items address the goals of a campaign site and reducing the number of options allows focus on the four that are most important to the campaign.
The top-level navigation items are clearly labeled and establish a strong information scent, or cues that users get from the link label, to guide the user further down the site. Particularly important to note the placement of “How to Vote” as the second item in the navigation. This implies that after candidate information, voter education is the second most important priority for the campaign. This aligns with the broader goals of the Democratic party. Traditionally, Republicans have supported more barriers such as voter identification and security while Democrats have encouraged engagement and access. Republicans argue voting is a privilege of citizenship to be earned and safeguarded with restrictions and security. Democrats argue that voting is a right focus on removing barriers to voting as much as possible, thus is so visible in the navigation. (NPR)
Notice that Biden’s campaign also reduced the number of navigation links. When you’re designing the architecture of a website it’s important to consider that you’re designing a decision tree for the user. Hick’s Law states the time it takes to make a decision increases with the number and complexity of choices.
Think about any time you’ve looked at a complex restaurant menu or tried to pick a book from a library shelf. It’s easier to make a decision at Chipotle than it is at the Cheesecake factory purely based on browsing their menus. The more difficult it is for your brain to organize information, the longer it must have taken for you to respond. A way to solve for this is by breaking down choices into actionable steps that provide clarity and focus.
While Donald Trump’s navigation does adhere to the Miller’s Law, ghost buttons (call-to actions with a thin border and text label), tight padding between menu items and unclear labels contribute to an unfocused navigation. As an incumbent, the candidate’s goal is to remind the voters of their successes. It's worth noting that there is a separate micro-site dedicated to "Promises Kept", dedicated to President Trump's accomplishments. As a navigation item, however, the "Promises Kept" label has a low information scent as it’s vague in comparison to the rest of the labels.
While these may appear to be criticisms of the navigation, it’s just an analysis of navigation through the lens of best practices but that doesn’t mean that it’s not the optimal experience for their user. The current navigation doesn’t have a drop-down menu therefore you’re able to see every link of the website. This reflects Donald Trump’s communication style in terms of simplicity and simulated transparency. He’s created a persona of speaking the language of the common man as he cuts through the noise of the media landscape through his twitter and creating a navigation that has deeper levels may be in direct opposition with his persona.
CTAs
Call-To-Actions (CTAs) are interface elements intended to encourage users to take a particular action. CTAs often appear as the distinct button at the end of a navigation, or the distinct link in a popup ad. They’re important to drive users towards your ultimate goals. When it comes to designing CTAs, every element must be intentionally chosen to reflect a brand’s promise - be it the button size, color, hover-state, interaction, or copy.
A distinction between both of the candidates' websites is the CTA copy directing users towards fundraising efforts.
Biden’s primary CTA is “Donate”, versus Trump’s CTA is “Contribute”. “Donate” implies a contribution towards a charitable organization versus “Contribute” which implies a gift offered towards a larger collection. Historically speaking, Donald Trump has touted his business acumen and vowed to run the country as an efficient corporation rather than an equitable philanthropy. Contribute also implies like you’re a part of a movement - which speaks to Trump’s coalition building strategy. Trump has repeatedly touted himself as the person speaking his voter’s language and not just working on their behalf but cutting through the political noise with the people’s vote. The usage of “contribute” is an active method to reinforce this idea.
The button styles are also very different, especially when examining the donation forms. To focus a user on an intended action, designers must consider the Von Restorff Effect.
The Von Restorff Effect, also known as The Isolation Effect, predicts that when multiple, similar objects are present, the one that differs from the rest is most likely to be remembered. This means you’ll always remember and be drawn to the one thing that sticks out.
Trump’s form buttons distinguish three specific options ($100, $250, $500) through several design choices. They distinguish button colors from the other five options and also make the text black. There’s also a slight drop shadow to make the buttons look more pronounced. To add to the list of distinguishing figures, in the default state the three buttons swivel to draw attention. Along with the button design, the campaign added context for each option - each one providing the promise of access to a membership. While the amount of design details put into driving users to donate might appear gauche, Trump’s form provides value and direction to the user. Again, this mimics Donald Trump’s general messaging strategy - often focused on a few key issues that are intended to galvanize his base.
On the other hand, Biden’s form does not achieve the same level of direction. Every button has the same shape, color and size. When scanning the form, Biden’s campaign doesn’t provide value or offer insight into how a user’s investment would benefit them. However, while the button UI fails to draw attention, the form bolds text above to focus the user on the Biden campaign’s central message: “defeating Trump and the GOP”.
ACCESSIBILITY
Accessibility allows you to be able to reach a broad audience and design for users with visual, auditory, motor and cognitive disabilities. Improving a website’s accessibility corresponds to both visual aspects (contrast ratio, hierarchy, etc.) and code(alternative text for visuals, tag structure, etc.).
In the United States, web accessibility is quickly moving from an option to a requirement. Several U.S. courts have ruled that commercial websites are bound by ADA regulations. The ADA calls for auxiliary aids in communication, which has been interpreted by courts as extending to online video captioning and website accessibility (Forbes).
Both Biden and Trump’s website’s approach accessibility in dramatically different ways however, their respective designs emulate their political strategies.
Biden’s website has explicitly laid out their commitment towards accessibility and that echoes their need to appeal to a broader audience. They state, “our on-going accessibility effort works towards conforming to the Web Content Accessibility Guidelines (WCAG) version 2.1, level AA criteria.” They’ve partnered with Perkins Access, a division of Perkins School for the Blind to work with the Biden team to continually improve web accessibility standards. The attention given to inclusion is in line with Joe Biden’s political strategy. The democratic party’s breadth is wide and includes many different factions of the American public. This coalition includes Republicans such as Gov. John Kasich and Cindy McCain along with progressives such as Rep. Alexandria Ocasio-Cortez and Sen. Bernie Sanders. Democrats could lose their appeal if they don’t actively engage with wider audiences. (Wall Street Journal)
In contrast, Trump’s website fails to adhere to many accessibility requirements but he doesn’t necessarily need to focus on reaching a broader audience to have an impactful message. Trump has been able to focus on specific talking points that appeal to his base and others have had to accommodate accordingly because they’ve been drawn to his communication style or his administration’s policy. Since addressing accessibility standards doesn’t benefit his primary user base, his campaign may have dismissed its value. This extends beyond disabled users on the website and into policy affecting voters. For example, farmers show support for Trump even though his subsidies and his trade war with China have deeply hurt them (Wall Street Journal). Inaccessibility doesn't necessarily hurt him and it reflects how he operates.
Websites are the beginnings of a conversation and being aware of your communication through the specific experiences can create a unified and cohesive platform for users to quickly understand. Certain elements of a website can be designed for the user to have an optimal experience but you can strategically break these rules to mirror how you would like to communicate with your users. Regardless of political party, the best way as a user to complete the communication loop with these candidates is by voting. Have your voice be heard and if you have any uncertainty about voting information visit https://www.usa.gov/how-to-vote.
This piece is not an endorsement of any particular candidate, but an analysis of how design is a reflection of how brands connect to their users.
.jpg)
