Add 'What is Prebid.js?' and 'How it Works' pages

getting-started.md

@@ -3,7 +3,7 @@ layout: page
 title: Getting Started
 head_title: Getting Started with Prebid.js for Header Bidding
 description: An overview of Prebid.js, how it works, basic templates and examples, and more.
-pid: 0
+pid: 2
 isNavDropdown: false
 isNavParent: true
 

how-it-works.md

@@ -0,0 +1,73 @@
+---
+layout: page
+title: How it Works
+head_title: How it Works
+description: An overview of how header bidding with prebid.js works
+pid: 1
+isNavParent: true
+isNavDropdown: false
+
+---
+
+<div class="bs-docs-section" markdown="1">
+
+# Overview
+
+At a high level, header bidding involves just a few steps:
+
+1. The Prebid.js library fetches bids from various partners
+
+2. Prebid.js passes information about those bids (including price) to
+   the tag on page, which passes it to the ad server as query string
+   parameters.
+
+3. The ad server has line items targeting those parameters.
+
+Note that the only additional latency introduced by header bidding
+comes during step #1.  Fortunately this latency can be controlled by
+[a timeout setting]({{site.github.url}}/publisher-api.html#ad-server-timeout).
+Furthermore, Prebid.js sends bid requests asynchronously to avoid
+blocking page load.
+
+For more information about how to set up header bidding with
+Prebid.js, see
+[Getting Started]({{site.github.url}}/getting-started.html).
+
+</div>
+
+<div class="bs-docs-section" markdown="1">
+
+# Step by Step
+
+The steps below describe how the process of header bidding with
+Prebid.js works in more detail (Each numbered step is shown in the
+diagram at the bottom of this page):
+
+1. Prebid.js loads asynchronously in the page header and hooks into
+   the ad tag on page to get the placement ID and size.  It can also
+   be used to set a timeout to delay loading the ad tag while the
+   header auction occurs. If the header auction exceeds the timeout,
+   the auction is skipped and the tag on page loads normally.
+
+2. Prebid.js makes an auction request to each of the header bidding
+   partners that you've configured.
+
+3. Each partner holds its own internal auction.
+
+4. Each partner returns bids to Prebid.js which include the creative
+   payload and other information.
+
+5. Prebid.js passes along bid information (including price) to the tag
+   on page, which passes it to the ad server as a set of query string
+   parameters. In the ad server, there are line items targeting those
+   parameter.
+
+6. The ad server evaluates all of the bids and chooses a winner.  The
+   tag on the page loads a creative from the winning bidder.  Note
+   that no additional latency is introduced by creatives from header
+   bidding partners since their creative payloads were already fetched
+   during step #4.
+
+</div>
+
+![Prebid Auction Diagram]({{ site.github.url }}/assets/images/prebid-auction.png)

what-is-prebid-js.md

@@ -0,0 +1,92 @@
+---
+layout: page
+title: What is Prebid.js?
+head_title: What is Prebid.js?
+description: What Prebid.js is, and why it's useful
+pid: 0
+isNavParent: true
+isNavDropdown: false
+
+---
+
+<div class="bs-docs-section" markdown="1">
+
+# Overview
+
+Pre-bid auctions (also known as "header auctions" or "header bidding")
+run directly on a publisher's page and allow publishers to access
+external demand that may not be available through their primary ad
+server.
+
+Prebid.js is a 100% free and open source Javascript framework designed
+to make it easier for publishers to run pre-bid auctions and get
+access to more demand with minimal integration hassle.
+
+For more information about how header bidding with Prebid.js works,
+see [How it Works]({{site.github.url}}/how-it-works.html).
+
+</div>
+
+<div class="bs-docs-section" markdown="1">
+
+# Benefits
+
+The benefits of pre-bid auctions include:
+
+- Access to more demand; partners compete on 100% of the publisher's
+  inventory.
+
+- Generally higher CPMs and fill rates.
+
+- More transparency about who is purchasing the publisher's inventory
+  as a result of eliminating "waterfall" methods and estimated CPMs.
+
+- Reduced discrepancies and pass-backs.
+
+- Lower transaction costs.
+
+The benefits of using Prebid.js in particular are:
+
+- 100% free and open source, giving you complete control over how you
+  use it.
+
+- Clean, built-in support for all major bidders as well as major ad
+  servers.
+
+- It solves many problems publishers are facing - high latency, unfair
+  auction mechanics, long development time, and confusing line item
+  and targeting setup.
+
+- Plugging in prebid.js is easy. Adding new header bidding partners is
+  a matter of adding tag IDs to your JSON config.
+
+</div>
+
+<div class="bs-docs-section" markdown="1">
+
+# Bidder Support
+
+Prebid.js has built-in support for most major bidders, including:
+
+- AOL
+- AppNexus
+- Criteo
+- Index
+- OpenX
+- Pubmatic
+- Rubicon
+- Yieldbot
+
+</div>
+
+<div class="bs-docs-section" markdown="1">
+
+# Supported Ad Servers
+
+Prebid.js supports major ad servers such as:
+
+- DFP
+- OAS
+- AdTech
+
+</div>