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

Slides:



Advertisements
Similar presentations
HTML I. HTML Hypertext mark-up language. Uses tags to identify elements of a page so that a browser such as Internet explorer can render the page on a.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
ASP.NET Intro An introduction to the languages and communication of an ASP.NET system.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
VCE IT Theory Slideshows By Mark Kelly McKinnon Secondary College Vceit.com Intranet, Internet, VPN.
CHAPTER 7 STYLING CONTENT WITH CASCADING STYLE SHEETS.
Authoring Languages and Web Authoring Software 4.01 Examine web page development and design.
Seattle Drupal Clinic Introduction to Drupal and Web Content Management.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
4.01B Authoring Languages and Web Authoring Software 4.01 Examine webpage development and design.
Static VS Dynamic websites. 1-What are the advantages and disadvantages? 2- Which one should you choose and why?
Using Cascading Style Sheets (CSS) Dept. of Computer Science and Computer Information CSCI N-100.
Unit 2, Lesson 5 Website Development Tools AOIT Web Design Copyright © 2008–2012 National Academy Foundation. All rights reserved.
IT Applications Theory Slideshows By Mark Kelly Vceit.com WEBSITE DESIGN TOOLS.
Drupal Workshop Introduction to Drupal Part 1: Web Content Management, Advantages/Disadvantages of Drupal, Drupal terminology, Drupal technology, directories.
IT Applications Theory Slideshows By Mark Kelly Vceit.com Types and contents of On-screen user documentation.
What is Web Design?  Web design is the creation of a Web page using hypertext or hypermedia to be viewed on the World Wide Web.
INTRODUCTION TO DHTML. TOPICS TO BE DISCUSSED……….  Introduction Introduction  UsesUses  ComponentsComponents  Difference between HTML and DHTMLDifference.
Dreamweaver MX. 2 Creating External Style Sheets-1 (p. 400) n A style is a group of formatting attributes identified by a single name. n An ________ style.
Cascading Style Sheets (CSS) 1.  What is CSS?  Why CSS?  How to write a CSS? 2.
The Characteristics of CSS
VCE IT Theory Slideshows By Mark Kelly Vceit.com Websites & Data.
With your friendly Web Developer, Chris.. Terminology  HTML - > Hypertext Markup Language  CSS -> Cascading Style Sheet  open tag  close tag  HTTP->Hypertext.
Using Styles and Style Sheets for Design
INTRODUCTION TO FRONTPAGE. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features Features  Starting Front Page Starting Front Page  Components.
Introduction to HTML Today we will look at: Separating style and content The purpose of a text editor such as Notepad How web-pages are made Creating a.
VCE IT Theory Slideshows By Mark Kelly vceit.com Data Types 1 a.
What is RSS? And how do I use it to make my life easier.
© 2011 Delmar, Cengage Learning Chapter 8 Using Styles and Design Style Sheets for Design.
Linking to an External Style Sheet Web Design Section 4-3 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.
Introduction to web development and HTML MGMT 230 LAB.
Seattle Drupal Clinic Introduction to Drupal Part 1: Web Content Management, Advantages/Disadvantages of Drupal, Drupal terminology.
“Which Content Management System (CMS)? Drupal, Word Press...” by Dene Grigar Spring 2012 Tech 101 Series.
VCE IT Theory Slideshows By Mark Kelly Vceit.com Problem Solving Methodology 3 Development.
Louisa Lambregts, Louisa Lambregts
© 2011 Delmar, Cengage Learning Chapter 3 Working with Text and Cascading Style Sheets.
Andy Dawson– University College London 1 EABH SUMMER SCHOOL Web Page Construction Andy Dawson Department of Information Studies, UCL.
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
 Computer use language to communicate  A web browser will read these tags and translate it into what you actually see  Viewing Code of ESPN WebsiteESPN.
DYNAMIC HTML What is Dynamic HTML: HTML code that allow you to change/ specify the style of your web pages. Example: specify style sheet, object model.
4.01B Authoring Languages and Web Authoring Software 4.01 Examine webpage development and design.
VCE IT Theory Slideshows By Mark Kelly Vceit.com Problem Solving Methodology 1 Analysis.
VCE IT Theory Slideshows By Mark Kelly Vceit.com Websites & Data.
Today’s Lesson….. 1.Formative Assessment Given Back – Go through Answers. 2.Webpage Design.
Web Authoring with Dreamweaver. Unit Objectives  Be able to define keywords: HTML, HTTP (protocol), browser, web server, client/server, tag, attribute,
Today’s Lesson….. 1.Formative Assessment Given Back – Go through Answers. 2.Webpage Design.
Learning Aim C.  Creating web pages involves many considerations.  In this section we will look at the different software tools you can use and how.
VCE IT Theory Slideshows by Mark Kelly study design By Mark Kelly, vceit.com, Begin.
Basic Web Page Design. Text book: HTML, XHTML, and CSS: Visual QuickStart Guide, Sixth Edition written by Elizabeth Castro. Software: Adobe® Dreamweaver®
What is CSS? A set of style rules that tell the web browser how to present a web page or document. – In earlier versions of HTML, style characteristics,
Creating a website. What you should learn HTML HyperText Markup Language Basic structure of your web.
Web Page Programming Terms. Chapter 1 Objectives Describe Internet and Understand Key terms Describe World Wide Web and its Key terms Identify types and.
VCE IT Theory Slideshows
VCE IT Theory Slideshows
Web Basics: HTML/CSS/JavaScript What are they?
VCE IT Theory Slideshows
Cascading Style Sheets (CSS)
Using Access and the Web
Markup Languages -Use codes, called tags, to provide instructions about formatting and structure of a website HTML (Hypertext Markup Language) Must be.
APTECH JANAKPURI INSTITUTE PROVIDING WEB DESIGNING COURSES Address:- J-1,2nd Floor, Opp Metro Pillar No – 559, Janakpuri East, Delhi /42.
Starting to develop a website
VCE IT Theory Slideshows
Web Design and Development
Computer communications
VCE IT Theory Slideshows
VCE IT Theory Slideshows
VCE IT Theory Slideshows
Web Site Development Careers
Markup Languages -Use codes, called tags, to provide instructions about formatting and structure of a website HTML (Hypertext Markup Language) Must be.
Unit 13: Website Development
Presentation transcript:

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

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

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.

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)

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

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.)

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

Webmaster creates content (e.g. body text)

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

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

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

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

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

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