Lesson 1 - Canva

• Computing
• Lower Secondary (Key Stage 3)

Website Development 

Year 7 - Lesson 1 

KO: To be-able to create a website using Canva.

All 

- To be-able to identify all of the components that make a website.

Most 

- To be-able to use Canva to create assets and develop a website.

Some 

- To be-able to explain how content can be used to target a specific audience.

What is a website?

What do I mean by 'Asset'?

What "assets" do webpages have?

Assets

Text

Graphics (photos, logos, banners, buttons, images etc...)

Links

Video

Audio

Data entry fields (and connected databases)

What tools have you used this year that could help you make assets?

There are many different ways of creating a Website

Code it:

• HTML, CSS, Javascript
• others

Use web authoring tools to construct it

• Canva, Wix etc...
• Use a drag and drop interface (WYSIWYG)

Scenario 1

Company: Florist

Name: Daisies

Daisies is an independent florist that creates bouquets for all occasions.  They own a small high street shop and want to enter the online world to get some digital presence which they can then refer to via social media.

Scenario 2

Company : Laser Tag Arena

Name: Zapz

Zapz is a new laser tag arena based in Mansfield city centre.  It offers free play sessions as well as specialist bookings (groups, birthdays, corporate) for its laser based games.  It has a front of house seating lobby with some arcade facilities along with vending machines.

Thinking about your chosen scenario, what content (pages) should you include?

Let's have a look at some website examples

Good Website Design

Click Here

Poor Website Design

Click Here

Task - Create a website

You are going to create a website using Canva. Canva not only allows you to create different types of graphics, it also allows you to build a website!

First step: Creating the logo

Remember: You have picked either Zapz or Daisies

Think about appropriate:

Colours

Images

Text 

Logo Creation

First job -->  Making an appropriate logo

Good logo qualities are?

www.canva.com

Garibaldi Linking group

Only use if you do not currently belong to Garibaldi School group on canva:

https://www.canva.com/brand/join?token=Fhb-oPR4duKlCsakGdqG0w&brandingVariant=edu&referrer=team-invite

DEMO

1. Create blank logo space
2. Using elements
3. Adding text
4. Exporting PNG

What do we call a website editor that allows you to visually create a website, without coding?

1. IDE
2. WYSIWYG
3. Interface
4. GUI

What does WYSIWYG stand for?

Next session

We will be looking at making a banner and buttons for your chosen website brief.