London | 26-ITP-January | Karla Grajales | Sprint 1 | Wireframe #920

Grajales-K · 2026-01-03T00:27:22Z

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

Changelist

The purpose of this project is to understand the fundamentals of wireframing and how to develop a page structure.
We used semantic HTML specifically one

and two tags to organize the content. The

introduces the core foundations, while the tags provide detailed information on specific topics that can stand on their own. This approach improves both SEO and readability for all users

Implemented CSS Grid to maintain a consistent layout across all containers. I also prioritized accessibility by using descriptive aria-labels and semantic tags to improve readability for all users, including those using assistive technologies

Questions

no

- Added meta description for better SEO indexing. - Added descriptive alt text to all images for screen readers. - Standardized image dimensions to prevent layout shifts and improve rendering.

-aria-label - target: to open a new tab

-href in each anchor

-hover to the anchor -effects before and after

netlify · 2026-01-03T00:27:28Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`a31a003`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/695afe298ffa970008320150
😎 Deploy Preview	https://deploy-preview-920--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: 99 (🔴 down 1 from production) Best Practices: 96 (🔴 down 4 from production) SEO: 86 (no change from production) PWA: - View the detailed breakdown and full score reports

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

-link in the head fot the social Icons - added class to anchor in the main - update the footer section

-class fot buttons to the anchor main section - style for the footer

Grajales-K added 19 commits December 29, 2025 22:41

tick the check list in the PR

9100029

added a new section and 2 articles

d510d37

added border to visualize the how clamp works in main

db40dd0

added some blue style and center the header

9b30f12

update the var --space to make more smooth the transition

4920811

added title and a paragraph in the header

bdf22cb

added img for section and article

1dbaa49

changed the color of h3

1ee5ade

added information, titles and href in the buttons

4362903

updated and organized the code following the structure of its html

a2e4d09

added some options for wireframe img tag

9714b8e

update text in the main section and first article

7121945

update stylish of buttons and text

eb79083

resized images to fit in its containers

00cc5df

refactor: improve SEO and accessibility for onboarding page

5f6b40d

- Added meta description for better SEO indexing. - Added descriptive alt text to all images for screen readers. - Standardized image dimensions to prevent layout shifts and improve rendering.

added to the tag anchor

6152f4b

-aria-label - target: to open a new tab

fixed

19546d9

-href in each anchor

added

46ba5d8

-hover to the anchor -effects before and after

briefly explanation of the project

b0dfa1a