Step 2: Customize the Header

What is the Header?

The header is the first section of content on each page of your site. It includes the title of the page and provides the option to format the background with a color or image. The header text is formatted as Title text, which is the equivalent of Header Level 1 text in Canvas. As you develop your Google Site, only the text in your header should be formatted with Title text. The hierarchical text formats in Google Sites (Title, Heading, Subheading, Normal Text) are more than just aesthetic text sizes. Header text styles support screenreaders (assistive devices used by people who are blind) to navigate the content on your page.

Follow this guideline throughout your site: Use Title text in the header of a page only.  Use Heading text for the top-level sections of a page and Subheading text for the secondary sections. Use Normal Text for your paragraph or body text. Would you like to learn a bit more about this topic? View this terrific 2-minute video about header text Links to an external site. from Foothill College.

Working with Images on Google Sites

Use alt-text on images that convey meaning.

On the site's pages, you are encouraged to upload images, icons, and graphics. Visuals are wonderful ways to motivate and inspire your students and convey information in a different way.

When you upload an image to a page, be sure to include alternative text (or alt-text) to ensure they are accessible to screen readers. You'll apply alt-text to images in a later step, but just keep this in mind as we move forward. If your image does not convey meaning, select the decorative image box in the alt-text field. Images used as backgrounds for sections are rendered by Google as decorative images by default. You will not find an option to add alt-text to background images.

Customizing Your Header

  1.  Customize the Title text. The title tells your students what the site is about. In most cases, this will be your course name.
      • Click on the Title text, Your page title, in the header area.
      • Type a new title for your Site.
      • Adjust the width of the title text box as needed by selecting a blue dot and dragging it left or right.

  2. Change the header background color or select an image.
    • Click on the header image.
    • Select Change image.
      • To choose from the Google image gallery, click on Select image.
      • Or to upload your own image, click on Upload.
  3. Select your header type. Google Sites provides three header format options: Cover, Large banner, Banner (the default for a blank site template), and Title Only). You can toggle between the options to see which you prefer.
    • Click on the header image.
    • Choose Header type.
    • Choose your preferred header option.

  4. By this point, you should have a site with a new title, new header image, and new header text, as shown below:
    Screenshot of a Google Site with a customized name, title, and background image.