QLT OnlineWorkshop 1: How to make an engaging

and informative landing page

KPI9: Students experience initial quality assured subject Interact2 site landing pages and basic outline

QLT (Online) standards

Julie Lindsay | QLT (Online) Academic Lead | U!maginejlindsay@csu.edu.au (02) 69334507

Feedback form: https://goo.gl/57YPpL

Introductions

Please share your name, school and anything interesting!What subjects do you teach? What format are they? DE, I, mixed,

small/large etc.

The power of...

I2 landing pages

p2p interaction(peer-to-peer)

s2s interaction(staff-to-student)

KPI11: Students experience a subject that provides the opportunity for peer-to-peer

interaction in the online space

KPI12: Students experience a subject that provides structured opportunity for staff-to-

student interactions in the online space

KPI9: Students experience initial quality assured subject Interact2 site landing pages

and basic outline

What you need to do (KPI9)

Functional: Make sure your navigation menu is clear

Informative: Include a basic heading, subject code and name,

your name/contact/bio (on landing page OR using the contact tool),

and a basic overview / introduction to the subject area (in written,

audio or video format)

Engaging: Include some multimedia (image/audio/video) that adds

meaningNote: This applies to ALL subjects - DE and Internal

Why is the design and content of the landing

page & navigation important for a subject?

● It is the first thing students see about your subject

● It sends a message about whether the subject is static or dynamic

● It sends expectations as to how YOU will teach and interact

● It impacts student motivation, expectations and engagement

● It supports students using i2 during the course of the subject

The Navigation Story……...

The Navigation story……...the short

Very simple - too much so?

Section headings - very effective

Longer - still organised for clarity?

……...the longer

Section headings - longer version

Organised with one Section heading

……...the longest

Individual modules linked from navigation

Navigation editing…..Step 1: Make sure you are in ‘edit’ mode

Step 2: Select drop down menu to add feature

Step 3: Menu items can be re-ordered by dragging

The Landing Page…….

Type 1: Single image with text info

Use of HTML to create table - hence text beside the image

Subject code, nameIntro to subject focusCoordinator name, picture, bio and email

Type 1: Single image with text info

PERSONALISED greeting from instructorLink to bio homepage

Type 1: Single image with text info

PERSONALISED greeting from instructorDifferent contact details

Subject name & code, interesting picture, information about the subject, academic name and contact, navigation details clear and minimal

Type 1: Single image with text info

Type 1: Single image with text info

Wrapped, flowing text - Use of HTML code

Type 1: Single image with text info

Image happens to be a bannerMore text-based details - what students should be working on etc.

Type 2: Single image with text info and one or more teachers

Top image is a bannerUse of a table to organise teacher images and text.Notice pictures are all the same size.

Video

Type 3: Including a video

Type 3: Including a video

Video - be careful about size distortion

Type 3: Including a video

Type 4: Multiple videos (with additional text and images)

Type 5: The longer page…...

Interesting top imageTeacher detailsSubject deliveryAssessment itemsSet textsWelcome video

Landing page ‘makeover’

<div class="content" style="font-size: 17px; color: #1a1a1a; text-align: left; width: 85%; margin: 0 auto; padding: 1em 0 0; border: 0;" align="left"><h2 style="font-size: 42px; line-height: 1.2em; font-family: sans-serif; font-weight: normal; margin: 0px 0px 0.5em; padding: 0px 10px; border-color: #F47B20; border-style: solid; border-width: 0px 0px 2px; clear: both;">Welcome to ETL523 Digital Citizenship in Schools</h2><h4 class="orange" style="font-family: sans-serif; color: #fff; text-transform: uppercase; font-weight: 600; background-color: #f47b20; margin: 12px 0px; padding: 0.5em 10px; clear: both;"></h4><div class="larger-profile"><div class="third" style="display: block; float: left; width: 33.33%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: visible; margin: 0; padding: 0 10px 0 0;"><img src="https://interact2.csu.edu.au/bbcswebdav/pid-901368-dt-content-rid-2045319_1/xid-2045319_1" style="max-width: 100%;" /><h4 style="font-family: sans-serif; text-transform: uppercase; font-weight: 600; margin: 12px 0px; padding: 0.5em 10px;">Julie Lindsay</h4><h6 style="font-family: sans-serif; font-size: 1.2em; font-style: italic; font-weight: 400; font-variant: normal; margin: 0; padding: 0 0 0 0.5em;">Adjunct Lecturer</h6><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0 0.5em;"><span style="font-weight: bold;">Contact:</span> julie@csu.edu.au</p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0 0.5em;"><span style="font-weight: bold;">Twitter:</span> @julielindsay</p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0 0.5em;"><span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; font-weight: inherit; font-style: inherit; font-family: inherit; font-size: medium;"><strong>Tel:</strong> (02) 6933 4507</span></p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0 0.5em;"></p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0 0.5em;"><strong><span style="margin: 0px; padding: 0px; border: 0px none; outline: 0px none; font-style: inherit; font-family: inherit; font-size: medium;">Let's get started with:</span></strong></p><ul style="font-family: sans-serif; list-style-type: square; margin: 10px 20px; padding: 10px 20px;"><li><a target="_blank" href="http://google.com">Discussions</a></li><li><a target="_blank" href="http://google.com">Learning Modules</a></li><li><a target="_blank" href="http://google.com">Resources</a></li></ul></div><div class="two-third" style="display: block; float: left; width: 66.66%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: visible; border-left-color: #eee; border-left-style: solid; margin: 0; padding: 0 10px; border-width: 0 0 0 1px;"><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">Hello everyone!</p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">The subject outline will give you an overview of all modules and assessments and update you on expectations for successful completion of the subject. Please read it carefully and thoroughly so that you know what is expected of you. You will need to steadily work your way through the modules, and make use of the appropriate forums to ask questions, and communicate, with me and with each other.</p><blockquote class="pull-quote" style="text-align: center; border-top-style: solid; border-bottom-style: solid; color: #f47b20; font-style: normal; font-variant: normal; font-weight: 400; font-size: 27px; line-height: 1.3em; font-family: serif; margin: 1.2em 0; padding: 1em; border-color: #CCCCCC; border-width: 1px 0;" align="center">We are a community of learners and toegther we will explore the concepts shared via the modules and share our experiences and knowledge via the discussion forums.</blockquote><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">This subject explores the concept and practice of digital citizenship as it relates to teachers and students, in fact all learners, in a school environment. Issues in policy and practice are examined to come to a better understanding of how learning programs and school communities can build capacity and resilience in students to enable them to become more effective and responsible digital citizens in global online learning environments.</p><h5 style="font-size: 1.1em; font-family: sans-serif; font-style: normal; font-weight: 600; margin: 0px 0px 10px; padding: 0.5em 10px; clear: both;">Getting to know your Subject Coordinator</h5><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">I am based in Ocean Shores on the Northern NSW coast and currently work from home as a global collaboration consultant and Director for <a target="_blank" href="http://flatconnections.com">Flat Connections</a>, Quality Learning and Teaching Leader (online) and Adjunct Lecturer. My EdD research has been approved and my working title right now is 'Online global collaborative educators and pedagogical change'. I hope to have this completed in about 2 years.</p><h5 style="font-size: 1.1em; font-family: sans-serif; font-style: normal; font-weight: 600; margin: 0px 0px 10px; padding: 0.5em 10px; clear: both;">Contact</h5><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">If you wish to contact me directly, please email me in the first instance. Remember to put the subject code ETL523 in the subject line of the email as I receive messages from students in different subjects. We will also have other means of connecting and communicating, which I will share with you in the subject. I am also very happy to chat on the phone or Skype when needed. I do travel out of Australia as a consultant but trips do not normally prevent me from communicating with Skype or via email.<br /> <br /> Best wishes for your study this session. I look forward to getting to know you through this class.</p><p style="font-family: sans-serif; color: #1a1a1a; word-wrap: break-word; line-height: 1.2em; margin: 0px; padding: 0 0 0.5em;">Julie</p></div></div></div>

HTML Coding - nothing to be afraid of!

Type 2: More than one lecturer with text info

INF111 Landing page ‘makeover’

IKC101 Landing page ‘makeover’

HTML - Simple tricks for transformation#1 - Heading size and colour<h2 style="font-size: 42px; line-height: 1.2em; font-family: sans-serif; font-weight: normal; margin: 0px 0px 0.5em; padding: 0px 10px; border-color: #F47B20; border-style: solid; border-width: 0px 0px 2px; clear: both;">Heading Two</h2>

#2 - The Block Quote"text-align: center; border-top-style: solid; border-bottom-style: solid; color: #F47B20; font-style: normal; font-variant: normal; font-weight: 400; font-size: 27px; line-height: 1.3em; font-family: serif; margin: 1.2em 0; padding: 1em; border-color: #CCCCCC; border-width: 1px 0;" align="center">There are dozens of simple, fascinating experiments that may be performed with this kind of electricity on Snow 22nd October 2014</blockquote>

#3 - List<ul style="font-family: sans-serif; list-style-type: square; margin: 10px 20px; padding: 10px 20px;"><li>The first item in an unordered list</li><li>Second item right here</li><li>This is the third item in the list</li></ul>

Please avoid the blank template…..…...not a good look

Inserting hyperlinks…..

Step 1: Highlight the text you wish to hyperlink

Step 2: Select the ‘hyperlink’ tool from the menu

A pop-up window opens…..

Step 3: Add the URL

Step 4: Choose how the hyperlink will open (in a new window is preferred

Step 5: Select Insert

Creative Commons images

http://photosforclass.com/

Splash some Creative Commons onto your homepage - Blog post explaining more! (http://uimagine.edu.au/qltonline/)

https://pixabay.com/

https://unsplash.com/

http://morguefile.com/

Inserting image files.….

Step 1: Select IMAGE icon on Content menu

Step 2: Browse Computer for image file

Step 3: Select ‘Insert’

A pop-up window opens…..

Inserting video files…..

Step 1: Select VIDEO icon on Content menu

Step 2: Add video URL eg from YouTube

Step 3: Select ‘Insert’

A pop-up window opens…..

What strategies

would you like to

know more

about?

Quality check in Session 2

27 June(Landing page)

Session 2 Mid-session break(Interaction)

Professional Development Calendar - FoArts/Ed

Week

beginning

Date & Time Proposed Online Discussion

23 May Tuesday May 24th - 11:30am-12:30pm

Friday May 27th - 1:30-2:30pm

Focus on KPI9 – How to make an engaging and informative landing page

30 May Wednesday June 1st - 10:00-11:00am

Friday June 3rd - 1:30-2:30pm

Focus on KPI11 – How to encourage student interaction online

6 June Not yet scheduled - TBA Disciplines groups or individuals to contact Julie if specific PD sessions are

needed

13 June Thursday June 16th - 2:00-3:00pm

Friday June 17th - 1:30-2:30pm

Focus on KPI12 – How to establish a strong online teacher presence

20 June Not yet scheduled - TBA Additional small group and drop-in PD to be arranged.

Watch this space

http://uimagine.edu.au/qltonline/professional-learning/faculty-of-arts/

Support from Division of Student Learning (DSL)

If you would like support to meet or exceed QLT requirements outside the support offered by the QLT leads the process is that you will submit an SRS to DSL using https://online.csu.edu.au/de/dewsrsc.sqt?run=TopicRequest

Email me jlindsay@csu.edu.au

anytime

Feedback form: https://goo.gl/57YPpL