2015 webmaster training. 1.site navigation rwd structure sharing content areas 2.dynamic content...
TRANSCRIPT
![Page 1: 2015 Webmaster Training. 1.Site Navigation RWD Structure Sharing content areas 2.Dynamic Content Updates News/Blog Containers Calendars – Priority, Standard](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/1.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/2.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/3.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/4.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/5.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/6.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/7.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/8.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/9.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/10.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/11.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/12.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/13.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/14.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/15.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/16.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/17.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/18.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/19.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/20.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/21.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/22.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/23.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/24.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/25.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/26.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/27.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/28.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/29.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/30.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/31.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/32.jpg)
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](https://reader036.vdocuments.net/reader036/viewer/2022081603/56649e2a5503460f94b17f4d/html5/thumbnails/33.jpg)
Site Build-Out
Workshop Time