Sheffield | 26-ITP-jan | Richard Frimpong | Sprint 1 | Wireframe to web code

[Richiealx]

Learners, PR Template

Self checklist

• I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
• My changes meet the requirements of the task
• I have tested my changes
• My changes follow the style guide (https://curriculum.codeyourfuture.io/guides/reviewing/style-guide/)

Changelist

Summary

Converted the provided wireframe into a webpage using semantic HTML and CSS.

The layout follows the provided wireframe and demonstrates:

• Semantic page structure
• Grid-based layout
• Accessibility considerations
• Correct Git branching and workflow

Testing

• Opened locally using Live Server
• Lighthouse Accessibility score: 100

Questions

No questions at the moment. I would appreciate any feedback on structure or accessibility improvements.

[netlify]

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	78d4559
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/6972c3151ea96a00084a7d0c
😎 Deploy Preview	https://deploy-preview-1002--cyf-onboarding-module.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	2 paths audited Performance: 100 (no change from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 90 (🟢 up 4 from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[cjyuan]

1

Can you update the Markdown syntax of the checked checkboxes in the PR description to make them look like this

• My changes meet the requirements of the task
  instead of like this
• [x ] My changes meet the requirements of the task

2

When a wireframe is provided, our implementation should closely reflect its appearance and layout to ensure consistency with design expectations. You're off to a solid start. To better align with the wireframe, here are a few areas where the layout and appearance could be refined:

• Center the PAGE TITLE and the SUBTITLE
• Layout the 2nd and 3rd articles side by side beneath the 1st article.

[Richiealx]

Thanks for the feedback.

I have:

• Fixed the checkbox formatting in the PR description
• Centered the page title and subtitle
• Updated the layout so the 2nd and 3rd articles appear side by side beneath the first article

I have also re-run Lighthouse and confirmed Accessibility is 100.

[cjyuan]

Changes look good. Well done!

In CYF, in addition to responding to reviewer's comments, trainees should also add "Needs review" label when their PR is ready to be re-reviewed. Without the "Needs review" label, the reviewer won't know if a PR is ready to be reviewed.