Page Deployment Link: https://barathkumarbk-15.github.io/GoldenRatioWebPage/
An Interactive and Informative webpage on Golden Ratio created using HTML5
, CSS3
, and JavaScript
.
The code can be downloaded as a compressed zip
file from the github web interface.
The repository can also be cloned using:
git clone https://github.com/BarathKumarBK-15/GoldenRatioWebPage.git
The game can be deployed locally after extraction by opening the index.html
file in any compatible browser.
- HTML files - 3
- CSS files - 1
- JavaScript files - 1
- Multiple graphic contents like images, gifs in separate folder
The webpage contains three pages namely, Home (index.html), Facts (facts.html), and Applications (app.html) which provides the basic information about the Golden Ratio. It also contains a JavaScript file for performing various functions and also contains a simple program to showcase the relation between the fibonacci numbers and golden ratio making it more interactive.
-
Home -
- The home page is designed in such a way that it provides a clear picture about the concept of Golden Ratio.
- The Home page paves way in two directions towards some interesting facts about Golden Ratio and its Applications in various fields.
-
Facts -
- The facts page provides a brief description about its derivation and various terminologies like
Golden Angle
, with some interesting relationships withFibonacci Series
in an interactive way. - It also contains some cool facts. Go check it out. (No
SPOILERS
)
- The facts page provides a brief description about its derivation and various terminologies like
-
Application -
- The application page is broadly divided into four categories namely,
Brand Logos
,Natural Elements
,Monuments
,Art and Photography
which provides the reader a glimpse about Golden Ratio being used in those respective fields in spectacular ways.
- The application page is broadly divided into four categories namely,
-
Graphical Features -
- The webpage contains simple yet convincing graphical elements from simple bending of border radius to interactive emojis, gifs, and much more. In addition, the webpage uses colours that provides the soothing effect to the reader.
- Note: The images provided in the page are of great resolution but for better viewing experience we recommend you to view them in a new tab.
- Microsoft Edge
- Google Chrome
- Safari