Code Institute - Project One - Rebecca Stevens

Overview

This is my first project studying software development with Code Institute. I have created a website for a friend who runs a cake business from home. The website consists of four pages. It includes a portfolio, about page, main index page and contact page.

Features

The website consists of four pages. A main welcome page which introduces the website to the user, an about page which has a few paragraphs and a picture of the ladies who run the business and what they do. It has a portfolio page which has plenty of images of the produce and a contact page which consists of a map sourced from Google Maps and a short contact form. All pages link to each other through the navigation links and a call to action. The website has a navigation bar with logo and navigation links and a footer with a link to the business Facebook page. These both are consistent throughout the website and are media responsive.

Tech Used

The website was written using Visual Studio Code and uses html, css and javascript. Bootstrap framework was used to style the website and can be downloaded from here GetBootstrap. Bootstrap I found especially great for styling the navbar as it provides simple classes for a fully responsive navbar, the hamburger toggle button in particular was a handy tool and is used by the majority of websites. I have included the link to the bootstrap inside the head tag of the page and the script link at the bottom just inside the head so that the javascript loads after the webpage and the user doesn't have to wait. A link to the css custom page is inserted in the head. I used flexbox which is a great tool in css for making easy media responsive websites. You can find a great tutorial here Guide to Flexbox. Jquery, which is an easy to use javascript library, was used to give the website a few interesting animations for example I used the fadein to create an interesting fade in effect to the welcome header when the user first opens the website. The link to jquery should be included in a script tag at the end of the body, the link to the download is here jQuery. Your code can be added to a custom javascript page and also added as a script to the end of the body. test2