1 / 19

Introduction to Websites

Introduction to Websites. Purpose of Website. Digital version of a physical representation Libraries Online Communities Social Networks Forums Online retail presence Officeworks Harvey Norman Ebay News Online Journals / Blogs Entertainment

calvine-jerom
Download Presentation

Introduction to Websites

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Introductionto Websites

  2. Purpose of Website • Digital version of a physical representation • Libraries • Online Communities • Social Networks • Forums • Online retail presence • Officeworks • Harvey Norman • Ebay • News • Online Journals / Blogs • Entertainment All ways of delivering information, content, and services

  3. Analysis of Existing Websites • http://www.slashdot.org • http://www.theage.com.au • http://www.lifehacker.com.au/ • ADD OWN SCHOOLS WEBSITE

  4. Key Features of a Website • Navigation Bar • Content area • Header • Footer • Sidebars • Advertising space (?)

  5. Designing a Website

  6. Deconstructing Existing Websites • Useful to determine trending design elements • Helps users in navigation: Why? • Helps to get an idea for the ‘feel’ of the site, and how it functions • Easier to make changes and play with variations (add / remove elements)

  7. Add screenshot of schools website here,Use to create a rough ‘wireframe’ / mock-up to demonstrate how to deconstruct (and ultimate, construct) a website.

  8. Class Activity Deconstructing a Website

  9. [OPTIONAL] insert some screen shots of developmental wireframes / mock-ups and the final version as comparison of real-world projects / sites / software

  10. Overview of HTML Structure • HTML is a scripting language • HyperTextMarkup Language • The script is ‘parsed’ (interpreted) by the browser • Made up of ‘tags’ (known as elements) let the browser know what to do with the content • There is always an opening tag and a closing tag

  11. Lets the browser know what type of document it is

  12. Opening / Closing of the <html> declaration. This lets the browser know what type of script it is reading.

  13. This is where important information about the document goes.Note: document specific resources (such as links to JavaScript files or CSS files are also placed inside the <head>

  14. This lets the browser know how the page is ‘encoded’

  15. The title of the page • shown at the top of the browser window or tab

  16. This is where all the content goes

  17. Welcome to Dreamweaver

More Related