COMPELLING WEBSITE BEST PRACTICES

FOR 2016
Ben Hoekstra

SIMPLICITY AND MINIMALISM

o
o
o
o
o

o
o

users are more perceptive, less patient, and clutter only slows them
downi.
simpler sites are faster at gratifying users. Simplicity is not just a
fashion: its the future. Expect it to only continue ii.
Typography used ofteniii and effectivelyiv with greater emphasis nowv
Contrastmay use white background to achieve vi
Negative space: Negative space serves to manipulate the users
visual flow. As a rule, the more negative space around an element, the
more the eye is drawn to itvii
Move away from texturesviii
Break down what you offer into bite-sized categories ix

Flat designno 3D effectsx or drop shadowsxi

BOWLING GREEN STATE UNIVERSITY
o Toned down use of colorxii
o 68% of web professionals said flat design is here to stay xiii

SIMPLE NAVIGATION
o

o
o

Hidden navigation menus have become increasingly popular,

especially as they can be used to save screen space. xiv
Hamburger iconxv--particularly interesting as it looks like the 3bar flipped on its side.
More than 4 clicks for significant info is unlikely xvi
Scrolling vs. Click
Tendency in 2015 towards scrollingxvii
Death of above the foldxviii

Follow the user journey: check the main tasks for each of your
audiences.xix

USE OF EMBLEM
o

Geometric elements to frame images or draw attention to specific

elementnot as backgroundxx

WWW.BGSU.EDU/STUDENTS

USE OF INFOGRAPHICS
o
o
o
o

Improve user experiencexxi

Color gains readership by 80%xxii
Can go viralxxiii
SEO aidxxiv
they [infographics] even generate more backlinks than most
other link building tactics on the Web. xxv
infographic search volumes have increased by over 800
percent in just over two years. xxvi
Examples of 10 best: http://blog.hubspot.com/marketing/bestinfographics-2015

USE OF VIDEO
o
o

Light-hearted and musical can be compelling:

http://www.bgsu.edu/fly
Feature on About Us page to get feel for school xxvii

HOVER EFFECTS AND ANIMATION

o

Animation and interaction coming backxxviii

o Hover effects give a more intuitive feel to a site as users mouse over
content.xxix

DIRECT COPY
o
o
o
o
o
o

Simple and clear taglinexxx

Call to actionxxxi
Simple and direct taglinexxxii
dont bury valuable, potentially persuasive, data in a long, dense
paragraph.xxxiii
Direct paths to academic programs, costs and scholarships xxxiv
Clearly show the application deadlines, and offer a step-by-step
description of the application process. xxxv

SCREEN WIDE PHOTOS

High qualityxxxvi-- 67% of ecommerce consumers say Quality of Product
Photography is Very Important in their purchasing decisions xxxvii
o oversized photographs add a comforting touch of familiarity without
dominating the foregroundxxxviii.
o Top photo largest component, rest of content to follow xxxix
General Photo Use
o prospects follow directions 323 percent better when there are
images.xl
o Feature well-known faces
o

Story/Personal

Focus
o Allo
w students to
contribute/produce contentxli
More

compelling
Shows trust and value of students
Searchability
o Intuitive internal search engine helps turn prospectives from searching
external sites to learn about the schoolxlii
o Search by alphabet or interestxliii
Mobile First as Norm
o 2014 mobile access of web outpaced traditional xliv
o 48% of users felt if website worked poorly on mobile that company did
not care about their businessxlv
Parallax
o Conflicting opinions: Positive
Show in 3D, can be compellingxlvi
Considering whether adds to sites personality xlvii (Example of
positive useCitrus Diner)xlviii
o Conflicting opinions: Negative
Parallax is not always compelling for users after the first few
minutesxlix, and the trend is tapering offl.
Not time to join the trend.

BACKGROUND RESEARCH AND CONTENT

Four Rhetorical Visions in Choosing a School

Communications scholars Craig and Barnes cite three reasons why

students choose a college.
The first is the righteous vision- the school is reputable and
prestigious, and its programs are well-known and well-regarded.
The second is the social vision- students can envision themselves
there. They feel like they belong, they can have fun at this school,
and they can make friends.
The third is the pragmatic vision- students believe they will be able
to get a job upon graduation. These three visions are cited as the
three reasons why someone would choose a school.
o In conversations with Pastor Bill, he mentioned perhaps there would be a
fourth- a formational vision of sorts. Students choose a school based on
the kind of person they want to become, who they want to be.
The Distinction between Innovative and Creepy
o Protect privacy (using common senseif it would creep you out, dont do
it)li
o Taking care with real-time response or anticipationlii
o Wording
o Example of creepy (pictured on right)
o

CREEPY

INNOVATIVE

i http://delighten.co.uk/7-future-web-design-trends/
ii http://delighten.co.uk/7-future-web-design-trends/
iii http://internet.com/web-design/web-design-trends-2015-simplicity-and-minimalism/
iv http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
v https://www.digitalpulse.pwc.com.au/infographic-web-design-trends-2015/
vi http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
vii http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
viii http://piktochart.com/5-design-trends-in-2015-you-could-use-for-inspiration/
ix Miller, Donald. 5 Things Your Website Should Include.
xhttp://www.business2community.com/online-marketing/5-web-design-trends-in-2015-you-should-knowabout-01321841#tml1sihf1RVWTSBC.97

xi http://internet.com/web-design/web-design-trends-2015-simplicity-and-minimalism/
xii http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
xiii https://www.digitalpulse.pwc.com.au/infographic-web-design-trends-2015/
xiv http://www.awwwards.com/6-web-design-trends-you-must-know-for-2015-2016.html
xv http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
xvi http://internetdevels.com/blog/web-development-trends-2015
xvii http://internetdevels.com/blog/web-development-trends-2015
xviii http://delighten.co.uk/7-future-web-design-trends/
xix http://www.nngroup.com/articles/university-sites/
xx http://piktochart.com/5-design-trends-in-2015-you-could-use-for-inspiration/

xxi http://internetdevels.com/blog/web-development-trends-2015
xxii http://www.office.xerox.com/latest/COLFS-02UA.PDF
xxiii http://www.youradsquad.com/9-reasons-why-your-business-should-be-using-infographics-in-2015/
xxiv http://www.youradsquad.com/9-reasons-why-your-business-should-be-using-infographics-in-2015/
xxv http://thenextweb.com/insider/2015/07/29/why-infographics-are-the-secret-to-super-seo/
xxvi http://thenextweb.com/insider/2015/07/29/why-infographics-are-the-secret-to-super-seo/
xxvii http://www.nngroup.com/articles/university-sites/
xxviii http://delighten.co.uk/7-future-web-design-trends/
xxix http://www.awwwards.com/6-web-design-trends-you-must-know-for-2015-2016.html
xxx Miller, Donald. 5 Things Your Website Should Include.
xxxi Miller, Donald. 5 Things Your Website Should Include.
xxxii Miller, Donald. 5 Things Your Website Should Include.
xxxiii http://www.nngroup.com/articles/university-sites/
xxxiv Johnson, Bob. Evaluating Your Institutional Website.
xxxv http://www.nngroup.com/articles/university-sites/
xxxvi http://delighten.co.uk/7-future-web-design-trends/
xxxvii https://www.digitalpulse.pwc.com.au/infographic-web-design-trends-2015/
xxxviii http://thenextweb.com/dd/2015/06/09/7-pillars-of-minimalist-web-design/
xxxix http://piktochart.com/5-design-trends-in-2015-you-could-use-for-inspiration/
xl http://www.youradsquad.com/9-reasons-why-your-business-should-be-using-infographics-in-2015/

xli http://www.nngroup.com/articles/university-sites/
xlii http://www.nngroup.com/articles/university-sites/
xliii Johnson, Bob. Evaluating Your Institutional Website.
xliv http://internetdevels.com/blog/web-development-trends-2015
xlv https://www.digitalpulse.pwc.com.au/infographic-web-design-trends-2015/
xlvi https://www.digitalpulse.pwc.com.au/infographic-web-design-trends-2015/
xlvii http://www.awwwards.com/6-web-design-trends-you-must-know-for-2015-2016.html
xlviii http://www.citrusdiner.com/#home
xlix https://www.usertesting.com/blog/2015/04/16/parallax-scrolling-engaging-or-annoying/
l http://www.sitepoint.com/peril-perk-designing-with-parallax/
li https://www.dexmedia.com/blog/golden-rule-online-marketing-dont-creepy/
lii https://www.dexmedia.com/blog/golden-rule-online-marketing-dont-creepy/