Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merge cells in Govspeak tables #182

Open
thomasjhughes1 opened this issue Jul 21, 2020 · 5 comments
Open

Merge cells in Govspeak tables #182

thomasjhughes1 opened this issue Jul 21, 2020 · 5 comments

Comments

@thomasjhughes1
Copy link

There isn't currently a way to merge cells in tables in Govspeak. I'm working on a piece of content that includes a lot of tables. A few of them have data that applies to multiple columns, so it would be useful if I could merge cells across the table.

I've attached screenshots of how one such table looks in Google Docs and how it looks when translated into Govspeak and published on GOV.UK.

As you can see, I've had to split this into 2 smaller tables as a workaround. I'm concerned this could lead to the information being misinterpreted by users. For example, users might think they only need to do the checks listed in one of the tables - not both.

Can someone please look into this? Thanks 🙂

Screenshot 2020-07-21 at 12 37 43

Screenshot 2020-07-21 at 12 37 33

@selfthinker
Copy link

As suggested in #110, the most common way to do that in other Markdown flavours or other plain text markup languages is by not leaving any spaces between the pipes, e.g.

|# First row      | Cell            | Very long data entry   |
|# Second row     | Cell            | Cell                   |
|# Third row      | Cell that spans across two columns      ||

@thomasjhughes1
Copy link
Author

thomasjhughes1 commented Jul 27, 2020

I came across a table in the Budget 2020 in which they've managed to merge the header cells.

Screenshot 2020-07-27 at 12 58 51

It looks like they've done this using HTML.

<table class="financial-data source-tableeditor">
<thead>
<tr>
<td>&nbsp;</td>
<th colspan="2">Employment rate</th>
<th colspan="2">Unemployment rate</th>
</tr>
<tr>
<td>&nbsp;</td>
<th class="numeric">Actual (1)</th>
<th class="numeric">Difference from UK average (3)</th>
<th class="numeric">Actual (2)</th>
<th class="numeric">Difference from UK average (3)</th>
</tr>
</thead>
<tbody>
<tr>
<th>North East</th>
<td class="numeric">71.1</td>
<td class="numeric">-5.4</td>
<td class="numeric">6.1</td>
<td class="numeric">2.3</td>
</tr>
<tr>
<th>North West</th>
<td class="numeric">75.9</td>
<td class="numeric">-0.6</td>
<td class="numeric">4.2</td>
<td class="numeric">0.4</td>
</tr>
<tr>
<th>Yorkshire & the Humber</th>
<td class="numeric">73.3</td>
<td class="numeric">-3.2</td>
<td class="numeric">4.5</td>
<td class="numeric">0.7</td>
</tr>
<tr>
<th>East Midlands</th>
<td class="numeric">78.4</td>
<td class="numeric">1.9</td>
<td class="numeric">3.6</td>
<td class="numeric">-0.2</td>
</tr>
<tr>
<th>West Midlands</th>
<td class="numeric">75.5</td>
<td class="numeric">-1.0</td>
<td class="numeric">4.4</td>
<td class="numeric">0.6</td>
</tr>
<tr>
<th>East of England</th>
<td class="numeric">78.6</td>
<td class="numeric">2.1</td>
<td class="numeric">3.3</td>
<td class="numeric">-0.5</td>
</tr>
<tr>
<th>London</th>
<td class="numeric">75.5</td>
<td class="numeric">-1.0</td>
<td class="numeric">4.3</td>
<td class="numeric">0.5</td>
</tr>
<tr>
<th>South East</th>
<td class="numeric">80.0</td>
<td class="numeric">3.5</td>
<td class="numeric">3.1</td>
<td class="numeric">-0.7</td>
</tr>
<tr>
<th>South West</th>
<td class="numeric">80.1</td>
<td class="numeric">3.6</td>
<td class="numeric">2.8</td>
<td class="numeric">-1.0</td>
</tr>
<tr>
<th>Wales</th>
<td class="numeric">74.4</td>
<td class="numeric">-2.1</td>
<td class="numeric">2.9</td>
<td class="numeric">-0.9</td>
</tr>
<tr>
<th>Scotland</th>
<td class="numeric">75.0</td>
<td class="numeric">-1.5</td>
<td class="numeric">3.5</td>
<td class="numeric">-0.3</td>
</tr>
<tr>
<th>Northern Ireland</th>
<td class="numeric">72.4</td>
<td class="numeric">-4.1</td>
<td class="numeric">2.4</td>
<td class="numeric">-1.4</td>
</tr>
<tr class="subtotal">
<th>United Kingdom</th>
<td class="numeric">76.5</td>
<td class="numeric">0.0</td>
<td class="numeric">3.8</td>
<td class="numeric">0.0</td>
</tr>
</tbody>
</table>
<table class="financial-data source-tableeditor">
<tbody>
<tr>
<td>1 Employed people as a percentage of the population (aged 16-64).</td>
</tr>
<tr>
<td>2 Unemployed people as a percentage of the economically active population (aged 16+).</td>
</tr>
<tr>
<td>3 Percentage points.</td>
</tr>
<tr>
<td>Source: Office for National Statistics</td>
</tr>
</tbody>
</table>

@thomasjhughes1
Copy link
Author

I've had a play around with this. I can get the table looking closer to how I need it to look by using the colspan HTML attribute. It's a bit more fiddly than creating Govspeak tables (which are quite fiddly themselves) and, while I might have the patience for HTML, the same can't be said for future generations of content designers.

Screenshot 2020-07-27 at 14 07 46

I'm wondering if this might be a good short-term solution for the thing I'm working on while we keep this issue open.

Are there any accessibility issues with building tables in this way?

@selfthinker
Copy link

There is no question that HTML has the feature to merge table cells. But this is a request for Govspeak as it would be very helpful if Govspeak had that feature.
By the way, the budget tables are done with the help of this table editor: https://github.com/alphagov/table-editor

I know that the team building the new publishing tool have looked into making tables easier to write. I don't know what their conclusion was or if they have finished looking into it.

@thomasjhughes1
Copy link
Author

Thanks @selfthinker. I did not know that table editor existed. I think I will make use of that for the thing I'm currently working on.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants