Site Manager rocks!

  • 3,907 views
Uploaded on

Site Manager rocks! This presentation goes up to 11. …

Site Manager rocks! This presentation goes up to 11.

Presentation I gave at the T44U conference in Dublin (12-13 November 2009).about our tops tips for using the Site Manager Web content management system (http://www.terminalfour.com/)

Released under a Creative Commons Attribution-Share Alike 2.5 UK: Scotland Licence.
http://creativecommons.org/licenses/by-sa/2.5/scotland/

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
3,907
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
16
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Office accessorize: http://www.sxc.hu/photo/1228819
  • Team Leader: http://www.istockphoto.com/stock-photo-5866244-team-leader.php
  • Hand signing contract: http://www.istockphoto.com/stock-photo-2982441-hand-signing-contract.php
  • Name tag: http://www.istockphoto.com/stock-photo-3445841-name-tag.php
  • Name tag: http://www.istockphoto.com/stock-photo-3445841-name-tag.php
  • Computer studies: http://www.istockphoto.com/stock-photo-4758492-computer-studies.php
  • Firewall system: http://www.istockphoto.com/stock-photo-8517528-firewall-system.php
  • Push the button: http://www.sxc.hu/photo/1064362 Feedback form: excellent http://www.sxc.hu/photo/866529
  • Thieves: http://www.istockphoto.com/stock-photo-4906934-thieves.php
  • Blueprints: http://www.istockphoto.com/stock-photo-3879027-blueprints.php
  • Build your website: http://www.istockphoto.com/stock-photo-2393284-build-your-website.php
  • Stones 1: http://www.sxc.hu/photo/998467
  • Balance 3: http://www.sxc.hu/photo/1093389
  • Unreal cube: http://www.sxc.hu/photo/1237492
  • Unreal cube: http://www.sxc.hu/photo/1237492
  • Balance 3: http://www.sxc.hu/photo/1093389
  • Blank signpost: http://www.istockphoto.com/stock-photo-1717253-blank-signpost.php
  • Directions silhouette: http://www.sxc.hu/photo/1146427
  • Change: http://www.istockphoto.com/stock-photo-5884311-change.php
  • Diagram: http://www.istockphoto.com/stock-photo-7857366-diagram.php
  • Lost: http://www.istockphoto.com/stock-photo-3582142-lost.php
  • Online advertisement: http://www.istockphoto.com/stock-photo-8926205-online-advertisement.php
  • Snail: http://www.sxc.hu/photo/1181452
  • Clock: http://www.sxc.hu/photo/1181581
  • Clock: http://www.sxc.hu/photo/1181581
  • Clock: http://www.sxc.hu/photo/1181581
  • Clock: http://www.sxc.hu/photo/1181581
  • Clock: http://www.sxc.hu/photo/1181581
  • Clock: http://www.sxc.hu/photo/1181581
  • LCD display with log in screen: http://www.istockphoto.com/stock-photo-2808740-lcd-display-with-log-in-screen.php
  • LCD display with log in screen: http://www.istockphoto.com/stock-photo-2808740-lcd-display-with-log-in-screen.php
  • LCD display with log in screen: http://www.istockphoto.com/stock-photo-2808740-lcd-display-with-log-in-screen.php
  • LCD display with log in screen: http://www.istockphoto.com/stock-photo-2808740-lcd-display-with-log-in-screen.php
  • LCD display with log in screen: http://www.istockphoto.com/stock-photo-2808740-lcd-display-with-log-in-screen.php
  • Green wheelie bins in a row: http://www.istockphoto.com/stock-photo-2044765-green-wheelie-bins-in-a-row.php

Transcript

  • 1. Site Manager rocks! This presentation goes up to 11 Gareth J M Saunders Assistant Information Architect/Web Manager Chris Gordon Web Software Developer T44U, Dublin - November 2009 Beta
  • 2. Site Manager rocks! This presentation goes up to 11 Gareth J M Saunders Assistant Information Architect/Web Manager Chris Gordon Web Software Developer T44U, Dublin - November 2009
  • 3. St Andrews
  • 4. St Andrews Founded 1413
  • 5. Site Manager at St Andrews December 2006 Installed Site Manager 5.1 (or 5.2) May 2007 Launched first site October 2008 Upgraded to Site Manager 6.0.0018 Summer 2009 Dev server installed with 6.2 Soon? Upgrade live to 6.2 Currently 35 channels, inc. 11 RSS channels
  • 6. “ Could you ...?" A typical request
  • 7. "We can do anything !" The University of St Andrews Web Team
  • 8. "How would we do this ...?" Gareth
  • 9. "We could use PHP ..." Steve
  • 10. "Aye ... but is there any way we could get Site Manager to do it?" Gareth
  • 11. The answer is usually: YES
  • 12. But occasionally the answer is no
  • 13. Site Manager rocks! This presentation goes up to 11 Gareth J M Saunders Assistant Information Architect/Web Manager Chris Gordon Web Software Developer T44U, Dublin - November 2009
  • 14. Top tips when rolling out sites using Site Manager Caveat We’re not experts, but these are the things we’ve found useful
  • 15. 1. Policies and procedures The exciting stuff first ...
  • 16. Who is responsible for what?
  • 17. Sign a partnership agreement Thanks to Bill Mackintosh at the University of York for this advice
  • 18. Naming conventions
  • 19. Naming conventions UPPERCASE, Mixed case or lowercase URLs? Per channel Content e.g. webteam_about_garethjmsaunders Styles and templates e.g. Divinity 1 Home Media library categories Publish out as separate folders? TOOLS > CONFIGURATION Media library items e.g. hr-policy-sickleave.pdf
  • 20. Training and support
  • 21. Development server
  • 22. Going live policy ... test first
  • 23. 2. Hacks If it ain’t broke ... tweak it!
  • 24. Hack #1: Firebug for Firefox http://getfirebug.com
  • 25. CSS Selector navigation object Problem How do I delete these?
  • 26. CSS Selector navigation object Hack! Use Firebug Locate the values in the code Delete them UPDATE
  • 27. Hack #2: Stylish for Firefox https://addons.mozilla.org/en-US/firefox/addon/2108 " Restyle the web with Stylish , a user styles manager."
  • 28. Use Firebug to locate page elements Isolating the login input boxes
  • 29. Stylish examples Log in screen Before Small login boxes After Web 2.0 treatment for the short-sighted
  • 30. Stylish examples Site Hierarchy Before Very subtle background colour on mouse-over hover After Hover more prominent
  • 31. Stylish examples Media Library Before There is no media in which category? After Ah! that one!
  • 32. Stylish examples Configuration Before Centre-aligned headings After Left-aligned headings with background-colour and hover-effect on rows
  • 33. Hack #3: Greasemonkey for Firefox JavaScript libraries Can be used with jQuery, MooTools, Prototype, Scriptaculous, etc. Wishlist Highlight any selected rows in User Management, Group Management, etc., or even move them to the top of the table to remove the need to scroll. https://addons.mozilla.org/en-US/firefox/addon/748 "Allows you to customize the way a webpage displays using small bits of JavaScript ..."
  • 34. 3. From design to T4 Transferring your designs into Site Manager
  • 35. Print out design onto A3 and mark-up by hand Style elements Find divide between header and footer Related content required? Hard-coded elements Navigation objects Share existing Create new Write IDs onto diagram Media elements Images CSS JavaScript Templates Share existing Create new
  • 36. Use mind maps Our uses include Project management Information architecture Migration (4,000+ pages) Re-architect 50+ sites Page-level design Design management User permissions in T4 www.slideshare.com/garethjmsaunders/
  • 37. 4. Efficient code Improving the Web one byte at a time
  • 38. Duplicate standalone HTML code for quick mock-ups TERMINALFOUR Site Manager Standalone HTML
  • 39. Use version control Efficient Work on different branches concurrently Fail-safe Roll back quickly to an older version
  • 40. Use frameworks CSS Blueprint CSS 960 Grid System YUI Grids JavaScript jQuery Prototype and Scriptaculous MooTools PHP CakePHP Symphony Zend
  • 41. Framework advantages v disadvantages Advantages Cross-browser support Faster development time Well-structured, modular code Code consistency Visual design cohesion Disadvantages Often non-semantic Bloated code (may not need whole framework) Limited Inherit other people's bugs Can take time to learn
  • 42. Optimize your code Books High Performance Web Sites Steve Souders (O'Reilly, 2007) ISBN 0-596-52930-9 Even Faster Web Sites Steve Souders (O'Reilly, 2009) ISBN 0-596-52230-4 Firebug add-ons Yahoo! YSlow http://developer.yahoo.com/yslow/ Google Page Speed http://code.google.com/speed/page-speed/
  • 43. 5. Navigation objects Where do you want to go today?
  • 44. Navigation objects Site Manager 6.0 Related Content Related Content Branch BreadCrumbs CSS Selector Link Menu Return To Index Section Details Top Content BreadCrumb Advanced Language Switcher Section Iterator Site Map Top Stories
  • 45. An average page BreadCrumbs CSS Selector Section Details Content Related Content Branch Related Content Link Menu
  • 46. Where related content comes from
  • 47. Advantages v disadvantages Advantages Separate content from design Restrict access Easy to mirror information Disadvantages Users often struggle to remember where to go to update information
  • 48. Related Content navigation object Use Child Unique keyword
  • 49. Related Content Branch navigation object Use Child Unique keyword
  • 50. Predefined order in styles rel_global_image rel_image rel_residence rel_global_contacts rel_contact rel_content rel_global_content rel_children rel_global_children rel_twitter rel_global_twitter rel_php rel_meebo rel_global_openingtimes rel_openingtimes rel_rssfeed rel_global_applications rel_forms rel_global_forms ... rel_global_internal_links
  • 51. Main content ... everything else is related
  • 52. Image carousel
  • 53. Campaign buttons
  • 54. Categories
  • 55. Highlights
  • 56. 6. Alternate formatters Really useful ... if you can get your head around them
  • 57. RSS feed link and autodiscovery News rel_rssfeed Content uses the rssfeed template Template has 2 formatters related/rss head/rss Two navigation objects in styles using each of the formatters
  • 58. 7. Statistics Who, what, where, when ...
  • 59. 8. 404 Page not found These are not the droids you're looking for
  • 60. www.st-andrews.ac.uk/error404/ How did I get here? Site organsation Search box Popular pages Help
  • 61. www.abertay.ac.uk/error404/ How did I get here? Site map Search box Feedback form Recent changes Help
  • 62. www.strath.ac.uk/error404/ How did I get here? Contact us Search box Most popular pages Top search terms
  • 63. 9. Publishing How not to be damned
  • 64. Stagger the publish times of your channels Otherwise ...
  • 65. When do you schedule RSS publishing?
  • 66. Hourly publishing schedule Site Manager WWW Transfer Manager
  • 67. Approve by half past, live 50 minutes later Transfer Manager Site Manager WWW
  • 68. The problem If we schedule the RSS publish anywhere during those 50 minutes and a new News item has been approved after half-past then the RSS feed may publish out a link to a 404 depending on whether the HTML publish included it or not.
  • 69. Example 09:30 HTML publish begins 09:45 News item approved 10:20 RSS feed published with 404 link to latest news item 11:20 News item finally published to HTML +
  • 70. Our solution 09:29 RSS publish to staging 09:30 HTML publish to staging 10:09 Transfer all to live +
  • 71. 10. htaccess Apache experience
  • 72. .htaccess - directory-level server configuration Password protect require valid-user abc Redirects redirect 301 /from /to Error documents ErrorDocument 404 /errors/404 AddType AddType application/x-httpd .php .htaccess
  • 73. Password protect a directory /restricted .htaccess LDAP require user abc1 require user def2 require user ghi3
  • 74. Publish as a channel? Advantages Create template Tight control on what information is entered Restrict access to template Disadvantages Channels publish a file to every directory even if there is no content being published to that channel.
  • 75. Channels also publish to 'empty' sections Staff Restricted Students Parents Channel has only one piece of content Every section is published to with blank .htaccess files .htaccess .htaccess .htaccess .htaccess
  • 76. 11. Deleted For those users who don't understand what inactive means
  • 77. Create a local deleted section within each site
  • 78. Publish Draft Do not publish (hide) Deleted Content status: 4 values, 3 lights
  • 79. Publish Draft Do not publish (hide) Deleted What's the difference between Expired and Inactive?
  • 80. How many of our users think of it Expired Inactive
  • 81. How TERMINALFOUR thinks of it Expired Inactive
  • 82. Move content/sections you really want to delete
  • 83. Purge only those items within a Deleted section
  • 84. We salute you! For those about to use Site Manager
  • 85. Thank you Gareth J M Saunders [email_address] Chris Gordon [email_address] Questions, comments, suggestions, thoughts, ideas ...