USER-CENTERED DESIGN
WEBSITE DESIGN amp DEVELOPMENT
User-Centered DesignPage 1
Our User-Centered Process
The UO Digital Communications team follows a user-centered design process that seeks to engage end-users in all stages of design and development From understanding requirements to testing out designs we work with you your users and stakeholders to find answers to the following questions
bull Who is your primary target audiencebull Why are they visiting your website What are they trying to accomplishbull How do their environment attitudes and prior experiences impact their expectations of your sitebull How do users refer to and think about your content
A deep understanding of your end usersrsquo needs will enable you to make strategic data-driven decisions about your website content navigation and design
WHATrsquoS INVOLVED IN OUR USER-CENTERED DESIGN PROCESS
While each project is unique our user-centered design process follows these basic phases
bull Discovery ndash During the discovery phase we seek to understand what both your end-users and your department requires for success
bull Conceptual Design ndash This phase focuses on creating effective and engaging content structure and site navigation to support user and departmental needs
bull Visual Design ndash We work with you to select templated design elements that support your content messaging and user tasks
bull Development ndash Staging sites are made available for your team to input and test content before launchbull Launch - Make your website live and make sure itrsquos functioning properlybull Implementation ndash After site launch we assist you in validating usability and measuring outcomes
PROJECT KICKOFFWEBSITE DESIGN amp DEVELOPMENT
Project KickoffPage 1
Project KickoffBuilding a Shared Vision
Nothing can derail a project quicker than unclear requirements and conflicting goals Thatrsquos why we kickoff all our web projects by asking our clients to answer these ten basic questions
SCOPE
bull Is this a redesign or a completely new websitebull If redesign what are the URLs for the websites which must be included in this project
GOALS amp OBJECTIVES
bull What is the purpose of your websitebull What actions do users need to perform on your site for your department to achieve its goalsbull What measurable outcomes will indicate that this project is a success (eg increased web traffic more
applications submitted more appointments made positive feedback etc)
STAKEHOLDERS
bull Who needs to be involved in this project and in what capacitybull In what capacity will or do your internal staff use this website
TARGET AUDIENCE
bull Who is your primary target audiencebull Why does this audience seek out your services
TASKS AND CONTENT
bull What are the key tasks your primary target audience wants to accomplish on your sitebull What questions or complaints do you hear the most often about your services
These basic questions act as a template to jumpstart more detailed conversations about project planning objectives target audience and content
ANALYTICS amp EXISTING DATA
WEBSITE DESIGN amp DEVELOPMENT
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
User-Centered DesignPage 1
Our User-Centered Process
The UO Digital Communications team follows a user-centered design process that seeks to engage end-users in all stages of design and development From understanding requirements to testing out designs we work with you your users and stakeholders to find answers to the following questions
bull Who is your primary target audiencebull Why are they visiting your website What are they trying to accomplishbull How do their environment attitudes and prior experiences impact their expectations of your sitebull How do users refer to and think about your content
A deep understanding of your end usersrsquo needs will enable you to make strategic data-driven decisions about your website content navigation and design
WHATrsquoS INVOLVED IN OUR USER-CENTERED DESIGN PROCESS
While each project is unique our user-centered design process follows these basic phases
bull Discovery ndash During the discovery phase we seek to understand what both your end-users and your department requires for success
bull Conceptual Design ndash This phase focuses on creating effective and engaging content structure and site navigation to support user and departmental needs
bull Visual Design ndash We work with you to select templated design elements that support your content messaging and user tasks
bull Development ndash Staging sites are made available for your team to input and test content before launchbull Launch - Make your website live and make sure itrsquos functioning properlybull Implementation ndash After site launch we assist you in validating usability and measuring outcomes
PROJECT KICKOFFWEBSITE DESIGN amp DEVELOPMENT
Project KickoffPage 1
Project KickoffBuilding a Shared Vision
Nothing can derail a project quicker than unclear requirements and conflicting goals Thatrsquos why we kickoff all our web projects by asking our clients to answer these ten basic questions
SCOPE
bull Is this a redesign or a completely new websitebull If redesign what are the URLs for the websites which must be included in this project
GOALS amp OBJECTIVES
bull What is the purpose of your websitebull What actions do users need to perform on your site for your department to achieve its goalsbull What measurable outcomes will indicate that this project is a success (eg increased web traffic more
applications submitted more appointments made positive feedback etc)
STAKEHOLDERS
bull Who needs to be involved in this project and in what capacitybull In what capacity will or do your internal staff use this website
TARGET AUDIENCE
bull Who is your primary target audiencebull Why does this audience seek out your services
TASKS AND CONTENT
bull What are the key tasks your primary target audience wants to accomplish on your sitebull What questions or complaints do you hear the most often about your services
These basic questions act as a template to jumpstart more detailed conversations about project planning objectives target audience and content
ANALYTICS amp EXISTING DATA
WEBSITE DESIGN amp DEVELOPMENT
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
PROJECT KICKOFFWEBSITE DESIGN amp DEVELOPMENT
Project KickoffPage 1
Project KickoffBuilding a Shared Vision
Nothing can derail a project quicker than unclear requirements and conflicting goals Thatrsquos why we kickoff all our web projects by asking our clients to answer these ten basic questions
SCOPE
bull Is this a redesign or a completely new websitebull If redesign what are the URLs for the websites which must be included in this project
GOALS amp OBJECTIVES
bull What is the purpose of your websitebull What actions do users need to perform on your site for your department to achieve its goalsbull What measurable outcomes will indicate that this project is a success (eg increased web traffic more
applications submitted more appointments made positive feedback etc)
STAKEHOLDERS
bull Who needs to be involved in this project and in what capacitybull In what capacity will or do your internal staff use this website
TARGET AUDIENCE
bull Who is your primary target audiencebull Why does this audience seek out your services
TASKS AND CONTENT
bull What are the key tasks your primary target audience wants to accomplish on your sitebull What questions or complaints do you hear the most often about your services
These basic questions act as a template to jumpstart more detailed conversations about project planning objectives target audience and content
ANALYTICS amp EXISTING DATA
WEBSITE DESIGN amp DEVELOPMENT
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Project KickoffPage 1
Project KickoffBuilding a Shared Vision
Nothing can derail a project quicker than unclear requirements and conflicting goals Thatrsquos why we kickoff all our web projects by asking our clients to answer these ten basic questions
SCOPE
bull Is this a redesign or a completely new websitebull If redesign what are the URLs for the websites which must be included in this project
GOALS amp OBJECTIVES
bull What is the purpose of your websitebull What actions do users need to perform on your site for your department to achieve its goalsbull What measurable outcomes will indicate that this project is a success (eg increased web traffic more
applications submitted more appointments made positive feedback etc)
STAKEHOLDERS
bull Who needs to be involved in this project and in what capacitybull In what capacity will or do your internal staff use this website
TARGET AUDIENCE
bull Who is your primary target audiencebull Why does this audience seek out your services
TASKS AND CONTENT
bull What are the key tasks your primary target audience wants to accomplish on your sitebull What questions or complaints do you hear the most often about your services
These basic questions act as a template to jumpstart more detailed conversations about project planning objectives target audience and content
ANALYTICS amp EXISTING DATA
WEBSITE DESIGN amp DEVELOPMENT
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
ANALYTICS amp EXISTING DATA
WEBSITE DESIGN amp DEVELOPMENT
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Analytics and Existing Data Page 1
Analytics and Existing Data Use What You Know
You probably already know a lot about your target audiences Perhaps you speak with your users on a daily basis answer phone calls emails or form submissions Maybe yoursquove conducted focus groups to gain deeper insights into their thoughts and behaviors Regardless of the approach this information is invaluable when it comes to understanding what users want and expect from your services
At the beginning of each website project we ask you to look at the following to begin building a picture of your target audiencesrsquo needs and behaviors
bull Phone or emails logs bull Website feedback bull Previous user studies (interviews focus groups etc) bull Website analytics
This information allows you to establish a baseline against which to measure the future performance of your website and build an understanding of who is visiting your site what they are trying to achieve and how you can design your site
WEBSITE ANALYTICS
Many UO websites have analytics set up to monitor visitor traffic Examining your analytics data at the be-ginning of a project allows you to understand basic user behavior such as where users enter your site which pages they visit and how long they stay
Understanding your current analytics
Web analytics have their own language Here are some basics to help you interpret your site analytics
What is Bounce Rate
Bounce Rate is when visitors to the website enter through a page and then exit from that same page without visiting a second page Bounce Rate is calculated by dividing bounces (exiting without viewing a second page) into entrances Examples When a user types a different URL hits the back button out of your site closes the window or clicks on an external link
The Bounce Rate relates directly to the entrances to that page To be considered a bounce someone has to go directly to that page and directly leave your website without going to another page So if your webpage has 10000 page views but only 5000 entrances a Bounce Rate of 50 percent means that half of the 5000 en-trances immediately left your site (2500 bounces that did not view a second page on the website) and is not based on the total number of page views
An excellent Bounce Rate is considered to be 25-55 percent a good Bounce Rate is from 56-70 percent and ones to investigate are over 70 percent
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Analytics and Existing Data Page 2
When is a high Bounce Rate a concern
A high Bounce Rate is a concern when people donrsquot spend much time on a page compared to the amount of information on it or when the pages link to on-site webpages or are intermediary pages and people arenrsquot continuing along that journey
If webpages with a high Bounce Rate have all the information someone needs especially about very specific information or lots of links out to off-site webpages then it may not be a concern
What is Exit Rate
Exit Rate is the percentage of people who leave your site through a particular page
When is a high Exit Rate a concern
If someone exits above 75 percent you need to look and see if that is a terminal page for your site ndash it gives them the final information they need and they have no need to continue on from there on your site If it is not and you want people to continue looking through your site it can be a concern If it is a terminal page then it isnrsquot a concern because the page was designed to be an exit page
When is a low Exit Rate a concern
If someone exits less than 30 percent of the time then you need to look and see if they are getting the infor-mation they need on that page or if they are being forced to continue on the site because they canrsquot find what they need If you think the page should provide all the information people need and there is no need to contin-ue looking through the website but people arenrsquot exiting the site then that could be a concern If a page links to several on-site webpages or is an intermediary page and has a low exit rate it can be good
USING ANALYTICS FOR SET BENCHMARKS FOR IMPROVEMENT
Once you understand how your visitors interact with your site you can use this information to set a baseline for meaningful improvement
Key Performance Indicators
The first step is to identify the key performance indicators (KPIs) that will indicate whether or not your project is a success What you choose as KPIs depends upon how your department measures success Some indicators will be tied to website interactions Others will be tied to metrics like reduced support calls or increased name recognition Whatever you decide make sure your KPIs are actionable and measurable
Here are a few things to consider when deciding your KPIs
bull What actions are you encouraging end users to take bull On the flip side what user interactions would you like to see reduced (eg support emails and phone calls) bull Are you using social media If so what outcomes will prove that this is a good use of your time bull Where are users struggling in terms of understanding your services and programs
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Analytics and Existing Data Page 3
Brainstorm with your stakeholders to come up with a list We will then help you decide how you can measure these after site launch
Establish Baselines
Once you know your KPIs we can help you establish baselines of current performance around these metrics This can be done by looking at your analytics data conducting usability studies and analyzing other data points like conversions emails and call logs
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
COMPARATIVE ANALYSIS
WEBSITE DESIGN amp DEVELOPMENT
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Comparative Analysis Page 1
Comparative Analysis What are other universities doing
Something that can be useful in this process is comparing what you are doing and what you would like to do with what other universities are doing When choosing which websites to compare consider Pac-12 institutions AAU institutions and flagship universities but donrsquot leave out smaller or private universities It is always good to get a broad look at what others are doing Some of the things that you should look for when looking at other schools are
bull Who is the primary audience (Who are they trying to reach the most - students faculty staff public) bull What information is being provided (Content) bull How is information being provided (Text bullet points photos charts checklists forms videos infographics etc)
bull How their information is organized grouped together (Task-based audience-based organizational structure-based etc)
bull What terminology are they using (What words are they using to describe tasks etc)
It is good to write down what you think about the websites you visit You can include information about
bull specific elements you like and dislike (tool bars links photos organization text etc) bull how a website makes you feel (friendly inviting dark sad etc) bull how easily it is to navigate and find information bull things you find confusing bull forms or information you may find useful for your website
Once you have completed your comparative analysis we will meet with you to review your observations and determine what information and ideas will be valuable as we move forward in this process including an understanding of why you may like or dislike some websites what may or may not be working on your comparison websites and what may or may not work on your website We will also need to test the features that you are considering adopting to ensure it meets your projects goals and is useful to your end users
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Comparative Analysis Page 2
EXAMPLE OF A BASIC COMPARATIVE ANALYSIS FOR PRATT SILS WEBSITE REDESIGN
Pratt Sils Syracuse iSchool UNC SILS Illinois GSLIS
Navigation Contained in left sidebar site levels represented by indenting and varying text size within menu
Clear paths to information for all relevant users no clear path to degree requirements no site map
Offers clear navigation labels and clear paths for each of four user groups
Clearly labeled navigation menu at top of each page dropdown menus with large number of subsections links to student faculty etc pages not in top-level navigation left sidebar navigation on individual pages
Organization Lacks clear paths to information for prospective students current students faculty
Clearly labeled paths for all relevant users consistent features and sidebar in each section consistent and simple header
Has clear structure that seems to match user needs makes use of persistent links in headers and footer featured news section is a starting place for casual readers
Straightforward structure clear path toorganization of information for prospective students paths to information for students faculty alumni less clear because put in secondary navigation under ldquoPeoplerdquo
Readability Fonts and large amount of text make pages difficult to read lack of clear headings to separate sections of content inadequate space between text and photos
Good use of white space bullets spacing text is concise and explanatory and the language used is simple
Some pages are lengthy but important information is clumped in tables and bullet points
Adequate white space and padding between different areas of content columns on homepage are vertically uneven could use more space between them
Content Text-heavy some content repeated on multiple pages spelling and grammatical errors difficult to quickly find key information
Homepage is clear concise and updated missing crucial department info but still adequate each page has clear descriptive and updated content
Content is frequently updated and appropriately highlighted
Provides information that is most important to key user groups (ie admissions requirements academic requirements course offerings) clearly labeled sections of text some pages that are text-heavy
Appearance Limited use of color use of fonts that are relatively difficult to read
Site uses consistent styles that render on multiple browsers images are attention-getting high-res and illustrative appearance conveys quality of program but not facilities
Makes good use of photos text and layout to convey values of the program
Consistent color scheme small number of pages with overabundance of text sizes and colors good balance between text and photos on most pages
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
COMPARATIVE ANALYSIS WORKSHEET
COMPARISON UNIVERSITY
HOMEPAGE bull Who are they most trying to reach bull What do you like dislike Why bull What is unique bull How does it make you feel (friendly inviting disapproving reserved)
APPEARANCE DESIGN bull What is your overall impression bull What grabs your attention bull How are they using photos colors bold italics
bull What is unique
NAVIGATION bull What do you want to know do bull Did you find that information bull What do they want you to do bull How easy is it to find information bull Where did you get stuck bull What words are they using
ORGANIZATION bull How is their information organized
bull Task (what are you trying to do) bull Audience (who are you - students faculty staff)
bull Org chart (how they do things) bull Did you know where to find things
CONTENT LAYOUT bull What did they tell you bull Was that what you wanted expected were looking for
bull How did they tell you (text lists photos charts checklists videos infographics)
ADDITIONAL NOTES bull What were the strengths weaknesses of the website
bull What can they improve bull Was there something useful that you may want to use (forms infographics checklists etc)
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
CONTENT AUDIT WEBSITE DESIGN amp DEVELOPMENT
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Audit Page 1
Content Audit Evaluating Your Current Content
A content audit is the cornerstone of your content strategy It is a qualitative analysis of all of the published content on your website and allows you to catalog and analyze that content assessing its strengths and weaknesses on a page-by-page basis
Why perform a content audit Simply put simplify simplify simplify A content audit helps you determine if your content is relevant ndash both to users and to your departmental goals It also helps you answer important questions Is content accurate and consistent Does it speak in the voice you want to project Essentially a content audit helps shape your content by using the data we gathered during stakeholder interviews and user research to help you assess where your website is and where you want it to be Then simplify everything down to only what is essential
A content audit will help you
bull Create an inventory of content bull Prioritize content bull Determine which pages need copywriting editing bull Determine which pages need to be updated bull Determine which pages should be consolidated bull Determine which pages are no longer needed bull Determine if your content aligns with the needs of your users
PHASE 1 STARTING YOUR CONTENT AUDIT
First things firsthellip Therersquos nothing sexy about the content audit process But that doesnrsquot mean that itrsquos not critically important to your websitersquos success When you think about starting your content audit itrsquos easy to find yourself getting overwhelmed and procrastinating Donrsquot let yourself fall into this trap Just take it one step at a time and you will be done in no time
If you look back at the content audit example phase 1 is the first five columns of the audit sheet You should start the first phase at the beginning of the project to ensure that it is done before user research is completed
Step 1 Find your content
bull If you have a way to pull up all the published pages on your site then use this to complete the audit bull If you do not go through each page and write down that URL and the URL of every link on the page that goes to a different page on your website
Step 2 Enter all the URLs on the spreadsheet in the ldquoPage URLrdquo column
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Audit Page 2
Step 3 Evaluate the content on each page
Whether reviewing current content or creating new content these questions will help you evaluate your content
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Audit Page 3
Step 4 Fill in the content type
bull Ask yourself what is the set-up of the page - Examples homepage informational text page story page (content that gets added frequently like news or blogs) list of links staff directory webform tables graphic element calendar of events photo gallery etc
Step 5 Fill in the topic
bull Ask yourself what the topic of the information is on the page mdash this helps us group pages that have related topics
Step 6 Fill in the audience
bull Ask yourself who needs this information mdash Examples current students prospective students faculty staff public alumni etc
Step 7 Fill in the purpose
bull Ask yourself why you have this page - Examples general information introduction to a program attend an event join a group fill out a form
PHASE 2 COMPLETING YOUR CONTENT AUDIT
The second phase of your content audit focuses on aligning what you have with what your end users and department needs This phase should be tackled after you have conducted user research and have a clear understanding of your project requirements
If you think of your website like a puzzle through this process you have been gathering pieces to put your website together You have come to understand your end user and departmental requirements (green pieces) and what content you currently have (yellow pieces) Now itrsquos time to start putting the puzzle pieces together ndash matching the green and yellow pieces to see where you are missing puzzle pieces to make one complete website while weeding out the pieces you donrsquot need or donrsquot fit well together
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Audit Page 4
Step 1 Fill in keep revise remove or merge with
bull Ask yourself bull Does this content help your users achieve their goals quickly and easily bull Does this content push users towards the actions you require bull Of the content yoursquore keeping how important it is to your end users (prioritize) bull Did users express needs that your current content doesnrsquot support
bull Using the answers to the previous questions decide whether to keep revise remove or add content in your audit
bull Document your decisions in the last three columns of the content audit spreadsheet Yoursquoll find that you refer to this throughout the design process especially when building the framework for your websitersquos content in the next phase mdash Information Architecture
Step 2 Fill out the pagersquos priority - high medium low
bull Depending on the amount of time before you launch your redesigned website you may not have time to update everything before the launch so this step is important so that high priority pages can be completed first
Step 3 Fill in any notes you need to make about that page
bull Examples shorten content merge with xxx page add table need to get new photos etc
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Evaluation Page 1
Content Evaluation Questions
Whether reviewing current content or creating new content these questions will help you evaluate your content
What is the purpose of the page Who is the pagersquos primary intended audience What are the 1-2 things you want a user to do or learn after reading this page
Is the information valuable to the intended audience Does the page enable you to do something useful Does the page offer information not found elsewhere Is the information accurate and up-to-date
What topics are covered Is your content organized by related information or tasks and not by your departmental structure Will users think all of the content on the page is related to the task they want to perform or the
information they need Does the page only provide information related to a specific topic or task (donrsquot make them skim the
whole book when they only want whatrsquos in one chapter) If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics
with their own pages
Can you see what information is on the page at a glance Can you easily find links keywords and bullet points while skimming the page Do you use headers to break up text into easily identifiable sections Does the page title describe that page and include key words or phrases
Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) Is the text clear and as concise as possible (how would you say it on Twitter) Are you using your audiencersquos language and not your own Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Has the content been through an editing process (at least 2-3 people should review all content) Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) Is the text free from spelling errors Are the links up-to-date and working
What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) Does the design support the pagersquos purpose and target audience Are the images related to the content or provide additional information about the page Is the look consistent from page to page
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Example of a Content Audit (More Info)
Page URL (More Info) Content Type (More Info) Topic (More Info) Audience (More Info) Purpose (More Info) Keep Revise Remove Merge With Priority (HML) Notes
httpsadvancementuoregoneducontenthomepage Marketing Page Homepage General Public Advancement Keep
httpsadvancementuoregoneduwhat‐we‐do Informational Page What We Do General Public Explain what Advancement does Revise ‐ Remove CMBM Make 2 Columns
httpsadvancementuoregoneduresources‐and‐publications Informational Page Resources and Publications General Public Faculty amp Staff List Advancement publications resources Revise ‐ Remove AtO OQ Style Guide
httpsadvancementuoregoneduabout‐us Informational Page About Us General Public Explain what Advancement does Revise ‐ Update copy
httpsadvancementuoregoneducontact‐us Staff List Contact Us General Public List of contacts Revise ‐ Remove CMBM
httpsadvancementuoregoneduvice‐president Profile Vice President for University Advancement General Public Faculty amp Staff Background information on VP Revise ‐ Update copy
httpsadvancementuoregoneduUOAA Informational Page University of Oregon Alumni Association General Public Faculty amp Staff Explain who Advancement is Keep
httpsadvancementuoregoneduuniversity‐development Informational Page University Development General Public Faculty amp Staff Information about what Development does Keep
httpsadvancementuoregonedugovernment‐and‐community‐relations Informational Page Government and Community Relations General Public Faculty amp Staff Information about what GCR does Keep
httpsadvancementuoregonedujordan‐schnitzer‐museum‐art Informational Page Jordan Schnitzer Museum of Art General Public Faculty amp Staff Information about what JSMA does Keep
httpsadvancementuoregoneducommunications‐marketing‐and‐brand‐management Informational Page Communications Marketing and Brand Management General Public Faculty amp Staff Information about what CMBM does Remove ‐Move to Communications
httpsadvancementuoregonedupublic‐affairs‐communications Informational Page Public Affairs Communications General Public Faculty amp Staff Information about what PAC does Remove ‐Move to Communications
httpsadvancementuoregonedudigital Informational Page Digital Communications General Public Faculty amp Staff Information about what Digital Communications does Remove ‐Move to Communications
httpsadvancementuoregonedudigitalcontact Staff List Digital Communications Staff Directory General Public Faculty amp Staff List of contacts Remove ‐Move to Communications
httpsadvancementuoregonedukwax Informational Page KWAX General Public Information about what KWAX does Remove ‐Move to Communications
httpsadvancementuoregonedumarketing‐communications Informational Page Marketing Communications General Public Information about what Marketing Communications does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐management Informational Page Brand Management General Public Information about what Brand Management does Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementpolicy Informational Page Usage Policy Brand Management Customers Information about the Usage Policy Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementlicensing Informational Page Licensing Brand Management Customers Information about Licensing Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementdisplayunits Informational Page Display Units Brand Management Customers Information about Display Units Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementtradeshow Informational Page ConferenceTradeshow Pieces Brand Management Customers Information about Conference Tradeshow pieces Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementproducts Informational Page Products Brand Management Customers Information about Products Remove ‐Move to Communications
httpsadvancementuoregonedubrand‐managementcontact Staff List Brand Management Staff Directory General Public List of contacts Remove ‐Move to Communications
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
USER RESEARCH WEBSITE DESIGN amp DEVELOPMENT
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
User Research Page 1
User Research Understanding Needs and Objectives
Throughout this overview wersquove talked about the alignment of your end usersrsquo needs and your own departmental objectives
WORKING WITH STAKEHOLDERS
The purpose of the project kickoff meeting is to discuss project objectives requirements and departmental needs While these discussions often take place with a core website team we also like to meet with stakeholders who either interact with end users or who use the website in their own work These meetings can take many forms including
bull In-depth discussion of your departmentrsquos organizational objectives workflows messaging and desired outcomes
bull Group task analysis to help document workflows bull Development of user profiles based on stakeholder insights bull Creation of user journey maps based on stakeholder interactions
INVOLVING END USERS
The heart of a user-centered design process is engaging the audiences who currently or potentially use your services While user research can vary by project at a minimum we strive to conduct the following activities
Interviews and observations ndash Listening to your users
With your help wersquoll sit down with end users and listen them talk about why they use your services what they expect to be able to do what they actually do and where they get frustrated or confused If your website includes business workflows we will also watch users interact with your site
Personas ndash You are not your target audience
From interviews and observations we can create personas to represent the goals behaviors attitudes and frustrations of specific user groups Personas are a great way to communicate what yoursquove learned about your target audience They can also help guide decisions about content layout and design
Usability studies ndash Observing users interact with design solutions
The adage goes that what end users say they do and what they actually do can be very different Task-based usability studies allow us to not only understand what is working and not working on your current site but also to test out design solutions early on With quick iterative studies of 3-5 users you can gain valuable insights into the effectivness of proposed navigation labels content layout and features well before your site is launched
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
User Research Page 2
Card sortingndash Understanding usersrsquo mental models
Once you have a clear understanding of the user and business objectives your content must support wersquoll want to learn how end users expect this content to be labeled and organized Card sorting helps facilitate these activities
In a card sort we ask users to organize representative pieces of your content into logical groups and then label these groups When we conduct card sorts across multiple participants we begin to see patterns in how they expect your content to be organized and labeled This helps us determine your site structure or information architecture
This is only a small sample of the user research activities we can conduct during the discovery and concept design phases Regardless of the activity user research is key to building a usable engaging and accessible website that meets your user and departmental needs
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
INFORMATION ARCHITECTURE
WEBSITE DESIGN amp DEVELOPMENT
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Information Architecture Page 1
Information Architecture Building the framework for your websitersquos content
Galley kitchen or open floor plan One-story or two-story Gas or wood-burning fireplace From Bungalow to Craftsman Cape Cod to Colonial knowing what a homeowner wants and expects guides the type of home an architect designs Building a website isnrsquot exactly like building a house but understanding what your users want and expect plays a similar role in determining the structure and framework for how you design and organize the content and navigation on your website
Now that wersquove taken the time to understand how your users expect content to be organized and how they refer to that content (what terminology they use) we will use that data to create your websitersquos information architecture
WHAT IS INFORMATION ARCHITECTURE
Information architecture is the structural design of a website showing how effective organization and labeling can help users find and use your content Information architecture focuses on who your users are how they navigate through your site what technology they use and what content you provide
The purpose is to help users understand where they are on your site where to find what they are looking for what theyrsquove found what other things are on the site and what to expect from the site
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective
What is a site map and how do I read it
Through this website redesign process we will develop a working site map for your website A site map is a planning tool that visually shows how information will be grouped and labeled where content will be located and how a user will move through your website It lists the pages and content organized in hierarchical fashion that should be read from top down from left to right
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Information Architecture Page 2
HOMEPAGE
At the top of the site map is your homepage The information listed there is what will be shown on your sitersquos homepage (key messaging a brief description of your department and what it does a list of upcoming events testimonials about your department etc)
SITE MAP OF THE HOMEPAGE
BECOMES THE HOMEPAGE
PRIMARY NAVIGATION
Below the homepage information is the primary navigation (the main menu listed horizontally across the top of the site just below your departmentrsquos name) Primary navigation is the highest profile and labels the 5-8 sections of content that the users are the most interested in visiting
The primary navigation is the starting point on your userrsquos journey through your website beyond your homepage You will find the primary navigation at the top of every page it should allow the user to easily access exactly what they are looking for and remain consistent throughout your website The easier you make it for your user to understand the more likely they are to stay on your site to get the information they came for and to return
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Information Architecture Page 3
later when they need additional information
The primary navigation should be based on tasks (what am I trying to do on this website) rather than user (who am I) Users come to a website to accomplish a specific task and forcing them to self-identify first can be frustrating and deter them from accomplishing their goals The primary navigation should be read from left to right like part of a journey (getting started to getting a task accomplished to getting help for a specific problem to answering questions etc)
Five Problems with Audience-Based Navigation (from Nielsen Norman Group)
1 Users donrsquot know which group to choose Sometimes users identify with more than one audience group Other times they donrsquot identify with any of the options In some cases people donrsquot understand the labels because the audience categories are based on the organizationrsquos internal jargon The reality is that people donrsquot always fall neatly into a single category nor are they able to quickly self-identify
2 Users question whether the category will have information about that group or for that group Imagine a university website with a link in the main navigation called ldquoFacultyrdquo Would you expect to see information about the professors that teach at the university or would you expect specialized information for faculty members Based on the label alone you canrsquot tell and neither can users
3 Forcing people to self-identify creates an additional step and takes people out of their task mindset Web users are task oriented they arenrsquot thinking about who they are In audience-based navigation people must ask themselves who the site thinks they are and what type of content that type of person wants All these questions increase usersrsquo cognitive effort and people havenrsquot even made it past the navigation yet
4 Users feel anxious that the information they see might be incomplete or incorrect When users feel stuck in one group they wonder what other groups get that they donrsquot Particularly in e-commerce or B2B contexts users want to know if other audience groups have access to better options or prices
5 Websites with audience-based navigation often have overlapping content which creates a greater workload for users (and content maintainers) Often topics relate to more than one audience group So designers end up either creating two pages one for each audience (a technique that replicates content) or they use the same page with multiple links to it from different sections Most of the time this results in users questioning if the information is different in different areas of the site and people end up pogo-sticking between sections testing links to see if there is new information
Each of the primary navigation elements is a separate webpage that the user lands on when they click on the primary navigation link These landing pages will either contain all of the information about that element or be an introduction to additional pages (secondary navigation) On the site map the primary navigation elements will be labeled 1 2 3 4hellip and presented in boxes with bright colors near the top of the page The content that will appear on that specific page will be labeled 1a 1b 1chellip or 2a 2b 2chellip etc
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Information Architecture Page 4
SITE MAP OF THE PRIMARY NAVIGATION
BECOMES THE PRIMARY NAVIGATION
SECONDARY NAVIGATION
All of your content may not always fit in one large menu no matter how organized it may be It may then become necessary to use secondary navigation Any content that does not serve the primary goal of the website but that users might still want to visit should go in secondary navigation
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link These will be presented in a box on the left side of the pages associated with the primary navigation On the site map these will be the boxes will be a lighter color than the primary navigation they are associated with and located under the primary navigation boxes The secondary navigation pages will be labeled 11 12 13hellip or 21 22 23hellip etc The content on these pages will be labeled 12a 12b 12chellip etc
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Information Architecture Page 5
MEET THE TRUSTEES LANDING PAGE (PRIMARY)
CHUCK LILLIS LANDING PAGE (SECONDARY)
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
TRUSTEESUOREGONEDU
2 - BOARD MEETINGS
2a Brief information about the next board meeting
2b Information about how to give public comment
2c Link to Upcoming Meetings 2d Link to Past Meetings
1 - MEET THE TRUSTEES
1a List of Trustees with a photo name and brief bio
1b Link to Committees page 1c Link to Invite a Trustee page
3 - GOVERNANCE
3a Brief desciption about BOT governance 3b Links to UO Bylaws Policy Library Committees
page Policy on Retention and Delegation of Authority Adopted Motions and Resolutions
4 - COMMITTEES
4a Executive and Audit Committee Brief description and list of members
4b Academic and Student Affairs Committee Brief description and list of members
4c Finance and Facilities Committee Brief description and list of members
4d Presidential Factors Committee Brief description and list of members
5 - INVITE A TRUSTEE
5a Information about how to invite a Trustee to your event
5b Link to Invitation Form
bull Overview of the Board of Trustees - What is the BOT bull Announcements (Feed of BOT stories from AroundtheO)
11 - Chuck Lillis
12 - Ginerva Ralph
21 - Upcoming Meetings
21a Dates for upcoming BOT meetings
31 - Adopted Motions and Resolutions
31a List of links to PDFs of adopted motions and resolutions in order by most recent to least recent
51 - Board of Trustees Invite Form
51a Webform for the public to invite a Trustee or Trustees to their event
13 - Connie Ballmer
14 - Peter Bragdon
15 - Rodolfo (Rudy) Chapa
22 - Past Meetings
22a List of all past meetings with links to Materials and Minutes for each
22b Separate pages based on academic year (July 1 - June 30)
16 - Andrew Colas
17 - Ann Curry
18 - Allyn Ford
19 - Susan Gary
110 - Joseph Gonyea III
111 - Ross Kari
112 - Michael Schill
113 - Helena Schlegel
114 - Mary Wilcox
115 - Kurt Willcox
GLOBAL CALLS TO ACTION bull Apply bull Visit bull Give
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
CONTENT CREATION WEBSITE DESIGN amp DEVELOPMENT
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Creation Page 1
Content Creation ldquoContent there is no easy buttonrdquo mdash Scott Abel
Now that you have finished your content audit made decisions about which current content you need to keep revise remove and merge and determined your information architecture itrsquos time to start writing your content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
Content creation is entirely about the written word Donrsquot get caught up in the circular argument regarding content and design You shouldnrsquot be thinking about the appearance or layout or design yet Your users come to your website for the content not the design so focus right now on telling them something they need or want to know or helping them get something done If you have great written content the design is just to help compliment that
Your content should also be written before you design your website because you donrsquot want to be forced to fit your content into a pre-determined layout And you donrsquot want to have to change your design because your content wonrsquot fit Changing a design is time consuming and may force you to push back your deadlines
ldquoAs a rule of thumb content should account for at least half of a pagersquos design and preferably closer to 80 percentrdquo mdash Jakob Nielsen
Once you move past the homepage and your primary navigation pages most of the remaining content of your website will have the same basic structure After you have a first draft of the content you can then look at how elements like calls to action images buttons can enhance the content
Like your content audit there isnrsquot anything sexy about creating most of the content your website But this may be the most critical process in determining your websitersquos success
GETTING STARTED
ldquoThe secret of getting started is breaking your complex overwhelming tasks into small manageable tasks and starting on the first onerdquo mdash Mark Twain
Having trouble deciding where to start Getting too caught up on what it will look like Escape analysis paralysis by starting with the easiest sections and then gradually building into more intricate pieces
Do this by starting at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and working up to your primary navigation pages (1 2 3 etc) Leave your homepage and primary navigation pages for the end when yoursquove established your rhythm and voice You can always come back and polish your early work But the key is getting rolling NOW
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Creation Page 2
Writing simple useful web content is not an easy task so starting with the easiest content can help you ease into the process learning the art of writing specifically for the web along the way These pages will be mostly process or task-based pages that give more business-oriented information that makes their content more straight forward and easy to write
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
While saying this is the easiest content to write donrsquot downplay the importance of the content on these pages This is the content people are coming to your website to find It is the foundation on which the rest of your website is built and if your foundation is not solid it doesnrsquot matter how pretty your website is it will still crumble and never be successful Once you have tackled those pages in the secondary or tertiary navigation you will have knocked out most of your websitersquos content and can then move on to the tone-setting pages like landing pages and your homepage You will have the ability to focus more time and attention on these page and really be able to make your content useful and persuasive
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Creation Page 3
WEBSITE MANUSCRIPT
Putting your content in manuscript form can often help with the writing process It makes you have to think of your content on a page-by-page basis and even section-by-section on a page It can help you divide your content and help you visualize when text is getting too long and help you break those larger blocks of text into smaller blocks that are easier for users can scan
ldquoThe journey of a thousand miles begins with one steprdquo ndash Lao Tzu
Start at the bottom of your information architecture site map with the secondary and tertiary navigation pages (13 12 11 etc) and take your website one page at a time Donrsquot think of all the pages on your website as a whole think of them all as individual pages Then work on a page or two a day ndash or more if you have the time ndash and slowly but surely you will make your way through all of it
USER-FRIENDLY CONTENT
ldquoNo I donrsquot think the Empire had Wookiees in mind when they designed it Chewierdquo mdash Han Solo
Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Content Creation Page 4
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Website Manuscript Page | 1
WEBSITE MANUSCRIPT Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Header
Body Copy
Links
II Section 2
Header
Body Copy
Links
III Section 3
Header
Body Copy
Links
IV Section 4
Header
Body Copy
Links
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Website Manuscript Page | 2
Page Title
AUDIENCE (Who is this page for) OBJECTIVE (What do you want the reader to do learn) SOURCE CONTENT (Where is the content coming from) KEYWORDS (What words phrases will people search for when looking for this content)
I Section 1
Headline
Body Copy
Links
II Section 2
Headline
Body Copy
Links
III Section 3
Headline
Body Copy
Links
IV Section 4
Headline
Body Copy
Links
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 1
ACADEMIC ADVISING
WEBSITE MANUSCRIPT
Page Title Work with an Advisor
AUDIENCE Current students OBJECTIVE Find out who to contact and how to contact them for academic advising
SOURCE CONTENT Work with an Advisor page on current site
KEYWORDS advisor undeclared contact questions appointment schedule
I Introduction
Body Copy Advisors in the Office of Academic Advising help new students make a smooth transition to the university
and assist continuing students in many ways It is a place where students can sit down with an advisor one‐on‐one and discuss their individual concerns and questions In addition advisors help students develop meaningful educational plans that are compatible with their life goals Specialized advising is available for students who are undeclared (have not chosen a major)
II Undeclared Majors
Headline Undeclared Majors
Body Copy The Office of Academic Advising works directly with undeclared majors Please call us to schedule an
appointment at 541‐346‐3211 We look forward to speaking with you
Preparing for your advising appointment
Check the FAQ page to see if you can find an answer to your question
Bring a list of questions that you want to discuss Be open to reviewing course options addressing academic problems or concerns making
decisions about the upcoming quarter and exploring majorminor options Make a list of potential courses you are interested in taking for the next quarter Explore departmental websites or review the UO Catalog for majors that you are interested in
pursuing Review your degree guide (through DuckWeb) and bring a copy to your appointment Arrive in advance of your scheduled appointment time Students arriving 10 minutes or more
past their scheduled appointment times will need to reschedule their appointments If you are
unable to make your scheduled appointment you must cancel at least 24 hours in advance
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 2
III Declared Majors
Headline Declared Majors
Body Copy Each student is an important new member of our student community We want each studentrsquos experience at the University of Oregon to be a successful one
Students with declared majors are assigned tomdashor choosemdashan advisor from their major department usually by the end of their first term Students can check the name of their assigned faculty advisor by
looking at the Student General Information screen of DuckWeb
For a link to departmental websites use the UO Catalog or look at our campus advisors page
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 3
Page Title Registration Decisions
AUDIENCE Current students OBJECTIVE Answer questions about registration
SOURCE CONTENT Registration page on current site
KEYWORDS registration register schedule classes drop change grade withdrawal
I Current Term Registration Questions
Headline Registration
Body Copy When can I see classes for the next term Class schedules are posted on Friday of week 5 (for example the winter class schedule is posted week 5 of fall term) Class schedules for summer sessions are posted in early March BONUS TIP Once the class schedule posts you may use schedule builder in DuckWeb to begin arranging possible schedules
When can I register Registration is based on credit hours earned and begins Monday of week 8 (for example winter registration begins week 8 of fall term) Summer registration begins in early May Registration priority information is posted in DuckWeb under registration menu check registration eligibility during Week 7 It can also be found at the Office of the Registrar
What classes should I register for Review your degree audit on DuckWeb and make note of areas in red that say ldquoNOrdquo These are courses you will need to incorporate into your schedule planning Things to consider include how many credits to take 12 credits is full‐time however aim to earn 45 credits per year to graduate in four years Balance your course load to account for your academic strengths and challenges and other time commitments
Who can help me with my schedule Your Advisor Speak with an advisor early about schedule planning Weeks 3‐5 are the best time to work with an advisor to discuss future schedule plans Donrsquot wait until week 6 or later when advising schedules begin to fill up
Can I add classes after the deadline Petitions to registeradd classes after the deadline can be obtained through the Office of the Registrar (220 Oregon Hall)
Can I register for more than 21 credits Students considering more than 21 credits in a term MUST speak with an advisor Advisors may give permission for up to 24 credits Students seeking more than 24 credits (NOT RECOMMENDED) must obtain a petition in the Office of the Registrar (220 Oregon Hall)
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 4
II Dropping Courses
Headline Dropping Courses
Body Copy Should I drop a course or courses
Students are ALWAYS encouraged to speak with an advisor before dropping courses Advisors can discuss other possible options and also make important referrals
When can I drop (withdraw from) a course
Students have until Sunday before week 8 to drop courses via DuckWeb HOWEVER there are deadlines throughout the term that will dictate how much tuition is owed Drop deadlines can be viewed by clicking
on the CRN for the course in the Class Schedule or by viewing the registrarrsquos academic dates and
deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to
click on course CRNS to view individual course deadlines
How do I drop all my courses (complete withdrawal)
Students who drop all their courses must use DuckWeb and go to completely withdraw in the
registration menu Students have until Sunday before finals week to completely withdraw HOWEVER
there are deadlines throughout the term that will dictate how much tuition is owed on complete
withdrawal Those deadlines can be viewed by clicking on the CRNs for the courses in the class schedule
or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have
different deadlines due to shorter terms Be sure to click on course CRNS to view individual course
deadlines
III Change Grade Option
Headline Change grade option
Body Copy What is a change in grading option
Many courses offer the option to change your grading from a letter grade to PassNo Pass via DuckWeb It is very important to talk to an advisor before making a decision to change grading option Most courses for your major are NOT permitted to be taken PNP but you must confirm that with an advisor
When can I change my grading option
Students have until Sunday before week 8 to change grading option via DuckWeb Deadlines can always be viewed by clicking on the CRN for the course in the class schedule or by viewing the registrarrsquos academic dates and deadlines calendar NOTE Summer Sessions have different deadlines due to shorter terms Be sure to click on course CRNS to view individual course deadlines
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 5
IV Missed DropGrade Option Deadline
Headline I missed the dropgrade option deadline
Body Copy What can I do if I missed the drop (withdrawal)grade option deadline
If the term is still in progress (before finals week) you may obtain a petition for late drop (withdrawal) or late change in grading option in the Office of the Registrar (220 Oregon Hall) THIS IS AN EXCEPTION TO
UNIVERSITY POLICY AND MAY NOT BE APPROVED
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Academic Advising Website Manuscript
Page | 6
Page Title Academic Honors
AUDIENCE Current students OBJECTIVE Learn how to qualify for university academic honors SOURCE CONTENT UO Catalog
KEYWORDS Deanrsquos list summa cum laude cum laude magna cum laude honors grade point average
I Introduction
Body Copy There are many academic honors and awards at the university Below are some of the more prevalent Academic Honors awarded at the University of Oregon For a full list of how to graduate with honors and other awards please visit the UO Catalog
II Deanrsquos List
Headline Deanrsquos List
Body Copy At the conclusion of each term during the academic year (fall winter and spring) undergraduate
students whose grade point average is at least 375 and who are taking 15 or more total credits are
named to the Deanrsquos List and receive a special designation on their academic records At least 12 of the
credits for the term must be taken for letter grades
III Latin Honors
Headline Latin Honors
Body Copy Graduating seniors who have earned at least 90 credits in residence at the University of Oregon and have
successfully completed all other university degree requirements are eligible for graduation with Latin
honors These distinctions are determined by the Office of the Registrar and are based on the following
percentile rankings in each graduating class
Top 2 percent ndash summa cum laude
Top 5 percent ndash magna cum laude
Top 10 percent ndash cum laude
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 1
UOREGONEDU
WEBSITE MANUSCRIPT
Page Title Academics
I Hero Image
Headline More than 270 right directions
II Programs of Study
Headline Programs of Study
Body Copy Itrsquos your move Accounting biology or architecture Explore environmental studies and geography or mix material science philosophy and economics With more than 270 science and liberal arts options availablewe can help you prepare you for life And a lifetime of careers
Links Explore Majors Undecided on a Major
III Schools and Colleges
Headline School of Architecture amp Allied Arts
Body Copy World renowned for our groundbreaking Sustainable Cities Initiative we are among the nationrsquos finest professional schools for architecture and the arts planning public policy and design
Headline College of Arts amp Sciences
Body Copy The academic heart of the university we bring together hundreds of top‐notch faculty who are
committed to both path‐breaking research and mentoring the next generation
Headline Charles H Lundquist College of Business
1
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 2
Body Copy We are serious determined focused and hands on But we are not your typical business school We are a
place that does not shy away from societal issues but tackles them solves them
Headline College of Education
Body Copy Teacher education Of course we do that but we also train administrators and counselors School psychologists and family therapists Human service providers and clinicians
Headline Robert D Clark Honors College
Body Copy The Clark Honors College features small classes and close interaction among students and faculty We
foster an intense creative exchange of ideas in a tight‐knit dynamic community
Headline School of Journalism amp Communication
Body Copy We teach students the power of storytelling through ethics innovation and action in journalism and
communication We are inventing the future of media transforming ldquoWhat If into ldquoWhat Isrdquo
Headline School of Music and Dance
Body Copy We are the premier educational institution of music and dance in the Pacific Northwest We offer programs in music performance music education composition and choreography‐performance
Headline School of Law
Body Copy Rigorous and inspiring Oregon Law teaches students how to engage the law We are a preeminent public law school that shapes brilliant students into professionals
Headline Graduate School
Body Copy Over one hundred graduate options available Masterrsquos and doctoral degrees Certificates and
specializations Empowering students to take their education and careers to the next level
2
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 3
IV Rankings
Headline The place for green
Body Copy The University of Oregon leads the nation in finding creative solutions environmental challenges We rank
No 1 in the nation in sustainable design (according to Americarsquos Best Architecture and Design Schools 2015) The Oregon MBA is the top ranked Green MBA in the country (by the Princeton Review) We
invented green chemistry which uses chemistry research to build more environmentally sustainable
products and makes science labs more environmentally sustainable And our Sustainable Cities Initiative
lets students work with cities across Oregon to bring environmentally sustainable solutions to urban
planning
Headline One of the best at teaching teachers
Body Copy US News and World Report ranks our College of Education in the top five nationally and it ranks our special education program No 3 Our faculty members are also leading researchers and the UO is ranked
second in the country for research money per professor
At the UO we teach learn research and find a better way
Headline UO a leader in graduate study
Body Copy The UO ranks in the top 20 (or top 20 percent) nationally in such varied fields as creative writing education environmental law landscape architecture psychology sports marketing sustainable business practices and many more
Headline Highly ranked in anthropology biology literature and more
Body Copy The UO is a great place to study all kinds of things Our highly ranked programs include anthropology biology comparative literature geography geological sciences physics psychology sustainable design and special education
3
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 4
V Academic Resources
Headline Academic resources
Body Copy Learning extends way beyond the classroommdashand so does our support Our academic support programs and services include
Links Support Services First‐Year Programs Accessible Education Center University Counseling amp Testing Center International Student and Support Services
Study Help and Tutoring
Teaching and Learning Center UO Libraries Mills International Center Library Research Guides
Academic Advising
Office of Academic Advising
Departmental Advisors PathwayOregon
Center for Multicultural Academic Excellence
4
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 5
Page Title Admissions amp Financial Aid
I Page Opener
Links Apply
Requirements Financial Aid Scholarships amp Costs Majors amp Minors Law School Graduate School
II Request Information
Headline Meet us halfway to get all the way here
Body Copy Whether yoursquore applying from Oregon or from out of state as an undergraduate or a graduate we can
help you through the process Request information schedule a visit or contact an admissions counselor in
your area to find the information you need to apply
Links Request Information
Schedule a Visit Find Your Admissions Counselor
III Apply
Headline $196 Million Every Year
Body Copy Thatrsquos the amount the UO gives undergraduate students each year Our job is to keep the UO affordable About 65 percent of our undergraduates receive some type of financial aid To one of the top public research institutions in the nation
Links Costs Scholarships Other Aid
5
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 6
iv Learn to Fly
Headline Learn to Fly
Body Copy Reasons to come here are as varied as the opportunities yoursquoll find 3000 courses to choose from Countless chances to discover what yoursquore made of and passionate about Freedom to mix things up Combine physics with business and this with that Collaborate with others from around the world conduct real research and get a world‐class education So when you leave here youlsquoll be ready to soar
Links Why UO
UO Facts Photos amp Videos
6
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 7
Page Title ABOUT
I Hero Image
Headline Search and create
II Page Introduction
Body Copy Wersquore a member of the prestigious Association of American Universitiesmdashone of only 36 public universities committed to scientific exploration and interdisciplinary research Wersquore founded on and committed to a tradition of classic liberal arts education One dedicated to overcoming barriers and discovering how much there still is to discover Wersquore driven by what we donrsquot know and to finding the answers
Link Just the Facts
III Diversity
Headline Long live diversity
Body Copy Wersquove done away with diversity and replaced it with diversity equity and inclusion We decided that itrsquos not enough to just be different together We want cultural collisions that lead to happy accidents Cross‐pollination that leads to new perspectives We want thousands of brilliant students from Oregon America and around the world learning from each other Working and sharing with each other Discovery and excellence demand it So we demand it At every level We know the differences between us make us stronger and smarter together than apart
Link Inspire Inclusion
IV News
Headline Every Day
Body Copy A breakthrough in concussion research A new way to use nanoscience to protect the environment A
student wins a Pulitzer or a National Geographic competition or a Peabody Things happen here Big
things All the time See for yourself
Link See for Yourself
7
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 8
V History
Headline The UO and OregonmdashTogether Forever
Body Copy Throw sepia tones on an October morning in 1876 Thatrsquos when 155 students showed up for the first day
of classes at the University of Oregon They filed into a looming four‐story building in the middle of a
muddy clearing with workmen inside still hammering away on the upper floors and cattle lowing in the
pasture outside From these rustic origins grew one of the nationrsquos top research institutions Today our campus is vibrant and green and our future has never been brighter
Link Learn from History
VI Mission Statement
Headline Who we are and will continue to be
Body Copy We exist to provide access to a high quality education for those who want one Students who will help us shape the future Wersquore here to spread knowledge because knowledge is the wealth of any civilization It adds depth and meaning to the world and it can change lives on the most fundamental level for the
better And we exist to cultivate excellence in all things by preparing students to be active participants in
a global society Students who question critically think logically communicate clearly act creatively and
live ethically This is who we are Who wersquove always been And who we will continue to be
Link UOs Mission Vision and Values
VII Competitive Excellence Rooted in History Eyes on the Future
Headline The Best the Bright the Curious
Body Copy Wersquore increasing our scholarships growing our Honors College and expanding our doctoral fellowships so
we can attract students who love to create and discovermdashwho arent afraid to stumble and get back up
again Students who want to learn about dirt and bugs and fish about how our brains work about how to
design the Next Big Thing Students who grew up in Portland or Pasadena Paris Texas or Paris France Students who want to change the world
8
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
UOREGONEDU Website Manuscript
Page | 9
Headline Faculty Rock Stars
Body Copy Wersquore expanding the size and reach of our faculty Were hiring 150 world‐class thinkers and researchers over the next five years Were changing the way the world thinks about volcanoes childhood obesity sports products green chemistry and life at the nano‐scale Wersquore creating Clusters of Excellencemdashgroups of faculty who are experts in their fields Working together to become greater than the sum of our parts
Headline Access and Success
Body Copy Wersquore committed to giving all students the opportunity to learn Wersquore expanding Pathway Oregonmdashour benchmark program for high ability students with demonstrated financial needmdashby 65 percent Wersquore
launching programs to help students stay in school To finish what they started And wersquore creating new
assistance grants Itrsquos all about removing roadblocks to student achievement
Headline Building Boom
Body Copy Watch out for cranes on campus Were building and rebuilding Expanding and growing Wersquore
renovating the Student Rec Center and our student union Wersquore building new research labs and investing
in ldquoBig Datardquo technology infrastructure Were increasing our classroom and faculty spaces Were
renovating our residence halls and building one thatrsquos brand new
9
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
WRITING FOR THE WEB
WEBSITE DESIGN amp DEVELOPMENT
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 1
Writing for the Web Creating User-Friendly Content
ldquoContent precedes design Design in the absence of content is not design itrsquos decorationrdquo mdash Jeffrey Zeldman
People read differently online than they do when they read print materials Reading long paragraphs on a screen hurts the eyes and is time consuming Web users
bull Scan pages bull Read in quick short bursts bull Pick out key words and phrases bull Are action oriented bull Search for information that will lead them towards a goal
Effective web writing involves having the content the primary audience is looking for and presenting it in a way that makes it easy to find Good web content should either tell the user something they need or want to know or help them get something done Web content should also drive actions give your users something they should do ndash click a link call a phone number make an appointment fill out a form etc
Content Drives Layout and Design
ldquolsquoContent is Kingrsquo ndash you might have a pretty web site which will catch someonersquos eye but if the content is no good you can be willing to bet that they arenrsquot going to stick aroundrdquo mdash Selene M Bowlby
After completing your content audit based on the needs and requirements of you and your users you will write the content for your website knowing what you should keep remove add revise or merge It is important to know that your content should be written before you determine the look and feel of your website Content drives what the layout and design should be because you donrsquot want to be forced to try and fit your content into a pre-determined layout and design If you realize something is hard to describe in words and works better as an image or infographic you donrsquot want to be stuck in a text-based layout or if you find out you need something to be written out you donrsquot want to be stuck in a graphic-based layout
Writing your content is probably the step that will take the longest because you will probably need to write all of the content and then re-examine that content to determine what the best way to give that content to your users Throughout the process you will need to always ask yourself
bull What is the purpose of the page bull Who is the pagersquos primary intended audience bull What are the 1-2 things you want a user to do or learn after reading this page
bull Is the information valuable to the intended audience bull Does the page enable you to do something useful bull Does the page offer information not found elsewhere bull Is the information accurate and up-to-date
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 2
bull What topics are covered bull Is your content organized by related information or tasks and not by your departmental structure bull Will users think all of the content on the page is related to the task they want to perform or the information they need
bull Does the page only provide information related to a specific topic or task (donrsquot make them skim the whole book when they only want whatrsquos in one chapter)
bull If the content on your page is longer than 3-4 scrolls can you divide the information into sub-topics with their own pages
bull Can you see what information is on the page at a glance bull Can you easily find links keywords and bullet points while skimming the page bull Do you use headers to break up text into easily identifiable sections bull Does the page title describe that page and include key words or phrases
bull Is the text well-written (short easy to understand conversational ndash see ldquoWriting for the Webrdquo) bull Is the text clear and as concise as possible (how would you say it on Twitter) bull Are you using your audiencersquos language and not your own bull Are you avoiding marketing ldquofluffrdquo jargon and undefined acronyms
bull Has the content been through an editing process (at least 2-3 people should review all content) bull Is the text grammatically correct (see UO Editorial Style Guide and The Chicago Manual of Style) bull Is the text free from spelling errors bull Are the links up-to-date and working
bull What impression does the design give (chaotic focused cluttered minimalist ndash see ldquoVisual Designrdquo) bull Does the design support the pagersquos purpose and target audience bull Are the images related to the content or provide additional information about the page bull Is the look consistent from page to page
CREATING YOUR CONTENT
Here are some easy dos and donrsquots for creating user-friendly web content
DO
Keep Content as Concise as Possible
Web users have very short attention spans and donrsquot read articles thoroughly or in their entirety They skim webpages to find the information they want They search for keywords skip around instead of reading from top to bottom and have lowered attention spans Shorter articles enhance readability Cutting half the words on a webpage can increase usability by up to 58
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 3
What you can do
bull Be accurate Be clear Be concise Read httpsbranduoregoneduusage for usage tips
EXAMPLE
DO USE DONrsquoT USE because the reason forsince due to the fact thatwhy owing to the fact that
in light of the fact that considering the fact that on the grounds that this is why in terms of with regard to
bull Get to the point as quickly as possible - Start with the conclusion follow with the details (See the inverted pyramid on page 4)
bull Cut out unnecessary information - Use half the word count of traditional writing
EXAMPLE
DO DONrsquoT Find out how to Read about how we can help you prepare for the bull Post your resume rigors of the job search with tips for posting your bull Search our jobs database resume on our website searching our extensive bull Sign up for Career Fairs database of job offerings and registering for
upcoming fall semester Career Fairs DO Apply here [with a link to application] DONrsquoT
By completing the online application available on this site you can enroll in the program
bull Avoid long paragraphs and sentences - ideally no more than 20 words per sentence and five sentences per paragraph
bull Use easy-to-understand shorter common words and phrases Be conversational
EXAMPLE
DO USE Get Before Buy Ask For Next End Use Know Help
DONrsquoT USE Obtain Prior To Purchase Request Subsequent Terminate Utilize Cognizant Facilitate
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 4
bull Avoid jargon Use your userrsquos language not yours
EXAMPLE
DO Call it financial aid if that is what your users call it
DO Oregon researchers study how patients with a minor heart condition are affected by high altitude
DONrsquoT Use ldquofinancial assistancerdquo just because that is what your department calls it
DONrsquoT Oregon researchers study the effects of patent foramen ovale in a high-altitude Bolivian setting
bull Use pronouns The user is ldquoyourdquo The department is ldquowerdquo This creates more approachable content
EXAMPLE
DO Get advice you need to write effective web copy that gets your program noticed
DONrsquoT Users should review our suggestions on writing for the web to optimize their organizationrsquos outreach efforts
bull Avoid acronyms - your reader isnrsquot necessarily familiar with the shorthand you use
EXAMPLE
DO Contact the Teaching and Learning Center
DONrsquoT Contact TLC
bull Use active voice
EXAMPLE
DO If it snows call the parking hotline before coming to campus
DONrsquoT In the event that it snows the parking hotline should be called prior to coming to campus
Use Headings to Break Up Long Articles
ldquoA wall of text is deadly for an interactive experience Intimidating Boring Painful to read Write for online not printrdquo mdash Jakob Nielsen
Internet readers inspect webpages in blocks and sections going directly to items that seem to match what theyrsquore looking for When they look at a webpage they tend to see it as chunks of information rather than as a whole One strategy is to break up long articles into sections so that users can easily skim down the page
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 5
Do not just bold text for your section headings use ldquoheaderrdquo tags (H2 for major headings H3 for subheadings) instead For screen reader users header tags are vital in giving a sense of the main topics of the page and enabling easier navigation through your content Additionally effective header tags help with search engines mdash making your site more accessible to everyone
What you can do
bull Write clear direct headlines
EXAMPLE
DO UOrsquos College of Education ranks in the top five nationally
DONrsquoT Plato Aristotle and Being No 1
bull Before writing a post consider organizing your thoughts in logical chunks by first outlining what yoursquoll write
bull Use simple and concise headings Ideally headings are 4-8 words and subheads are 1-5 words
bull Use keyword-rich headings to aid skimming as well as those that use their browserrsquos search feature
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 6
Help Readers Scan Your Webpages Quickly
Designing and structuring your webpages with skimming in mind can improve usability
What you can do
bull Use words that your target audiences use when searching bull Catch your readersrsquo attention in the first few words because users tend to read the first few words when theyrsquore scanning a webpage
bull Front-load keywords in webpage titles headings and links bull Use the inverted pyramid (right) to place important information at the top of your articles
Use Bulleted Lists and Text Formatting
Users fixate longer on bulleted lists and text formatting (such as bolding and italics) These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases
What you can do
bull Consider breaking up a paragraph into bulleted points bull Highlight important information in bold and italics
Use Visuals Strategically
Photos charts and graphs are worth a thousand words Users pay close attention to photos and other images that contain relevant information Using visuals can enhance readability when they replace or reinforce long blocks of textual content But users ignore certain images particularly stock photos merely included as decorative artwork
What you can do
bull Use images diagrams or multimedia to visually represent ideas in the content bull Videos and images should reinforce the text on your page bull Always use alternative text (alt text) with images ndash or long descriptions (longdesc) for complex images like charts graphics and maps ndash for website accessibility and search engine optimization
bull Avoid stock photos and meaningless visuals
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 7
DO NOT
Do NOT welcome people to your website and explain what a website is
How many times have you seen this ldquoI would like to personally welcome you to our departmentrsquos web page We have put together a great collection of information and links to help you learn more about us I invite you to look around and click the links to the leftrdquo A website is a collection of information no need to tell your readers that
Do NOT put your mission statement on your home page
Unless this is the most important content your users search for when visiting your site it should not be on your home page Donrsquot tell people what you domdashshow them by making your most important services and content available immediately on your site Your users come to your site to do somethingmdashmake it easy for them
Do NOT organize your website and write content to reflect your organization
Donrsquot require your users to figure out your internal organization to find content on your website Present related tasks and content together on the site regardless of who does them within your organization If you were shopping for a car you wouldnrsquot expect to be sent to the website for the engine department to find out what type of engine a car has would you Likewise use language and terms that your audiences use regardless of what you call them internally
Do NOT bury important links within text
If information is important enough on your website to require a link do not bury it within your copy Users are always scanning your website for useful information or links but when links are buried within paragraphs of text they are hard to find and are easily missed or ignored
Do NOT use ldquoClick Hererdquo to label your links
Avoid using ldquoClick Hererdquo for your link label When users are scanning your website they want to see links that tell them where the information they are looking for is located If they just see a link titled ldquoclick hererdquo they are forced to read the surrounding text to find out if that is what they are looking For many users they will just skip over the link looking for better information and may miss key information In addition many screen readers allow users to jump to links and if the title of the link is ldquoClick Hererdquo it provides no context for where the link goes and what it does Links should be labeled with the most important keyword or phrase people are looking for to guide them to the information they want
Do NOT put every piece of printed content you have on your website
Large volumes of content do not necessarily make good websites If your visitors donrsquot need it do put it on your site
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Writing for the Web Page 8
Do NOT use marketing ldquofluffrdquo on the web
When your readers scan your content every word is valuable Do not fill your pages with marketing ldquofluffrdquo or needless formalities Boastful exaggerated language reduces the likelihood that your content will be read or believed
Do NOT post a PDF version of a document unless absolutely necessary
Unless the format and integrity of the original document must be maintained such as a printable form do not use PDFs for the web PDF and Word documents or any other printed document type are not intended for the web and pose issues with search-ability access and readability Besides if the content was written for print chances are itrsquos not appropriately formatted for your website
When creating a PDF document to post on your website ensure that it was created from an electronic document - a Word file InDesign file etc) and not from a scanned document or an image Screen readers can usually interpret text from an original document but can not from text in images Adobe Acrobat and Adobe Reader can do an accessibility ldquoQuick Checkrdquo or ldquoFull Checkrdquo on your document Check Adobe help for your particular version of Adobe for accessibility tools
UO EDITORIAL STYLE GUIDE QUICK REFERENCE
The UO
When using abbreviations use the UO Oregon or the university not Univ of Ore U of O or the University More on abbreviations
Capitalization
Professor Bob Smith is capitalized but Bob Smith professor of sociology isnrsquot Same with president and director Department of Biology is capitalized but ldquoGo to the biology departmentrdquo or ldquoI got an A in biologyrdquo isnrsquot The University of Oregon is capitalized but ldquothe universityrdquo isnrsquot More on capitalization
Phone Numbers
With Oregonrsquos change to 10-digit dialing and just because it looks better phone number style is to use hyphens only So 541-346-5397 instead of (541) 346-5397 More on numbers
Academic Degrees
Periods in degrees are no longer used so BA MS and PhD not BA MA and PhD More on academics
Serial Comma
Use it Reading writing and arithmetic More on punctuation
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
WIREFRAMES WEBSITE DESIGN amp DEVELOPMENT
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Wireframes Page 1
Wireframes Test Out Solutions
If your site map reflects your sitersquos organizational structure wireframes reflect page-level structure Think of wireframes as architectural blueprints No color images or special fonts Instead wireframe communicate how content blocks should be organized on a page to support your end usersrsquo and your departmentrsquos goals
Remember all that work you did with your content audit stakeholder interviews and user research This is where it all comes together
Content Audit
In your content audit you noted page types and overall purpose To provide continuity for your users yoursquoll want similar page types to have a similar layout With our templated system you can choose basic page lay-outs and then customize with your own images and text
Example ldquoNewsrdquo page type wireframe
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Wireframes Page 2
Stakeholder Interviews
Calls to action messaging measurable outcomes Your stakeholders provided valuable insights into the busi-ness objectives your content must support With wireframes you can visually prioritize content to push users towards specific actions or messages
User Research and Personas
Before you sit down to wireframe a feature or page review your audience personas and ask
bull Who is primary target audience for this page bull How does this page fit into the larger context of the site Is it part of a workflow or is it a destination bull What are users trying to do when they visit this page bull What do you want them to do bull What keywords are users looking for
The answers to these questions will not only help you prioritize content blocks they will also help you design content that is usable effective and engaging
Test your pages
Wireframes and sketches are a great tool for gathering user feedback at any stage in the design process Brain-storming ideas Sketch them out and see what people think Want to test your pages to make sure users can find what they need Create a wireframe and give them some tasks
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Wireframes Page 3
There are three types of wireframe tests we recommend While you may not test all stages of your wireframes we strongly recommend that test your site with end users before going live
Low fidelity
A low fidelity wireframe shows the simple page structure but doesnrsquot include a lot of content details A low fidelity wireframe will be tested early in the design process often using paper prototypes to gather feedback When testing a low-fidelity wireframe be sure to ask users about their expectations behaviors likes and dis-likes
You can use a low fidelity wireframe to get feedback on content placement navigation and labels
Medium fidelity
Medium fidelity wireframes include more content details but still no color or design Often your medium fidelity wireframes are presented as interactive PDFs or HTML prototypes allowing you to test task flows and more complex interactions While you still may ask questions during user tests you really want to sit back and watch what people do
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Wireframes Page 4
High fidelity prototype
For more complex sites you might want to test a high fidelity prototype A high fidelity prototype is the closest thing to your final site in terms of design and functionality Yoursquoll most likely test with a high fidelity prototype near the end of the design phase to be sure that you have worked out all the kinks before your site goes live
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
VISUAL DESIGN WEBSITE DESIGN amp DEVELOPMENT
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Visual Design Page 1
Visual Design Thinking Beyond Decoration
ldquoDesign is not just what it looks like and feels like Design is how it worksrdquo - Steve Jobs
Many people regard web design as decoration making a website look good However design is more about how something works than how it looks It is about both form and function
When designing a website itrsquos easy to assume that everybody is like you However this leads to a strong bias and often ends in an inefficient design You already know a lot about your services and your website But your users just want to get things done on your website They come for the content not the design
Content is by far the most important element in design A webpage with a simple structure but quality content performs much better than a nice layout with subpar text
DESIGN LAYOUT
F-Pattern
Typically for text-heavy websites the F-Pattern comes from the reader first scanning a vertical line down the left side of the text looking for keywords or points of interest in the paragraphrsquos initial sentences When the reader finds something they like they begin reading normally forming horizontal lines The end result is something that looks like the letters F or E Use the F-Pattern to enable quick scanning and encourage scrolling
Example of the F-Pattern
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Visual Design Page 2
Eye Tracking for the Z-Pattern
Z-Pattern
Z-Pattern scanning occurs on pages that are not text heavy The reader first scans a horizontal line across the top of the page When the eye reaches the end it shoots down and left and repeats a horizontal search on the lower part of the page Use the Z-Pattern to draw your users to your ldquoCall to Actionrdquo that will be used on your homepage
Example of the Z-Pattern
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Visual Design Page 3
USING IMAGES ON YOUR WEBSITE
Graphics and images can make a huge difference in how your site appears and how users interpret its intentions Images can help you attract attention and guide your usersrsquo line of sight They can be of great value when it comes to presenting important information
bull Image processing happens in a different part of the brain from where words are processed so putting them with your words will engage more of your viewerrsquos brain
bull Images are especially effective to activate associations If you spark an experience or memory with your image you can convey meaning that goes well beyond the picture
However you should only use images that somehow support your content For every image on your site you should be able to answer four questions
1Why did you chose that image and not a different one 2Why did you place the image where you placed it and not somewhere else 3Who is your primary target audience and what type of imagry will speak to them 4What underlying message are you trying to convey ndash Undergraduate Research wants to emphasize research outside of the science so they could use photos of students in the field and not just in a lab
Be Aware of What Appears Above the Fold
Because the area above the fold is the first part of your website people see you should use it wisely If you plan to use a large image at the top of your website make sure it doesnrsquot push more important informative or catchy content below the fold People will scroll if they feel like they will find the information they are looking for Itrsquos absolutely natural to scroll so give people a reason to scroll and look at the rest of your site
Make sure you take into account how each graphic or image alters the overall appearance of your site This includes paying attention to color scheme negative space within the image and the imagersquos actual content
The Power of Directional Cues
Use visual cues to guide users to key areas of your website Human beings have a natural tendency to follow the gaze of others and we have been coached since birth to follow arrows directing us to where we should be lookinggoing
Non-Directional Focuses only on the Face Directional Focuses on the Face and the Text
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Visual Design Page 4
Prioritize Information on Your Pages
Different information on your site should have different levels of importance Your design should reflect their importance in the grand scheme of your site
Itrsquos important to correlate size with importance in a design Objects that are bigger demand more attention The biggest elements should be the most important in most cases the smallest elements should be the least important
Image Dos and Donrsquots
The images people look at most have the following characteristics
bull are high contrast and high quality (crisp and colorful) bull are cropped rather than overly reduced when necessary to fit a small space bull are not excessively detailed easy to interpret almost iconic bull are highly related to the content on the page bull possess magnetic features
Features that make images magnetic include the following
bull smiling and approachable faces - They make us feel like we are actually connecting with other humans not only with some coded website
bull people looking at (or at least facing) the camera bull clear instructions or information
People ignore images that have the following characteristics
bull are low contrast and low quality bull are too busy for the space bull look like advertisements - People donrsquot like ads and over the years they have successfully learned to ignore them
bull are not related to content on the page or only slightly related to it - people look for the content and ignore unrelated visual noise
bull are boring bull include people or objects that are generic or obvious stock art bull are cold fake or too polished
If you have a large international audience for your website be mindful of the size of your photos and make sure they are optimized for the web for quicker loading on slower internet connections
USING COLOR ON YOUR WEBSITE
Human visual attention first responds to contrasts in color and light then to the emotional and cultural value of a specific color Bright colors stand out from muted colors and you can exploit this to draw your userrsquos attention where you want Additionally certain colors can help set the mood of the entire site (blues are tranquil reds are aggressive etc)
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Visual Design Page 5
Repetition assigns relative meaning to elements If all ldquoparagraphrdquo text is grey when a user sees a new block of grey text he can assume itrsquos another basic paragraph when that same user encounters a blue link or a black title he can safely assume it is different and unique from the grey text
If you have a large international audience for your website be mindful of the cultural implications of the colors and images you select
TEXT
Special type styles (bold italic ALL CAPS) should be used sparingly
Donrsquot make every other word on your site bold or italic or in ALL CAPS Only use them sparingly when you want to emphasize something important
Donrsquot use center-justified blocks of text
Text that is center-justified is fine for headlines but avoid it for paragraphs or other large blocks of text The jagged edges take longer to read and tend to interrupt the flow of the text
Donrsquot underline anything but links
People expect underlined text online to be linked to something If it isnrsquot yoursquoll do nothing but confuse your visitors
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
MEASURING SUCCESS
WEBSITE DESIGN amp DEVELOPMENT
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Measuring Success Page 1
Measuring Success
Once your website is launched you are ready to monitor and assess its performance
REVIEW YOUR BASELINES
First wersquoll review the baselines you established around key performance indicators Where was the old site in terms of usability accessibility and engagement What were the numbers in terms of page visits return visits and links to important calls to action like apply visit or make an appointment These are the types of metrics we will use to make sure your redesign has met your departmental goals
ESTABLISH A PLAN
Next wersquoll work with you to establish a plan to measure your KPIs at specific intervals Web analytics can be measured weekly quarterly or around specific events like the start of the term Usability studies should be conducted within six months of launch and then at regular intervals
ITERATE
The age of the grand web redesign is past Itrsquos no longer sufficient to let your website grow stale until the next major redesign project Instead think about making smaller iterative changes based on analytics and user test-ing Our team can teach you easy methods for testing out changes with end users and keeping them engaged
Top Related