Giter VIP home page Giter VIP logo

gnisco-first-project_marresub's Introduction

Black Tie Attire Website


Contents:


Description

This is a website designed to advice veiwers on how to dress appropriately for a black tie dress code. It shows all the different pieces that should be worn and informs them of the way to wear each item and which are the correct ones to be worn, it also informs them about the history of black tie and how it came to be.

This idea was due to my part time job as a sales representetive at a hackett store where many customers who came to buy suits for black tie dress code had no idea about the kind of things which they needed for this dress code so I thought an informative webpage on the do's and don'ts for this would be useful to them.

UX


My goal in the design was to make it very traditional and antique but with a minimalistic approach as I didn't want too much clutter. Hence a grey/white/cream theme was used to create the antique feel as it is trying to represent a classic topic. User stories:

  • I am looking to learn more about the history of black tie attire.
  • I am looking to have visual clueas as to which type of accesories are suitable to use with a black tie.
  • I am looking to see which jackets are viable to go with a black tie dress code.
  • I want to know the full atire which should be used in a black tie dress code as I am completely unfamiliar with it.

Technologies Used

  • HTML
  • CSS
  • Bootstrap (4.2.1)
  • Features
  • This site uses the scrollSpy feature in Bootstrap.

Testing

Browser compatability: - Go to "https://gnisco.github.io/First-project/". - Open link in chrome web browser. - Check to ensure all images load properly and styles are all correct. - Repeat for firefox, safari and internet explorer browser pages.

Navbar: - Go to "https://gnisco.github.io/First-project/". - Clcik 'History', ensure it takes you to desired location. - Clcik 'Jackets', ensure it takes you to desired location. - Clcik 'Trousers', ensure it takes you to desired location. - Clcik 'Accesories', ensure it takes you to desired location.

Screen size compatability: - Use "https://gnisco.github.io/First-project/". - Open link on desktop. - Go to developer tools and open Toggle device toolbar. - Check that the page renders properly on all types of device (xlarge, large, medium, small and xsmall) - Ensure on mobile the text and images render as a collumn rather than next to each other for clearerviewing experience.


Deployment

This site is hosted using GitHub pages, deployed directly from the master branch. The live site updates automatically each time there is a new push to the repository. You can git clone the code to run it locally on your machine.

There is no differences between the deployed version and deployment version.


Credits

content:

  • The contents are about black tie and were written off my own knowledge from previous work in a menswear store, but https://en.wikipedia.org/wiki/Black_tie was used to help me explain the history aspect.

media:

Acknowledgements:

  • I used W3schools and the boostrap website to help with dividing my colums properly and making the cards in the accesories section.

gnisco-first-project_marresub's People

Contributors

gnisco avatar

Watchers

James Cloos 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.