Giter VIP home page Giter VIP logo

zvonimir667-milestone1's Introduction

MANCHESTER UNITED FAN PAGE

Picture of Man.Utd. crest

Manchester United Fan Page is site that can bring you closer to your favorite club.This site will be useful for people who want more knowlege about the club and want to be up to date about all news related to them.

Features

  • Navigation Bar

    • This section will allow the user to easily navigate from page to page across all devices without having to revert back to the previous page via the ‘back’ button.

    • Navigation bar is featured on all three pages, it is identidal on each page.

    • Includes links to Home page, Legends and Sign Up page.

Screenshot of navigation bar.

  • Hero image
    • Image of full Manchester United stadium "Old Trafford" on the right side and crest and some info about stadium on the left side
    • On tablet and mobile screens images are one below other.

Screenshot of hero image

  • Eric Cantona quote

    • When I think football, I think Manchester United. I still support United and always will. I will die with them in my heart.

    • We begin with a quote from Eric Cantona, a true legend of ManUtd known for his passion and love for the club.
  • History

    • Brief history of ManUtd to familiar user with ther begginings and achievements over thier logn and succesfull history.
  • Footer

    • The footer section includes links to the relevant social media sites for ManUtd Fan Page. The links will open to a new tab to allow easy navigation for the user.
    • The footer is valuable to the user as it encourages them to keep connected via social media.

Screenshot of footer

  • Manchester United legends

    • This section makes the user more familiar with some of the biggest names who played in Manchester united so can create a bond for a user with a club.

Screenshot of legends section

  • The Sign Up Page

    • This page allow user to sign up for newsletter so he can can up with all the news and transfers involving the club. Aslo he can choose to get newsletter on daily, weekly or monthly basis.

!{Screenshot of Sign Up Page}(/assets/images/screenshot-signup.png)

Testing

Validator testing

  • HTML
    • No errors were returned when passing through the official W3C validator
  • CSS
    • No errors were found when passing through the official (Jigsaw) validator

PageSpeed testing

  • Desktop testing

Screenshot of PageSpeed desktop testing

  • Mobile testing

Screenshot of PageSpeed mobile testing

  • Performance issues with mobile were due to loading fonts and fontawesome from style.css

Screenshot 1 from PageSpeed performance

  • Performance issues with loading hero image were reduced mildly by chnging format from .jpg to .avif

Deployment

  • The site was deployed to GitHub pages. The steps to deploy are as follows:
    • In the GitHub repository, navigate to the Settings tab
    • From the source section drop-down menu, select the Pages
    • In Build and deployment select source Deploy from a branch
    • Choose branch main and save
    • On top the Pages you will find the link to indicate the successful deployment

The live link can be found here - https://zvonimir667.github.io/milestone1/

Credits

Code Used

  • Code was written by Zvonimir Koska
  • Fonts for this project were chosen from Fontjoy site

Content

  • Content was written by Zvonimir Koska, with some information provided through wikipedia page and Manchester United official website
  • Quote from Eric Cantona on index.html page is from AZ quotes

Media

Acknowledgments

I would like to acknowledge the following people who helped me along the way in completing this project:

  • Code Institute for giving me knowledge and tools to create this project
  • My Code Institute mentor Jubril Akolade

zvonimir667-milestone1's People

Contributors

zvonimir667 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.