Post on 08-Jun-2020
CiDACertificate in
Digital
Applications
CiDA
EXAM
TOP TIPS
Make your home page
with background colour,
insert a table with 4 rows
3 columns and 0
padding.
Add your fireworks
banner, buttons, email
link, suitable images and
text.
Save home page, copy
and paste file, rename to
each page required.
Add hyperlinks to all
buttons, on all pages.
Read exam paper to add
required information on
each page.
Tick the paper when you
have completed
something.
Check your images are in the correct file format and size (NOT always PNG)
(Optimise Images in Fireworks - File- Export Wizard - png 8 OR File – Image Preview)
Create a Banner for your microsite in fireworks/photoshop - check size of saved .png
Create Buttons for navigation bar in fireworks e.g.HOME
(only if you have time and if it is a requirement otherwise use a TEXT link)
Before you use the images – ensure they are the right size/format (PNG, JPEG etc.)
Do not distort images, resize from the corners rather than sides
There is always an image you shouldn’t use in the assets (Distractor Images)
Thumbnails = miniature version of the original
Log on
Read the exam paper/client brief carefully (Use skim & scan technique)
Manage your site - Site – New Site- Site Name - Ensure your microsite has a sensible
name e.g. not site1. Local Site Folder - make sure you choose the ASSETS folder -
Save.
Remember:
Check you are in DESIGN VIEW – View – Split – Code Design
Check you have your PROPERTIES WINDOW visible –
Window – Properties (Ctrl + F3)
Creating your Index (home page)
File – New - </>HTML – title = index.html
(this is your home page template think of it as a master slide)
Save as index as a .html page
Check page size at bottom of dreamweaver screen –
Most, but not all sites will be 1024x768
Create a table to group your information on the webpage –
Insert table – think about how many rows/columns you will need.
What width should the page be?
Change the colour scheme (make sure it suits the business and people with visual
impairments) Choose colours that are accessible – so no red and green – use colours that
are in the logo
Change colour scheme – select Page Properties (Appearance CSS) – font, size, text
colour, background colour)
Add the banner to your index page
Add ALT text to the banner image –
Make sure you add accessibility features for all of your images (alternate text).
Add buttons to the navigation bar OR text.
Create links for the buttons in the navigation bar.
Add the edited images to the Index (home) page.
Add appropriate text from the INFO.rtf
Once happy with the template file and save as with the names of the other pages the brief
asks for e.g. Volunteers.html, Programmes.html, LunchHour.html etc. (or alternatively
copy the index in your user area and rename it as another page – repeat this process)
OR
In your user area copy index page and rename.
Repeat process of adding text / images / links to other pages
Ensure when you put the External Link (often asks you to link the logo) ensure you
leave http:// at the beginning even if it is not stated on the paper.
Remember – sometimes they will ask for hyperlinked icons rather than a standard navigation bar
Hotspot
X Graphical Link
• Email Link
When hyperlinking to an email address put the prefix mailto: OR INSERT – EMAIL LINK
Every paper says ‘consider accessibility features’ this means alternate text but also:
using contrasting colours (avoid red and green) and easy to read fonts – mention your
consideration of this in the evaluation.
Make sure you add accessibility features for all of your images (alternate text) this is
worth quite a few marks but takes 5 minutes.
Ensure ALT TEXT is meaningful e.g. not just ‘flyer’. But ‘flyer advertising the radio station’.
Make your home page
with background colour,
insert a table with 4 rows
3 columns and 0
padding.
Add your fireworks
banner, buttons, email
link, suitable images and
text.
Save home page, copy
and paste file, rename to
each page required.
Add hyperlinks to all
buttons, on all pages.
Read exam paper to add
required information on
each page.
Tick the paper when you
have completed
something.
Click SITE – NEW
SITE
Enter a SITE NAME
e.g. Impromptoo.
Local Site Folder –
click on the folder and
find the exam assets
folder.
Click File – New
</> HTML
Enter Title –
Home.html
File – Save As
Home.
Insert – Table
Add in number of
rows/ columns
required
Add in table width
required
Border Thickness
Click Window –
Properties
Change Page Font,
Size, Text Colour &
Background Colour
Open Fireworks and click File –
New
Set the width to 1024 pixels and
height to 250 pixels.
Add the logo, suitable text &
colour.
Save it in the Assets folder and
make sure you change the file
format .png
Check the client requirements
Click on Insert –
HTML-Image.
Your Banner should
now appear on the
page
Go in to your webpages
folder and copy the Home
Page, paste file and
rename file to each
page required from the
client brief.
You can link up your
pages by typing in the
name of the
page.html
OR you can use the
point to file
OR you can use the
folder to browse for the
file
Point
to file
Browse
for file.
* Test Your Work In The Browser F12
Highlight the email address
on the page that you typed
in.
Click Insert – HTML –
Email Link
After you have typed in your
text click OK
OR you can type in the link
using mailto:
* Test Your Work In The Browser F12
Click on the image that
requires a Hotspot and
draw the shape over
the area of the image
you want to be able to
click.
If you want to link to a
website type in http://
and then the URL * Test Your Work In The Browser F12
Click INSERT –HTML
– ROLLOVER IMAGE
BROWSE to the
ASSETS folder for the
correct image e.g.
Original image =
Front Cover.png
BROWSE to the
ASSETS folder for the
correct image e.g.
Rollover image =
Brochure.png
* Test Your Work In The Browser F12
Right Click on the image
you inserted.
Select Align
Select Right
The text wraps around the
image
Click Insert – HTML –
HTML5 video
Click on the Video
Icon -In Properties –
Source (point to file
e.g.Video.mp4)
Video
Icon
* Test Your Work In The Browser F12
YouTube (video tutorials)
1. CIDA DA201 – The Recycle Drive – Exam
Walkthrough.
2. CIDA DA201 - 4ToonzRadio – Exam
Walkthrough.
3. CiDA: January 2016 Unit 1 Exam –
(Grubalicious)4Toonzradio How To.ppt