Creating and Publishing Your First Website

Part 1: Creating and Publishing YOUR first Website

In Part 1 we will Create a new Website with a single page and Publish it to the Internet

Login to Google and navigate to New Google Sites

Login to your Google Account, if you don't have one then create one. It will give you a free Google Mail (GMail) Email Address amongst a host of other possible things.

Once logged in, Google will remember who you are as you navigate around the Internet until you Sign out.

Navigate to New Google Sites: https://sites.google.com

The first time you login to Google Sites you will receive a welcome. 😃

Create a Site

Firstly, we are going to create a New Site.

There are lots of templates available, more than you can see here. Click on Template gallery to see the full list. You will see a range of Templates, currently in 4 groups:

  • Personal

  • Work

  • Small business

  • Education

For this Site, I am choosing Blank because I'll be making up the style as I go.

Initial Home page view

You'll then be offered a tour of Google Sites functionality.

You can see the page title in the background. We'll move on to that now.

Creating a Home page

Let's start-off by giving the Home page a Title.

Just click on the text "Your page title" and change it to whatever suits your site.

Of course, I'm using "Creating a Website for FREE"

So now we know what the Wesite is about.

Site Settings

Click on the "gear" in the top right of the window to change Settings.

You should see a list options:

  • Navigation - location and color of the pages Menu at the top or left of the Site

  • Brand images -Site Logo and Icon

  • Viewer tools - changing user functionality of the Info Icon and Anchor Links

  • Custom URLs - enables linking of a custom Domain Name

  • Analytics - Google Analytics tracking ID

  • Announcement banner - annoucement Banner for your Sites pages

Don't worry too much about these at the moment, they should all be covered during the Project

Navigation Settings

This allows you to tailor the Navigation Menu that enables navigation to each of the pages within your Site.

I'm choosing to display the Menu at the top of the page with a black background.

You can see the black Bar at the top of the page.

Brand images Settings

Here I will upload a Logo and Icon from my Desktop by clicking Upload and choosing an image for each.

That's it with Settings for now.

Let's move on to Themes.

Site Themes

Themes are a selection of styles for your Site. Each one varies the Colors, Fonts and Look of the Site.

To view the themes click on Themes, on the right near the top of the window.

You will see a list of Themes, currently:

  • Simple

  • Aristotle

  • Diplomat

  • Vision

  • Level

  • Impression

I initially chose Aristotle but later changed my mind to Diplomat and finally Simple. So you'll see a change of Themes later in this Part.

But don't worry, the Theme can be changed at any time and it actually updates the pages so you can see the differences.

Insert a Textbox

Click Insert and then Text box below that.

A Box allowing entry of Text will be added to the page in the next available position.

Text Types and Formatting

You can change the type of text to any of the following:

  • Title

  • Heading

  • Sub-heading

  • Normal

  • Small

They are fairly self-evident, so I'll let you experiment. You can also change characters to Bold or Italics, choose a Justification, insert a List or add a Link to a page within your Site or an external page.

Adding multiple Sections with Textboxes

Here I have added another Text Box to create two Sections.

The Editor allows you to move them around and change their order or position, such as above/below or side-by-side.

Another Textbox and a change of Theme

The third Text box contains a paragraph of text to give you more idea of the Look.

At this point I changed the Theme to Diplomat.

Page Done

Here is the completed page well the bottom of it anyway!

And you will notice that I have changed the Theme again, this time to Simple.

OK, so I've skipped ahead quite a bit. But the page literally took me about 10 minutes to create.


Complete your first page

It would take an age to go through all the options available to create pages and this Website page would be huge.

This Site is more about the Process of Creating and Publishing a multi-page Website and the technical issues involed, than a complete step-by-step guide to creating every Section of a Site.

So I've given you a basic introduction and I'll highlight a few of the options available:

  • Use Insert to add Text boxes, Images, Links to your Google Drive or Embed HTML

  • Use Layouts to insert various types or layouts of Sections (similar to the Text boxes we added) but with Images and Captions

  • Below Layouts is a list of Object types that can be inserted such as:

    • Buttons

    • Dividers

    • YouTube links

    • Documents

    • Image carousel

    • And a host of others

The best thing to do is play around with the various options and the layouts of your page until you are happy with your skill level. It's really quite self-evident once you get started and you should pick it up in no-time.

I will go into creating multiple-pages, sub-pages and Linking to pages within your site in Part 3.

So let's move on the Publishing your Website.

Publishing your Website

When you are ready to Publish your Site, click the blue Publish button in the top-right corner of the page.

The first time you Publish your Website a dialog will appear allowing you to enter the Website Name.

Enter a Name and then take notice of the Search settings checkbox, "Request public search engines to not display my site". In most cases you will want your Site to be included in Searches, so you may want to leave it un-checked.

Click Publish.

Review the changes and Publish

A comparison view is displayed and the changed pages are listed on the left.

Click the blue Publish button on the top-right of the window and you are done!

Congratulations, your Website should now be Published and live on the Internet.