BlueGriffon Logo

Getting Started with BlueGriffon

Download

You can download the installer for BlueGriffon from http://bluegriffon.org. On the Mac installation was very straight forward, all that was required was to download a .dmg file and drag and drop BlueGriffon into my applications folder.

mac installation

Creating your first page


This video walk through will show you how to create your first page using the wizard for new pages.

Note: It's a good idea to save your page immediately. It will be required to add images, multimedia files or link stylesheets using relative locations.

View Options

BlueGriffon comes with four different view modes. You can switch between them with the buttons along the bottom of the screen.

View Mode Buttons

Wysiwyg

The Wysiwyg ("What you see is what you get") view looks and behaves much like a Word Processor. You can type into your document, select and modify text, insert images all while seeing what the final output would like like to a site user on a browser. If you want to create a page, without having to think about the code that is rendering the content - this is the view you will spend your time in.

Source

Using the source view is much like using a text editor to write HTML markup. 

  • Auto indent
  • Syntax highlighting

Dual View

Dual View

This Dual View seems to be a bit buggy. I found that sometimes if I was typing content into the source view it wouldn't go where I intended on the page.

Print Preview

Print Preview is designed to allow a site creator to preview what the layout would look like if printed when they are creating a responsive design. If you wanted to optimize the layout to enable a site visitor to be able to print out the content you could use this viewing option to ensure the best experience.