18 27 Dec2019 -7Jan2020 Email us yourwebsite building questions [email protected]
Webflowisasophisticatedonlinesite-buildingtoolthatmixestheblock-based simplicity ofWix with
sophisticatedweb-designsoftware.Weshowyouhowtobuildabasicsitefor freeCheck your site’s layout
It’sagood ideatoseehowyour
websitelooks onavarietyof
operating systems andbrowsers,
toensureit’saccessible toall
potentialvisitors. Comaparium
(comparium.app)emulatesthese
setupson the web,providingyou
with ascreenshotofhowyour site
looksonacombination of
different devices and browsers.
Type theaddressofthe page
you’dliketocheck, thenselect
the computerand browser
options from the drop-down
menu.Click theTestbutton and
wait for the tool toreturn your
screenshot.
Makeabetter menu
Your website’smenuis an
essentialnavigation tool for
people tofindtheirwayaround
your site,so whynotmakeit
moredynamic–withimages,
better layout andarange ofother
options?InWordPress, you can
do thiseasilywith the Max Mega
Menuplugin(bit.ly/mmm491).
It addsanewoption toyour
Appearance,Menutool,for extra
control overthe designand layout
of standardWordPressmenus.1Sign up oruseyour Google account.
ClickViewDashboard, then the New
Project button.Youcanstartanewsite
from scratch^1 orchooseatemplate,(^2) some of which arefree,while others
arepaid-for.Hoveroveratemplate to
see moreinformation about it,^3 and
click PrevieworSelect.^4
2
Nameyour project and click ‘Create
project’. Double-clicktextboxes^1
tomakechangestothewords. Toadd
images, firstclick the Assets button^2
in the sidebar on theleft,then choose
Upload.^3 Whenyour image appears,
drag ittothepage.Wefound thatthe
easiestwaytoreplaceexisting images is
todeletethe placeholder first.
3
Newelements canbeaddedto a
page inablocksystem. ClickAdd
(^1) and choosetheblock from the
availableoptions.^2 Usethedevice
icons^3 topreviewhowyour sitewill
look onvarious devices.^4 Whenyou’re
ready,click Publish.^5 Makesurethe
‘webflow.io’ option is selected, then
click ‘PublishtoSelectedDomains’.
Specialisttips, toptools and practical help
BuildaBetterSite
TopTipsofthe Fortnight
MINIWORKSHOP|Getstarted onanewwebsitewithWebflow
Webflow:webflow.com| 10 mins|Any browser
Dealofthe Fortnight
Names.co.ukisoffering‘.com’domainsfor
£2.39forthefirstyear,downfrom£ 17 .99.
Web-building Helpdesk
Q
I’vetaughtmyselfCSStotake
thestylingcodeoutofmy
HTMLfilesbut,withoutaproper
teacher,it’shardtoknowifI’mdoingit
right.HowdoIcheckit’sokay?
TimFinch,viaemail
A
Atutor ormentorwouldbenicebut,
inlieuofsuchluxuries,thereare
plentyofwebsitesthatcanpick
holesinyourcode and advisehowto
improveit.TryCodeBeautify(bit.ly/
cssv 491 ). Copyandpastethetextfromyour
CSSfileintoitandclicktheValidatebutton.
Theseautomatic
code-checking
toolsusuallyerr
onthesideof
strictness,sotry
tofixanyerrorsit
findsbutdon’t
worrytoomuch
aboutwarnings,unlessyou’reasticklerfor
makingyourcode perfect.
AndyShaw, Technical&Reviews Edit or
1
2
3
4
1
2
3
2
(^13)
4
5