11 12, 2019

Beacon’s Favorite Web Design Projects of 2019

By | 2019-12-11T15:38:26+00:00 December 11th, 2019|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

Well, it’s almost here… 2020, the new year, the start of a new decade (depending on whom you ask). And that means we’ve nearly made it through another memorable 12 months.

For us, at Beacon, 2019 was filled with lots of great projects, conversations, innovations and new beginnings. We’ve welcomed in talented new staff and began relationships with awesome new clients. We’ve also strengthened our existing customer relationships and added to our already considerable skill set.

Through it all, we’ve worked as a team of equals to support our clients’ business goals, advance our understanding of the digital landscape and collaborate on outcomes that really move the needle.Image by OpenClipart-Vectors from Pixabay

It’s natural this time of year to reflect on all that’s been accomplished. We’re no different. There are quite a few Beacon projects that deserve recognition. Unfortunately, we don’t have the time or space to touch on them all.

What follows below is just a small representation of our successes in web design from the past year.

But, before we dive into highlights of those great new client websites, let’s review what a great new website should look like in 2020 and beyond.

Design Features of a Great Website

Reasonable people can disagree on what they view as the most important elements of a modern website. After all, beauty is in the eye of the beholder. That said, our experience informs us that your next website should be built with the following concepts in mind:

  • Simplicity – like a beautiful piece of recorded music, you don’t want your site to feel overproduced. And that can (and does) happen if you try to pack too much into every page. A tasteful page design that prioritizes spacing and a natural flow is the rule. Your users shouldn’t feel lost or overwhelmed by information on a busy screen.
  • Responsiveness – today, your users will access your site from more than one platform. You want their experience to be equally awesome on their phones, desktops and tablets. Moreover, there isn’t a standard screen size for any of the platforms. Your site has to be built to accommodate the smallest and largest screen dimensions, and everything in between.
  • Legible typography – don’t get too cute with your choice of fonts. Yes, you want your branding to stand apart, but not so much that it takes attention away from the information your visitors are looking for. Subtle differences from the typical are appreciated; major departures from the norm are a distraction.
  • Accessibility – keep in mind that some visitors to your site will have special needs and/or physical limitations that may impact their ability to access information on your pages. Account for these needs by following the widely accepted Web Content Accessibility Guidelines (WCAG 2.1).
  • Easy, intuitive navigation – the last thing that you want is your visitors getting lost on your site. Navigation menus offer the map to your site content. You want to make the map as easy to read and use as possible.
  • A careful balance between visual storytelling and text – you don’t want to overwhelm your visitors with too much information at once. And, let’s remember, attention spans are getting notoriously short. That means you have to keep your text scannable and easily digestible. Wherever possible, lean on visuals to relay information to your users.
  • Professional imagery – you wouldn’t include amateur photography in your printed marketing collateral. Why would you on your flagship marketing asset? The extra cost is worth it if you want to look polished and professional.
  • Strong branding – again, your website is your most important marketing tool. You want your brand to be well represented in the design, but without appearing overbearing and too in-your-face. There’s a fine line, certainly. But, you don’t want your users to be guessing that they’re in the right place.

Some of Our Favorite Websites of 2019

Ok, without further ado, here are some of our favorite web design projects from the past year, along with the design attributes that make the websites really pop.

North Carolina A&T State University

NC A&T University website homepage

  • Streamlined, out-of-the-box homepage design and functionality
  • Mobile-first approach and navigation design
  • High contrast toggle for accessibility
  • Degrees and Programs pages with branding for each college/department and extensive filtering capabilities

Eastern Connecticut State University

Eastern Connecticut State University website homepage

  • Artistic take on a higher ed website, with exceptionally sharp presentation
  • Imagery, content and branding integrated into a modern, sleek design
  • A ton of subtle design touches, like paint-brush edges and golden arrows accents always pointing East
  • Newly developed content written to take full advantage of customized page templates

Atlantic Cape Community College

Atlantic Cape Comm College website homepage

  • Multiple parallax design attributes
  • A really cool social media wall
  • Interior pages featuring an intuitive “navigate this section” menu
  • Animated “Cape Man” icon in the utility navigation

Crosspointe Homes

Crosspointe Home website homepage

  • Modular design optimized for the specialized needs of the real estate industry
  • Page templates coded for easy addition of new content
  • SEO-optimized content developed by Beacon content strategy experts
  • Simple and easy to use navigation

Beacon Knows Web Design

Need to refresh your website for 2020? We’re here to help. Learn about our approach to website redesign projects and get in touch with our talented team today.

22 05, 2019

Did Your Mother Dress Your Website?

By | 2019-05-22T12:54:48+00:00 May 22nd, 2019|Categories: Digital Marketing, Higher Education, Creative Design|Tags: , , , |

For many juniors and seniors, one major decision comes to dominate the closing chapters of their high school careers: where to go to college. It’s not a secret that your higher ed website can – should, even – play a large role in the decision-making process. Often, it’s the first interaction between a prospective student and your school.

It’s important, then, for your site to create a good first impression by presenting and defining your school brand for visitors in a compelling, accessible and fun manner. It helps if your brand lends itself to memorable presentation. However, if your brand isn’t compelling, accessible or fun, you’ll likely struggle to create the first impression you want.

The truth is, bad branding – including sub-optimal visual presentation – can stymie the performance of an otherwise perfectly good college site.

Bad Branding Is Real

You remember those looks you’d get as a kid when your parents would dress you up in something real “cute” – like a sailor suit or a bumble bee costume (stifles traumatic childhood memory)? That bumble bee costume wasn’t your idea, and isn’t you… but to everyone on the outside, you were a bumble bee. Thanks, mom!

What made those experiences feel, um, awkward – other than the stares and the laughs – is your personal brand being badly misrepresented. Normally, you wouldn’t have been caught dead in that outfit. As a result, you were rightfully concerned about the consequences of that disharmony.

Putting painful childhood memories aside, kids are not the only ones to suffer from badly misaligned branding (though, thankfully, we get oversight powers of our personal brands eventually). Traverse the interwebs for even just a little while and you’re bound to run across sites that look like they were dressed by your mother.

And, higher ed sites can be some of the worst dressers.

Brand Style Guide: Your Wardrobe Organizer

So, how do you put better threads on your site?

A visual refresh or redesign may be the solution if your higher ed site is technically sound but lacking a contemporary look and feel. Let’s be clear, though – you don’t necessarily need to reinvent your brand. To use your branding more strategically, you may just need to define it better.

The best way to do that is with a brand style guide  – a comprehensive document that explicitly defines key attributes and elements of your school’s brand (sometimes referred to as a brand bible). The brand bible is best used as your road map for all future marketing initiatives, including website redesigns.

A brand style guide is a foundational marketing document, but many higher ed marketing departments operate without one. That’s probably because style guides have a reputation for being cumbersome and difficult to produce.

However, there’s no reason why a functional brand style guide can’t be developed in-house by a dedicated team. With careful planning and buy-in from key stakeholders, no task is insurmountable. The most difficult task might be getting everyone in the same room for the requisite brand brainstorming sessions.

Defining Brand Components

To define a thing as elusive as your school brand, you’ll need to discuss certain key attributes of your school. This is where you’ll need all those VIPs – for their institutional knowledge and decision-making prowess.

Schedule a brainstorming session (or several) to discuss the following key brand components:

School Values

This may be as simple as pulling from your school charter. It’s just as likely to find that no one has ever bothered to record your school values, or maybe even thought about defining them. In which case, the input from your school leadership will be critical to completing this task.

Target Audience

Develop a full persona, or several personas, of your prospective student groups. This will help calibrate all your marketing efforts.

Mission

If your school has a mission statement already, ask if your stakeholders feel that it still accurately represents what your school aims to accomplish. This may lead to a revision or a re-statement.

Vision

A vision statement speaks to goals or outcomes that your school wants to accomplish. As with the mission statement, you may find that an existing one may need to be brought up to date.

Brand Personality

This is where things can get fun. The goal is to come up with three to five adjectives to serve as brand attributes. There are lots of exercises that can help get the ball rolling. If your group gets stuck, start with deciding what your brand is not, or identify its opposite traits.

Discussions that involve abstract ideas can be difficult to get going initially. You’ll want to have some ice breakers and exercises prepared beforehand to guide the discussion and keep it on track. More than one brainstorming session may be required to complete the task.

Shape Your Brand Elements

Once you’ve got the brand components down, use them to define your brand elements.

Brand Story

The brand story can draw upon your mission and vision statements to tell a narrative about your school.

Logo

A logo update may not always be necessary. That said, if you’re introducing something substantially different or new to your brand, a new or updated logo can help signal that change.

Color palette

In this section of your brand style guide, provide explicit examples of all official brand colors and include information to help your vendors recreate the right hues.

Imagery 

There are several ways to provide guidance on creating on-brand imagery. Find and present images that convey the feelings you want to evoke. You should also include imagery that has historically performed well on your website and other marketing assets.

Voice

Your brand voice is closely related to your brand personality. Identify and document how you want your brand to sound to your target audience.

Typography 

In branding, details matter… down to the typeface selection. Choose your typeface family and provide explicit instruction on usage. Direct how you want copy to align and identify the spacing ratios to ensure consistency when typeface sizes change.

Beacon Knows Higher Ed Websites

Is your school website meeting your recruiting and conversion goals? Find out with a complimentary audit from Beacon’s digital marketing experts.

16 04, 2019

Drive Recruitment with Campus Virtual Tours

By | 2019-05-03T12:44:14+00:00 April 16th, 2019|Categories: Digital Marketing, Higher Education, Creative Design|Tags: , , |

Is there a better way to approach campus visits in the information age?

Campus tours are an excellent way to showcase your campus to prospective students. In fact, as you’re reading this, admissions offices across the country are in the midst of preparations for a very busy campus visit season.

From an admissions perspective, few things signal serious interest in your school louder than an investment of time and resources into a visit to your campus in-person.

But, today, students looking to make a decision on their academic future want as much information about your school at their fingertips as possible – and, not just about academic programs or meal plans. Your future students want to know how it feels to be on-campus, what student life is really like and whether they’ll easily be able to fit into the school culture. Oh, and, they want this information before actually committing to a campus visit.

It’s also important to remember that not every potential student has the ability to come check out your school in all it’s splendor.

More than ever and for a myriad of reasons, your website serves as a prerequisite – even a substitute – for a physical experience of your school. As such, a well-designed, high-quality virtual tour of your campus, featured prominently in high-traffic areas of your website, can be very helpful in meeting your academic recruitment goals.

What You Need to Create a Virtual Tour of Your Campus

It’s easy enough to cobble together a few short videos or images for a quick-and-easy version of a digital campus tour. However, with a too-simple approach, you’d be risking alienating your digitally native target audience, who quickly abandon and don’t easily forgive weak user experiences.

To keep the attention of your visitors, you’ll need a well-designed and skillfully executed digital strategy. That strategy should include professional-quality video/image production, a narrative tailored to the needs of your prospective students and their families, and technical skills to integrate the tour into your current higher ed website.

Your internal marketing team can handle the script writing and your site developers/webmasters can create the digital experience on the website. However, unless your school has a top-notch film program, you’ll need to procure the services of a qualified videographer to manage the video production of your virtual tour.

Virtual Tour Best Practices

Your school’s virtual tour does not have to be just like your rival school’s virtual tour. Every college and university has something that makes it unique and special, and your virtual tour should reflect the qualities that make your school stand out.

That said, to create a virtual tour with maximum potential for conversion, you should consider the following best practices:

Narration

The virtual tour should be a guided experience, just like an in-person campus tour. Recruit your current student tour leaders for the role of video campus tour guide, or find a few willing student participants. Having a real student provide the narration will help your prospective students better connect with the content of the tour.

Interactive campus map and controls

The best part of a digital tour is that you can skip to the parts you’re interested in the most. An interactive campus map and controls put your site visitors in charge – exactly how digital users prefer.

Panoramic, feature-rich images

Providing users with even more opportunity to explore on their own, panoramic images deliver breathtaking, encompassing views that can be further explored through exploratory clicks.

Mobile-friendly design

Keep in mind that your school’s virtual tour is almost as likely to be accessed from a mobile device as it is from a desktop. As such, it’s important to gear the experience for mobile use. This includes keeping video and image files as small as possible to keep load times low. Breaking up video into small chunks – a short clip at each location, as opposed to one, long, continuous video – will also help keep the experience lively.

Accessibility

It’s imperative that the development of the virtual tour digital experience take into account web accessibility guidelines. This will ensure that screen readers and other devices that help people access and navigate the internet will be able to do their jobs. Accessibility should be considered in layout and control design. And, don’t forget to include closed captioning for the narrated portions of your tour.

Tracking 

Tracking user interaction with your site can yield tons of information about your target audience. It’s something that you’re probably doing already with other parts of your site. Tracking how visitors navigate to the virtual tour and their subsequent user journeys can help you better understand your user needs and interests. That, in turn, can help you optimize your call-to-actions and provide valued information that drives users to begin the application process.

Beacon Knows Digital Marketing

Want to know how to maximize your investment in a virtual tour? Request a complimentary website audit, and let Beacon digital marketing experts show you how to get the most out of your higher ed website.

4 04, 2019

Get More Students On Campus with Tailored Homepage Content

By | 2019-04-04T12:38:52+00:00 April 4th, 2019|Categories: Google Analytics, Higher Education, Creative Design|Tags: , , , , |

Spring is a popular time for campus visits. In April, campuses everywhere swell with high school upperclassmen, parents in tow, taking part in information sessions and embarking on campus tours. It’s an exciting time, filled with intrigue and possibilities.

A successful spring campus visit season is a result of much hard work, coordination and planning, especially by your school’s admission staff. As the flagship marketing asset, however, your higher ed site also has a lot to do with getting prospective students on-campus.

In the months prior, students and their families scour college websites, looking for insights into a multitude of different campuses. A user experience geared specifically to a prospective student’s interests can go a long way in helping your school stand out from the crowd.

Imagine a prospective student logging on to your homepage and being welcomed by a greeting featuring her first name. Or, an international prospect seeing a welcome image matching his time of day six time zones away.

Personalization is a powerful marketing force. But, tailoring your homepage experience for multiple audience groups can seem like a bit of a daunting proposition.

With a bit of strategic analysis and creative brainstorming, however, the process loses its mystery. All it takes to create an effective personalized web experience is applying what you learn about your audience groups to a slightly more sophisticated tracking setup. After that, you’ll need to teach your website when to fire up the right web experience for the right type of visitor.

Step 1: Identify Your Prospective Student Groups

In order to create a personalized experience, you’ll first need to identify your audience groups. Your admission staff can provide initial guidance on which major prospective student groups exist within your school’s typical applicant pool. Odds are, your school will have one or more of the following prospect groups: high school, international, transfer and graduate.

As the content expert on your school’s website, you’ll then need to identify which collection of pages each distinct prospect group is most likely to frequent. While all prospective students are likely to access admissions and financial aid information, international students, for example, may also visit pages with information about student visas. Transfer students, on the other hand, are likely to be interested in credit transfers.

Identifying the distinct mix of pages for each group is a key part of the process. The wrong step here can lead to confusion on the part of the end-user – or worse, a complete loss of interest. It’s helpful to engage several people in the brainstorming and examine user journeys and needs from as many angles as possible to get the full picture.

Step 2: Segment & Analyze Your Prospective Student Groups

Once the target pages are defined you’ll be able to do two things: 1) analyze historical data for further insights into each group (thru Google Analytics segments), and 2) set up tracking to segment incoming visitors for future analysis (via Google Tag Manager custom dimensions).

Make use of the historical data to confirm the assumptions you may have made about each group earlier in the process. You may also discover additional interests that may not have been obvious before.

Make note of trends in the data, such as geographical location, what other platforms or websites users are coming from and even type of device being used. Details like these will help you further determine what type of content will meet the needs of each group. Use this information to guide the design and creation of each personalized homepage.

Setting up the custom dimensions in Google Tag Manager is what will enable the cueing of the right personalized homepage to the appropriate prospect group.

Step 3: Build Custom Experience for Each Prospect Group

You’ve identified your prospect groups and learned the distinct needs and expectations of each. All that’s left is designing the actual personalized content.

Start small. Custom greetings and introductory text are among the easiest to customize. Once you have put those pieces in place, you can customize by the interests identified in the earlier stages.

High School Prospects 

Give this group lots of student life shots and direct access to on-campus happenings. This is the audience that wants to see that award-winning sunset over the stadium, or the spring festival on the main lawn. Links to a frequently asked questions page and information on housing and majors are also likely to be of importance.

Often, parents or other family members will also be searching with this group. This demographic might be interested in information on cost, class size and selection, campus safety, etc. You might consider adding a panel just geared to this audience on the high school prospect homepage. If this audience segment is large enough, it may warrant its own personalized page.

International Students

These students have a longer journey to campus. In many cases, there are also new language and cultural elements to get used to. This group may need to feel reassured that your school is worth the challenges. These visitors are likely to appreciate content that makes them feel welcome, secure and a part of the campus community.

You may want to feature images of other international students and multi-cultural events on campus. Information about various international communities that may be active in the area will let international prospects know that they are not far from a taste of home.

This group may also be looking for international student visa information, or any special international housing opportunities.

Transfer Students

Transfer students have already been in the college system. They are goal-oriented and in search of a better academic experience than where they came from. This group may be the most primed for a deep dive into the academic choices your school offers.

Greet them with classroom shots, or images of student creations and accomplishments. They are also likely to appreciate quick access to academic programs, transfer and degree requirements, post-graduate employment opportunities and accommodations.

You may also want to add links to extracurricular activities – social, physical and academic – to showcase ways they can get involved on their new campus.

Beacon Knows Custom Audiences

Need help segmenting and tracking your high-value audiences in Google Analytics and Google Tag Manager? Beacon can help. Give us a call, we’ll be glad to talk through your questions.

19 12, 2018

Is Website Personalization Right For Your School?

By | 2018-12-19T13:16:58+00:00 December 19th, 2018|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

This time of year, as students flee campus for winter break, the usual bustle of activity slows considerably. This affords the opportunity for faculty and staff to take a break from the breakneck speed of the semester.

For many institutions of higher learning, this is a good time to explore some new ideas and tactics to meet strategic goals. The end of the calendar year is, after all, a time for reflection and goal setting. For your higher ed marketing team, this may take the form of evaluating your website performance for optimization opportunities, or a discussion about implementing new processes or concepts.

One concept that’s been gaining steam in higher ed marketing for a couple of years now is website personalization. Can a personalized web experience make a difference for your school’s recruiting and marketing efforts?

Website Personalization Explained 

A personalization-enabled website delivers tailored content to visitors, providing a quicker pathway to relevant information and, hopefully, enabling deeper engagement with the site. The assumption behind personalization is that it will promote more loyalty from visitors. And increased consumer loyalty translates to better financial performance.

Traditionally, early adopters of the concept (see: Amazon and Netflix) would create a unique homepage experience for each visitor. The founder and CEO of Amazon, Jeff Bezos, famously said this way back in 1998:

“If we have 4.5 million customers, we shouldn’t have one store. We should have 4.5 million stores.”

Research backs up Mr. Bezos’ affinity for highly personalized web content. And the success of Amazon speaks for itself. For e-commerce websites, personalization has proven effective in improving conversion rates, engagement, customer loyalty and more.

That said, colleges and universities don’t run e-commerce sites. So, what works for Amazon may not necessarily work for your school.

In the higher ed sector, it’s difficult to personalize a web experience to the individual level. For one, schools just don’t have access to the same type of information about students that e-commerce sites are able to collect from their customers. It’s easy for Amazon to come up with unique content for you, specifically, when it can analyze your shopping queries for the last six months (or six years).

Without that level of insight, it’s more prudent to personalize content for a distinct higher ed audience, rather than each individual visitor. If you’re already segmenting your audiences, you have the data you need to begin differentiating your content strategy for each group. There’s a treasure trove of actionable audience data aching to be put to good use.

Implementing Personalization

If you haven’t gone through the audience segmentation process yet, make that the jump off point. You’ll want to start with the obvious groups: prospective students, current students, faculty, alumni, etc. Digging deeper, however, can reveal additional opportunities for personalization. Prospective students, for example, can be further broken up into geographic regions, undergraduate vs. graduate, or by academic interests.

With your groups defined, you’ll need to match each audience group with actions you want them to complete (conversions). For prospective students, that could be submitting a request for information, interest in a campus visit, or downloading an application. This is when tracking comes in – you’ll need to be able to analyze the number of conversions to know if your strategy is paying off.

Another helpful step can be to develop personas for the groups most important to you. Creating a “real” person to embody the needs and goals of the audience group will help you zero in on how these users will want to interact with your site.

Finally, you’ll need to design the personalized experience for each target audience group. This involves identifying the proper calls to action and conversion points, creating the actual content, tasking your development team with building out the needed pages, and making a plan to track performance, evaluate and iterate if necessary.

Beacon Knows Content Strategy

Not sure if personalization can work with your content strategy? Let Beacon help. Our expert team is happy to evaluate your website content and governance structure against your goals. Give us a call today.

27 11, 2018

Cohesion: Key To Great Web Design

By | 2018-11-21T13:51:47+00:00 November 27th, 2018|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

Does this sounds familiar?

You’re exploring a website and click into a major navigation menu item. The new page loads and, suddenly, you feel like you’ve been transported somewhere completely different. Nothing about the experience on the new page ties back to the page you just came from. The type face is different, the navigation menu is completely unrecognizable in both style and selections, the color scheme is brand new, as is the overall page layout. You check the URL… yep, still the same domain.

This confusing experience is replicated surprisingly often across the web. In fact, this issue crops up fairly consistently for colleges and universities, as well as other large organizations.

What gives? It’s 2018! Doesn’t anybody know how to design and maintain a good website?

Putting our incredulity aside, it’s important to remember that the reasons behind a bad user experience aren’t usually intentional. No one sets out to confuse their audience on purpose.

In most cases, a confusing website is just a result of competing needs. Sometimes you need to add a new landing page quickly. Sometimes, staff turnover makes replicating older page templates challenging. Sometimes, you’re asked to try something new and different just to see if it works.

All of these reasons are plausible enough. Also, the web is a fast-moving place. The instincts to evolve, try new things and move quickly are usually the right ones.

That said, nothing on your website should be a one-off. If you want to implement change, you have to have a plan.

Creating & Maintaining a Cohesive Web Design

It should go without saying that a cohesive website design will keep your users engaged, on task and able to replicate their sessions easily and intuitively. So, how can one create and maintain cohesion through the design process and beyond?

The first objective is to create consistency for the user throughout their journey. This is best accomplished by establishing your brand elements and maintaining predictable page layouts and navigation. Predictable doesn’t have to mean boring. You can have a great page, with lots of great, engaging content, that still follows an intuitive layout.

The other on-page elements that you must painstakingly keep constant throughout your site include:

  • navigation menus
  • header and footer
  • type face
  • color palette
  • accent graphics
  • imagery (quality and tone)

There are aspects of your higher ed website that can be tailored to highlight special features of various departments or schools. The above list, however, is absolutely hands off.

Elements of Cohesive Interior Pages

While the homepage introduces your users to your brand, the job of landing and interior pages is to deliver information that your users are searching for and help them complete a specific goal. These objectives are best accomplished by different means, and this should be acknowledged by your design.

Branding is done best through visual elements. As such, homepage design leans heavily on imagery and graphics.

Interior pages are concerned with delivering hard information. As such, the design and layout need to reflect the text-heavy nature of these pages. Branding can be injected through the use of consistent header  and text styles, button colors, voice and tone of the text.

Visual elements, while still very much important, are, nonetheless, a secondary priority – they help break up the text and keep the user’s attention on the page. Despite the reduced emphasis, the visual elements help tie interior pages in with the branding of the rest of the site.

Elements of Cohesive Landing Pages

Landing pages are a cross between the homepage and an interior page. When arriving at a landing page on your higher ed website, your users should feel like they’ve just flipped open to a start of a new chapter in a book. There’s an introductory feel, but also hard information presented for consumption.

Due to the dual-nature purpose of landing pages, they tend to integrate a bit more graphic elements than interior pages. The landing page are really a continuation of the user experience from the homepage. As such, they tend to carry over some of the visual design and interactive elements of the homepage.

Beacon Knows Higher Ed Web Design

Want to know how your higher ed website stacks up? Not sure if you need a refresh or a complete overhaul? Request a complimentary website audit from Beacon’s expert team. We’ll be happy to discuss your most pressing needs.

13 11, 2018

Visual Storytelling: Designing an Effective Homepage

By | 2019-05-03T07:46:09+00:00 November 13th, 2018|Categories: Higher Education, Web Development, Creative Design|Tags: , , , |

Brands are big in our society. Wherever we go – out to dinner, to a concert, for a cup of coffee with a friend – we see branding. In addition to communicating (sometimes) complex ideas, branding is also used as an identifying element. It’s how we know that the store we’re walking in to is the place we mean to be.

The same is true online. We’ve discussed the idea of the website as the centerpiece of higher ed marketing strategy previously. If your website is your digital storefront, how do your visitors know that they’ve come to the right place after typing in your school website URL or clicking on a link?

Of course, the user’s expectation is that they’ve arrived at their intended destination. The homepage, then, first and foremost, needs to confirm that expectation. The easiest way to do that is to lean on your school’s branding.

The homepage is where the user journey starts on your website. For colleges and universities, this is where prospective students gain their first impressions of your school. As a digital doorway onto your campus, the homepage needs to display your institution in a visually striking way that resonates with your future students. It needs to scream your school brand… loudly.

Show Them, Don’t Tell Them

How do you create an authentic brand experience? Making use of compelling campus imagery is a vital first step. The goal is to relay your school’s narrative mainly through visual elements.

Letting your prospective students enter your world via stunning and interactive visuals allows them to become part of your story. They want to see themselves there, reflected in the student body. That’s why shots of students walking through a busy part of campus is such a fixture on higher ed websites.

Aspects that exemplify the personality of your school are also perfect muses for the page. Be it an iconic landscape, a specific department, or a philanthropic spirit, these hallmark additions draw users in and make a big first impression.

Imagery serves as a great alternative to extensive text. While packing your homepage with tons of written information may seem like a good idea, it can actually hurt the overall experience. The job of the homepage is to wow your prospective students, and then guide them to the next step in the recruitment process – campus visits, application, or a deeper dive into the academic offerings.

Make It Easy, And Tell Your Story

You know what prospective students are searching for… maybe even better than they do. So, help them out. Since the homepage is almost always designed for the prospective students, tailor the homepage experience for their needs. Structure the page to match the questions and interests of this audience group.

That doesn’t mean that your campus events are not important. They are. It just means that the homepage is probably not the ideal place to feature the events widget prominently.

The layout of the page should create an easy to follow narrative: This is who we are, this is why you want to be here, here is what you need to get started.

Keeping with the theme of easy, provide direction and navigational guidance for your visitors. Be sure to include CTAs like “Apply Now” or “Schedule A Tour” at appropriate panels throughout the page. Be cognizant of where your buttons are. Placement is key for visibility and engagement.

To ensure you are on target, use Google Analytics data to monitor your CTA engagement levels. You can always tweak the appearance or wording of your CTAs to optimize performance.

Don’t Forget That Your Audience Is Mobile

A lot has been written about adopting a mobile-first approach to website development, including our recent post on the topic. But, what’s the impact on homepage development for higher ed websites?

While online college applications typically get filled out on the bigger screens of desktops and laptops, your prospective students are just as likely to first check out your school website via their mobile devices. As such, the homepage needs to be optimized for the mobile experience.

That doesn’t mean that the homepage should be stripped of any complex functions. It just means that your foundational page elements need to scale easily and efficiently to smaller screen sizes.

Beacon Does Web Design

Feeling overwhelmed? Don’t know where to begin your homepage revamp efforts? No worries, Beacon is here to help. Request a complementary audit from our expert team today.

9 08, 2018

Design Is More Than Meets the Eye

By | 2018-08-09T15:20:34+00:00 August 9th, 2018|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

Undertaking a web re-design can provide the liberating feeling of starting anew, from scratch. But, most of the time, that’s not really the case. Pretty much all of the websites undergoing a re-design still have a base of existing users.

So, while you do want to focus your re-design around fresh, modern and relevant elements, you should make sure that your new website still accommodates your loyal followers.

You can do so by analyzing your Google Analytics data and taking note of the browsers and devices your current users utilize. We’ve parsed GA mobile and audience analysis in an earlier post. These data points can have a significant influence on your design. After all, what good is a shiny, new, website, when it doesn’t display or load correctly on the devices your primary audience use most.

Designing for Mobile

In today’s mobile-heavy society, designing a website using a mobile-first approach is a must. With search engines placing particular emphasis on mobile-friendly capabilities, it’d be foolish to ignore how your website looks through a mobile screen.

That said, while everyone typically buys into the mobile-first approach, as the design/development process stretches out, sometimes the focus shifts to other priorities. Most often, the design approach morphs from mobile-first to mobile-constrained.

What’s the difference?

Instead of the mobile experience driving design, mobile elements (like smaller screen sizes) guide the initial design parameters and then take a back seat to content concerns deemed more important. This is what web design insiders call progressive enhancement — or, a focus on core content first, and adding richer elements that enhance the user experience second.

This isn’t necessarily a bad thing. As long as key elements are geared toward the mobile experience, like responsive templates and main navigation built for smaller screen sizes, you should be in good shape. Just make sure the website works for all the devices your audiences use (yes, even the old ones).

Designing for Browsers

The kind of browsers your website audiences utilize can also impact your re-design. Not everyone automatically updates their preferred browser when new versions come out, no matter how many times the IT guy recommends it. The impact of old browsers can be felt in a couple of ways.

First, older browsers simply won’t be able to support some of the newer design elements  — or, won’t be able to handle them well. If you know that a large portion of your users relies on an outdated version of a browser, that can limit your design choices and nix that really cool feature that you wanted to include.

One tool that developers use in cases like this is caniuse.com. This site allows users to see what versions of browsers support a particular feature through a simple search.

The other concern with outdated browsers is security. Browser updates are often issued in order to patch up vulnerabilities in the underlying code. If users don’t update their browsers they don’t just leave themselves exposed, they spread the risk to the entire ecosystem.

One way to protect your site is to remind user to update their outdated browser via an “old browser alert.” A pop-message can be set to trigger anytime a user with a vulnerability logs onto to the site, and encourage them to update.

Lately, coders have even made an effort to encourage users to update their browsers in order to protect not just themselves, but everyone else, too.

Beacon Knows Web Re-design

If you’re observing declining traffic or cratering conversion metrics on your website, it may be time to consider an overhaul. Request a website audit by our knowledgeable digital marketing team and see how you’re doing.

29 11, 2017

Sean Connery’s 5 Design Elements That Make Sites Look Outdated

By | 2017-11-08T13:28:06+00:00 November 29th, 2017|Categories: Creative Design|Tags: |

How do you know when your website looks outdated and needs a refresh? When your engagement metrics slide, that’s a pretty good indicator. Sometimes, it’s even more obvious than that.

Such is the case with the website of a well-known celebrity. It’s the perfect example of a digital public face in dire need of cosmetic surgery.  Or a car wreck you can’t turn away from. This, in a nutshell, is SeanConnery.com.

As a public service, I offer my observations to you and the beloved actor. In the interest of pure fun, each anecdote references a famous James Bond quote. Guess the movie and win a prize. (Mr. Connery, you don’t qualify).

Without further ado, I bring you the 5 design elements that make any site look outdated:

#1 Design Layout

“Well, one of us smells like a tart’s handkerchief.”Sean, I hate to be the one to break it to you but it’s you. The layout you’ve chosen is right out of the 1970’s. The design is anchored in the upper left corner. Its three column layout with two side gutters is positively nostalgic. That’s not a good thing, Sean. The type becomes very small and hard to read. The URL is in the header. I haven’t seen anything like it since the McCarthy hearings.

#2 It’s Not Responsive

“Good morning, gentlemen. ACME pollution inspection, we’re cleaning up the world, we thought this was a suitable starting point.” – All the top Hollywood gossip sites are mobile friendly, which should tell you all you need to know about this audience’s behavior, Sean.  If I were assigned with ridding the internet of digital pollution, I’d start here.

#3 No Video

“Ejector seat? You’re joking!” – You’ve appeared in over 60 films, won an Academy Award and 3 Golden Globes. And yet Mr. Connery, you have no video on your site. You must be joking. Video drives engagement. You need the attention. You’re not exactly getting a lot of parts these days. Where’s the paparazzi when you need ‘em? Probably on YouTube.

#4 No Social Media

“Do you mind if my friend sits this one out? She’s just dead. – Celebrities thrive on attention. In this day and age, there are no better or more necessary channels than social media outlets such as Facebook, Twiiter, Snapchat and Pinterest. Hell, Pierce Bronsnan has a social media presence and he can’t act his way out of a paper bag.

#5 The Website Requires Flash

“Red wine with fish. Well, that should have told me something.” – Yes, it’s a website with Flash. That’s the software Adobe will discontinue in 2020. ‘Nuff said.

 Just Say Dr. No.

If SeanConnery.com reminds you, dear reader, of your website, just say “no”. It’s time for a redesign. NOW. If you have any questions on anything above, wish to add a comment or contribute another example of web atrocities, please leave a comment or email me here.

Answer key to quotes above:

#1 Diamonds Are Forever

#2 Diamonds Are Forever

#3 Goldfinger

#4 Thunderball

#5 From Russia With Love

30 06, 2017

Top 5 Accessibility Items to Review in a Website Redesign

By | 2017-07-17T07:14:26+00:00 June 30th, 2017|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

Accessibility is a hot topic and an expansive one, too. I’ve been preparing for some upcoming speaking engagements with accessibility being the main focus. The first of these engagements is the eduWeb Digital Summit on August 6-10. This seems like a good time to share some thoughts regarding accessibility, WCAG guidelines and 508 compliance.

Additionally, I’d like to leave you with a list of 5 important accessibility items to review while in the midst of your next site redesign.

Accessibility Overview

Often, when administrators or oversight committees are asked to consider website accessibility while planning their institution’s website redesign, they think only in terms of addressing under-served users such as the elderly or visually disabled. Accessibility doesn’t simply address the needs of the disabled user. Adaptations and modifications made to address under-served users have broader implication, frequently enhancing the experience for all users. Designers and developers understand this and design with the idea that what is good for one is most often to the benefit of all.

Accessibility almost always enhances a website’s usability.

For example, incorporating design for those with diminished motor skills is always a good idea. It will enable all users to view your website without having to use a mouse. By doing so, you’ve also made it easier for any user to navigate the site and spend some time there. User engagement improves and, if you’re operating an online storefront, sales go up as well.

It goes without saying that any and all websites should factor accessibility into their design. To that end, WCAG recommendations and 508 standards have been established as guidelines to ensure a positive user experience for all. These guidelines have peripheral benefits, as they often overlap with best practices for mobile design and SEO. Still, there are many, many sites that remain inaccessible to a large number of users even today.

5 Accessibility Items to Review

With this in mind, I’ve comprised an abbreviated list of important accessibility items to consider when redesigning one’s website. Bear in mind that while I’ve listed 5 important accessibility items, this list is hardly complete and is meant only to provide a high level overview of what’s involved. Consider:

  1. Clear and Logical Design – This includes clear and intuitive navigation, contrast between text and backgrounds, proper use of color and more.
  2. CMS that Supports Accessibility – You’ve already considered functional requirements. Not all content management systems meet WCAG accessibility requirements. Know this from the start.
  3. Content Structure – Use headings and lists so as to clearly organize information. Use clear title attributes and page titles. Consider skip navigation for users of screen readers.
  4. Keyboard Accessible Functionality – Users with motor skill deficiency depend on keyboard accessibility to navigate your site. Other users benefit from added efficiency thanks to keyboard accessibility guidelines.
  5. Accessible Forms – Using JavaScript in forms often means that they are not accessible by keyboard alone. Testing your forms for keyboard accessibility is an imperative.

Once the items listed above have been fully considered and incorporated into the new design, the all-important testing phase begins.

Testing for Accessibility

Accessibility and usability are undeniably congruous. The benefits extend beyond just the user experience and into SEO and mobile performance. So take the time to test and test again. It’s time well invested. Fortunately, the WC3 provides a list of recommended web accessibility evaluation tools.

A Few Final Words

I look forward to seeing many of you at the upcoming eduWeb conference in August. I’ll discuss the topic of accessibility in more detail at that time. In the meantime, please comment below. Share your thoughts and experiences. We’ll pick up where we left off at the conference. See you then.

Load More Posts