WebUser – 21 August 2019

(Axel Boer) #1
Weekend Project

Subscribe toWeb User atsubscribe.webuser.co.uk 21 Aug - 3 Sept 2019 59

€90 (around £81)for a basic licence.
BlueGriffon also chargesfor its
instruction manual (€9 – around £8).


Before youstart
You may betempted to launch the
software andstart creatingyour sit e
straight away, but it ’s wo rth
sketching some designs on
paper first, because this lets
you play with different ideas
and explore your options.
Have a look at other websites
and note what they dowell.
Don’t be afraidto steal la yout
ideas from other sources –
but don’tcopy someone
else’s design entirely. Instead,
use it as atemplate, and
think upways you could alter
or impr ove it. Changing the
colour scheme makesa
website lookvery different,
too. The choice ofcolours


1

BlueGriffon can look dauntingat
first, but gettingstarted is easy.
Click File^1 and select ‘New wizard’.^2
The wizard then asks what type of
documentyou want to crea te.^3 If
you’re not sure which languageto
use, HTML 5 (the default option)
is fine. Click Next.^4

2

Give your document a title, author
name, description andkeywo rds,
then click Next again.You can now
choosecolours for the background,text
and links.The Document Background
screen letsyou upload a background
image^1 and adjust its position.^2 On
the next screen, chooseto ‘Apply a
predefined CSS layout’.

3

When you click Finish, the sample
page loads,ready for editing.
You can change the name of the site

(^1) by typing over the text. The buttons
at the bottom letyou switch between
the WYSIWYG^2 and Source (HTML)
views.^3 If you prefer,you can choose
Dual View^4 and see both views
side by side.
BlueGriffon’s DualView is a goodway to st art learning HTML Preview your site in aweb br owser to help identify any problems
MINIWORKSHOP|Create a simple pageusingBlueGriffon
Free Web Templates has nearly 4,000 designs onoffer
you use is important –you want to pick
hues thatcomplement one another
rather than clash.
There’s no needto design your sit e
entirely from scratch – you’ll find plenty
of free templates online thatyou can
customise asyou wish. FreeWeb
Templates (www.freewebtemplates.com)
is a greatresource and well worth
visiting.We show you how to import a
template into BlueGriffon in our Mini
Workshop on page61.
Understanding the sitecode
BlueGriffon’s DualView mode makes it
easy to work out what the different lines
of code do. Click an element on the
WYSIWYG side and the program
highlights thecode for it on the Source
side. If you make a changeto the code
(such as altering thetext or changing the
name or location of a photo, for example)
it’s reflected on the preview side. Once
you know afew snippets of HTML and
CSS, you can quickly make wholesale
changesto your sit e.
Optimise your images
Reducing the size and quality of the
images onyour site ensures that it loads
quickly, which is good news for an yone
1
2
4
(^31)
2
1
4 2 3

Free download pdf