content management systems week 14 lbsc 671 creating information infrastructures
TRANSCRIPT
![Page 1: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/1.jpg)
Content Management Systems
Week 14
LBSC 671
Creating Information Infrastructures
![Page 2: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/2.jpg)
Putting the Pieces Together
Web Server
HTML
HTML
CGI
Browser
SQL Query
Results
Database
![Page 3: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/3.jpg)
Why Database-Generated Pages?
• Remote access to a database – Client does not need the database software
• Serve rapidly changing information– e.g., Airline reservation systems
• Provide multiple “access points”– By subject, by date, by author, …
• Record user responses in the database
![Page 4: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/4.jpg)
Why Content Management Systems?• Separation of content and appearance
• Separation of roles
• Standardization of common “design patterns”– Login and password recovery– Headlines and drill-down– Site map– Search– Shopping cart
![Page 5: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/5.jpg)
Content Management Systems
• WordPress– http://wordpress.org
• Joomla– http://www.joomla.org
• Drupal– https://drupal.org
![Page 6: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/6.jpg)
Roles
• Information architecture design• Task assignment• Content generation and modification• Approval for “publication”• Publication• Error correction• Tracking task progress
![Page 7: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/7.jpg)
Content Management System Structure
• Database stores the content– And access control data and parameters
• Server scripting controls the user experience– PHP readss database, generates HTML
• (X)HTML conveys the user experience
• User-side scripting enhances interactivity– JavaScript may be used for form validation
![Page 8: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/8.jpg)
Database
Server-side Programming
Interchange Language
Client-side Programming
Web Browser
Client Hardware
Server Hardware (PC, Unix)
(MySQL)
(PHP)
(HTML, XML)
(JavaScript)
(IE, Firefox)
(PC)
Bus
ines
sru
les
Inte
ract
ion
Des
ign
Inte
rfac
eD
esig
n
![Page 9: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/9.jpg)
“Site Blueprint”
MainHomepage
Teaching ResearchOtherActivities
LBSC 690
INFM 718R
DoctoralSeminar
Ph.D. Students
Publications
Projects
IRColloquium
TREC
![Page 10: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/10.jpg)
Grid Layouts
Navig
ation
B
ar
ContentContent
Navig
ation
B
ar
Navigation Bar
Navigation Bar
ContentContent
Related
Lin
ks
![Page 11: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/11.jpg)
Grid Layout: NY Times
![Page 12: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/12.jpg)
Grid Layout: NY Times
Navigation
Banner Ad
Another Ad
Content
PopularArticles
![Page 13: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/13.jpg)
Grid Layout: ebay
![Page 14: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/14.jpg)
Grid Layout: ebay
Navigation
Banner Ad
Search ResultsRelated
Navigation
![Page 15: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/15.jpg)
Grid Layout: Amazon
![Page 16: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/16.jpg)
Grid Layout: Amazon
Navigation
Search Results
Related
Navigation
![Page 17: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/17.jpg)
Some Layout Guidelines• Contrast: make different things different
– to bring out dominant elements– to create dynamism
• Repetition: reuse design throughout the interface– to achieve consistency
• Alignment: visually connect elements– to create flow
• Proximity: make effective use of spacing– to group related and separate unrelated elements
![Page 18: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/18.jpg)
Joomla Structure
• Front end – The Web site
• Back end– Where the Web site is defined
![Page 19: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/19.jpg)
Joomla Components• Web sites are made up of rectangular pieces
– Called “modules”
• Two basic types of modules:– Displaying content (e.g., articles)– Interaction (e.g., login)
• Templates define where modules can be put– Templates define abstract “positions”– Joomla maps positions to layout in ways
appropriate to the device
![Page 20: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/20.jpg)
Joomla Features
• Menus control navigation– Menu items control where you can go
• Categories group things (i.e., entities)– University courses, Apollo missions, Meetups, …
• Extensions allow you to add new capabilities– JCE Editor, Image rotator, Google maps, …
![Page 21: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/21.jpg)
![Page 22: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/22.jpg)
Joomla Hosting
• Your own computer – Useful as a way to try things out– Not easily accessable to others
• Demo account (for 30 days) at joomla.org– You can pay to keep it past 30 days
• Web hosting service– Longer life, more support, or less cost– More complex to set up
![Page 23: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/23.jpg)
Joomla First Steps• System->Control Panel
– Gets to the back-end home
• Install the Joomla Content Editor (JCE)
• Learn how to insert content – Images, text without formatting
• Learn how to set up menu items
• Learn how to control layout
![Page 24: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/24.jpg)
Ajax Applications
• Google Maps– http://maps.google.com
• Google Suggest– http://www.google.com/webhp?complete=1&hl=en
• Sajax Tables– http://labs.revision10.com/?p=5
• Sajax– http://www.modernmethod.com/sajax/
![Page 25: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/25.jpg)
![Page 26: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/26.jpg)
![Page 27: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/27.jpg)
Navigation Patterns
• Drive to content
• Drive to advertisement
• Move up a level
• Move to next in sequence
• Jump to related
![Page 28: Content Management Systems Week 14 LBSC 671 Creating Information Infrastructures](https://reader036.vdocuments.us/reader036/viewer/2022062802/56649e985503460f94b9b075/html5/thumbnails/28.jpg)
Before You Go
On a sheet of paper, answer the following (ungraded) question (no names, please):
What was the muddiest point in this semester?