What This Page Should Do

The timetable page should show useful session information in a clear structure. A table is suitable because the content has rows and columns.

The club timetable should cover Monday to Friday. Each day should have two one-hour periods, and each period should show a different activity or project focus.

Keep the content simple for now. Tutorial 2 will make the table easier to read with CSS.

Timetable Example

<table>
    <tr>
        <th>Day</th>
        <th>Period 1</th>
        <th>Period 2</th>
    </tr>
    <tr>
        <td>Monday</td>
        <td>3:15pm to 4:15pm - Scratch animation</td>
        <td>4:15pm to 5:15pm - Scratch game design</td>
    </tr>
    <tr>
        <td>Tuesday</td>
        <td>3:15pm to 4:15pm - Python basics</td>
        <td>4:15pm to 5:15pm - Python quiz program</td>
    </tr>
    <tr>
        <td>Wednesday</td>
        <td>3:15pm to 4:15pm - HTML website structure</td>
        <td>4:15pm to 5:15pm - CSS page styling</td>
    </tr>
    <tr>
        <td>Thursday</td>
        <td>3:15pm to 4:15pm - JavaScript interactions</td>
        <td>4:15pm to 5:15pm - Browser game project</td>
    </tr>
    <tr>
        <td>Friday</td>
        <td>3:15pm to 4:15pm - Mobile app planning</td>
        <td>4:15pm to 5:15pm - App prototype build</td>
    </tr>
</table>

Project Cards Example

Add a short set of project cards below the timetable. These give Tutorial 2 more content to style with Flexbox, spacing, borders and hover effects.

<section>
    <h2>Project Highlights</h2>
    <article>
        <h3>Scratch Game</h3>
        <p>Design sprites, levels and scoring for an arcade-style game.</p>
    </article>
    <article>
        <h3>Python Quiz</h3>
        <p>Use input, selection and scoring to make a quiz program.</p>
    </article>
    <article>
        <h3>Mobile App Prototype</h3>
        <p>Plan screens and features for a useful school app.</p>
    </article>
</section>

Build It Yourself

1. Create a new file called timetable.html.
2. Copy the same basic HTML structure used by the other pages.
3. Add the same navigation menu and include a link to timetable.html.
4. Add a heading that says Club Timetable.
5. Add a short paragraph explaining that the timetable may change during the term.
6. Add a table with columns for day, period 1 and period 2.
7. Add rows for Monday, Tuesday, Wednesday, Thursday and Friday.
8. Make each period one hour long.
9. Give each period a different activity, such as Scratch, Python, JavaScript, game design, website building or mobile app prototyping.
10. Add a project highlights section with three cards below the timetable.
11. Save the file and test the Timetable link from each page.

Success Checklist

• The page file is called timetable.html.
• The navigation menu includes a Timetable link.
• The page uses a table for session information.
• The table has clear column headings.
• The table covers Monday to Friday.
• Each day has two one-hour periods.
• The activities show a range of coding projects.
• The page includes project cards ready to style in Tutorial 2.
• The timetable page opens from the navigation menu.