This website was build for Restaurant, not only to connect with their regular guests but also to attract more new customers in aim to enhance their sales. The website provides customers with information about the premises, menus, location so they can decide whether they would like to spend their special occasion or working lunch here or just simply to stop for a quick bite or coffe.

The main page About has some information details about working hours of the business. In the footer of the website is also address, phone number and email address.

Second page Menus gives the customer option to see what cuisine the restaurant specializes on and what are the options for children as the restaurant is also family friendly.

Third page Gallery provides some visual content of the restaurant and food.

Fourth page About provides some information of what occasions could be held in these premises as well as a contact form to contact the restaurant directly.

Each web page have an eye-catching background picture to convince the customers to visit the restaurant.

Colors used are grey and shades of blue. The contrast with white is nice and works well with the restaurant pictures.

The website is working on all devices, on smaller devices the navigation link is changed to dropdown menu. And some features such as 'Sign Up for exclusive offers' and some pictures are hidden for more efficient and easier navigation.

The website has interactive elements:

• Booking a Table to reserve the table for certain date and time with specific number of guests without the need to phone or visit the restaurant.

• Sign up for some exclusive offers is helpfull to get some special offers sent by email directly to customers.

• Contact Us with any queries is very good feature when the customer needs some more information, if his criteria could be met in order of booking the restaurant for a special occasion.

HTML5 CSS3

Bootstrap 4.4.1: Bootstrap specially the Grid system was used to structure the web pages and assist with styling of the website.

Hover.css: Hover.css was used on the Navigation link menu icons and Social Media icons in the footer to change the colour. Also for the buttons, SignUpHere and BookATable.

Google Fonts: Google fonts were used to import the 'Roboto' font into the style.css file which is used on all pages throughout the project and 'Exo' font which was used on all headings.

Font Awesome: Font Awesome was used on all pages specially on footer and also on the Book A Table button to add icons for aesthetic and UX purposes.

jQuery: jQuery Bootstrap was used for the forms and also for scroll down menu in navigation link.to make the navbar responsive but was also used for the smooth scroll function in JavaScript.

Git: Git is used for version control.

GitHub: GitHub is used for storing the websites codes after being pushed from Git.

Large amount of testing was done through all the coding process to make sure all the pages work on all device sizes and are visually pleasing and easy to navigate between. For instance the navigation link on smaller devices is changed to Dropdown Menu which is very efficient.

• Book A Table has a popup windov so the customers can enter the details such as name, email address with date, time and number of guests to reserve a table for. This was tested on all screen devices.

• Sign up for exclusive offers is a feature for customers to get special offers directly by email, and was also tested on all screen devices.

• Contac Us form was created for general enquires for customers to contact the restaurant team, maybe to ask for more information before deciding to book the restaurant for larger party or any other importat information. Also was tested on all screen devices.

The Website was tested on few browsers such as Google Chrome, Safari and Firefox. The website was viewed on a variety of devices such as Desktop, Laptop, Samsung 7 Edge. Family and friends were asked to open the website and let some feedback.

This project was written in HTML & CSS using Gitpod and was deployed to GitHub pages.

The project was deployed using the following steps...

• Log in to GitHub and locate the GitHub Repository.
• At the top of the Repository locate the "Settings" Button on the menu.
• Scroll down the Settings page until you locate the "GitHub Pages" Section.
• Under "Source", click the dropdown called "None" and select "Master Branch".
• The page will automatically refresh.
• Scroll back down through the page to locate the now published site link in the "GitHub Pages" section.

• Bootstrap - html, css, js library
• Free-fronted CSS Cards
• w3schools
• Code Institute solutions
• Code Institute materials

• free-stock photo website

• My Mentor for his feedbacks and support
• Code Insttitute Team for their continuous support.