c122sep2914.notebook September 29, 2014

Size: px
Start display at page:

Download "c122sep2914.notebook September 29, 2014"

Transcription

1 Have done all at the top of the page. Now we will move on to mapping, forms and iframes. 1

2 Here I am setting up an image and telling the image to uuse the map. Note that the map has name="theimage". I have decided to use both id and name too much conflicting/confusing information. See next slide. 2

3 I specify the shape as rect. You can also have circle or poly. Then I give the coordinates. With rect you give the top left corner and the bottom right corner. My href is going to a spot on the page. Telling what map to use and identifying the map with both id and name. 3

4 recgt poly circle 4

5 When you get the coordinates be sure that you are getting them for the exact same image you are using in the page size has to be the same. Now I am in paint I select a spot with the mouse and the coordinates are shown at the bottom of the page. 5

6 2,20 is close to 2,19 I am not being precise I just want a general rectangle around the letter i. 6

7 If I click on the i, I will go to the place on the page with the id = "i" 7

8 Works best when the page is shorter and you can see the places better. The end of the page is always at the bottom and so the one nearest the bottom sometimes does not show at the top of the page they way this does. 8

9 9

10 10

11 11

12 The form will send an to the address listed. Note the new address is bristolcc instead of bristol.mass Note the words show on the form and the value is sent. I set up the for using input and type of text for a textbox, checkbox for a series of checkboxes and radio for a series of radio buttons. The text area is for comments. Type submit means to do the action which is mailto: Type reset means to clear the fields. 12

13 Now I am setting up a variety of select with options. 13

14 Now we will look at frames in XHTML. 14

15 Instead of strict or transitional we use frameset. Frames do not validate in HTML5. We set up a frameset made of two rows the first is 50% of the page and the other is * which means the rest. Within the frameset there are two frames that will bring up two pages that I have developed. They are in the same folder. Note that they each have a name not necessary here but useful in some of the more complex things. 15

16 16

17 This is one of the pages that goes into one of the frames. 17

18 To see the source of the frame page you click on This Frame and then it will let you view the source for that frame. 18

19 19

20 Code for the page in the top frame. Frameset 20

21 Using cols instead of rows. 21

22 My frame page with two pages inside first column is 25% and the second column is the rest. 22

23 written in stages the basic template is many many years old so I am not using much CS for things like alignment. 23

24 24

25 I have a frame across the top, a frame in the middle that is split into two frames and a frame across the bottom. So I lay out the row hight with 25%,50%,* The top frame is within the frameset. The middle row needs to be split so I have another embedded frameset that divides it into two columns. The embedded frameset is closed and the last frame across the whole page is displayed. 25

26 26

27 Now we will start using target. This is the whole page. The information about target _self is in hdrrtar1x.html. 27

28 After the next button is clicked, this page appears in the right column. 28

29 When next is clicked the new page is loaded on top of itself because of target="_self" 29

30 30

31 Again the new page on the right. 31

32 Target="_top" loads the page in the full screen. 32

33 33

34 target="_blank" means a new window 34

35 Original window New window 35

36 left screen is name hdrleft right screen is name hdrright 36

37 Target="hdrright" means that hdrrnew.html will be loaded into the frame with the name hdrright. 37

38 38

39 Looking at embedded lists from last week we did not get to it. When you decide to embed something (for example under Second) you do not close the </li>. You wait until after the code you embedded is complete. 39

40 list style type tells what you want as the style on the elements in the list. 40

41 41

42 42

43 43

44 iframe is supported in HTML5 I have two iframes. When I click the content of the second one will change. This is done with the named target which loads another page into the iframe with the name. 44

45 After the click a new page is loaded in the second iframe. 45

46 The target is the iframe with the name second. 46

47 47

48 48

49 49

50 Looking at some more CSS under HTML5. There are three ways to do CSS: 1) separate sheet 2) embedded in the head 3) embedded in the body 50

51 51

52 CSS needs to be validated with its own validation service. 52

53 Another address, this is the one I have traditionally used. 53

54 Validating an external CSS page. 54

55 55

56 Validating the CSS in the HTML page. 56

57 The CSS is all on an external page. 57

58 The external page. Note that I did not specify a border color for the table so it is up to the browser what default it will use. Here the color: green under body is used. 58

59 Now I specified the color. 59

60 Note image was not done. Using class to specify rules for the tag with that class. See next slide. 60

61 Class center has centered the text in the cell and made it pink. Class right has aligned the text right, made it orange, italic and bold. 61

62 Here are the specifications for the class. Note that there is a dot in front of the class name. 62

63 63

64 64

65 I was putting a paragraph here and gave in a class of picbox but since picbox could not be applied to paragraphs I only see the blanks in the content. Missing picbox style Here I said that picbox could only be applied to div 65

66 The br in the paragraph make the multiple lines but the.picbox style cannot be applied because it is a paragraph, not a dvision. 66

framessp2015.notebook February 09, 2015

framessp2015.notebook February 09, 2015 To look at frames we are going to look at the examples under XHTML. http://www.pgrocer.net/cis44/cis44sampxhtml.html and scroll down to frames. 1 I have established a frameset (notice I did this instead

More information

c122jan2714.notebook January 27, 2014

c122jan2714.notebook January 27, 2014 Internet Developer 1 Start here! 2 3 Right click on screen and select View page source if you are in Firefox tells the browser you are using html. Next we have the tag and at the

More information

Chapter 1 Introduction to Dreamweaver CS3 1. About Dreamweaver CS3 Interface...4. Creating New Webpages...10

Chapter 1 Introduction to Dreamweaver CS3 1. About Dreamweaver CS3 Interface...4. Creating New Webpages...10 CONTENTS Chapter 1 Introduction to Dreamweaver CS3 1 About Dreamweaver CS3 Interface...4 Title Bar... 4 Menu Bar... 4 Insert Bar... 5 Document Toolbar... 5 Coding Toolbar... 6 Document Window... 7 Properties

More information

Title: Sep 12 10:58 AM (1 of 38)

Title: Sep 12 10:58 AM (1 of 38) Title: Sep 12 10:58 AM (1 of 38) Title: Sep 12 11:04 AM (2 of 38) Title: Sep 12 5:37 PM (3 of 38) Click here and then you can put in the resources. Title: Sep 12 5:38 PM (4 of 38) Title: Sep 12 5:42 PM

More information

c122sep2214.notebook September 22, 2014

c122sep2214.notebook September 22, 2014 This is using the border attribute next we will look at doing the same thing with CSS. 1 Validating the page we just saw. 2 This is a warning that recommends I use CSS. 3 This caused a warning. 4 Now I

More information

Title: Jan 29 11:03 AM (1 of 23) Note that I have now added color and some alignment to the middle and to the right on this example.

Title: Jan 29 11:03 AM (1 of 23) Note that I have now added color and some alignment to the middle and to the right on this example. Title: Jan 29 11:03 AM (1 of 23) Note that I have now added color and some alignment to the middle and to the right on this example. Sorry about these half rectangle shapes a Smartboard issue today. To

More information

Discuss web browsers. Define HTML terms

Discuss web browsers. Define HTML terms Week 1 & 2 *discuss safety of the internet and classroom Describe the internet and it s associated key terms Describe the world wide web and key terms associated Discuss web browsers Define HTML terms

More information

c122sep814.notebook September 08, 2014 All assignments should be sent to Backup please send a cc to this address

c122sep814.notebook September 08, 2014 All assignments should be sent to Backup please send a cc to this address All assignments should be sent to p.grocer@rcn.com Backup please send a cc to this address Note that I record classes and capture Smartboard notes. They are posted under audio and Smartboard under XHTML

More information

HTMLnotesS15.notebook. January 25, 2015

HTMLnotesS15.notebook. January 25, 2015 The link to another page is done with the

More information

Html basics Course Outline

Html basics Course Outline Html basics Course Outline Description Learn the essential skills you will need to create your web pages with HTML. Topics include: adding text any hyperlinks, images and backgrounds, lists, tables, and

More information

Bixby Public Schools Course Essential Elements Grade: Desktop Publishing

Bixby Public Schools Course Essential Elements Grade: Desktop Publishing Content Objective) applicable) Desktop Publishing Weeks 1-6 10-12 1. Create and edit a publication. 2. Design a newsletter. 3. Publish a tri-fold brochure 1-1 Start and quit Publisher 1-2 Describe the

More information

Taking Fireworks Template and Applying it to Dreamweaver

Taking Fireworks Template and Applying it to Dreamweaver Taking Fireworks Template and Applying it to Dreamweaver Part 1: Define a New Site in Dreamweaver The first step to creating a site in Dreamweaver CS4 is to Define a New Site. The object is to recreate

More information

Page Layout Using Tables

Page Layout Using Tables This section describes various options for page layout using tables. Page Layout Using Tables Introduction HTML was originally designed to layout basic office documents such as memos and business reports,

More information

Using Dreamweaver CC. 5 More Page Editing. Bulleted and Numbered Lists

Using Dreamweaver CC. 5 More Page Editing. Bulleted and Numbered Lists Using Dreamweaver CC 5 By now, you should have a functional template, with one simple page based on that template. For the remaining pages, we ll create each page based on the template and then save each

More information

How to lay out a web page with CSS

How to lay out a web page with CSS How to lay out a web page with CSS You can use table design features in Adobe Dreamweaver CS3 to create a simple page layout. However, a more powerful technique is to use Cascading Style Sheets (CSS).

More information

Table Basics. The structure of an table

Table Basics. The structure of an table TABLE -FRAMESET Table Basics A table is a grid of rows and columns that intersect to form cells. Two different types of cells exist: Table cell that contains data, is created with the A cell that

More information

Using Dreamweaver. 5 More Page Editing. Bulleted and Numbered Lists

Using Dreamweaver. 5 More Page Editing. Bulleted and Numbered Lists Using Dreamweaver 5 By now, you should have a functional template, with one simple page based on that template. For the remaining pages, we ll create each page based on the template and then save each

More information

CS Multimedia and Communications. Lab 06: Webpage Tables and Image Links (Website Design part 3 of 3)

CS Multimedia and Communications. Lab 06: Webpage Tables and Image Links (Website Design part 3 of 3) CS 1033 Multimedia and Communications Lab 06: Webpage Tables and Image Links (Website Design part 3 of 3) REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB! Table Properties Reference Guide The Property

More information

FRONTPAGE STEP BY STEP GUIDE

FRONTPAGE STEP BY STEP GUIDE IGCSE ICT SECTION 15 WEB AUTHORING FRONTPAGE STEP BY STEP GUIDE Mark Nicholls ICT lounge P a g e 1 Contents Introduction to this unit.... Page 4 How to open FrontPage..... Page 4 The FrontPage Menu Bar...Page

More information

Dreamweaver Basics Outline

Dreamweaver Basics Outline Dreamweaver Basics Outline The Interface Toolbar Status Bar Property Inspector Insert Toolbar Right Palette Modify Page Properties File Structure Define Site Building Our Webpage Working with Tables Working

More information

IMY 110 Theme 11 HTML Frames

IMY 110 Theme 11 HTML Frames IMY 110 Theme 11 HTML Frames 1. Frames in HTML 1.1. Introduction Frames divide up the web browser window in much the same way that a table divides up part of a page, but a different HTML document is loaded

More information

How to lay out a web page with CSS

How to lay out a web page with CSS Activity 2.6 guide How to lay out a web page with CSS You can use table design features in Adobe Dreamweaver CS4 to create a simple page layout. However, a more powerful technique is to use Cascading Style

More information

Creating A Web Page. Computer Concepts I and II. Sue Norris

Creating A Web Page. Computer Concepts I and II. Sue Norris Creating A Web Page Computer Concepts I and II Sue Norris Agenda What is HTML HTML and XHTML Tags Required HTML and XHTML Tags Using Notepad to Create a Simple Web Page Viewing Your Web Page in a Browser

More information

HTML Summary. All of the following are containers. Structure. Italics Bold. Line Break. Horizontal Rule. Non-break (hard) space.

HTML Summary. All of the following are containers. Structure. Italics Bold. Line Break. Horizontal Rule. Non-break (hard) space. HTML Summary Structure All of the following are containers. Structure Contains the entire web page. Contains information

More information

Creating a Template in WordPerfect

Creating a Template in WordPerfect 1. File a. New From Project Creating a Template in WordPerfect b. Go to Options 2. Create A Category 1 3. Name it Family History (or a title of your choice) 4. Find Family History in the Drop down list

More information

Unit 5 Web Publishing Systems Page 1 of 13 Part 4 HTML Part 4

Unit 5 Web Publishing Systems Page 1 of 13 Part 4 HTML Part 4 Unit 5 Web Publishing Systems Page 1 of 13 Part 4 HTML 4.01 Version: 4.01 Transitional Hypertext Markup Language is the coding behind web publishing. In this tutorial, basic knowledge of HTML will be covered

More information

As we design and build out our HTML pages, there are some basics that we may follow for each page, site, and application.

As we design and build out our HTML pages, there are some basics that we may follow for each page, site, and application. Extra notes - Client-side Design and Development Dr Nick Hayward HTML - Basics A brief introduction to some of the basics of HTML. Contents Intro element add some metadata define a base address

More information

[AVWSQ-ADWCS6]: WSQ ICDL Adobe Dreamweaver CS6

[AVWSQ-ADWCS6]: WSQ ICDL Adobe Dreamweaver CS6 [AVWSQ-ADWCS6]: WSQ ICDL Adobe Dreamweaver CS6 Length : 2 Days Audience(s) : New or existing users Level : 3 Technology : Adobe Dreamweaver CS6 program Delivery Method : Instructor-Led (Classroom) Course

More information

Lesson 1 New Presentation

Lesson 1 New Presentation Powerpoint Lesson 1 New Presentation 1. When PowerPoint first opens, there are four choices on how to create a new presentation. You can select AutoContent wizard, Template, Blank presentation or Open

More information

recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML)

recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML specifies formatting within a page using tags in its

More information

Chapter 1 Self Test. LATIHAN BAB 1. tjetjeprb{at}gmail{dot}com. webdesign/favorites.html :// / / / that houses that information. structure?

Chapter 1 Self Test. LATIHAN BAB 1. tjetjeprb{at}gmail{dot}com. webdesign/favorites.html :// / / / that houses that information. structure? LATIHAN BAB 1 Chapter 1 Self Test 1. What is a web browser? 2. What does HTML stand for? 3. Identify the various parts of the following URL: http://www.mcgrawhill.com/books/ webdesign/favorites.html ://

More information

Guidelines for doing the short exercises

Guidelines for doing the short exercises 1 Short exercises for Murach s HTML5 and CSS Guidelines for doing the short exercises Do the exercise steps in sequence. That way, you will work from the most important tasks to the least important. Feel

More information

Paint Box Tools. Professional Tools

Paint Box Tools. Professional Tools Paint Box Tools Professional Tools 1 1 Welcome and Appendix Welcome Whether you re a newby Mr Site user or a seasoned veteran you may well have noticed we ve updated our Paint Box editor to something a

More information

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS MOST TAGS CLASS Divides tags into groups for applying styles 202 ID Identifies a specific tag 201 STYLE Applies a style locally 200 TITLE Adds tool tips to elements 181 Identifies the HTML version

More information

A Brief Introduction to HTML

A Brief Introduction to HTML A P P E N D I X HTML SuMMAry J A Brief Introduction to HTML A web page is written in a language called HTML (Hypertext Markup Language). Like Java code, HTML code is made up of text that follows certain

More information

Dreamweaver 8. Project 5. Templates and Style Sheets

Dreamweaver 8. Project 5. Templates and Style Sheets Dreamweaver 8 Project 5 Templates and Style Sheets Starting Dreamweaver and Opening the Colorado Parks Web Site Click the Start button on the Windows taskbar Point to All Programs on the Start menu, point

More information

CSC 121 Computers and Scientific Thinking

CSC 121 Computers and Scientific Thinking CSC 121 Computers and Scientific Thinking Fall 2005 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language

More information

The Text Editor appears in many locations throughout Blackboard Learn and is used to format text. For example, you can use it to:

The Text Editor appears in many locations throughout Blackboard Learn and is used to format text. For example, you can use it to: About the Text Editor The Text Editor appears in many locations throughout Blackboard Learn and is used to format text. For example, you can use it to: Add items to Content Areas, Learning Modules, Lesson

More information

ADOBE DREAMWEAVER CS4 BASICS

ADOBE DREAMWEAVER CS4 BASICS ADOBE DREAMWEAVER CS4 BASICS Dreamweaver CS4 2 This tutorial focuses on the basic steps involved in creating an attractive, functional website. In using this tutorial you will learn to design a site layout,

More information

GRAPHIC WEB DESIGNER PROGRAM

GRAPHIC WEB DESIGNER PROGRAM NH128 HTML Level 1 24 Total Hours COURSE TITLE: HTML Level 1 COURSE OVERVIEW: This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used

More information

Proper_Name Final Exam December 21, 2005 CS-081/Vickery Page 1 of 4

Proper_Name Final Exam December 21, 2005 CS-081/Vickery Page 1 of 4 Proper_Name Final Exam December 21, 2005 CS-081/Vickery Page 1 of 4 NOTE: It is my policy to give a failing grade in the course to any student who either gives or receives aid on any exam or quiz. INSTRUCTIONS:

More information

Computer Applications Final Exam Study Guide

Computer Applications Final Exam Study Guide Name: Computer Applications Final Exam Study Guide Microsoft Word 1. To use -and-, position the pointer on top of the selected text, and then drag the selected text to the new location. 2. The Clipboard

More information

Glossary. advance: to move forward

Glossary. advance: to move forward Computer Computer Skills Glossary Skills Glossary advance: to move forward alignment tab: the tab in the Format Cells dialog box that allows you to choose how the data in the cells will be aligned (left,

More information

B. V. Patel Institute of Business Management, Computer & Information Technology, UTU

B. V. Patel Institute of Business Management, Computer & Information Technology, UTU B. C. A (Semester I) 030010108: Introduction to Web Design Lesson Plan Objective: To provide basic understanding of web and HTML for designing web pages in conjunction with HTML tags, text, videos and

More information

HTML Tags <A></A> <A HREF="http://www.cnn.com"> CNN </A> HREF

HTML Tags <A></A> <A HREF=http://www.cnn.com> CNN </A> HREF HTML Tags Tag Either HREF or NAME is mandatory Definition and Attributes The A tag is used for links and anchors. The tags go on either side of the link like this: the link

More information

1. Please, please, please look at the style sheets job aid that I sent to you some time ago in conjunction with this document.

1. Please, please, please look at the style sheets job aid that I sent to you some time ago in conjunction with this document. 1. Please, please, please look at the style sheets job aid that I sent to you some time ago in conjunction with this document. 2. W3Schools has a lovely html tutorial here (it s worth the time): http://www.w3schools.com/html/default.asp

More information

Web Design and Development ACS Chapter 3. Document Setup

Web Design and Development ACS Chapter 3. Document Setup Web Design and Development ACS-1809 Chapter 3 Document Setup 1 Create an HTML file At their very core, HTML files are simply text files with two additional feature.htm or.html as file extension name They

More information

INFS 2150 Introduction to Web Development

INFS 2150 Introduction to Web Development INFS 2150 Introduction to Web Development 3. Page Layout Design Objectives Create a reset style sheet Explore page layout designs Center a block element Create a floating element Clear a floating layout

More information

INFS 2150 Introduction to Web Development

INFS 2150 Introduction to Web Development Objectives INFS 2150 Introduction to Web Development 3. Page Layout Design Create a reset style sheet Explore page layout designs Center a block element Create a floating element Clear a floating layout

More information

Dreamweaver: Web Forms

Dreamweaver: Web Forms Dreamweaver: Web Forms Introduction Web forms allow your users to type information into form fields on a web page and send it to you. Dreamweaver makes it easy to create them. This workshop is a follow-up

More information

HTML, XHTML, and CSS 8/21/2011. Chapter Objectives. Chapter 4. Chapter Objectives. Chapter Objectives

HTML, XHTML, and CSS 8/21/2011. Chapter Objectives. Chapter 4. Chapter Objectives. Chapter Objectives HTML, XHTML, and CSS Sixth Edition Chapter 4 Creating Tables in a Web Site Using an External Style Sheet Chapter Objectives Define table elements Describe the steps used to plan, design, and code a table

More information

Chapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21

Chapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21 Table of Contents Chapter 1 Getting Started with HTML 5 1 Introduction to HTML 5... 2 New API... 2 New Structure... 3 New Markup Elements and Attributes... 3 New Form Elements and Attributes... 4 Geolocation...

More information

DREAMWEAVER QUICK START TABLE OF CONTENT

DREAMWEAVER QUICK START TABLE OF CONTENT DREAMWEAVER QUICK START TABLE OF CONTENT Web Design Review 2 Understanding the World Wide Web... 2 Web Browsers... 2 How Browsers Display Web pages... 3 The Web Process at Sacramento State... 4 Web Server

More information

A Balanced Introduction to Computer Science, 3/E

A Balanced Introduction to Computer Science, 3/E A Balanced Introduction to Computer Science, 3/E David Reed, Creighton University 2011 Pearson Prentice Hall ISBN 978-0-13-216675-1 Chapter 2 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is

More information

ORB Education Quality Teaching Resources

ORB Education Quality Teaching Resources These basic resources aim to keep things simple and avoid HTML and CSS completely, whilst helping familiarise students with what can be a daunting interface. The final websites will not demonstrate best

More information

GIMP WEB 2.0 MENUS WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR CREATING AN HTML LIST

GIMP WEB 2.0 MENUS WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR CREATING AN HTML LIST GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR Hover effect: CREATING AN HTML LIST Most horizontal or vertical navigation bars begin with a simple

More information

HTML and CSS COURSE SYLLABUS

HTML and CSS COURSE SYLLABUS HTML and CSS COURSE SYLLABUS Overview: HTML and CSS go hand in hand for developing flexible, attractively and user friendly websites. HTML (Hyper Text Markup Language) is used to show content on the page

More information

FrontPage. Directions & Reference

FrontPage. Directions & Reference FrontPage Directions & Reference August 2006 Table of Contents Page No. Open, Create, Save WebPages Open Webpage... 1 Create and Save a New Page... 1-2 Change the Background Color of Your Web Page...

More information

HTML5. HTML5 Introduction. Form Input Types. Semantic Elements. Form Attributes. Form Elements. Month Number Range Search Tel Url Time Week

HTML5. HTML5 Introduction. Form Input Types. Semantic Elements. Form Attributes. Form Elements. Month Number Range Search Tel Url Time Week WEB DESIGNING HTML HTML - Introduction HTML - Elements HTML - Tags HTML - Text HTML - Formatting HTML - Pre HTML - Attributes HTML - Font HTML - Text Links HTML - Comments HTML - Lists HTML - Images HTML

More information

Using Microsoft Excel

Using Microsoft Excel About Excel Using Microsoft Excel What is a Spreadsheet? Microsoft Excel is a program that s used for creating spreadsheets. So what is a spreadsheet? Before personal computers were common, spreadsheet

More information

ADOBE VISUAL COMMUNICATION USING DREAMWEAVER CS5 Curriculum/Certification Mapping in MyGraphicsLab

ADOBE VISUAL COMMUNICATION USING DREAMWEAVER CS5 Curriculum/Certification Mapping in MyGraphicsLab ADOBE VISUAL COMMUNICATION USING DREAMWEAVER CS5 Curriculum/Certification Mapping in MyGraphicsLab OBJECTIVES- 1.0 Setting Project Requirement 1.1 Identify the purpose, audience, and audience needs for

More information

Understanding the Web Design Environment. Principles of Web Design, Third Edition

Understanding the Web Design Environment. Principles of Web Design, Third Edition Understanding the Web Design Environment Principles of Web Design, Third Edition HTML: Then and Now HTML is an application of the Standard Generalized Markup Language Intended to represent simple document

More information

Styles, Style Sheets, the Box Model and Liquid Layout

Styles, Style Sheets, the Box Model and Liquid Layout Styles, Style Sheets, the Box Model and Liquid Layout This session will guide you through examples of how styles and Cascading Style Sheets (CSS) may be used in your Web pages to simplify maintenance of

More information

Before you begin, make sure you have the images for these exercises saved in the location where you intend to create the Nuklear Family Website.

Before you begin, make sure you have the images for these exercises saved in the location where you intend to create the Nuklear Family Website. 9 Now it s time to challenge the serious web developers among you. In this section we will create a website that will bring together skills learned in all of the previous exercises. In many sections, rather

More information

Learning Adobe DreamWeaver CC. Module 1 Contents. Chapter 1: Introduction to DreamWeaver CC

Learning Adobe DreamWeaver CC. Module 1 Contents. Chapter 1: Introduction to DreamWeaver CC Module 1 Contents Chapter 1: Introduction to DreamWeaver CC Design Considerations...1-1 Types of Graphics...1-2 Backgrounds and Text...1-2 Planning the Navigation...1-2 The DreamWeaver Screen...1-3 Workspaces...

More information

This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step.

This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step. This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step. Table of Contents Just so you know: Things You Can t Do with Word... 1 Get Organized... 1 Create the

More information

Lesson 5 Introduction to Cascading Style Sheets

Lesson 5 Introduction to Cascading Style Sheets Introduction to Cascading Style Sheets HTML and JavaScript BASICS, 4 th Edition 1 Objectives Create a Cascading Style Sheet. Control hyperlink behavior with CSS. Create style classes. Share style classes

More information

How to lay out a web page with CSS

How to lay out a web page with CSS How to lay out a web page with CSS A CSS page layout uses the Cascading Style Sheets format, rather than traditional HTML tables or frames, to organize the content on a web page. The basic building block

More information

Web Development & Design Foundations with HTML5 & CSS3 Instructor Materials Chapter 2 Test Bank

Web Development & Design Foundations with HTML5 & CSS3 Instructor Materials Chapter 2 Test Bank Multiple Choice. Choose the best answer. 1. What tag pair is used to create a new paragraph? a. b. c. d. 2. What tag pair

More information

Dreamweaver CS3 Concepts and Techniques

Dreamweaver CS3 Concepts and Techniques Dreamweaver CS3 Concepts and Techniques Chapter 3 Tables and Page Layout Part 1 Other pages will be inserted in the website Hierarchical structure shown in page DW206 Chapter 3: Tables and Page Layout

More information

By Ryan Stevenson. Guidebook #2 HTML

By Ryan Stevenson. Guidebook #2 HTML By Ryan Stevenson Guidebook #2 HTML Table of Contents 1. HTML Terminology & Links 2. HTML Image Tags 3. HTML Lists 4. Text Styling 5. Inline & Block Elements 6. HTML Tables 7. HTML Forms HTML Terminology

More information

Lecture : 3. Practical : 2. Course Credit. Tutorial : 0. Total : 5. Course Learning Outcomes

Lecture : 3. Practical : 2. Course Credit. Tutorial : 0. Total : 5. Course Learning Outcomes Course Title Course Code WEB DESIGNING TECHNOLOGIES DCE311 Lecture : 3 Course Credit Practical : Tutorial : 0 Total : 5 Course Learning Outcomes At end of the course, students will be able to: Understand

More information

Chapter 1 True/False Instructions: Circle T if the statement is true or F if the statement is false.

Chapter 1 True/False Instructions: Circle T if the statement is true or F if the statement is false. Name Date Chapter 1 True/False Instructions: Circle T if the statement is true or F if the statement is false. T F 1. WYSIWYG stands for What You See Is What You Get. T F 2. The menu bar shows the application

More information

HTML HTML/XHTML HTML / XHTML HTML HTML: XHTML: (extensible HTML) Loose syntax Few syntactic rules: not enforced by HTML processors.

HTML HTML/XHTML HTML / XHTML HTML HTML: XHTML: (extensible HTML) Loose syntax Few syntactic rules: not enforced by HTML processors. HTML HTML/XHTML HyperText Mark-up Language Basic language for WWW documents Format a web page s look, position graphics and multimedia elements Describe document structure and formatting Platform independent:

More information

OU EDUCATE TRAINING MANUAL

OU EDUCATE TRAINING MANUAL OU EDUCATE TRAINING MANUAL OmniUpdate Web Content Management System El Camino College Staff Development 310-660-3868 Course Topics: Section 1: OU Educate Overview and Login Section 2: The OmniUpdate Interface

More information

The figure below shows the Dreamweaver Interface.

The figure below shows the Dreamweaver Interface. Dreamweaver Interface Dreamweaver Interface In this section you will learn about the interface of Dreamweaver. You will also learn about the various panels and properties of Dreamweaver. The Macromedia

More information

FORMS. The Exciting World of Creating RSVPs and Gathering Information with Forms in ClickDimensions. Presented by: John Reamer

FORMS. The Exciting World of Creating RSVPs and Gathering Information with Forms in ClickDimensions. Presented by: John Reamer FORMS The Exciting World of Creating RSVPs and Gathering Information with Forms in ClickDimensions Presented by: John Reamer Creating Forms Forms and Surveys: When and What to Use them For Both Allow you

More information

Learn more about Pages, Keynote & Numbers

Learn more about Pages, Keynote & Numbers Learn more about Pages, Keynote & Numbers HCPS Instructional Technology May 2012 Adapted from Apple Help Guides CHAPTER ONE: PAGES Part 1: Get to Know Pages Opening and Creating Documents Opening a Pages

More information

By completing this practical, the students will learn how to accomplish the following tasks:

By completing this practical, the students will learn how to accomplish the following tasks: By completing this practical, the students will learn how to accomplish the following tasks: Learn different ways by which styles that enable you to customize HTML elements and precisely control the formatting

More information

CSS worksheet. JMC 105 Drake University

CSS worksheet. JMC 105 Drake University CSS worksheet JMC 105 Drake University 1. Download the css-site.zip file from the class blog and expand the files. You ll notice that you have an images folder with three images inside and an index.html

More information

Year 8 Computing Science End of Term 3 Revision Guide

Year 8 Computing Science End of Term 3 Revision Guide Year 8 Computing Science End of Term 3 Revision Guide Student Name: 1 Hardware: any physical component of a computer system. Input Device: a device to send instructions to be processed by the computer

More information

COPYRIGHTED MATERIAL. Contents. Chapter 1: Creating Structured Documents 1

COPYRIGHTED MATERIAL. Contents. Chapter 1: Creating Structured Documents 1 59313ftoc.qxd:WroxPro 3/22/08 2:31 PM Page xi Introduction xxiii Chapter 1: Creating Structured Documents 1 A Web of Structured Documents 1 Introducing XHTML 2 Core Elements and Attributes 9 The

More information

How to set up a local root folder and site structure

How to set up a local root folder and site structure Activity 2.1 guide How to set up a local root folder and site structure The first thing to do when creating a new website with Adobe Dreamweaver CS3 is to define a site and identify a root folder where

More information

Using Dreamweaver CS6

Using Dreamweaver CS6 Using Dreamweaver CS6 4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan shown below.

More information

Creating Forms. Starting the Page. another way of applying a template to a page.

Creating Forms. Starting the Page. another way of applying a template to a page. Creating Forms Chapter 9 Forms allow information to be obtained from users of a web site. The ability for someone to purchase items over the internet or receive information from internet users has become

More information

1/6/ :28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014

1/6/ :28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014 1/6/2019 12:28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014 CATALOG INFORMATION Dept and Nbr: CS 50A Title: WEB DEVELOPMENT 1 Full Title: Web Development 1 Last Reviewed:

More information

CHAPTER 2 MARKUP LANGUAGES: XHTML 1.0

CHAPTER 2 MARKUP LANGUAGES: XHTML 1.0 WEB TECHNOLOGIES A COMPUTER SCIENCE PERSPECTIVE CHAPTER 2 MARKUP LANGUAGES: XHTML 1.0 Modified by Ahmed Sallam Based on original slides by Jeffrey C. Jackson reserved. 0-13-185603-0 HTML HELLO WORLD! Document

More information

FrontPage 98 Quick Guide. Copyright 2000 Peter Pappas. edteck press All rights reserved.

FrontPage 98 Quick Guide. Copyright 2000 Peter Pappas. edteck press All rights reserved. Master web design skills with Microsoft FrontPage 98. This step-by-step guide uses over 40 full color close-up screen shots to clearly explain the fast and easy way to design a web site. Use edteck s QuickGuide

More information

Figure 1 Forms category in the Insert panel. You set up a form by inserting it and configuring options through the Properties panel.

Figure 1 Forms category in the Insert panel. You set up a form by inserting it and configuring options through the Properties panel. Adobe Dreamweaver CS6 Project 3 guide How to create forms You can use forms to interact with or gather information from site visitors. With forms, visitors can provide feedback, sign a guest book, take

More information

Eng 110, Spring Week 03 Lab02- Dreamwaver Session

Eng 110, Spring Week 03 Lab02- Dreamwaver Session Eng 110, Spring 2008 Week 03 Lab02- Dreamwaver Session Assignment Recreate the 3-page website you did last week by using Dreamweaver. You should use tables to control your layout. You should modify fonts,

More information

The content editor has two view modes: simple mode and advanced mode. Change the view in the upper-right corner of the content editor.

The content editor has two view modes: simple mode and advanced mode. Change the view in the upper-right corner of the content editor. Content Editor The content editor allows you to add and format text, insert equations and hyperlinks, tables, and attach different types of files to content. The editor appears throughout the system as

More information

CS Multimedia and Communications REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB!

CS Multimedia and Communications REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB! CS 1033 Multimedia and Communications REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB! Lab 06: Introduction to KompoZer (Website Design - Part 3 of 3) Lab 6 Tutorial 1 In this lab we are going to learn

More information

COMP1000 Mid-Session Test 2017s1

COMP1000 Mid-Session Test 2017s1 COMP1000 Mid-Session Test 2017s1 Total Marks: 45 Duration: 55 minutes + 10 min reading time This examination has three parts: Part 1: 15 Multiple Choice Questions (15 marks /45) Part 2: Practical Excel

More information

Introduction to using HTML to design webpages

Introduction to using HTML to design webpages Introduction to using HTML to design webpages #HTML is the script that web pages are written in. It describes the content and structure of a web page so that a browser is able to interpret and render the

More information

Learning DreamWeaver MX 2004

Learning DreamWeaver MX 2004 Contents Users Notes Software Requirements...xi The DW Support Files...xi Copying the DW Support Files...xi Windows Systems...xi Macintosh Systems...xi Using the Activities in Schools... xii The Chapter

More information

University of Bahrain College of Applied Studies

University of Bahrain College of Applied Studies University of Bahrain College of Applied Studies CSA 212: Human Interface and Design Activity 5: Front page 2003 Name : Student ID No : Section Instructor : : Demonstrator : Date : Total Marks : 10 Marks

More information

WEB DESIGNING COURSE SYLLABUS

WEB DESIGNING COURSE SYLLABUS F.A. Computer Point #111 First Floor, Mujaddadi Estate/Prince Hotel Building, Opp: Okaz Complex, Mehdipatnam, Hyderabad, INDIA. Ph: +91 801 920 3411, +91 92900 93944 040 6662 6601 Website: www.facomputerpoint.com,

More information

PlayerLync Forms User Guide (MachForm)

PlayerLync Forms User Guide (MachForm) PlayerLync Forms User Guide (MachForm) Table of Contents FORM MANAGER... 1 FORM BUILDER... 3 ENTRY MANAGER... 4 THEME EDITOR... 6 NOTIFICATIONS... 8 FORM CODE... 9 FORM MANAGER The form manager is where

More information

Creating Visually Appealing Documents. Word Module 2. Diocese of St. Petersburg Office of Training

Creating Visually Appealing Documents. Word Module 2. Diocese of St. Petersburg Office of Training Creating Visually Appealing Documents Word 2010 Module 2 Diocese of St. Petersburg Office of Training Training@dosp.org Diocese of St. Petersburg 0 9/5/2014 This Page Left Intentionally Blank Diocese of

More information

EMP105A-D - How to plan and build a basic form in Front Page.

EMP105A-D - How to plan and build a basic form in Front Page. EMP105A-D - How to plan and build a basic form in Front Page. Instructor : Scott Klassen Room : OC2004 Main Objectives: Recognizing when to use a form Building your form o Creating the form o Inserting

More information