Home About Us Our Services Blog

Creating CVUO's Massive Site

11 Jan 2020

Campus Vibez uOttawa, also known as CVUO, is an organization that operates at the University of Ottawa. Their website was meant to give students access to multiple resources, as well as act as a place for blogging, event promotions, and a giant list of items each with their own descriptions, pictures, descriptions and links. The site would have more than a thousand different pages and over 20 different unique designs.

The Navigation

The first thing to figure out was the navigation bar for the site. We wanted to nest as much information as we could in the navigation bar without it getting too cluttered. The navigation bar also had to be available in both English and French since it was a bilingual website. For the English and French navigation we made two different navigation bars for the site one in each language and would only show the English navigation bar on the English pages and the French navigation on the French pages, with a navigation link to switch between languages.

For the rest we divided up all the pages into a few categories; Resources, Clubs, Events, Misc, and Home. The Misc. items would be anything else the organization wants to add in the future. Under resources we added the major resources categories and the navigation bar was good to go.

The Design

Since the site contained a large amount of information the design had to focus on accessibility more than anything else. Instead of a large scroll indexed home page we instead opted for a small page divided by 6 rectangles for each of the sites categories. Each ‘rectangle’ would feature images with big block text that would let you navigate the whole site straight from the home page.

As the user got deeper into the site more of these ‘rectangles’ would appear whenever a category was being divided up into many smaller ones. This was specially useful when dividing up all the organizations resources and all of it’s different clubs.

The attractiveness of the website was highly dependent on the pictures for each ‘rectangle’ and for the smooth hover indicators. Using Squarespaces’ built in Ajax loading we were able to make jumping from page to page of the site a lot smoother, which was important since there was a lot of that happening on this site. Went with a simple Sans Serif font and made all the backgrounds white for a minimalist design that matched the organizations social presence.

SEO and getting visitors

There isn’t a lot of competition to consider when working with a university organization. The target audience is the students enrolled in that university and will already be looking for the website. The only competition was small organizations that were doing similar things and also uOttawa’s own website that would show up near the top for the relevant search queries. Due to the website being so deep the site’s bounce rates were organically very low so that was a good head start.

Next we started by name every picture (and there were a lot of them) with relevant file names, adding relevant headings and keywords at the top of the page. Also got the website to be featured on a few other uOttawa related websites, notably uOttawa’s own site and also the Student Union operating on campus, to create a small back link environment.

It wasn’t long before it showed up on first on Google for the requested search query (uOttawa Clubs) and is now drawing most of it’s visitors from Google. Once the website launched we also made a few social posts to boost a large first day audience, which always helps.