London | 2026-ITP-Jan | Said Fayaz Sadat | sprint 1 | WireFrame

Wireframe/index.html

@@ -10,24 +10,42 @@
     <header>
       <h1>Wireframe</h1>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        A wireframe is a simple visual guide that represents the skeletal framework of a website or application. It outlines the layout, structure, and key elements without focusing on design details like colors or images.
       </p>
     </header>
     <main>
       <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
+        <img src="rdme icon.png" alt="readme file icon" />
+        <h2>purpose of ReadMe file</h2>
         <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
+          A README file explains the purpose of a project and provides essential information for anyone who opens the repository. It helps users understand what the project does, how to set it up, and how to use it. It also guides contributors by outlining the workflow, requirements, and important details. In short, the README acts as the project’s main documentation and first point of reference.
+If you want an even shorter or more formal version, I can shape it however you like.
+
         </p>
-        <a href="">Read more</a>
+        <a href="https://www.geeksforgeeks.org/git/what-is-readme-md-file/" target="_blank">Read more</a>
       </article>
+      <article>
+        <img src="wireframe.png" alt="wireframe layout image" />
+        <h2>Purpose of a Wireframe</h2>
+        <p> 
+          A wireframe is created to show the basic structure and layout of a webpage before any colours, images, or detailed design are added. It helps you plan where elements like headings, text, buttons, and forms will go, making it easier to organise content and check that the page makes sense. Designers and developers use wireframes to agree on the layout early, so they can avoid mistakes and save time later in the project.
+
+        </p>
+        <a href="https://www.geeksforgeeks.org/blogs/what-is-wireframing/">Read more</a>
+      </article>
+      <article>
+        <img src="git.jpg" alt="git image" />
+        <h2>Branch in Git </h2>
+        <p>
+          A branch in Git is a separate workspace that lets you develop new features or make changes without affecting the main project. It keeps your work isolated so you can experiment safely, fix issues, or build improvements without breaking anything. Once the work on a branch is complete, it can be merged back into the main codebase, keeping the project organised and easy to manage.
+        </p>
+        <a href="https://www.geeksforgeeks.org/git/introduction-to-git-branch/">Read more</a>
+      </article>
+
     </main>
     <footer>
       <p>
-        This is the default, provided code and no changes have been made yet.
-      </p>
+        This was a short HTML semantics exercise. using articles tag i answered all three questions in separate articles.
     </footer>
   </body>
 </html>