wordpress web project - kate...
TRANSCRIPT
WORDPRESS WEB PROJECT
Information Architecture and User Experience Recommendations
February 19, 2014 Kate Winsor
The Digital Status Quo
“…the evolution of mobile, social, video and Web publishing are transforming the way higher education engages students online. There's a growing sense of urgency from higher education leaders I talk to that the digital status quo is unacceptable.”
-Jeff Cam, Why Are Colleges Flunking Web Strategy 101? http://www.fastcompany.com/1694328/why-are-colleges-flunking-web-strategy-101
2
Site Goals for the End User
Easy access to information that is important to the user
Easy to navigate, informational and transactional Clear and concise, easily search-able, things
grouped by content, very few clicks to get from point A to point B, don’t split up information
Up-to-date information Encourage users to take action
3
Information Architecture Process
Create inventory of existing content Review current analytical data Analyze competitors and review other higher education
websites Create a new, efficient site structure that is easy to
maintain Reallocate content pages to new site structure Make content easily accessible:
Content should follow a logical and intuitive path Grouped so that the hierarchy is balanced and uncluttered
Create consistencies among college content
4
Browser Traffic Screen Resolutions Most Visited Pages
Google Analytics 5
Browser Traffic: Jan 1, 2013 to Feb 1, 2014
Internet Explorer Chrome Safari Firefox Android Browser Mozilla Safari (in-app) IE with Chrome Frame Amazon Silk Opera
6
Internet Explorer 40%
Screen Resolution: Jan 1, 2013 to Feb 1, 2014
1366x768 1280x800 1440x900 1920x1080 1280x1024 1024x768 1600x900 1680x1050 768x1024 320x480
1366x768 27%
320x480 5%
7
Top 25 Pages: Jan 1, 2013 to Feb 1, 2014
Page Pageviews / 3,543,437 /current-students/ 1,538,495 /faculty-staff/ 357,409 /email.shtml 341,948 /future-students/ 149,901 /degrees.shtml 138,464 /services/counseling/resume/phrases.html 128,735 /future-students/onlinedegrees.shtml 85,619 /services/museums/miles-mineral/diamond.shtml 61,064 /academics/class-schedule/ 57,357 /future-students/applyNow.html 46,516 /academics/library/index.shtml 46,358 /about/directory/people-search.php 44,914 /future-students/tuition/index.shtml 38,747 /academics/library/periodicals.shtml 36,570 /calendar/ 35,642 /academics/resources/degrees/degree-plans.shtml 34,823 /current-students/important_dates.html 34,521 /services/counseling/student/index.php 32,766 /services/hr/ 30,969 /academics/assessment/faculty/manual/verb_list.shtml 26,321 /mba/online/index.shtml 23,602 /athletics/index.php 23,333 /mba/online/degree-plan-requirements.shtml 20,291 /parents-visitors/ 19,938
8
New Mexico Highlands University Western New Mexico University New Mexico State University University of New Mexico New Mexico Tech West Texas A&M Texas Tech Wayland Baptist Lubbock Christian University
Competitors 9
Main Navigation
Staying somewhat consistent with most college’s site navigation decreases site learning curve.
10
Secondary Navigation 11
Sitemap Information Architecture Content Strategy Wireframes Wordpress Template
New Site Recommendations 12
Sitemap * Please keep in mind that a sitemap does not indicate page flow.
13
New Information Architecture
Existing content has been re-distributed to new architecture
This content will need to be reviewed with stakeholders for accuracy and be refreshed as needed Content can also be re-organized or flagged for
removal Recommend only three levels of navigation, exclusive of
in page body links
14
15
How You Can Use This IA
Future content planning, long-term strategy Track content updates needed for launch Track delivery of content from various team
members for launch Facilitate section reviews with stakeholder groups Track and remove out-of-date or incorrect content
pages
16
New Site Requirements
Wordpress Content Management System Responsive/mobile friendly ADA compliant SEO optimized
17
Site Content Strategy
Take the focus off the entry and exit pages Home Page, Request Information and Apply
The “middle” contains pages that are highly influential in the journey and decision process
Show users WHY Why visit Why apply Why attend Why give
Showcase people, programs and proof
18
Topical/Thematic Overlay
Every school has signature features that truly differentiate it from other schools. Celebrate them.
Personal Touch Affordable Community and belonging Success
19
Homepage
Large, very visual featured content area focused on key themes and messaging Show students what they can do with
an ENMU education Highlight students who attend ENMU Showcase faculty who work at ENMU Be transparent about what it is like to
attend ENMU Showcase campus and location
Three calls to action to drive the user to act
Use syndicated and dynamic content, like news, events and social media while being flexible when sourcing content for these areas
Fat footer with commonly accessed links
20
Homepage, Responsive View
Dubbed the “mostly fluid” responsive design pattern by Luke Wroblewski, the multi-column layout scales from large screens down to small screens by stacking columns vertically in its narrowest incarnations. The core structure of the layout does not really change until the smallest screen by using fluid grids to adapt to a variety of screen sizes:
21
Degree Programs
Create one central location for all degree information All college sites will link to this page
Take responsibility off individual programs for maintaining content
Supplement degree plan documentation with value-added content: Program description Career areas Popular minors
Present content that relates topically without forcing the user to jump all around the site
Include advisor contact information and a contact form
Best in class examples: http://www.smcvt.edu/Academics/
Majors-Minors-and-Curriculum/Accounting.aspx
http://www.clemson.edu/majors/marketing
22
Visit
Getting a prospective student on campus for a tour significantly increases the likelihood of enrollment
Build excitement around the campus visit before the prospective student arrives
Use this opportunity to differentiate the campus visit Informational Experiential Transactional
23
Visit
Make the form great.
And mobile.
Help the planning process. Show off some of the great things to do in Portales other
than visit the campus.
A visit section instead of one long page. Let the student know what to expect, when
the sessions are and who will be showing them around.
Informational Experiential Transactional
24
Social
Integrate with a social strategy, not just randomly
Keep users on the site: Include dynamic student feeds in the
Student Life section
Flickr/Instagram feed of crowd sourced campus photos
25
Footer
Persistent on very page Add visit to the footer High-value page links Contact form for quick information requests
26
College Sites
Streamline content across all colleges by creating consistent site structures
Visually differentiate college sites from university site
Highlight departments and faculty, college accomplishments and programs
27
Template: Avada
http://theme-fusion.com/avada/
To ease the burden of development, allow the communications team to focus on content and meet the launch deadline, purchasing Wordpress template that comes with many built-in features is recommended. This will ensure a quality product in a short amount of time, will assist developers who are unfamiliar with the Wordpress engine, and standardize coding.
The Avada template is recommended for its robust features, fully customizable template and clean design.
28
Why Use Avada Template
Easy installation and setup Fully responsive and touch enabled Completely customizable Cross-Browser Compatibility: FireFox, Safari, Chrome, IE8, IE9, IE10 Built with HTML5 and CSS3 60 Layered PSDs for customization SEO optimized Advanced administrative controls Shortcode builder Extensive documentation and support
http://theme-fusion.com/avada/why-avada/
29
Additional Resources
http://www.insidehighered.com/news/2010/08/04/websites http://www.slideshare.net/ThePrimacy/improving-the-top-five-high-
value-pages-of-your-website http://www.slideshare.net/ThePrimacy/primacy-igxuc13-usingtopics http://collegewebeditor.com/blog/index.php/archives/
2011/11/16/top-first-responsive-websites-in-highered/ http://www.slideshare.net/cgrymala/word-press-in-higher-ed http://wphighed.org/category/site-gallery/ http://kelchenoneducation.wordpress.com/2013/06/19/the-vast-
array-of-net-price-calculators/ http://www.slideshare.net/epublishmedia/making-better-decisions-
with-web-analytics-4342776
30
THANK YOU!