We have some wonderful program pages to share with you. These are great examples of how you can lay out your content for program participants, volunteers, and other people who are involved with or interested in your program. Here’s initial feedback we’ve been hearing from all of you about the updated design features:
- “The sample webpage looks great! I love the ease of navigation and how well it showcases 4-H.”
- “Love the ‘new’ website layout!….Really like the ‘call to action’ addition!”
- “The overall appearance is very aesthetically pleasing….The design helps with visually de-bulking the content.”
- “This looks great! I appreciate that you’ve simplified & condensed the menu.”
- “[It] will really help to showcase the work of the volunteers locally, so thank you!”
Master Gardener local programs
- Polk (western region example)
- Lincoln (coastal region example)
- Josephine (southern region example)
- Umatilla (eastern region example)
- Wasco (central region example)
Check these out too:
- Become a Master Gardener (Josephine)
- Community projects (Wasco)
- Gardening help and resources (Lincoln)
4-H local programs
These pages also turned out well:
- Become a member
- Animal science
- Member opportunities and scholarships
- Record books
- Support 4-H
More local 4-H examples will be coming soon.
About the examples
The above examples were created through a partnership between EESC and these groups. A 4-H and Master Gardener local program was selected from each region. They were selected because they had a lot of wonderful content added to their pages, which gave us a great starting point.
Tips and recommendations for program pages
Think about how your current content will best fit into this style.
- Do you need to craft a more concise program description?
- You can use nested subpages to make the menu not so long and help users find the content they are looking for. Do you need to create nested subpages so the side menu is shorter?
- Programs video tutorial: Learn step-by-step how to apply these designs. Also learn how to create nested subpages on your program pages.
- Program resources video tutorial
- Page sections: See our quick reference showing the different types of designs you can use to format your content. This handout is from our web guide.
Getting help and sharing feedback
We can walk you through how to create this look when you’re ready. Send us questions, training requests or your feedback on the designs!
A shout out to Alisha Atha, Holly Burton, Rose Clarke, Shevon Hatcher, Renée Johnson, Samara Rufener, Sara Runkel and Michelle Sager for partnering with us to create the examples programs listed above. We greatly appreciate the content you added to the website before we got started—and your feedback and suggestions along the way! Thank you!
- Your profile pages on the OSU Extension website will automatically display some Digital Measures information. This includes the awards and presentations you’ve added to Digital Measures. To turn off the display of one or all of your publications and awards on your Extension profile, log into Digital Measures and go to the Activity menu. Click on Awards and Honors and/or Publications and Intellectual Contributions, and change the sharing option to “no”. This updates every 12 hours.
- EESC added a food safety and preservation hotline “call to action” to the OSU Extension homepage; let us know if you want the topic page announcement tagged to show on your county page.
Now that the new county designs have launched, it’s time to focus on filling out content for your county’s focus areas. Here are some tips to get you started. Also, if you’re in Eastern Oregon, the web team is coming your way for a training this week (see more at the end of this blog post).
1. Review some examples
- View a mockup of a local focus area at the end of this post. Includes annotations.
- Review examples of county pages using the redesign and new focus areas: Tillamook county and Washington county. From the county page, click “What we do” in the county’s navigation. Items under “Highlights” are focus areas. We appreciate these county’s help with testing their current content in the new designs!
2. Choose user-friendly titles
When writing a title for your focus area, we recommend:
- User-friendly titles: Use terms that are general and understandable for people unfamiliar with OSU Extension. Avoid using program names and internal jargon when possible.
- Encouraging action: Show people how they can become involved (e.g., use “Preserve food at home” instead of “Food preservation”).
- Concise titles: If a desired focus area is too big to use a simple phrase because it includes too many topics, it should probably be broken into multiple focus areas.
Here are some examples:
- Activities for youth
- Caring for your forestland
- Grow your gardening skills
- Start or grow your small farm
- Preserve food at home
Please contact us if you have any questions or would like some help identifying focus area titles or how to organize content to fit within focus areas.
3. Select which types of local focus area
There are three options for focus areas:
- 1) Display a custom page: this includes a place to add information about the local context, related resources, contact info, etc. See mockup at end of this blog post for an example.
Or, link to existing content:
- 2) Link to a local program (for 4-H or MG): Links will take visitors directly to the landing page for that local program (i.e. Benton County 4-H).
- 3) Link to an existing focus area in another county: if you would like to display a focus area that has been added by a different county (e.g. for a regional focus area), select it here. Links will take user directly to that focus area.
Select which desired option under “How to display” when creating a local focus area.
4. Create or edit a focus area
Read last week’s blog post for training materials to get started on creating or editing your focus areas.
The following focus areas have been or will been created for you:
- Any content that is currently within county sub-pages. We’ll transition this content to focus areas for you.
- 4-H and Master Gardener: These have been added. They link directly to county program pages (e.g., Gilliam County 4-H)
- Gardening: A template for gardening is being developed.
You can change the order of focus areas on the ‘What we do’ page and select which three to include on the county landing page.
New locations for content in new design
County programs & local focus areas
Three focus areas are set to display on the county landing pages. The ‘What we do’ page also includes:
- All focus areas: listed under the ‘Highlighted’ heading.
- Programs offered: Include all programs on the OSU Extension site that have been tagged with your county. See what is a program on the OSU Extension website.
Links to the ‘What we do’ page are in your county’s navigation. Links to 4-H and Master Gardener can now be found with focus areas.
Social media & newsletters
When the content is for:
- The county as a whole (e.g., county newsletter): These go in the orange quick link bar on the county landing page.
- A particular topic or program (e.g., Eastern Oregon Gardening Newsletter): These go in the orange quick link bar on the relevant local focus areas. County Master Gardener and 4-H social media are already part of local program pages, but can also be added to relevant focus areas.
We recommend using announcements to promote new newsletter issues.
Content that is currently in county subpages will be transitioned to local focus areas by EESC. If we aren’t sure how to make the content fit, we’ll work with you to find a solution.
Eastern Oregon website trainings this week
You are invited to attend in-person trainings in Eastern Oregon this week:
- Malheur County office on Wed., April 24: 10am-noon, lunch break, then continues 1-3pm. If anyone wants more personal, hands on instruction, contact Bobbi Howell.
- Union County office on Thurs., April 25: 10am-noon, lunch break, then continues 1-3pm. If anyone wants more personal, hands on instruction, contact Sherry Nantz.
The trainings will focus on using the new county page designs. Please bring your questions and a laptop if possible, so we can work with you on your county pages. For questions about the location or accommodation, please contact Bobbi Howell (Malheur County) or Sherry Nantz (Union County). For questions related to the training, contact Bryan Mayjor or Victor Villegas.
- Attend our office hours starting April 26th on Tuesdays and Fridays. Visit by WebEx, in person or by phone.
- As always, you are welcome to contact us if you have a question or suggestion.
Mockups & a shout out
A shout out to Carrie Berger and the forestry team for the awesome content they developed for county subpages! This content provided an inspiration and starting place for the focus area mockups below.
Focus area mockup.
Click mockup to view larger version.
UPDATE: Designs were updated April 10, 2019 based on your feedback. Thanks for your input!
We gave a sneak-peak of the new county landing page design at the Extension Annual Conference during Tuesday morning’s “Ask the Experts About the New Extension Website” session. See design below.
In January on your county’s landing page (homepage), you will be able to add a large hero image, background photos or shading, and calls to action. You can add a ‘quick links bar’ featuring four links to social media, events, newsletters, etc. Also highlight priority county/local programs, activities and resources.
Below is an example of Yamhill County that shows different design features you can apply. Think about how your current content will best fit into this style and where you need to write some text or find some photos.
Full details on how to create this look will be provided when design elements are ready on the live website. Please send us questions or what you think about the new designs!
Thank you for sharing your feedback at the Extension Annual Conference. And thank you for your continued hard work to create and add content to the website. We know this process isn’t always easy or straight forward. Together, we are making good progress! The website is growing as a place where Oregonians can come and easily find the amazing content you create and provide. We appreciate your hard work in making this site awesome!
Design with annotations
This is the design for large screens (desktop). Note: The wider you make your browser, the larger you will see the design. View full-sized annotated design.
Design without annotations
View full-sized design.