mattbruton / NSS-FrontEnd-StaticWeb-MockBusiness

NSS Evening Cohort 3 - Static Web - Mock Business

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

HTML Exercise - Mock Business

This is an introductory NSS Evening Cohort 3 exercise that focuses on semantic HTML and includes a minimal amount of basic CSS. The goal of this exercise was to make a mock website for a business using the HTML and CSS skills we'd gathered up until this point.

==============================

==============================

Viewing/Downloading Project

To View Hosted Project

HTML Exercise - Mock Business

Installation

Clone the repository from GitHub:

git clone https://github.com/mattbruton/NSS-FrontEnd-StaticWeb-MockBusiness.git

Navigate to the project from the directory it was cloned into:

cd NSS-FrontEnd-StaticWeb-MockBusiness/

To Run

If you need a command line http server, to install http-server globally:

npm install http-server -g

Then:

http-server or http-server -p XXXX (the X's represent the port of your choice)

You should now be able to open your browser and type localhost:8080 to view the project.

Specs and Project Information

Languages

  1. HTML
  2. CSS

Tools

  1. Git
  2. Atom
  3. NPM http-server

Specifications

==============================

Create a four page site for a mock business. Be as creative or as whimsical as you want to me for the business name. This is an HTML exercises, so while you may style this site to your heart's content, we will be focusing on the HTML structure and syntax of your code.

Pages

Home page

  1. Articles for company mission, short company history, and employees.
  2. Employee article should just list three employees: the CEO, the CTO, and the CFO.
  3. Find some fun imagery to include on the home page.

Products page

  1. Think of three unique products that your company makes.
  2. Create an article for each product description.
  3. Each article should have a header and at least one section.
  4. Each article should have a footer that has a link to Amazon (doesn't have to be real) to purchase the product.
  5. Find some fun imagery for each product.

Culture page

  1. One article.
  2. At least one, but as many as you like, sections for describing your unique company culture.
  3. Four sections that contain a home address, a phone number, and two social media URLs.

Contact page

  1. One article.
  2. A heading (e.g. "How to contact us").
  3. Four sections that contain a business address, a phone number, and two social media URLs.

Common page elements

Navigation

Create a navigation bar on each page that contains a link to all pages. You can use whatever elements you like for the navigation, but it must be contained in the appropriate HTML5 semantic element.

Page header

Each page should have an <h1> title contained in the appropriate HTML5 semantic tag.

Page footer

Each page should have the same footer information. Put whatever information you like in the footer.

==============================

About

NSS Evening Cohort 3 - Static Web - Mock Business


Languages

Language:HTML 96.3%Language:CSS 3.7%