Goal of This Tutorial Series This tutorial takes you through all the necessary steps to design and publish a fully-functional, multi-page website using BlueGriffon. Your site will be mobile-friendly, which means that not only will it work fine on a desktop and laptop computer screen, but it will also adjust to the small screens found on mobile phones, tablets and other handheld devices. It will have a home page, a Site Map, an optional About page, a working Contact Form, and any other pages you like. Goal of This Chapter By the end of this chapter, you will have created a mobile-friendly 2 column home page for your website. Preliminary Steps Get a Domain Name and a Web Hosting Account Before you can even design a website, you will need to get a domain name and sign up for a web host.

Author:Mezisida Tojas
Country:South Africa
Language:English (Spanish)
Published (Last):18 August 2012
PDF File Size:14.25 Mb
ePub File Size:9.34 Mb
Price:Free* [*Free Regsitration Required]

How to Create a Website with BlueGriffon 1. Or to put it another way, it is a computer program meant for a layperson to design websites without having to learn technical stuff like HTML and CSS. Note that this tutorial series is for version 1. There are some changes between the version 1. Goal of This Tutorial Series This tutorial takes you through all the necessary steps to design and publish a fully-functional, multi-page website using BlueGriffon version 1. Your website will have a home page, a Site Map, an About page, a working Feedback Form, and any other pages you want your site to have.

Goal of This Chapter By the end of this chapter, you will have created a 2 column home page for your website, and have published it to the Internet. Preliminary Steps Please do not skip this section. Get a Domain and Sign Up for a Web Host Before you can even have a website, you will need to get a domain name and sign up for a web host.

A domain name is just the name of your site. For example, "thesitewizard. A web host is a company which owns computers that are permanently connected to the Internet. These computers, called web servers, are where you will place your website, so that others in the world can visit it. The computers run a special type of software also, confusingly, called web servers to facilitate this. For students: If you have been referred to this tutorial by your lecturer or teacher, you may not need to get a domain name or a web host.

Some schools or universities set up a special web server for use by their students for their website-making assignments. If so, just skip to the next step. Yes, unfortunately, those 2 things cost money. However, you should only do this if you really cannot afford to get, at minimum, a domain name, because you will lose out in a major way sooner or later.

The High Price of "Free". Essentially, it involves hosting your website on a free web host and accepting whatever web address they give you for your site.

Download BlueGriffon Download version 1. Install BlueGriffon If you use Windows, doubleclick ie, click twice in quick succession the file you downloaded to install it. Note that this section presupposes that you downloaded the "installer version" ie, the "bluegriffon This tutorial will drag on forever if I give instructions for every possible alternative.

Initial screen The initial dialog box has a heading "Welcome to the BlueGriffon Setup Wizard" and it describes what the setup utility is about to do. Click the "Next" button at the bottom of this dialog box if you want to continue installing BlueGriffon. The "special offer" screen If you are connected to the Internet when you run the installer, a dialog box with the heading "Special Offer" will appear. The contents of this dialog box differ each time you install but it will generally offer to install some additional software on your computer.

At another time, it wanted to install an IM client. For those of you worried about whether the software is needed for BlueGriffon to work, please note that this is just an advertisement. None of the software offered is actually part of BlueGriffon itself. They are not used by BlueGriffon nor are they needed for it to work on your computer.

Installation folder and Start folder screens The next two dialog boxes offer to let you choose the folder to install to as well as the name of the Start menu folder.

Accept the default. That is, click the "Next" button for the installation folder dialog box, and when the "Select Start Menu Folder" dialog appears, click the "Next" button for that as well. Click the checkbox for "Create a desktop icon" before clicking the "Next" button. Ready to Install The next dialog box lets you look at your choices so far before committing to it.

You can also click the "Back" button if you want to make changes to your choices, or click "Cancel" to abort everything, if you like. Important: the final screen The final dialog box, with the heading "Completing the BlueGriffon Setup Wizard", will appear after the installer has finished setting up everything.

Uncheck the box "Launch BlueGriffon" on this screen before clicking the "Finish" button. I want to deal with the first run of BlueGriffon in a separate section, because you may need to install some additional software namely some free Microsoft software libraries used by the BlueGriffon program.

No one in the world, except users of your computer, will be able to see your site. There are many free FTP programs around, for a wide variety of systems. Go to the FileZilla download page and download the appropriate version for your system. For Windows users, download by clicking the default download button rather than getting the zip file, unless you know how to manually install computer programs. Doubleclick the file you just downloaded to launch the installer.

Follow the instructions given by the setup utility. In the dialog box entitled "Choose Components", click the box "Desktop icon" to check it, so that a shortcut to FileZilla will be placed on your desktop. When you reach the last window in the installer, uncheck the box that says "Start FileZilla now".

If so, you can still start it from your Start menu, unless you disabled that option in the installer too. If you are using Windows, you may get an alarming error message that says something like "This application has failed to start because the application configuration is incorrect.

Reinstalling the application may fix this problem. Read on for the solution. Note: if you do not see this error message, but instead find that BlueGriffon starts up normally, skip this section. Your job, where the installation is concerned, is done. Note: the specific redistributable package that you will need is also linked to on the BlueGriffon download page.

If the package linked to on that page is different from what I mentioned above, use their link instead. In any case, after you download the file, run it and follow the instructions to install it.

After that, if you are one of those who elected to run Windows Update manually rather than allowing the default of having it automatically update your system in the background , you may want to start up Windows Update so that it can install security fixes, if any, for the redistributable. Since the redistributable is a Microsoft product, updates are delivered using the usual Microsoft channels, which for the average home computer user, means Windows Update.

It should start up normally. Note that the first time you successfully start up BlueGriffon, you will get a dialog box prompting you to download an add-on and the user manual.

If you click the button agreeing to the download, your web browser will open and load the BlueGriffon site, where you will be given the option to buy the add-on and user manual. This is strictly optional. Such a layout is favoured "favored" in US English by many webmasters because it is both space-efficient and user-friendly.

You can see an example of a two-column web page by looking at any of the article pages on thesitewizard. In the case of thesitewizard.

This layout is very familiar to Internet users because you see it everywhere, making it a user-friendly layout since almost everyone knows how to navigate a site with it. As a webmaster, you will always want to make your website user-friendly, so that your visitors can get to where they want to go on your site.

To create your web page, click the word "File" on the menu bar, which you can find near the top of the window. A drop down menu will appear. Click the words "New wizard" on that menu.

Important: in the interest of brevity, I shall describe such a sequence of steps as simply clicking "File New wizard". For example, if I were to say to click "File Save" on the menu, it means to click the word "File" on the menu bar, followed by the word "Save" on the drop down menu that appears. By default, the radio buttons "HTML5" should be selected. If it is not, click it to enable it.

Then click the "Next" button at the bottom of the dialog box. The Title Field The contents of the dialog box should change, with a new sub-heading that reads "General document properties". This is just the main page of your website. It is the page that your visitors will see if they simply type in the domain name of your site into their browser.

For example, if you were to type "thesitewizard. Since this is your home page, enter the name of your website into the "Title" field.

For example, if your website is called "Example Company", enter "Example Company" into that first field. Those who are at a complete loss as to what to say, put your domain name into that field. Do not leave the "Title" field blank for any web page you create. Even though BlueGriffon will not force you to enter something into this field, it is a very important field. The contents of this field is displayed in the title bar of your browser window or in the browser tab for some browsers. Search engines also use this title in their search results for your page.

Most people also add a short description of their site immediately after the site name for their home page. Or if they have a slogan commonly attached to their brand, they may add it there. Note that the words in the title field are not actually displayed in the main window of any web browser for your website. It is only shown in the title bar as I mentioned earlier. Author By default, BlueGriffon inserts the user name you use on your computer into the "author" field.

You can either accept this, or change it to your real name, or delete the contents of this field altogether. This field is optional, and is neither displayed nor used in any way by the web browser. Description The "Description" field is supposed to contain a brief description of what your current web page contains.

Home pages are special though, since home pages are usually just pointers to the entire website. Most people just give a brief description of the website as a whole in the "Description" field of their home page.


BlueGriffon Tutorials



BlueGriffon Tutorial




Related Articles