2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content...

33
2015 Webmaster Training

Transcript of 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content...

Page 1: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

2015 Webmaster Training

Page 2: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

1. Site Navigation2. Dynamic Content Updates3. Static Page Updates4. Image Editing5. Advanced Topics6. Site Build-Out

Agenda

Page 3: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Site Navigation

Page 4: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

URLs and RWD Paths

Page 5: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Default Pages

Page 6: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Distributing Content Areas

Page 7: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercises: Site Navigation

• Find and edit the default page corresponding to: http://yoursite.mysdhc.org/clubs/

• View changes to the page with a browser• Share control of the Contacts_Faculty

container with an administrative contact at your school

• If necessary, undo changes to the clubs page when finished

Page 8: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Dynamic Content Updates

Page 9: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

News / Blog Containers

• Update by adding a message• Shown newest items first• Tips:– Consider expiration– Use consistent size images (if image is shown)– Avoid images & links in first 255 characters

Page 10: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Content Libraries

• Update by uploading a file• Assign Display Name in list, or as Subject in

“Properties” window

Page 11: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Calendars

• Create calendar events as usual in FirstClass• Utilize event body to provide details for event

• Mark Priority Events as Urgent

Page 12: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercises: Dynamic Content

• Add news item to main page• Upload policy document to School Policies

area; remember to set Display Name• Add calendar event which will be visible only

on the full calendar• Add a second calendar event which will show

in the Priority Calendar on the main page• Review all updates via browser; when

finished, delete all content from this exercise

Page 13: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Static Page Updates

Page 14: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Editing Static Pages

• [Image; show document body on left; web content on right]

Page 15: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Tips & Tricks

• Set Preferences to provide default font, size and link types

• Create backups of pages before editing• Insert tables to organize content on page; hide

table borders when finished• Always resize images before pasting into

documents

Page 16: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Understanding Mash-up Pages

Page 17: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Understanding Mash-up Pages

Page 18: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercises: Static Pages

• Open Preferences on the webmaster account. Verify the following:– Default font assigned to: Arial– Default font size set to: 14– Default link action to: open in same window

Page 19: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercises: Static Pages

• Navigate to http://yoursite.myshc.org/school_information and find the corresponding mash-up page within FirstClass

• Identify the source for each of the four panels on the school information page

• Create a backup of the Key Information page, and then edit the page

Page 20: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Image Editing

Page 21: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Pixlr Basicshttp://pixlr.com

Page 22: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Pixlr Basics

• Opening Files– File > Open image

• Viewing on-screen– View > Zoom in / Zoom out / Actual Pixels

• Resizing with Crop Tool– Set Constraint to Output Size

• Saving Files– Look at Format– File extensions are added automatically

Page 23: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercise: Image Editing

• Use photos of your own, or download a set of sample photos from the Media Center page at: http://harmony.mysdhc.org

• Size one or more images to 180x180 pixels and use the resized image(s) as thumbnails for School News items

Page 24: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Advanced Topics

Content

Page 25: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Slideshows

• Size images to correct dimensions– For home page, use 720 x 521– Other slideshows may use different dimensions

• Edit caption using “Display Title on Web” field• Link to content using “Alt URL” field

Page 26: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Emergency Notifications

• Scrolling Banner (good)• Splash Screen (better)

Page 27: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Videos

• Use “embed” code from video site

Page 28: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Exercises: Advanced Content

• Use photos of your own, or download a set of sample photos from the Media Center page at: http://harmony.mysdhc.org

• Size one or more photo to 720 x 521 and add it to the homepage slideshow, including a caption

• Add a YouTube, Vimeo or Teachertube video to your slideshow

• Add both a scrolling banner and a splash screen to your site

• Review all updates via browser; when finished, delete all content from this exercise

Page 29: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Advanced Topics

Site Navigation

Page 30: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Additional Pages

• Adding new page– Open folder, use “New Web Page” button– Select “blank RWD page” in most cases

• Adding navigation to new page (options)– Open Site Administrator Console from root of

website– Add as panel in Mash-up– Link from existing page

Page 31: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Subsites

• Adding subsite– Use “New Site Object” button

• Adding navigation to subsite– Open Site Administrator Console from root of

website

Page 32: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Analytics

• Using Google Analytics for all sites http://www.google.com/analytics

• Ask Communications department for access to your school site

Page 33: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard.

Site Build-Out

Workshop Time