Mini challenge - Create a wiki table in four steps
In this challenge, you will learn how to use wiki text (markup) for wiki tables while developing draft content for reuse in the learning materials you are developing in the course.
The purpose of this learn-by-doing challenge is to:
- Build the wiki skills to publish and edit tables in WikiEducator
- Consider requirements for the readability of online tables for mobile devices
- Learn how to customise boilerplate table markup for editing your own tables
- Prepare an initial draft of a table for use in your online content for this course
Overview
This mini challenge is divided into four steps. The table below will also serve as an example of the wiki markup for a 3 column table, which you may need to consult during step 4 of this mini challenge.
Step 1: Reflect on the advantages and disadvantages of using tables
Purpose: To be aware of the limitations of tables in an online environment
Tables are useful for organising information in a clean and readable format. They are best suited to information that has a clear and logical structure.
However, they are difficult to read when there are too many cells with large amounts of information in each cell. This is especially true when a table is viewed in portrait mode on a mobile device, because the reader may lose context of the column headings when scrolling down through a large table, or where the text in the columns is squashed together to fit a narrow screen.
For these reasons,
- Avoid using tables that have more than three columns. If there are more than three columns, consider transposing a table so there are more rows than columns, or try breaking up the information into multiple tables
- Avoid tables that contain large amounts of information in the individual cells
Step 2: Learn markup elements for a wiki table
Purpose: To learn about the wiki syntax components used to construct a basic table
| Wiki text
|
Purpose
|
| {|
|
table start, required
|
| |-
|
table row, used to signify a new row for table cells
|
| !
|
table header cell, optional. Start each consecutive header cell on a new line, each with its own single mark (!)
|
| |
|
table data cell, optional. Start consecutive table data cells on new lines, each with its own single mark (|)
|
| |}
|
table end, required
|
Step 3: Copy and paste wiki text for a basic two column table
Purpose: To copy boilerplate wiki text to get started with creating and editing tables
The following wiki text illustrates how to create a two column table with headings, which you will highlight and copy to practise editing:
{| class="oeru1"
|-
! Column 1 heading
! Column 2 heading
|-
|Cell A text
|Cell B text
|-
| Cell C text
| ''Cell D text in italics''
|-
|}
Compare the wiki text above with the table it creates (below in published view):
| Column 1 heading
|
Column 2 heading
|
| Cell A text
|
Cell B text
|
| Cell C text
|
Cell D text in italics
|
Notes
- Always include the class parameter: “
class="oeru1” immediately after the markup used for the start of a wiki table. This specifies the stylesheet used by the course website for the table and cell outlines,and the shading of rows on the published site. For the purposes of this course, avoid applying complex table styles which may not be recognised by the stylesheets on the published course site
- Avoid formatting the text of the header rows, for example bold or italics. The bold text is applied by the stylesheet specified by the class parameter above
- You can apply normal wiki markup (bold, italics, lists, links, images etc.) to data contained within cells
- To improve readability for fixing any syntax errors in wiki tables, we recommend starting each row and cell on a new line as indicated in the example above
Actions
- Open your sandbox page in a new tab or window
- Insert the following syntax
[[/Tables/|Tables]] in edit mode onto your sandbox page. This will create a subpage for practising wiki tables
- Copy the table markup for a basic two column table above, onto the tables subpage you set up on your sandbox page, and save the page
Step 4: Create a three column table with three or more rows
Purpose: To edit an existing table using wiki markup to add rows and columns
- Using a piece of paper or word processor, construct a table in a subject area of your choice (possibly for reuse in a learning sequence you are developing for this course). Your table should have:
- 3 columns
- include heading labels for each column
- 3 or more rows
- Text for each cell in every row
- Go to your sandbox page, click on the ‘Tables’ subpage you created in step three above. Construct a three column, three row table using wiki markup to adapt the two column example on that page
- Remember to save your wiki page
By clicking on the accordion below, you will find an example solution of wiki markup for a 3-column table which you can consult if you are having difficulty or encountering errors with your attempt. There is also a useful wiki tip for creating internal links to subheadings on the same wiki page.
Mini challenge - Create a wiki table in four steps
In this challenge, you will learn how to use wiki text (markup) for wiki tables while developing draft content for reuse in the learning materials you are developing in the course.
Objectives
The purpose of this learn-by-doing challenge is to:
Overview
This mini challenge is divided into four steps. The table below will also serve as an example of the wiki markup for a 3 column table, which you may need to consult during step 4 of this mini challenge.
Step 1: Reflect on the advantages and disadvantages of using tables
Purpose: To be aware of the limitations of tables in an online environment
Tables are useful for organising information in a clean and readable format. They are best suited to information that has a clear and logical structure.
However, they are difficult to read when there are too many cells with large amounts of information in each cell. This is especially true when a table is viewed in portrait mode on a mobile device, because the reader may lose context of the column headings when scrolling down through a large table, or where the text in the columns is squashed together to fit a narrow screen.
For these reasons,
Step 2: Learn markup elements for a wiki table
Purpose: To learn about the wiki syntax components used to construct a basic table
!)|)Step 3: Copy and paste wiki text for a basic two column table
Purpose: To copy boilerplate wiki text to get started with creating and editing tables
The following wiki text illustrates how to create a two column table with headings, which you will highlight and copy to practise editing:
{| class="oeru1" |- ! Column 1 heading ! Column 2 heading |- |Cell A text |Cell B text |- | Cell C text | ''Cell D text in italics'' |- |}Compare the wiki text above with the table it creates (below in published view):
Notes
class="oeru1” immediately after the markup used for the start of a wiki table. This specifies the stylesheet used by the course website for the table and cell outlines,and the shading of rows on the published site. For the purposes of this course, avoid applying complex table styles which may not be recognised by the stylesheets on the published course siteActions
[[/Tables/|Tables]]in edit mode onto your sandbox page. This will create a subpage for practising wiki tablesStep 4: Create a three column table with three or more rows
Purpose: To edit an existing table using wiki markup to add rows and columns
Feedback
By clicking on the accordion below, you will find an example solution of wiki markup for a 3-column table which you can consult if you are having difficulty or encountering errors with your attempt. There is also a useful wiki tip for creating internal links to subheadings on the same wiki page.
Project lead
Supported by
Development Partner