https://github.com/ryantusi/static_websites_collection
Under Development
https://github.com/ryantusi/static_websites_collection
Last synced: about 2 months ago
JSON representation
Under Development
- Host: GitHub
- URL: https://github.com/ryantusi/static_websites_collection
- Owner: ryantusi
- License: mit
- Created: 2024-07-19T18:11:45.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-11-14T20:21:39.000Z (6 months ago)
- Last Synced: 2025-01-20T23:46:20.740Z (3 months ago)
- Language: HTML
- Size: 36.1 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Static Web Pages
This repository contains a series of static web pages built with HTML and CSS, organized into three levels of increasing complexity. Each level corresponds to different stages of learning and mastery of front-end development concepts. These pages are part of the Full Stack Development course.
## Repository Structure
The project is divided into three main folders, each representing a different level of complexity in web development:
```
/level-1/
├── fashion blog
├── wine festival
├── new york blog
├── healthy recipes
└── olivia portfolio
/level-2/
├── davies burger
├── broadway
└── dasmoto
/level-3/
└── paint store
```
### Levels Overview
1. **Level 1: Basic HTML and CSS**
- In this level, the goal is to learn the basics of HTML structure and CSS styling.
- Includes simple layouts, links, forms, images, and text formatting.
- Emphasis on learning the basic structure of an HTML page and applying simple styles with CSS.
2. **Level 2: Intermediate HTML and CSS**
- This level introduces more advanced HTML tags and CSS properties.
- Includes layout techniques like flexbox, basic positioning, and responsive design.
- Focus on improving visual presentation and making the page layout more dynamic and adaptable.
3. **Level 3: Advanced HTML and CSS**
- This level incorporates complex CSS features like transitions, animations, advanced layout techniques (grid), and media queries for responsive design.
- The pages in this folder are more polished and closer to real-world design standards.
- Focus on fine-tuning layouts, interactivity, and optimizing for mobile devices.
## How to View the Pages
To view the static web pages in your browser:
1. Clone the repository to your local machine using the following command:
```bash
git clone https://github.com/ryantusi/Static_Websites_Collection.git
2. Navigate into any of the level folders (level-1, level-2, or level-3).
3. Open the project's index.html file in your web browser to see the page rendered.
## Technologies Used
- **HTML**: The backbone of the web page structure.
- **CSS**: For styling and layout of the web pages.
- **Flexbox and Grid**: Used in higher-level folders for advanced layout management.
- **Media Queries**: Implemented in higher levels for responsive design.
## License
This repository is part of a full-stack development course and is available for educational use. Feel free to clone, fork, and modify the project, but please refer to the license or course guidelines for any commercial use.