TEMPLATE CONVERSION KICK-OFF

About the new templates

1

Jessica Mann, Assistant Director – jmann@siu.edu

Liz Hunter, Webmaster– lizhunter@siu.edu

Alexis Ray, Web Developer – alexis.ray@siu.edu

Web Communications, University Communications and Marketing

Southern Illinois University

EXAMPLES: ADMISSIONS.SIU.EDU & SUMMER.SIU.EDU

2

HOW DID WE GET HERE?

• Responsive design

• Need for flexibility

• Your input

3

4 TEMPLATES

4

5

1 TEMPLATE

A wide screen image on the home page,

with slide out navigation. For high

volume traffic, recruitment focused

sites.

A smaller main image with a static

navigation at larger sizes. For all other

sites.

FLEXIBILITY

Many options – something for everyone

6

FLEXIBILITY

• Banner can be a

slideshow, one photo, or

not there at all

• Main content area can

be one or two boxes

• 3 sets of additional

rows with multiple color

options and box sizes

• Sidebar is optional

7

FLEXIBILITY

8

Previously

Right

Sidebar

Previously

Left

Sidebar

9

10

11

BRAINSTORMING

Recommendations from You

12

AC

CO

RD

ION

PA

NE

LS

13

Accordion panels create a list of headings. Each heading has it’s own main content

area, which is revealed when the heading is clicked. When a new heading is clicked,

the previous heading’s main content will be hidden.

BU

TT

ON

14

The button

appears

below the

main content

in the first

main content

box.

PH

OT

O G

AL

LE

RY

15

Clicking on a

photo displays

the larger

version of the

image, with an

optional

caption.

You may add a photo gallery to your main content as well. A thumbnail of each photo will be

available on the page and a full size version of the photo will appear when the thumbnail is clicked.

Each photo must have alternate text briefly describing the photo, and may optionally have a caption

added as well. There is no limit to the number of photos in the gallery.

TA

BB

ED

PA

NE

L

16

Tabbed panels work similarly to browser tabs in functionality. A heading and it’s corresponding

content are presented in a window, with tabs, showing other headings. When a new tab is clicked,

the content for that tab is shown. You may not exceed six tabs.

TABLE

17

Tables can be used to display data in an intuitive way for visitors to your site. Tables can

have up to six columns and unlimited rows. You may add headings to any column or

row individually as needed.

YOUTUBE VIDEO

18

FLEXIBILITY

• Banner can be a

slideshow, one photo, or

not there at all

• Main content area can

be one or two boxes

• 3 sets of additional

rows with multiple color

options and box sizes

• Sidebar is optional

19

EXAMPLES: ADMISSIONS.SIU.EDU & SUMMER.SIU.EDU

20

TEMPLATE CONVERSION PLAN

It won’t be that bad!

STEPS

• Website owners will be contacted

• All users from that site will be disabled once we start

• Submit web ticket for content changes during that time

• Our staff will apply the template and review each page

• Training will be scheduled for all users in that group

• Website will be published on development site for review

• Review period will be for 2 days

• WEBSITE LAUNCH

• Trained users regain access to website

You website will still be up and running during this time

TRAINING

• While the site is being migrated, trainings will be scheduled for all users.

• Current UsersAll current users will need to attend a 1-session training on the new template before gaining access to it. Training sessions will occur twice a month for current users.

• New UsersNew users will still have to attend a 2-session training to gain access. These sessions will be offered once a month.

ENTIRE PROJECT TIMEFRAME

• 175+/- websites

• Start date: MAY 1

• Completion date: December 15

SINGLE SITE TIMEFRAME

1-4 weeks to convert a website onto the new template

• Dependent upon size of the site

• If the site contains any:

• applications

• customized scripts

• database code

• After group 1 is finished, a better timeframe can be

determined

GROUP 1

• Financial Aid – fao.siu.edu

• Extended Campus – extendedcampus.siu.edu

• Housing – housing.siu.edu

• New Student Orientation - orientation.siu.edu

• Saluki Family Association - salukifamily.siu.edu

• Saluki Startup – salukistartup.siu.edu

• Week of Welcome – wow.siu.edu

• Center for International Education – cie.siu.edu

• Scholarships – scholarships.siu.edu

• Transfer Student Services transfer.siu.edu

• Dawg Days – dawgdays.siu.edu

• Graduate School - gradschool.siu.edu

WHAT DO I DO WHILE I WAIT?

• Review your existing sites/pages

• Update your content

• Attend our Google Analytic/SEO session