# Page

The `page` call lets you record your website's page views with any additional relevant information about the viewed page. Many destinations require the `page` events to be called at least once every page load.

{{< info >}}
The [RudderStack JavaScript SDK]({{< ref "sources/event-streams/sdks/rudderstack-javascript-sdk/_index.md" >}}) includes a `page` method in its snippet just after the `rudderanalytics.load` method.
{{< /info >}}

## Sample payload

Here is a sample payload of a `page` call after removing the [common fields]({{< ref "event-spec/standard-events/common-fields.md" >}}):

```json
{
  "type": "page",
  "name": "Home",
  "properties": {
    "title": "Home | RudderStack",
    "url": "http://www.rudderstack.com"
  }
}
```

The corresponding event that generates the above payload via the [JavaScript SDK]({{< ref "sources/event-streams/sdks/rudderstack-javascript-sdk/_index.md" >}}) is:

```javascript
rudderanalytics.page("Home")
```

{{< info >}}
The JavaScript SDK automatically gathers the page `title` and `url` and passes them into the event payload.

However, note that the HTTP API or the server-side SDKs do not automatically capture these properties.
{{< /info >}}

## Send a sample `page` call

Use RudderStack's **Event Playground app** to send sample events to RudderStack and test the data flow without any instrumentation.

Click **Send** to see the API call in the **Network** tab of your browser's developer tools.

{{< script-app-page >}}

{{< customreadfile "/includes/send-test-events.md" >}}

## Page fields

Apart from the [common fields]({{< ref "event-spec/standard-events/common-fields.md" >}}), the `page` call accepts the following fields:

| **Field**    | **Type** | **Presence** | **Description** |
| :----------- | :------- | :----------- | :---------------- |
| `name` | String   | Optional | The name of the page. |
| `category` | String   | Optional | The category of the page. |
| `properties` | Object   | Optional | Includes the properties of the page like the `url`, `referrer`, etc. <br />For more information, see the [Properties]({{< ref "#properties" >}}) section below. |

## Properties

Properties are additional information that describe the viewed page.

RudderStack has reserved some standard properties listed in the following table and handles them in a special manner. For instance, `path` should always be the URL path of the page and `referrer` should be the URL of the previously viewed page.

<table>
  <thead>
    <tr>
      <th style="text-align:left">
        <b>Property</b>
      </th>
      <th style="text-align:left">
        <b>Type</b>
      </th>
      <th style="text-align:left">
        <b>Description</b>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">name</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">
        <p>The page name. This is a reserved property for future use.</p>
      </td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">category</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">
        <p>The page category.</p>
      </td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">path</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">The path component of the page URL.</td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">url</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">
        <p>Full page URL. RudderStack first looks for the canonical URL. If it is not present, RudderStack uses the <code class="inline-code">location.href</code> component from the DOM API.</p>
      </td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">title</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">The page title.</td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">referrer</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">
        <p>The full URL of the previous page visited by the user.</p>
      </td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">search</code>
      </td>
      <td style="text-align:left">String</td>
      <td style="text-align:left">
        <p>The querystring component of the page URL.</p>
      </td>
    </tr>
    <tr>
      <td style="text-align:left">
        <code class="inline-code">keywords</code>
      </td>
      <td style="text-align:left">Array</td>
      <td style="text-align:left">
        <p>A list or array of keywords describing the page. These keywords are similar to the keywords used for SEO purposes. This property is not automatically collected.</p>
      </td>
    </tr>
  </tbody>
</table>