1. VCE IT Theory Slideshows By Mark Kelly McKinnon Secondary College Vceit.com Power Websites CMS and CSS

2. Contents Static websites CMS – Content Management System CSS – Cascading Style Sheets

3. Static Websites Each page is produced by hand, using GUI web editor (e.g. Dreamweaver) or raw HTML code Pages never change without being edited Can be dull and unresponsive to current conditions Imagine a static eBay site where the finishing time of all auctions had to be entered by hand every second.

4. Dynamic Websites Constantly changing – e.g. eBay Can respond to events and the profile of the user Can be achieved to a degree with Javascript (e.g. a countdown timer on a static page)

5. Content Management Systems CMS Examples – Wordpress, Joomla, Drupal Database-driven software that creates pages when needed and tailor-makes them for the time, the circumstances, the user

6. CMS The CMS fetches content (e.g. text, data, pictures) from the database and creates a webpage with pre-defined formatting chosen by the webmaster. The same pages might look different for each person viewing it (e.g. their ‘My eBay’ pages, or their Facebook pages.)

7. Pros and cons ProsCons Site maintenance is far easier and quickerMust install CMS software onto your webserver – some are expensive Sites become dynamic and pages change automatically Must learn how to use the CMS Easier to manage assets (pictures etc)Can be expensive/slow to convert an existing static site to CMS Better looking sites Site has a consistent appearance across all pages Far less chance of 404 errors or bad links

8. Webmaster creates content (e.g. body text)

9. Media (pix, videos etc) are stored in the database

10. The CMS combines content, media, formatting to create web pages which are sent to the visitor’s browser

11. Cascading Style Sheets CSS Instead of repetitively formatting lots of types of text in the same way, define the formatting in a CSS file and just mark text with the style it needs

12. CSS To change the look of main headings, change the definition of HEADING1 once in the CSS file. Don’t have to find and change every piece of HEADING1 text across the site Far quicker, easier Creates consistently formatted sites

13. CSS E.g. CSS file contains “Heading 1 = Bold, TNR, size 20” In a webpage, some text is tagged as being “Heading 1” style.

14. By Mark Kelly McKinnon Secondary College vceit.com These slideshows may be freely used, modified or distributed by teachers and students anywhere on the planet (but not elsewhere). They may NOT be sold. They must NOT be redistributed if you modify them. VCE IT THEORY SLIDESHOWS