---
schema_version: "1"
id: 7c86ad4ed9e5dadfc5f05f12b1c9b1003541166fc560448aa6b8b5e38f3da0a8
title: Creating an Empty HTML5 “Container” Page
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/salesforce-pages-developers-guide/guides/pages/styling/pages-html-container-page.md
canonical_url: https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-html-container-page.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: cd42066ba78c5e42d78da03740d2e625ed1d2e52271b0fbddc41731f7073615c
products:
  - Visualforce Developer Guide
  - Platform Developer Content
---

# Creating an Empty HTML5 “Container” Page

Use an empty container page when you want to bypass most of Visualforce and add your own markup. A container page is especially useful for HTML5 and mobile development and other web apps for which standard Visualforce output isn’t desired.

You use Remote Objects, JavaScript remoting, or other Lightning Platform APIs to make service requests and then render the results with JavaScript.

The following code provides a sample container page to start with.

<!-- otherprops: apex_page -->
```markup
<apex:page docType="html-5.0" applyHtmlTag="false" applyBodyTag="false"
           showHeader="false" sidebar="false" standardStylesheets="false"
           title="Unused Title">
<html>
    
    <head>
        <title>HTML5 Container Page</title>
    </head>
    
    <body>
        <h1>An Almost Empty Page</h1>
  
        <p>This is a very simple page.</p>
    </body>
    
</html>
</apex:page>
```

The `<apex:page>` component and its attributes is the core of a container page’s definition.

-   `docType="html-5.0"` sets the page to use the modern HTML5 docType.
-   `applyHtmlTag="false"` and `applyBodyTag="false"` tell Visualforce that your markup supplies the `<html>` and `<body>` tags so that it doesn’t generate its own.

    **note:** When you set `applyHtmlTag` or `applyBodyTag` to false, the `title` attribute of the `<apex:page>` component is ignored.

-   The `showHeader="false"`, `sidebar="false"`, and `standardStylesheets="false"` attributes suppress the standard header, sidebar, and style sheets that add the Salesforce user interface and visual design to Visualforce pages. It also suppresses JavaScript resources, like scripts that aid with redirects on session timeout.

The `<head>` tag isn’t required in a container page, but it’s a good idea to include it. If you must add values to the `<head>` element, you must add the `<head>` tag yourself. In that case, Visualforce adds any of its required values to your `<head>`. Otherwise, Visualforce renders its own `<head>` to add any necessary values.

You can use Visualforce components, such as `<apex:includeScript>`, `<apex:stylesheet>`, and `<apex:image>`, to reference static resources on the page. The output of `<apex:includeScript>` and `<apex:stylesheet>` is added to the `<head>` element. If you didn’t include one, Visualforce adds its own. The `<apex:image>` output is rendered wherever you place it on the page.

**note:** An “empty” Visualforce page renders the minimum amount of HTML markup, but it isn’t entirely empty, or free of resources you don’t control. JavaScript code that’s essential for Visualforce, such as instrumentation, is still added. Visualforce also automatically adds resources required for markup you add. For example, references to Remote Objects or JavaScript remoting resources, if you use them in your code.

**See Also**  


-   [Using Custom Styles](https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-styling-custom.md)
-   [Suppressing the Salesforce User Interface and Styles](https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-styling-suppressing-salesforce-stylesheets.md)

