Launching your website is an exciting milestone—congratulations! To help you transition smoothly, we’ve created this quick checklist. Follow these steps before submitting your go-live request:

Steps to Launching Your Site

1. Update All Content

Double-check that all your website content is present and up to date on your staging site. This includes recent pages, posts, events, media (like images and documents), and any other updates.

For example, if you added an event to your old site while your cuTheme site was on staging, you will have to recreate that content. The sites are not connected.

Blank Installs

If you had a blank site installed (versus a migration), please ensure that you have uploaded any required media from your old site to your cutheme site on staging (images, PDF files, docs etc)

2. Export Form Entries

If your old site includes active forms, export any recent submissions to ensure you don’t lose important data collected during the migration period.

3. Submit Your Go-Live Request

Once everything is ready, submit your go-live . Please allow up to a week for the team to schedule and complete the process.

4. No Further Changes

After submitting your request, avoid making additional changes to your site. This ensures that everything you’ve worked on is accurately reflected during deployment and helps us deliver a smooth launch.

By following this checklist, you’ll help set your website up for a successful launch. If you have questions or need support, we’re here to help—just reach out!

The post cuTheme Go Live Checklist appeared first on Web Services.

We are getting close! Very soon we will be starting to move websites from the CCMS and Framework templates into the new cuTheme.

cuTheme and the new WordPress Gutenberg admin interface are all about choice and with the migration process we are extending that idea: You will have a choice on how your site is prepped for its reconstruction in the new theme.

What are these choices? Very briefly, we will be placing all sites on a staging server (where your site cannot be viewed) where it will be made ready for moving onto the production server (i.e., the live space where it can viewed by the entire world).

Your choice is between having a clean installation or a migrated installation.

• We can create a clean installation – in other words, a blank, or empty site, for you to move your content into piece by piece
• We can execute a migrated installation of your content for you, but this will be everything on your site.

Your choice is between these two.

With the migrated installation we can currently migrate about 90% of the content on a website. We are nearly done working out the migration plan and are looking at ways to make that 100%. You will have to move the pieces we can’t, and you will be responsible for cleaning up all the content.

With a clean installation, we see a huge advantage to you: the blank canvas which will enable you much more easily to cut loose any old content, any orphan pages, old events, news stories from 1996, etc. Your site will be sleek, streamlined, and beautiful, with the advantage of users finding content easily – with the same advantage extended to the Google algorithm as it searches through your pages.

In the meantime, we are researching ways to move some areas of content while leaving others blank for you to recreate using all the amazing new features which cuTheme offers. That will take away some of the tedium of rebuilding news posts, for example, and enable you to concentrate on the fun task of re-organizing your site and crafting beautiful pages with all the new bells and whistles on offer.

Watch this space for further news on our migration plan, which will be coming your way very soon.

In the meantime, there are some things that you can do to get your site ready for the migration cuTheme!

The post Choices, choices: migration planning for cuTheme appeared first on Web Services.

One exciting development we can’t wait to bring to you with cuTheme is the top navigation menu.

Top refers to the position of the navigation in the new template – it runs horizontally across the top of all your pages. It is a real leap for us as well as for you, but once you start looking at what most other major websites do in terms of positioning their site menus, you will quickly find that most big-hitters have already adopted this approach.

Whether you read your news on the , , or , buy your clothes at or , or dine at or , you are going to find that top nav menus have become the norm. We are adopting the top nav menu for many reasons including consistency of look and feel, availability of more real estate for your content on the page, and improvement of accessibility.

The best thing on the menu

Let’s take a look at the benefits in detail:

Accessibility

This menu is in the same place on every site AND when you scroll down the page

Usability

As we say, an accessible website is a usable website: those same reasons that help people with disabilities help anyone browsing a ĐÓ°ÉÔ­´´ site

Consistency

Now people will enjoy the same position for the menu on all cuTheme sites, plus other major sites such as Students, Admissions, and Graduate Studies

Real estate

Removing the left hand nav means we can use much more of the page – and look out some additional widening options in cuTheme

Resourcing

Web developers in our team no longer have to check every template change works with top and left nav as they do with Framework at the moment. this means more time to develop the new features you request.

How to get to the top in website layout

Start by looking at the pages on your website.

• Are they organized hierarchically? The most important pages should be at the top level with subpages beneath.
• If your site is an academic department focused on recruitment, do you have items for prospective students and current students? Can prospective applicants get to the info they need quickly?
• Are important pages buried? Do they need to be moved up the hierarchy/made top-level?
• View your pages from the back end: We have a tool for this you can learn about and initiate here.
• Talk to the people who deal with inquiries around information via other media in your department, for example, front of office colleagues. Are they constantly fielding calls or emails because people can’t find certain info on your site? Should that info be highlighted in the menu?
• Look at other departments and even other universities to see what they are doing well. Co-opt their ideas.

We have a whole checklist of things to do in order to create the perfect navigation menu in an earlier post.

Who’s in the business of effective top nav menus? Sprott!

Now let’s dive in and see a great example of how to consolidate the menu into just a few items. The are the epitome of menu consolidation. Sprott, of course, hosts a lot of content on their site, so they needed to be economic and efficient in how they organize their menu.

Of course, they knocked it out of the park. They have four navigation items on their top nav. We featured the reorganization of their site in a news story An Exemplar cuTheme Site: The Sprott Success. In that post, Liz Lariviere from Sprott explains that they as a team, “started by benchmarking about 25 different Business school websites [in Canada and the US] … We looked at their nav, web architecture, and content. We noticed that the better sites had 3-4 menu items and their content was succinct and very visual.”

Notice that the Sprott team inserted an innovative item on the menu labelled I am. This avatar-led approach (creating the idea of a role or path that a person visiting the site is on) is another great way to channel a user to the content they need or want. Avatar roles could include “I am a future student“, “I am a student seeking an accommodation”  or even, “I am a visitor to campus seeking a sandwich.”

We are so excited to see how you take on the challenge and opportunities offered by creating a top navigation menu on your site when it comes to migrating your site(s) to the new cuTheme template!

The post Coming out on top: the new top nav menu in cuTheme appeared first on Web Services.

Reviewing your website thoroughly before migrating it, lets you start off on the right foot and can make for a smoother transition. It is also beneficial to your current visitors!

Here are four steps to help you prepare your website for migration to cuTheme.

Step 1: Do a Content Audit

• Evaluate the relevance and quality of your content. Remove outdated information.
• Delete old pages and posts. Clear out obsolete news, events, people listings, files, etc.
• Rewrite content for the web to optimize for both Search Engine Optimization (SEO) and accessibility.
• Look for and fix broken links

Resources

• Website Review Training – How to do a Content Audit
• Spring Cleaning your Website – not limited to spring 🙂
• Tips for optimizing for SEO and accessibility

Step 2: Ensure your Content is Accessible

• Review your website’s accessibility according to AODA guidelines.
  • Ensure that it’s easily navigable for users with disabilities
  • Including proper alt text for images
  • Use headings and subheadings and use in the correct order (hierarchically)
• This is good practice to ensure a site that is easy to navigate and use for all visitors.

Resources

• Online accessibility training – Learn how to make more accessible text, images, tables and videos
• Web accessibility checklist
• Alt Text
  • All about Alt Text
  • Describing people in Alt text

Step 3: Review Your Navigation Menu

The menu in cuTheme is top-of-page only (no side option). You may need to rethink your navigation depending on the length. We recommend reviewing it periodically anyway as things evolve on your site!

Simplify your Navigation

• Streamline your menu items to make navigation intuitive and efficient. Consider categorizing content logically and using sub-items where necessary.
• Limit top-level menu items to (4-7 is what we recommend). This makes it easier to navigate for the user, plus ensures it will fit
• Review top-level items. Top-level menu items with subpages won’t act as landing pages in cuTheme. Do you need to rethink your structure?

Resources

• Menu magic – Tips for improving user experience via navigation
• Coming out on top: the new top nav menu in cuTheme

Step 4: Review and Renew Your Homepage

Note: This step is optional for migration, but can enhance your site immediately and ensure your homepage is in top shape.

cuTheme will present you with a lot more design options for your homepage. However, content is still Queen! Now is a great time to rethink the most important elements of your homepage.  Prep the content now and then style it up in cuTheme.

Have Clear Calls-to-Action (CTAs)

• Place a prominent CTA that aligns with your primary goal (e.g., register for a program, get to a service, contact your department). Make it stand out without overwhelming the page.

Create a Visual Hierarchy

• Organize content using a clear visual hierarchy. Use headings, images, and white space strategically to guide visitors through the page.

Use Dynamic Elements

• Consider incorporating dynamic elements like videos and news posts to engage visitors and convey information effectively.

Update Images

• Make sure to refresh images from time to time so they are current. This keeps your homepage from looking stale and dated,

Resources

• Reorganize your homepage – Tips & ideas for renewing your homepage content
• Calls to Action – What they are, examples, and best practices!
• Structure content on your pages – From our Writing for the Web Series, tips making your pages easy to scan
• Video
  • Generate transcripts and captions
  • Make video accessible
• Images
  • Finding images for your site – the ultimate guide …
  • Optimizing your images for SEO and accessibility

Download our cuTheme Readiness Checklist

The post cuTheme Ready – Prepare your Site for a Seamless Migration! appeared first on Web Services.

If you clicked on the headline for this post and expected an article on a player who stops the quarterback from scoring a touchdown then congratulations – you know less about American football than I do (and that is quite the achievement). Instead, today we are talking about a new feature that you will see in the new cuTheme template when it is launched.

What is a back end block check?

In the new template we are employing WordPress’ latest administration interface. This uses blocks – components which house each individual piece of content that can be edited separately and which together compose the page. (You can read more about our adoption of WordPress’ Gutenberg interface.)

That’s the back end block. The check aspect is a small function we use to ensure that any block created on a page goes out into the world as its creator intended.

What does the check do?

The function works to make sure an element is not added to the page which makes the page less accessible. As with all aspects of accessibility, making the page better for those with disabilities makes it better for everyone else.

That is what the check does – makes sure a component, for example, isn’t published with no text in it, or if it is supposed to have a hyperlink attached, that this is present.

An example: the button block

As with every component on a page in cuTheme, to add a button you now employ a block to do so. Handily, our developers named this the Button block. On the front end of the site it looks like this:

And here is how it appears when you are editing the page in the back end:

(Let’s just take a hot second to admire the neat thing about Gutenberg: the back end as you edit it looks so much like the front end, you have a much clearer idea of how your page or post will look before you hit the Update button!)

Anyway, that is how the button is supposed to look in the back end. What happens, though, if you fail to add text or a URL to the attributes of the button? You get back end check blocked, that’s what happens!:

If I remove the URL:

Meanwhile, in the top right hand corner of the admin screen you will notice something else going on when there is no URL or text. I this example I have added neither:

That’s right: the Publish/Update button remains greyed out until there is entries for text and a URL are inserted.

What’s another example?

If you use the video embed block you can place a video player, cued to display your chosen video when the page loads. The stipulation is however that the video link you embed must be from one of the providers the University wants us to accommodate: YouTube, Vimeo, Kaltura, or TED.

So, if we add something that is not a valid URL, first of all, we will see the checker block the page from being saved:

And the same is true if we include a URL which is technically valid, but which doesn’t point to a YouTube, Vimeo, Kaltura or TED address. For instance, from the rogue video website, TheyTube instead of YouTube:

Again, that error message appears, but check out what also happens with back end checks: you notice the Update button in the top right is greyed out. Tht’s right – you can’t save the page while that error exists.

Table manners

Here is one more example of something we have programmed in to check that blocks and their content are valid. Tables, which are there to display tabular data and not to lay out a page, must have properly defined column headings. This is for accessibility’s sake – users employing screen readers hear potentially misleading information about tables without column headers.

Therefore placeholder text is in the column header cells to remind you to add text to label the headers (with the imaginative text of Header label).

We hope you share our understanding that these checks will enable our community to create even more accessible and usable content as we move all our sites into cuTheme.

You can still leave these blank but you will find the button to update or publish the page is greyed out. This is a measure to protect accessibility of the page, of course, so we know you will understand why this measure has been implemented.

These are some of the blocks you will encounter in cuTheme and some of the ways we ensure they are released into the wild in good working order, insuring more usable and accessible content. The other portion of that insurance is all the amazing website content editors on campus continuing to create great, usable, and accessible content!

The post Back end block checks: helping you to help your website appeared first on Web Services.

In the last few days of October we were alerted to a bot attack on a form on one of ĐÓ°ÉÔ­´´’s hundreds of websites. Because the email account to which the form submissions were sent is not monitored, the attack went unreported for a longer period of time. In just a few days a form was submitted over 19,000 times.

Eek!

We shut the form down (it was no longer in use) and no harm was done apart from 19,000 form entries to be deleted from the database, but this is a good time to remind ourselves about why forms are subject to these attacks and how to stop them.

Why me?

Bots are let loose on a relatively frequent basis against forms on ĐÓ°ÉÔ­´´’s websites. The forms they attack may seem random, but the point of these attacks is that they do not care if your form is popular or obscure. The aim of bots is to seek out fundamental flaws in a web server and exploit those vulnerabilities. John Conde, an admin at Stack Exchange’s Webmasters forum summarizes it thus:

They search for and fill in every form they can find. They’re looking for any vulnerability that they can exploit for their gain. It might be to see if they can gain access to your site or web server. It can be to compromise your form to send out spam.

It’s worth their time to do because it’s all automated. They just set their bots free and let them go about their business. Their cost is low and the potential reward is high.

(You can on the Stack Exchange forum.)

Of course, ĐÓ°ÉÔ­´´ has measures in place to stop such attacks but you can add to this security with a few straightforward steps.

Stand by to repel bots!

Thankfully there are steps to take which can automatically do away with most bot attacks against your forms. Let’s take a look at how to employ these.

1. Add a reCAPTCHA field (see below) – Web Services offers a reCAPTCHA field element for all forms on sites in the ĐÓ°ÉÔ­´´ template. This field – we have all seen them – enables a non-robotic user to confirm their humanity with a tick. If there is some question as to whether you are a human or not you might be asked to prove this by demonstrating you know what a traffic light or a bicycle is. We’ll ignore the fact that it’s a computer making you prove you are not a computer. For details on how to implement this fix, see below.
2. Turn off your forms if they are not in use. Although many forms are in continual use, many are seasonal or one use. For example, you may have a form which you embed in an event in order to allow users to register. You might want to use the form again next year. However, once registration is over for this year then you can go into the forms and switch if off. (See below.)
3. Ensure the admin notifications for the administrator are set to go to a real email address. If you don’t then the form can accrue tens of thousands of submissions before anyone notices. Plus any genuine submissions are missed, even if your form is not attacked by bots. To check how to add the email address, please see below.

Adding reCAPTCHA

The main way to forestall the attack of the bots is to employ a reCAPTCHA field. To add this there are a couple of steps to carry out.

1. Check your website has this feature enabled. reCAPTCHA is enabled by a license key so we switch it on as requested (partly because when we first purchased this tool we had 600 websites already). To check this, go to a form in the back end of your website and see if you can add the field. This can be seen by looking in the Advanced Fields area:

If it doesn’t appear then proceed to step 2. Otherwise, you can go to step 3.

2. If it is not there please submit a request to the ITS Service desk

3. Once it is enabled you can then add a reCAPTCHA field. Go into Forms > followed by clicking on the name of your form, click on Advanced Fields and then CAPTCHA (as in the image above).

Once you have updated the page you can see on the form that your users will need to check the box before they submit the form.

Switching off forms

When a form is not in use, you can switch it off, making it invisible to people visiting the page where it is hosted. To do so:

1. In the back end of your website, click on the Forms link on the left hand side.
2. You will see a list of forms, each of which has a switch button next to its name.
3. Click on the switch to turn the form off.

Once off, the form will no longer on the page.

Direct your form submissions to their rightful home

It’s important to make sure your admin notifications go to the correct email address. If you do not set the address, all submissions will go to the Web Services junk mail folder. If your form receives 20,000 bot-generated submissions, no one will know. Even if it doesn’t, all genuine submissions will be lost to the ether.

To make sure the submissions go to the correct email address:

1. Hover over the form name in the back end of your site and click on Notifications.
2. Click on Admin.
3. In the To: field, paste in your or your admin’s email address. Save the notification.

—

Now you have some methods to protect your forms from bot attack.

We will leave you with the exciting news that in cuTheme 2.0, all sites will have CAPTCHA switched on by default. Additionally, we will have some templated forms for your general needs, and all of these will have CAPTCHA switched on by default. Watch this space!

The post Defence is the best form of defence: Protecting forms on your website appeared first on Web Services.

A well-structured and user-friendly menu can make or break the user experience on your website. As a content manager, your job is to create a menu that allows people to easily find what they are looking for.

In this post, I share some best practices for creating effective website navigation. A well-thought-out menu enhances user experience which also helps you meet your website goals.

Website Menu Tips & Tricks

1. Take Inventory

Start by looking at the pages on your website. Are they organized in hierarchically? The most important pages should be at the top level and subpages beneath.

2. Define Your Website’s Structure

Next, it is time to make sure you have a clear understanding of your content and site structure. Begin by identifying the main sections or categories your website will have. For example, these could be things like ĐÓ°ÉÔ­´´ Us, Programs, Services, News, and Contact. The goal is to create a logical and organized hierarchy of information.

When organizing your content, decide what the most important information is. Then work your way down. This will help you figure out what should be at the top level of your menu, and what should be nested below at the second or third level.

3. Keep your Visitors Top of Mind

Who is your main audience? Gear your navigation towards them. What are they doing when they come to your site? Think about navigating your site from their perspective. Are key things apparent and easy to find? Can you simplify even more?

4. Prioritize Content

Once you have your main sections in mind, it’s time to prioritize your content. Decide which sections or pages are the most important and should be prominent. These will form the top level of your navigation menu.

Following, are some of the critical pages typically found on ĐÓ°ÉÔ­´´ sites. But note, your priorities may vary based on your website’s goals and content:

• ĐÓ°ÉÔ­´´
• Programs
• Future Students
• Current Students
• Research
• News & Events
• Contact

5. Keep it Simple

Avoid overwhelming your visitors with too many menu items. Limit the number of main menu options to around 5-7 items based on importance. Too many choices can confuse users and lead to choice paralysis.

Note: Our new web theme will feature top navigation. It will be important not to have a super long menu as this prime real estate is limited.

Group sub-menu items under main headings to make it intuitive. For example:

• Talks and Workshops
  • Web Wednesday Workshops
  • Coffee Break Events
  • Training

6. Pay Attention to Order

Put the most important items first and last. According to the primary and recency effect, users remember (or notice) the first and last items the most.

Put the most important items at the start of your nav, and the least important in the middle. We recommend putting Contact at the end (or far right in a top nav), a standard location.

7. Choose Labels

Use short, clear link labels. Don’t use jargon or unfamiliar terms. What makes sense to your user? By default, WordPress takes the page name for the menu label but you can change it. For example, if your page is called “Events for Health Science Students” you can change the menu label to “Student Events” or simply “Events.”

The goal is to make it as easy as possible for your site visitors to know what they are going to get when they click a link.

8. Get users to do Something

While most of your menu is object-based (kind of like a table of contents) you may also have some action-based items. For example, a place students can click to “Apply.” Consider using a special nav item for Calls to Action (CTAs) that make them stand out. for example, this could be a button on the left-hand nav bar in our cms template (see “Get Support” on the left of this site) or at the top right in our new theme.

9. Monitor and Adjust

Once your menu is live, continue to monitor user behavior and gather feedback. Ask users what they think. Analyze interactions with your navigation menu using Google Analytics. Make adjustments based on user preferences and your evolving content and site needs.

Great Menu Examples from Around ĐÓ°ÉÔ­´´

• (love this minimalist approach!)
• Geography
• Sociology/Anthropology
• FPA

Need help with your menu?

Get in touch with us!

The post Menu Magic: Create a Great User Experience appeared first on Web Services.

There are a lot of great improvements to the ĐÓ°ÉÔ­´´ web template on the horizon when we launch cuTheme. Something we are excited for is the removal of the ability to edit a page by adding HTML, Javascript, and styling.

In this post we outline why we need to make this critical move. There are several reasons that having the ability on hand to edit HTML is a liability for your end users.

Accessibility

If there is one good reason to remove the ability to edit HTML code it is the potential for rogue code to harm the accessibility of a web page.

The example often used to show the harm HTML code can do is coloured text. We have very dark text for a reason – it contrasts well with our light background and colour contrast is key to the legibility and scanability of text. With the HTML editor in place a website maintainer could place very light text on our white background making it invisible to those with vision challenges. Keeping the text within certain tones makes sure the text is as legible as possible. Remember, someone does not have to have particularly bad eyesight in order to find it a strain to make out light text on a light background.

People also use HTML to colour code text, giving it meanings that are implicit but only to those who can perceive them. Changing text to render in red, amber, and green to illustrate bad, neutral, or good items only works if people can view those colours. One in twelve of some demographics can’t distinguish red from green, making this practice misleading and even possibly dangerous.

That’s the classic example. But in fact a more important instance of changing the attributes of a font comes with using HTML and JavaScript to change the size and weight of text. Imagine you want to write the word Warning in a way that makes it more noticeable. One way would be to make the text much bigger using HTML code. But by doing that you are confusing users especially those whose neurodivergence manifest in the form of a difficulty in how a page of information is laid out.

By using HTML to show text at the same or similar size to one of our subheadings, the user believes the word Warning denotes a section of the page when it is doesn’t. It then becomes unclear what is a page section and what it isn’t. And if you use it to set the size of the text for a heading, then you are going to confuse humans and the screen readers they employ.

Usability

That also illustrates a good example in the crossover between usability and accessibility. Usability – how easy it is to move around, identify, take in and interact with page content on a website – is affected by many of the same concerns that affect accessibility.

People also use HTML to manipulate colour of links. Links in text in the CCMS render as red, with the exact tone double checked to match the . If that colour is then used to highlight something, people assume it is a link. When they can’t click on it they are confused.

Consistency

That previous illustration also refers to consistency. Another practice is to use a different colour on links so some are red and some are blue. Elsewhere a subheading in the text might be blue. This means someone might click on it, only to find nothing happens. Confusion all around!

Ease of maintenance

But why limit confusion to the front end of a website when an editor can also cause mayhem in the backend too? Remember that not everyone has the coding knowledge that one team member might possess. That’s fine when the coding guru is around, but if they win the lottery (or go on vacation for a week) and aren’t available then the colleague who steps in to make a change might be left scratching their head as to how to edit the page. They are confronted by a set of code they don’t understand. The most likely thing is that they will break the code making the page even more unpredictable to users.

Risk of errors

Introducing HTML code – or trying to fix it when its creator has gone on vacation – can also create havoc with other elements on the page. Why? Because the CCMS template is created using a combination of HTML, CSS, and PHP, but also a series of Javascript libraries. Injecting code into the page can interfere with that. In the very simplest example, failing to close a font tag code make the rest of the text on the page red.

We have a team of developers who spend days on end testing for how content can break the code in the template. Let’s make not make their jobs harder.

Security

Finally, there is the safety aspect. With an HTML editor enabled, there is always the fear that malicious actors can inject code that does harm to the site or the whole network. HTML injection attacks involve inserting malicious HTML elements or tags into the content created with the editor. This can result in the manipulation of the page’s structure and content, potentially leading to security vulnerabilities or phishing attempts. URLs can be placed in a page that lead to websites whose owners have criminal intent, for instance. Similarly, JavaScript can be injected as a potentially more powerful security threat than HTML.

In the future we will give some guidance on how to achieve some of the things previously rendered by adding code in the page. Until then, we will give you time to mourn loss of the

SUPERPOWERS

associated with the HTML editor.

The post End of an error: removing the HTML code editor in WordPress appeared first on Web Services.

Back to school is an exciting and busy time for most of us. It is where we reorganize ourselves to ensure a fresh start for the upcoming school year. For students, that may look more like organizing school supplies and timetables, and for staff and faculty, that looks more like organizing sites. If you lack the time to reorganize your whole site, don’t panic! Your site will look all fresh and new with just a simple homepage spruce-up!

1. Quicklinks Makeover

Quick Links are one of the prime features of your homepage. They add an extensive visual element to your page, which helps make your site appealing. Additionally, they drive traffic to other sections of your site and help your audience reach key pages.

Quick Links should:

• Link to your top-viewed pages and/or pages where you want traffic directed. You can view your site’s top-viewed pages through your Google Analytics. This is all covered in our post on Page Visits in Google Analytics.
• Include excerpts which are short descriptions of the page it links to.
• Include engaging, eye-catchy images.

For more information on Quick Links, you can visit our What to put in your Quicklinks post.

2. Modernizing Images and Videos

Images are everything. They set the tone of your site, especially the ones on your homepage. Therefore, it is crucial that the images you choose are attractive, and represent your current audience. By this phrase, we mean selecting high-quality images, as well as updating your images and videos every so often that reflect your site in today’s world.

3. Calls to Action are Your Friend

Calls to action (CTA), are anything you include on your site that encourages a person to take a certain action. CTA is important because your audience is directly engaging with your site. Popular calls to action include the “register” button for an event or a “subscribe” button to a newsletter. CTA can be added to your page as a button, a Quick Link, or as linked text. For more information on CTA, visit our Calls to Action post.

4. Keeping up with Current Events

Keep your homepage up-to-date by promoting upcoming events and recent news with News and Events Listings. This will help ensure your site’s content is fresh and lively and has the appeal that your site is being regularly monitored and cared for. Additionally, it also keeps the community excited and regularly informed about what is going on in your department.

5. Steering your Site in the Right Direction

Lastly, you want to make sure your homepage is in line with ĐÓ°ÉÔ­´´’s image and the University’s current brand guidelines. This includes elements such as the brand, visual identity, typography, colours, photography and graphic elements. Reflecting these elements on your homepage helps create a consistent user-experience across the ĐÓ°ÉÔ­´´ domain. For more information visit ĐÓ°ÉÔ­´´ Master Brand Guide.

Still interested in learning more about homepages? Visit our post on How to Make your Homepage Visually Appealing. 

The post Back to School: Ensuring a Happy, Healthy, Homepage appeared first on Web Services.

Preparing for the new cuTheme migration can be very exciting, although, it can also be a bit overwhelming as it is a big change. A few of our sites, such as the , were a part of our cuTheme pilot project and have successfully helped pave the way for this new transition across the ĐÓ°ÉÔ­´´ domain. Unlike other faculty sites, all programs within Sprott are represented by this site. We had the opportunity to interview , the star behind the Sprott website. She provided us with insights on the overall clean-up and organization process, metrics, and navigation, as well as her additional advice on website management.

Clean-up Process

Regarding the minimalistic and clean look of the site, how did you manage to classify all the Sprott pages under just four menu categories (Programs, ĐÓ°ÉÔ­´´ Us, Research and, I am:? ). Were there other menu categories you were considering? Did you always have just these four categories, if not, what was the organization process like, and how long did it take?

“This took about 6-8 months of research and re-organizing. We [myself and Kim Swartz, Media & Relations Officer and our Comms Team Lead] started by benchmarking about 25 different Business school websites. Half were Canadian and the rest were bigger-named Ivy League schools, both American and International. We looked at their nav, web architecture, and content. We noticed that the better sites had 3-4 menu items and their content was succinct and very visual.

Then we took a full inventory of our 500+ pages and cleaned up any orphaned pages, anything that was outdated or didn’t NEED to be on the external website, which was a huge job. (As a faculty, we don’t have departments like others do, so our website covers everything Sprott) Staff and Faculty info was moved over to the intranet and we overhauled our UG current students section after 4 years and a few different people in those roles. We got it down to about 325 pages. Then I had to take all those pages and fit them into our new categories. If it didn’t quite fit, we had to decide if it belonged on the website and/or what to do with it. The other thing we had to keep in mind is that websites aren’t as linear as they used to be, so we also limited our structure to 2-3 levels, otherwise, it was just too much! I think I had 6 different spreadsheets before we decided we were happy with it and it made sense. It was a huge job, but I’m so glad we did it. It was clearing off and reorganizing a messy desk and starting fresh!”

Audience Filtering in Menu Bar

The I am: section is a unique touch that other ĐÓ°ÉÔ­´´ websites have not included in their menu bar. Do you believe this menu category is an effective way for users to find the content they are looking for? Would you recommend other departmental sites across ĐÓ°ÉÔ­´´ include this category in their menu as well?

“I do! I have to admit we “borrowed” this from another website we came across in our research. Our 2 major audiences are 1) prospective students and 2) current students. The “I am a…” menu allows the visitor to select the audience they belong to, and us to easily deliver our messaging and content specifically for them. Of course, they can get to those same pages in other ways, like search, but this menu gives us the option of an audience filter vs content filter.”

Google Analytics

Do you track your Google Analytics often, and if so, do your analytics have a big impact on the way you display content on your site?

“Yes! We’ve always tracked GA and review monthly reports. Our site follows some solid trends during the academic year, but sometimes we do get surprises and it’s always good to have the numbers to fall back on to figure out the “why” – whether it was positive or less than positive. It shows us what our stakeholders are looking for and when, and allows us to make changes if they aren’t seeing the content we want/need them to see too. We relied on our GA stats a lot when we were re-structuring the website for CUTheme too. If a page wasn’t getting views, did we need it? If yes, we had to figure out how to redevelop that content. If not, it allowed us to build a case as to why it shouldn’t be web content. It also gives us insight on other aspects of comms, like whether or not a social campaign was successful, and what kind of stories resonate with our community.”

Top Navigation System

I noticed the Sprott site uses a top navigation system. Have you noticed an improvement in user experience when switching from side navigation to top navigation?

“Previous to CUTheme, we were on Framework and a totally custom template before that one, so Sprott has always had a top nav. It’s also in line with industry standards and trends.  So while I can’t compare it to a side nav, we did reduce the “laundry list” of 8-9 menu items and that’s been an improvement. We noticed an increase in traffic, more time spent on pages, and lower bounce rates in some places. We also realize a lot of users just search, so we also worked on improving our SEO. #TeamTopNav!”

Additional Advice

Do you have any advice for our other clients who manage ĐÓ°ÉÔ­´´ sites?

“I think my advice would be to always ask yourself (or your colleagues) is does this NEED to be on an external website and what value is it providing to the stakeholder, especially if you’re managing a larger site. Content can balloon quickly, so sometimes we have to step back and evaluate the best way to communicate our message. I also try to do a yearly review with our different teams and clean up anything that’s outdated or no longer providing value and that helps us keep on top of our content.”

The post An Exemplar cuTheme Site: The Sprott Success appeared first on Web Services.