Redesigning Your Site For a Better User Experience

Preview:

Citation preview

Redesigning Your Site for a Better User Experience

BySylvia Nicosia

Director of Web Programming & DevelopmentFarmingdale State College

Two Major Web Redesigns Since 2011

2012 2015

Right After Going Live in 2015...

Admission Inquiries

down 22%

General Information

inquiries down 14%2014 2015

0

50

100

150

200

250

300

350

400

450

500

AdmissionsGeneral Information

The Secret For Our Success1. COMMUNICATION2. Smart Content Contributors 3. Right Tools4. Awesome Team5. Time

5) Time

T A K E Y O U R T I M E

4) Awesome Team• VP for Institutional Advancement• Senior Director of Communications• Director of Web Programming &

Development• Creative Director• Digital Media Manager• Graphic Designer• Photographer• Junior Programmer/Work Study

But most important…

3) The Right Tools

Quantitative - Google Analytics, The “What”

• How is the audience accessing our content? • Filters by IP Address.• Review pages by device.• Review landing pages and bounce rate.• Review search queries on internal and external search

boxes.

Information from Internal & External Audience for all Navigation

Qualitative Data to Backup Information Architecture

Data collected through “Contact Us” form for a period of two years.

farmingdale.edu/about/contact-us.shtml

Data Analysis Over 3,000 submissions reviewed. Repetition dictated location for

navigation. Categories became the areas for the

navigation system: Global, Local, Left Menu, Top Landing pages, FAQ page.

Data that provides the “Why”

Give Users What They Need… Search Tool A-Z Links

FAQ Page

Back To Top Button

Global Navigation Secondary Navigation Left Menu Footer

Campus Directory Faculty Pages Not What

They Want!!

How?Goals from Quantitative and Qualitative Analysis:1. Concentrate on a simple design/layout that

WORKS as intended.2. Provide most sought information within reach,

one and two-click max from any page.3. Provide tools to navigate and find any

additional information.

Final Information Architecture

Global Navigation – Top Links

Most viewed FSC pages for internal and external audiences. 15 most popular pages from Google Analytics in dropdown,

grouped according information from contact us form (i.e. Admissions, Orientation).

Next 35 Popular Links Went to Landing Pages

General information about admission to Farmingdale, regardless of department.

Specific information about the admission process, from the Admissions office.

Secondary Navigation Top 5 links from both internal and external

audiences, regardless of device.

Footer = General Information Important information from the

institution. Calls to action

FAQ Page = Repetitive Data from Contact Us Form Repetitive

inquiries ended up on FAQ page.

Anything Else: A - Z Links PagePlus: Global & Local

Search Box. Dynamic Back to

Top button for easy navigation

2) Smart Content Contributors Make them smart by teaching them right! A Year and a half of constant training to

prepare them for a new Website and a new version of our CMS.

Mandatory workshops from 2014 to 2015. Those who did not attend lost publishing privileges.

Content Migration, a Team Effort Content Contributors worked closely

with the Office for Institutional Advancement cleaning content before and after migration.

A second revision of content underwent a week before going live.

1) Communication

Image Source: http://jameswooddesign.blogspot.com/2011/04/star-wars-lego-campaign-poster.html

“Communication is the key element of a successful and timely CMS implementation”

- Marcel Ayers, Director of Implementation, OmniUpdate

http://blog.omniupdate.com/posts/2015/best-practices-for-implementing-a-cms.html

Constant Communication with Campus

Results…

Data from 2014 & 2015 shows…

2014 20150

50

100

150

200

250

300

350

400

Admission to FarmingdaleAlumni RelationsCareer DevelopmentCommencementFinancial AidInternational StudentsOrientationOther/UnsurePolice (parking)RegistrarStudent AccountsTransferringUse of FacilitiesWebsite/Mobile

Tracking User Behavior Through Goals with Events

More Goal Conversions

Happier Content Contributors :D

Empowered With ONLY What They Need

ALL Content Contributors with Level 1 Toolbar Only 5 users with HTML out of 133

Yay

Choice of RED or GREY text Choice of BLUE or GREY background Additional icons added on a single basis Too many icons gave users way too many ideas…

Nay - Absolutely NOT to the Following:

1. Restore Auto-Saved Content2. Underline3. Strikethrough4. Indents5. Alignment6. Font Family7. Font Size8. Font Color9. Background Color

10. Insert/Embed Media11. Special Characters12. Cleanup Messy Code13. Show/Hide Guidelines/Invisibles14. Show/Hide Block Elements15. HTML16. Code Protect17. Form Tools

Content Contributors Are NOT Designers

“Make something sweet with your content”

Here’s Your Toolbar

And the Result is This…

And Leaving Their Directory Like This:

Wouldn’t it be better…

Tell them Exactly What to Doand Give them the RIGHT Tools?

Here’s Your Toolbar

The Result:

And Their Directory :D

Before with Full Toolbar:

After “Enhanced” Toolbar

Before…

After…

Before… After…

Before… After…

= Paste as Plain Text ONLY

Give Them The Tools To Do Their Job

farmingdale.edu/ou-training/snippets.shtml

To Wrap Up5. Time: Don’t rush.4. Team: Detach yourself.3. Tools: Research & test. Support.2. Content Contributors: Empower them!1. Communication: All levels, at all times.

Questions

???

Contact InformationSylvia E. NicosiaDirector of Web Programming & Development@synicosiasylvia.nicosia@farmingdale.edu