Basic Web Design Using Dreamweaver Robby Seitz 121 Powers Hall 915-7822

Slides:



Advertisements
Similar presentations
3.02B Authoring Languages 3.02 Develop webpages..
Advertisements

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.
Hyper Text Markup Language.  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,
Teppo Räisänen LIIKE/OAMK 2010
ASHIMA KALRA.  WHAT IS HTML WHAT IS HTML  HTML TAGS HTML TAGS  FORMATTING TAGS FORMATTING TAGS.
XHTML Basics.
Authoring Languages and Web Authoring Software 4.01 Examine web page development and design.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Instructional Technology & Design Office or Insert Workshop Name Presented by Your Name Here.
XP Information Technology Center - KFUPM1 Microsoft Office FrontPage 2003 Creating a Web Site.
Web Content Management System Website Maintenance Demonstration Introduction to Macromedia Contribute Jamie Uprichard.
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.
Lecture 2B: HTML and CSS IT 202—Internet Applications Based on notes developed by Morgan Benton.
4.01B Authoring Languages and Web Authoring Software 4.01 Examine webpage development and design.
Overview of HTML. Three Different Approaches  Text editor like Notepad  HTML editor such as: –KompoZer –DreamWeaver –Microsoft Expression Web –iWeb.
Review HTML  What is HTML?  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,
Basics of HTML.
HTML Comprehensive Concepts and Techniques Intro Project Introduction to HTML.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
Exploring Microsoft Office XP - Microsoft Word 2002 Chapter 61 Exploring Microsoft Word Chapter 6 Creating a Home Page and Web Site By Robert T. Grauer.
Getting Started with Expression Web 3
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
© Ms. Masihi.  The Dreamweaver Welcome Screen first opens when you start Dreamweaver.  This screen gives you quick access to previously opened files,
INTRODUCTION TO FRONTPAGE. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features Features  Starting Front Page Starting Front Page  Components.
Chapter 1 Understanding the Web Design Environment Principles of Web Design, 4 th Edition.
Week 1 Understanding the Web Design Environment. 1-2 HTML: Then and Now HTML is an application of the Standard Generalized Markup Language Intended to.
Website Development with Dreamweaver
Learning Web Design: Chapter 4. HTML  Hypertext Markup Language (HTML)  Uses tags to tell the browser the start and end of a certain kind of formatting.
Styling and theming Build campaigns in style. What we'll look at... How a web document is structured How HTML and CSS fit together Tools you will need.
CSCI 1101 Intro to Computers
XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.
Copyright © 2013 MyGraphicsLab / Pearson Education STRUCTURE AND HTML TAGS MyGraphicsLab: Adobe Dreamweaver CS6 ACA Certification Preparation for Web Communication.
Introduction to HTML. What is HTML? Hyper Text Markup Language (HTML) is a language for describing web pages. HTML is not a programming language, it is.
XP New Perspectives on The Internet, Sixth Edition— Comprehensive Tutorial 8 1 Creating Effective Web Pages Creating HTML Documents Tutorial 8.
Session 1 SESSION 1 Working with Dreamweaver 8.0.
Overview of HTML/XHTML Two Different Approaches  Text editor like Notepad  HTML editor such as: –KompoZer –DreamWeaver –Microsoft Expression Web –iWeb.
Creating Webpage Using HTML
Lesson 12: Working with Code-editing Features Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver.
Presented by Graduate Design Group 2 Meredith, Jennifer, Cammay and Diane.
Dreamweaver MX BTA3Open. Dreamweaver MX Application used for creating web sites Homepage must always be saved as index.htm All files names must be in.
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 1 1 Microsoft Office FrontPage 2003 Tutorial 1 – Creating a Web Site.
1 Creating Web Pages Part 1. 2 OVERVIEW: HTML-What is it? HyperText Markup Language, the authoring language used to create documents on the World Wide.
Instructional Technology & Design Office or Beginning Web Design Presented by Laura Miller.
ECA 228 Internet/Intranet Design I Intro to Markup.
Use CSS to Implement a Reusable Design Selecting a Dreamweaver CSS Starter Layout is the easiest way to create a page with a CSS layout You can access.
Web Design. How do web pages work? Webpages are written in a code called HTML. Programs like Internet Explorer read the code, and then show it as a web.
 Create a free account  Verify your address.
Introduction to HTML Unit 3: E-business.
1 © Netskills Quality Internet Training, University of Newcastle Using Style Sheets in Dreamweaver CS © Netskills, Quality Internet Training, University.
Tutorial 3 Adding and Formatting Text with CSS Styles.
2.1 XHTML. Motto High thoughts must have high language. –Aristophanes.
Lesson 2 – Unit B. Quick review 1. What is the name of the eGCC host that you ftp your files? 2. What type of software do you use to create and edit web.
Chapter 8 HTML Editors. Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors Text editors don't have word processing features.
SERVER web page repository WEB PAGE instructions stores information and instructions BROWSER retrieves web page and follows instructions Server Web Server.
Understanding CSS Cascading Style Sheets control the presentation of content in HTML pages Style Sheets separate formatting from the content –Styles defined.
 Create a free account  Verify your address.
Chapter 4 and 5. Objectives Introduce markup: elements and attributes How browsers interpret HTML documents Basic structure of HTML document What do style.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML.
Web Design. Learning Objectives To familiarize you with the structure of HTML (HyperText Markup Language) To identify some of the qualities of good web.
Getting Started with HTML
Getting Started with CSS
XHTML/CSS Week 1.
Web Programming– UFCFB Lecture 9
Creating a Successful Web Presence
HTML HYPERTEXT MARKUP LANGUAGE.
Basic Web Design Using Dreamweaver
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
Web Programming– UFCFB Lecture 9
5.00 Apply procedures to organize content by using Dreamweaver. (22%)
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Presentation transcript:

Basic Web Design Using Dreamweaver Robby Seitz 121 Powers Hall

Basic Web Design What is the easiest way to build or update a Web page? Get someone else do it for you. What can you give someone to help them build a good Web page for you? Money.

Methods Compared. MethodBuilder Skills Required Management Issues MS Word & Publisher Not intended for Web pages Creates illegible code Almost impossible to update Non-standard HTML FrontPage Strong use of templates FrontPage original files required to maintain Non-standard HTML Massive file sizes MySpace, FaceBook, etc. No skills needed Limited flexibility Locked into domain name Easy to update – Difficult to mess up! Dreamweaver Serious HTML knowledge Lots of assistance provided Clear and standard HTML is written and may be edited by any capable program/person Text editor In-depth HTML knowledge Ditto above

HTML Basics Hyper-Text Markup Language Don’t worry, we have handouts! (Source:

HTML Basics Markup Tags - Nesting ◦ Open, surround, close stuff Link This is my very short paragraph. ◦ Empty or self-closing

HTML Basics Spacing doesn’t matter (much), but indentation helps show nesting. Robby’s Page This is a picture of my cat, Lou.

HTML Basics

Web Concepts Expect viewers to see things differently. Obstacles to consistent page rendering include: ◦ Different browser versions ◦ Different screen resolutions ◦ Different accessibility needs ◦ Different mobile devices

Web Concepts Keep layout and content as separate as possible. Content – Information and its contextual meaning. Layout – The format and arrangement of information.

Basic Dreamweaver Parts of the screen ◦ Top menu: File, Edit, View… ◦ Top toolbar: Common, Layout, Forms…

Basic Dreamweaver Parts of the screen ◦ Tabs: Document names ◦ Code/Design views ◦ File Transfer, Validation

Basic Dreamweaver Parts of the screen ◦ Tag Selector ◦ Properties window: Format, Style, Align…

Basic Dreamweaver Parts of the screen ◦ Windows on right side: Files, CSS…

Basic Web Design Using Dreamweaver Robby Seitz 121 Powers Hall