-
Courses
Courses
Choosing a course is one of the most important decisions you'll ever make! View our courses and see what our students and lecturers have to say about the courses you are interested in at the links below.
-
University Life
University Life
Each year more than 4,000 choose University of Galway as their University of choice. Find out what life at University of Galway is all about here.
-
About University of Galway
About University of Galway
Since 1845, University of Galway has been sharing the highest quality teaching and research with Ireland and the world. Find out what makes our University so special – from our distinguished history to the latest news and campus developments.
-
Colleges & Schools
Colleges & Schools
University of Galway has earned international recognition as a research-led university with a commitment to top quality teaching across a range of key areas of expertise.
-
Research & Innovation
Research & Innovation
University of Galway’s vibrant research community take on some of the most pressing challenges of our times.
-
Business & Industry
Guiding Breakthrough Research at University of Galway
We explore and facilitate commercial opportunities for the research community at University of Galway, as well as facilitating industry partnership.
-
Alumni & Friends
Alumni & Friends
There are 128,000 University of Galway alumni worldwide. Stay connected to your alumni community! Join our social networks and update your details online.
-
Community Engagement
Community Engagement
At University of Galway, we believe that the best learning takes place when you apply what you learn in a real world context. That's why many of our courses include work placements or community projects.
Tables
Using Tables
Every content type that uses the WYSIWYG editor can contain tables. Simply click on the 'Table' dropdown menu and select 'Insert table with column headings' or 'Insert table with column and row headings'.
e.g.
Fruit | Colour |
---|---|
Apple | Green |
Orange | Orange |
Tomato | Red |
Lime | Green |
Blueberry | Blue |
Banana | Yellow |
Accessibility Considerations
Tables created using the WYSIWYG editor will meet accessibility guidelines if you add content to each cell (so don't leave any blank).
Also, the table may not be fully visible on small devices - especially in portrait orientation - if the table is wider than the screen. Usually, browsers don't let the user scroll sideways, so anything off the screen is invisible unless the user flip's their device to landscape orientation.
To remedy this shortcoming, always add a 'Mobile Friendly Tables' content type to your page (only add 1 - regardless of how many tables you have on your page). This content type adds the ability to scroll sideways (if necessary) to all tables on that page.
Table Options
Shading
By default, all table rows have a white background. Sometimes this makes it hard to read a line. To combat this, you can elect to have the table header, and every 2nd row shaded subtly to assist readability.
To apply shading,
- Right-click anywhere on the table
- Choose Table Properties
- Click Advanced (on the left hand side of the popup)
- In 'CSS class', add in this keyword: shaded
- Click 'Save'
Table Filters
If your table is very long, you can add the ability to filter it. This adds a field where the user can enter their filter text - once something has been typed into it, only the table rows that contain that text will remain visible. How to set this feature up is detailed in a separate example page.
Background Colours
People love to use background colours on their tables but this can make the content inaccessible to some users. Common mistakes include:
- Reducing the contrast ratio (between the text and the background) below legal limits.
- Relying on colour, alone, to indicate different categories of items. This is useless to anyone with reduced vision, colour-blindness, or relying on a screen reader (which will not read aloud that this particular table cell is, for example, red).
These mistakes must be avoided at all costs.
Selecting Colours
We've made the first mistake easy to avoid - some of the University brand's secondary colours have been defined as table row, or table cell colours. Using these colours ensures the contrast ratio remains above the minimum threshold.
Pro Tip: Less is more - when selecting background colours, don't go mad! As a rule of thumb, your web page should contain around 5 colours (6 at a stretch) - and University pages already have Maroon and White, the Grey of the side navigation bar, and the Black of the headline(s). That's 4 (not counting the Grey of the text), so try not to use any more than 2 colours on your table, unless you have good reason.
To apply a colour to a cell (or a whole row):
- Click into a cell
- Choose Table - Cell - Cell Properties
or else Table - Row - Row Properties - Click 'Advanced' (on the left hand side of the popup window)
- In the 'CSS class' field, enter one of the following values:
Colour | CSS class | Notes |
---|---|---|
Red | red | |
Blue | blue | To 1 in every 100,000 people, Blue and Dark Green are identical. To 1 in 100, they are very similar |
Dark Green | green | |
Orange | orange | 2 in every 100 will see very little difference between yellow and orange. |
Yellow | yellow | |
Light Green | lime |
To 1 in every 100, lime is very similar to both grey and orange. |
Grey | grey |
It can be difficult to tell grey and silver apart.
|
Silver | silver | |
Light Pink | pink |
Pink and white are identical to 1 in every 100 people. |
White | white | |
Normal | [no CSS class entered] | When you don't specify a class name, the font colour is a dark grey on a white background. |
To a very small number of people, all the following colours groups are identical: Red & Green, Orange & Grey, Yellow & Lime & Silver, Pink & White. |
Borders
By default, tables have no borders. Our designers had good reasons for this - it helps the flow of the page and makes it feel less crowded. This works very well when one or more of each row's cells have longer text.
Sometimes borders can aid a table's legibility, or help to isolate it from other content. For, example, the last 2 rows on the mostly coloured table, above, appear odd, because the use of background colours defined the rectangle of the table up until that point. In this case, a border would enhance the table.
To apply a border,
- Right-click anywhere on the table
- Choose Table Properties
- Click Advanced (on the left hand side of the popup)
- In 'CSS class', add in this keyword: bordered
- Click 'Save'
Column 1 | Column 2 | Column 3 | Column 4 | Column 5 |
---|---|---|---|---|
Row 1 | ||||
Row 2 | ||||
Row 3 |