diff --git a/.github/Articles.md b/.github/Articles.md
new file mode 100644
index 000000000..169ee65ac
--- /dev/null
+++ b/.github/Articles.md
@@ -0,0 +1,56 @@
+1. What is the purpose of a README file?
+1. What is the purpose of a wireframe?
+1. What is a branch in Git?
+
+
+
+
+What is the purpose of the README file?
+
+A README file, or "Read Me" file, is a text document that provides essential information about a program, utility, or game. The purpose of a README file include:
+
+ • Instructions: How to install, configure, and use the software
+ • Context: An introduction to the project, its purpose, and target audience
+ • Documentation: Links to documentation, additional resources, and contact information
+ • Collaboration: Guidelines for developers, designers, and other stakeholders to contribute and collaborate
+
+ • Security: Information on how to report security issues
+ • Roadmap: A list of future release ideas
+ • Metadata: Information that adds value to Digital Research Objects (DROs)
+ • File naming conventions: Explanations of file naming practices
+ • Changes: Documentation of changes to files or file names within a folder
+
+
+
+What is the purpose of a wireframe?
+
+
+The purpose of a wireframe is a key part of the design process, and are used to:
+
+ • Explore ideas: Used to explore aesthetics, information architecture, and function without writing code.
+ • Communicate: Used to communicate basic functionality and user flow to stakeholders.
+ • Test: Allow users to test the site to see how easy it is to navigate, and to identify any issues.
+
+ • Save time: Wireframes can help save time across the entire project by allowing for a more efficient build phase.
+ • Create consistent layouts: Help designers create consistent layouts that meet user needs.
+S
+
+
+
+What is a branch in Git?
+
+
+A Git branch is a separate development line that lets developers work on features or fixes independently.
+
+ • Merged back: It enables parallel tasks and can be merged back into the main branch for organization and collaboration.
+ • Abstraction: serve as an abstraction for the edit/stage/commit process.
+
+ • The branch in Git command lets you create, list, rename, and delete branches.
+
+
+
+ #ACC8E5;
+ color: #112A46;
+
+
+
diff --git a/Form-Controls/Form-structure/css b/Form-Controls/Form-structure/css
new file mode 100644
index 000000000..9177978f5
--- /dev/null
+++ b/Form-Controls/Form-structure/css
@@ -0,0 +1,52 @@
+h1 {
+ margin-top: 0;
+}
+
+ul {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+form {
+ margin: 0 auto;
+ width: 400px;
+ padding: 1em;
+ border: 1px solid #ccc;
+ border-radius: 1em;
+}
+
+label span {
+ display: inline-block;
+ text-align: right;
+}
+
+input,
+fieldset {
+ font: 1em sans-serif;
+ width: 250px;
+ box-sizing: border-box;
+ border: 1px solid #999;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+ width: auto;
+ border: none;
+}
+
+input:focus {
+ background-color: yellow;
+}
+
+button {
+ margin: 20px 0 0 0;
+}
+
+label {
+ display: inline-block;
+}
+
+p label {
+ width: 100%;
+}
diff --git a/Wireframe/ReadMe.webp b/Wireframe/ReadMe.webp
new file mode 100644
index 000000000..7eda1fb33
Binary files /dev/null and b/Wireframe/ReadMe.webp differ
diff --git a/Wireframe/ReadMep.png b/Wireframe/ReadMep.png
new file mode 100644
index 000000000..3459a4e95
Binary files /dev/null and b/Wireframe/ReadMep.png differ
diff --git a/Wireframe/gitbranches.png b/Wireframe/gitbranches.png
new file mode 100644
index 000000000..4c8d4f192
Binary files /dev/null and b/Wireframe/gitbranches.png differ
diff --git a/Wireframe/index.html b/Wireframe/index.html
index 0e014e535..e3a3bc960 100644
--- a/Wireframe/index.html
+++ b/Wireframe/index.html
@@ -8,25 +8,51 @@
-
- Title
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
- voluptates. Quisquam, voluptates.
-
- Read more
+
+ What is the purpose of the README file?
+ Instructions: How to install, configure, and use the software.
>
+ An introduction to the project, its purpose, and target audience.
+ Documentation: Links to documentation, additional resources, and contact information.
+ Guidelines for developer Collaboration: Guidelines, designers, and other stakeholders to contribute and collaborate.
+ Read more
+
+
+
+
+
+ What is the purpose of a wireframe?
+ The purpose of a wireframe is a key part of the design process, and are used to:
+
+ - ideas: Used to explore aesthetics, information architecture, and function without writing code.
+ - Communicate: Used to communicate basic functionality and user flow to stakeholders.
+ - Test: Allow users to test the site to see how easy it is to navigate, and to identify any issues.
+
+ Read more
+
+
+
+
+
+ What is a branch in Git?
+ A Git branch is a separate development line that lets developers work on features or fixes independently.
+
+ - Merged back: It enables parallel tasks and can be merged back into the main branch for organization and collaboration.
+ - Abstraction: serve as an abstraction for the edit/stage/commit process.
+ - The branch in Git command lets you create, list, rename, and delete branches.
+
+ Read more
diff --git a/Wireframe/wireframe2.png b/Wireframe/wireframe2.png
new file mode 100644
index 000000000..2b540beca
Binary files /dev/null and b/Wireframe/wireframe2.png differ