Skip to content

Commit ed402d8

Browse files
MacDonald91MacDonald91
committed
Complete task requiremnts
1 parent 831349e commit ed402d8

1 file changed

Lines changed: 71 additions & 57 deletions

File tree

‎Wireframe/index.html‎

Lines changed: 71 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -3,73 +3,87 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<title>Wireframe Exercise</title>
6+
<title>Wireframe Task</title>
7+
<meta
8+
name="description"
9+
content="A simple explanation of README files, wireframes, and Git branches."
10+
/>
711
<link rel="stylesheet" href="style.css" />
812
</head>
913

1014
<body>
11-
<main>
12-
<!-- Header MUST be first child of main for the CSS grid -->
13-
<header>
14-
<h1>Web Development Basics</h1>
15-
<p>
16-
This page explains the purpose of a README file, a wireframe, and a Git
17-
branch.
18-
</p>
19-
</header>
15+
<header>
16+
<h1>Web Development Fundamentals</h1>
17+
<p>
18+
This page explains README files, wireframes, and Git branches using a
19+
simple wireframe layout.
20+
</p>
21+
</header>
2022

21-
<article>
22-
<img
23-
src="placeholder.svg"
24-
alt="Illustration representing a README file"
25-
/>
26-
<h2>Purpose of a README file</h2>
27-
<p>
28-
A README file explains what a project is, how it works, and how to use
29-
it. It helps other developers understand the project quickly.
30-
</p>
31-
<a
32-
href="https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/about-readmes"
33-
>
34-
Read more
35-
</a>
36-
</article>
23+
<main>
24+
<section>
25+
<!-- README ARTICLE -->
26+
<article>
27+
<img
28+
src="placeholder.svg"
29+
alt="Illustration representing a README file"
30+
/>
31+
<h2>What is a README file?</h2>
32+
<p>
33+
A README file explains what a project is about, how to use it, and
34+
any important information someone needs before contributing to the
35+
project.
36+
</p>
37+
<a
38+
href="https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/about-readmes"
39+
target="_blank"
40+
>
41+
Read more
42+
</a>
43+
</article>
3744

38-
<article>
39-
<img
40-
src="wireframe.png"
41-
alt="Illustration showing a wireframe layout"
42-
/>
43-
<h2>Purpose of a wireframe</h2>
44-
<p>
45-
A wireframe is a simple visual plan of a webpage. It shows the layout
46-
and structure before colours, images, or styling are added.
47-
</p>
48-
<a href="https://www.productplan.com/glossary/wireframe/">
49-
Read more
50-
</a>
51-
</article>
45+
<!-- WIREFRAME ARTICLE -->
46+
<article>
47+
<img
48+
src="wireframe.png"
49+
alt="Example of a webpage wireframe layout"
50+
/>
51+
<h2>What is a wireframe?</h2>
52+
<p>
53+
A wireframe is a simple visual guide that shows the structure and
54+
layout of a webpage before design and development begins.
55+
</p>
56+
<a
57+
href="https://www.figma.com/resource-library/what-is-a-wireframe/"
58+
target="_blank"
59+
>
60+
Read more
61+
</a>
62+
</article>
5263

53-
<article>
54-
<img
55-
src="placeholder.svg"
56-
alt="Illustration representing a Git branch"
57-
/>
58-
<h2>What is a Git branch?</h2>
59-
<p>
60-
A Git branch allows developers to work on changes safely without
61-
affecting the main code until the work is ready.
62-
</p>
63-
<a
64-
href="https://git-scm.com/book/en/v2/Git-Branching-Branches-in-a-Nutshell"
65-
>
66-
Read more
67-
</a>
68-
</article>
64+
<!-- GIT BRANCH ARTICLE -->
65+
<article>
66+
<img
67+
src="placeholder.svg"
68+
alt="Diagram representing Git branches"
69+
/>
70+
<h2>What is a Git branch?</h2>
71+
<p>
72+
A Git branch allows developers to work on new features or fixes
73+
without affecting the main version of a project.
74+
</p>
75+
<a
76+
href="https://docs.github.com/en/get-started/using-git/about-branches"
77+
target="_blank"
78+
>
79+
Read more
80+
</a>
81+
</article>
82+
</section>
6983
</main>
7084

7185
<footer>
72-
<p>© 2026 Web Basics</p>
86+
<p>© 2026 CYF Wireframe Task</p>
7387
</footer>
7488
</body>
7589
</html>

0 commit comments

Comments
 (0)