This project is a clone of the Usability Hub website, created using HTML and CSS. The main goal of this project is to replicate the look and feel of the Usability Hub website, focusing on its visual design and responsiveness. The project is currently in progress, and the responsive design implementation is pending.
To view and work on this project, simply clone the repository to your local machine:
git clone https://github.com/DhavalBhimani44/usabilityhubclone.git
The project follows a simple structure:
-
index.html : The main HTML file that represents the structure of the Usability Hub clone.
-
styles.css: The main CSS file containing styling rules for the project.
The project currently includes the following features:
- Home page layout similar to the Usability Hub website.
- Replicated visual elements, such as headers, navigation, and footer.
- Placeholder content to mimic the original site's content.
The main pending task for this project is implementing responsiveness. This involves making sure that the website layout and design adapt gracefully to different screen sizes, including mobile devices and tablets. The responsive design will ensure that the website remains user-friendly and accessible across various devices.
To complete the responsive design, follow these steps:
-
Media Queries: Implement media queries in the CSS to apply specific styles based on screen size breakpoints.
-
Flexbox/Grid: Utilize flexbox and/or grid layouts to create responsive columns and rows that adjust to different screen sizes.
-
Adjust Font Sizes: Modify font sizes, line heights, and spacing to maintain readability on smaller screens.
-
Images and Media: Resize and optimize images for different screen resolutions.
-
Test Across Devices: Test the responsiveness on various devices and web browsers to ensure consistent user experience.
Contributions are welcome! If you're interested in improving the project, feel free to fork the repository, make your changes, and submit a pull request.
When contributing, ensure your changes are well-documented and follow the existing coding style of the project.