Lesson 1: Dreamweaver CS6 Jumpstart

Size: px
Start display at page:

Download "Lesson 1: Dreamweaver CS6 Jumpstart"

Transcription

1 Lesson 1: Dreamweaver CS6 Jumpstart Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver CS6

2 Overview 2013 John Wiley & Sons, Inc. 2

3 3.1 Elements of the Dreamweaver Interface When you work with a document, Dreamweaver lets you see your work in one of four views: 1. Dreamweaver s default Design view lets you add elements to your page in a visual fashion. 2. More experienced web designers and coders can use the Code view to edit a document s HTML code and scripts directly 2013 John Wiley & Sons, Inc. 3

4 3.1 Elements of the Dreamweaver Interface 3. For those who like something in between, the Split view provides a split-pane Design and Code view all at once as shown at right John Wiley & Sons, Inc. 4

5 3.1 Elements of the Dreamweaver Interface 4. The Live view is a type of reality check that allows you to view your page in a native web browser, eliminating the need to leave the program in order to preview your designs John Wiley & Sons, Inc. 5

6 3.1 Elements of the Dreamweaver Interface Built-in FTP: You can easily upload and download files to and from your web server using the Files panel s drag-and-drop interface. Page and code object Insert panels: You can find intuitive icons for most common web page elements in a categorized Insert panel, from which you can add elements to your page with a single click. CSS Styles panel: Dreamweaver s full-featured CSS Styles panel lets you create, edit, and manage styles on-the-fly from a single panel John Wiley & Sons, Inc. 6

7 3.1 Elements of the Dreamweaver Interface Customizable workspace layouts: You can save combinations and positions of panels and toolbars. Save multiple workspace layouts for different users, or create workspaces for specific tasks John Wiley & Sons, Inc. 7

8 3.1 Elements of the Dreamweaver Interface Powerful visual aids: Take advantage of the precision you re accustomed to in other programs through guides, rulers, measuring tools, and customizable positioning grid; many of these features are found and can be activated within the View menu John Wiley & Sons, Inc. 8

9 3.1 Elements of the Dreamweaver Interface CSS styles panel: Take advantage of the vast design and formatting options that CSS provides through Dreamweaver s full-featured CSS Styles panel, which lets you create, edit, and manage styles on-the-fly from a single panel John Wiley & Sons, Inc. 9

10 3.4 Use The Assets Panel The Assets panel (Windows > Assets) catalogs different types of content and code from your site and allows you to easily locate and apply an asset, such as colors, by clicking and dragging or applying it. The Assets panel will allow you to access and reuse multiple types of content and code John Wiley & Sons, Inc. 10

11 6.4 Managing Assets, Links, and Files for a Site The Related Files bar runs across the top of your document window and shows the various files used create your finished page. You can switch between these files using the Related Files bar without losing the visual preview of their parent page John Wiley & Sons, Inc. 11

12 3.1 Elements of the Dreamweaver Interface Clicking on the Code Navigator, enabled in the design view, shows CSS styles. You can click on the style in order to view the code directly John Wiley & Sons, Inc. 12

13 4.5 Applying Alternative Text InContext Editing, a feature of Business Catalyst, allows users to make simple content changes within a web browser. The creator of the HTML page in Dreamweaver must specify regions on the page that users can edit. For example, you could make a table an editable region. When users log into the InContext Editing service, they can edit the table in a browser John Wiley & Sons, Inc. 13

14 2.1 Website Design: Best Practices Style sheets define page layout, fonts, navigation, and color in a central location, thereby ensuring consistency. Snippets are small sections of code that you can reuse from page to page such as a table or a copyright notice. Library Items are similar to Snippets but maintain a relationship with the original, allowing you to update multiple instances with a single change. Templates allow you to link multiple pages to one single master John Wiley & Sons, Inc. 14

15 1.1 Identify Your Site s Purpose Questions that might arise in discussing the functionality and design of such a site include: Will the site be free? Will advertising need to be included in the layout? Is there a target audience? What is the typical occupation, sex, education, residence, race and computer literacy of this audience? What user interactions might there be on site. For example, can users submit recipes or simply browse existing ones? 2013 John Wiley & Sons, Inc. 15

16 1.2 Identify Content Relevant to the Site s Purpose Page content should serve a single specific purpose. Your pages should contain content designed to serve that purpose. Content must be helpful and of practical use. Consider the format you are delivering your content in. Organize your content by dividing it into chunks and using headings, subheadings, lists, tables, and images. Evaluate your sentence structure, and eliminate grammar and typographical errors John Wiley & Sons, Inc. 16

17 1.5 Development Decisions When designing a website, take into account: Download Speed. The rise of broadband Internet connections has steadily increased but take account the experience of users who may not have the fastest connections. Remember that mobile devices may have slower connection speeds. Screen Resolution. The number of screen sizes is wide, and users are beginning to expect websites to function well at any size. Support for JavaScript, plug-ins and multimedia. Many modern web pages have features that are dependent on JavaScript and/or browser plugins such as Flash. Consider what happens if a user does not have these features John Wiley & Sons, Inc. 17

18 1.6 Project Management Tasks and Responsibilities There are differences between small projects and large ones, but there are commonalities worth discussing: Defining a project plan. A project plan might include assigning tasks and responsibilities to various team members, assigning due dates, and allocating resources. Planning and analysis. A website should have a reason for existing and serve the needs of users. The site creator should have a very good sense of this before moving further. Designing. You might start the design process with a sketch, and mockups done in a program such as Photoshop can convey color, type, and layout before moving into the realm of HTML/CSS John Wiley & Sons, Inc. 18

19 1.6 Project Management Tasks and Responsibilities Building. Building a site involves organizing all the content into HTML (or a scripting language such as PHP), CSS and perhaps JavaScript. Additionally, a logical and usable navigation system (often referred to as information architecture) is needed. Testing. Common tests include checking for broken hyperlinks or missing images, checking page appearance on multiple browsers and platforms, checking for accessibility and readability. Site launching and maintenance. Deployment (or launching ) is the final step and involves transferring site documents from a local or network system to a final destination or URL John Wiley & Sons, Inc. 19

20 2.5 Flowcharts, Storyboards, and Wireframes Flowcharts provide a visual overview of how your website is organized. A flowchart illustrates the primary navigation within a site as well as the relationships of pages. The term primary navigation relates to the site s hierarchy and can be defined as the level of importance assigned to specific pages. Flowcharts quickly and easily communicate the structure of a site John Wiley & Sons, Inc. 20

21 2.5 Flowcharts, Storyboards, and Wireframes Storyboards help you focus on page content and provide a way to fine-tune navigation and site structure. A storyboard consists of multiple pages based on those defined in the flowchart. A storyboard could be created by hand as a sketch or diagram, but is more often done digitally John Wiley & Sons, Inc. 21

22 2.5 Flowcharts, Storyboards, and Wireframes A wireframe takes you one step closer to your HTML and CSS designs but without committing to design decisions such as images, colors, and fonts. Wireframes are typically created in black and white or shades of gray, using placeholders. At this stage, organization of the content and the features of the site are still a priority, the goal is to allow time for feedback from clients or other members involved with the project John Wiley & Sons, Inc. 22

23 2.5 Flowcharts, Storyboards, and Wireframes At the wireframe stage, it is possible that your original flowchart will need to be updated due to changes along the way. You also may have strayed from your original hierarchy, perhaps by dropping or modifying elements in your navigation bar or other changes. You can always compare the flowchart to the wireframe and make sure pages are reflected but another way to determine if the planned hierarchy is being followed is by adding an element of interactivity John Wiley & Sons, Inc. 23

24 2.1 Website Design: Best Practices In HTML a pair of tags is referred to as an element. HTML elements define the structure of a page as well as the content hierarchy (importance) and examples include headings, lists, images, tables, formatting such as the strong, small, and em tags and even the HTML documents themselves. The HTML element is the most fundamental element you will use. It is used to specify the beginning and end of HTML in a document: <html></html> 2013 John Wiley & Sons, Inc. 24

25 3.1 Elements of the Dreamweaver Interface In Dreamweaver s panels and in your code, each color is referred to by a six-character code preceded by a pound sign. This code is called the hexadecimal code; it s the system that HTML pages use to identify and use colors. You can reproduce almost any color using a unique hexadecimal code. For example, a lime green hexadecimal color is #9F3 as shown above John Wiley & Sons, Inc. 25

26 4.4 Add Text to a Web Page There are different ways to format your text. In the Design view, click once after the sentence that reads, This is one sentence, and then press Shift+Enter (Windows) or Shift+Return (Mac OS) twice. This creates two line returns you can see that each line return is created in your code by a <br> (break) tag as seen at right. When rendered in the browser, the <br> tag adds blank lines between the sentences; however the sentences are technically within the same paragraph John Wiley & Sons, Inc. 26

27 4.3 Create, Title, Name, and Save a Web Page Although HTML is very flexible, there are a few file-naming restrictions (issues which may cause errors) and conventions (standard practice for designers and developers): Forbidden Characters. Stay away from using any of the following characters as they may cause problems in your file directory or when loading in a web browser: *&^%$#@! Filename extensions. The most common filename extension for files containing HTML is.html. A common abbreviation of this is.htm. You can use either interchangeably. Avoid whitespace in file names. In the early days of the web, a space in the file name such as about us.html could cause errors on certain web servers. This has largely been solved and web servers generally replace spaces with the characters %20. However, to be safe it is highly recommended that you avoid spaces in your file name John Wiley & Sons, Inc. 27

28 4.3 Create, Title, Name, and Save a Web Page Avoid the forward slash / and the back slash \ Using either in your file names could potentially cause problems on a web server or could be misinterpreted as a path to a directory. Be consistent with upper or lowercase when naming files. Many designers and developers have settled on using all lowercase for their file names (for example contact.html not Contact.html or CONTACT.html ). Using index.html vs. default.html The index.html convention has generally become the standard, although default.html will likely work on most servers John Wiley & Sons, Inc. 28

29 Lesson Summary 2013 John Wiley & Sons, Inc. 29

30 Copyright 2013 John Wiley & Sons, Inc.. All rights reserved. Reproduction or translation of this work beyond that named in Section 117 of the 1976 United States Copyright Act without the express written consent of the copyright owner is unlawful. Requests for further information should be addressed to the Permissions Department, John Wiley & Sons, Inc.. The purchaser may make back-up copies for his/her own use only and not for distribution or resale. The Publisher assumes no responsibility for errors, omissions, or damages, caused by the use of these programs or from the use of the information contained herein.

Foundation of Web Goal 4: Proficiency in Adobe Dreamweaver CC

Foundation of Web Goal 4: Proficiency in Adobe Dreamweaver CC 1. Setting Project Requirements 1.1 Identify the purpose, audience, and audience needs for a website. 1.2 Identify web page content that is relevant to the website purpose and appropriate for the target

More information

Figure 1 Properties panel, HTML mode

Figure 1 Properties panel, HTML mode How to add text Adding text to a document To add text to a Dreamweaver document, you can type text directly in the Document window, or you can cut and paste text. You modify text by using the Properties

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

Adobe Web Communication using Dreamweaver CS5 Curriculum/Certification mapping

Adobe Web Communication using Dreamweaver CS5 Curriculum/Certification mapping Adobe Web Communication using Dreamweaver CS5 Curriculum/Certification mapping OBJECTIVES Domain 1.0 Setting Project Requirements 1.1 Identify the purpose, audience, and audience needs for a website. 1.2

More information

Before starting, make sure that your tools and panels are consistent by resetting your workspace. See Resetting the Dreamweaver workspace on page 3.

Before starting, make sure that your tools and panels are consistent by resetting your workspace. See Resetting the Dreamweaver workspace on page 3. Lesson 1 Dreamweaver CS5 Jumpstart What you ll learn in this lesson: Exploring Dreamweaver s primary features Introducing new features in CS5 Understanding how web sites and web pages work Coding HTML/XHTML:

More information

Dreamweaver Basics. Planning your website Organize site structure Plan site design & navigation Gather your assets

Dreamweaver Basics. Planning your website Organize site structure Plan site design & navigation Gather your assets Dreamweaver Basics Planning your website Organize site structure Plan site design & navigation Gather your assets Creating your website Dreamweaver workspace Define a site Create a web page Linking Manually

More information

Before starting, make sure that your tools and panels are consistent by resetting your workspace. See Resetting the Dreamweaver workspace on page 3.

Before starting, make sure that your tools and panels are consistent by resetting your workspace. See Resetting the Dreamweaver workspace on page 3. Lesson 1 Dreamweaver CS4 Jumpstart What you ll learn in this lesson: Exploring Dreamweaver s primary features Introducing new features in CS4 Understanding how web sites and web pages work Coding HTML/XHTML:

More information

Adobe Web Authoring using Adobe Dreamweaver Exam and objectives

Adobe Web Authoring using Adobe Dreamweaver Exam and objectives Adobe Web Authoring using Adobe Dreamweaver Exam and objectives After taking the exam, your score is electronically reported. Please allow 2-4 weeks from the date you pass the exam to receive your ACA

More information

Objective % Select and utilize tools to design and develop websites.

Objective % Select and utilize tools to design and develop websites. Objective 207.02 8% Select and utilize tools to design and develop websites. Hypertext Markup Language (HTML) Basic framework for all web design. Written using tags that a web browser uses to interpret

More information

1. Setup a root folder for the website 2. Create a wireframe 3. Add content 4. Create hyperlinks between pages and to external websites

1. Setup a root folder for the website 2. Create a wireframe 3. Add content 4. Create hyperlinks between pages and to external websites A. Pre-Production of Webpage 1. Determine the specific software needed WYSIWYG- design software that manipulates components of the web page without the user writing or editing code Uses graphical layout

More information

Adobe Dreamweaver CS6 Digital Classroom

Adobe Dreamweaver CS6 Digital Classroom Adobe Dreamweaver CS6 Digital Classroom Osborn, J ISBN-13: 9781118124093 Table of Contents Starting Up About Dreamweaver Digital Classroom 1 Prerequisites 1 System requirements 1 Starting Adobe Dreamweaver

More information

All Adobe Digital Design Vocabulary Absolute Div Tag Allows you to place any page element exactly where you want it Absolute Link Includes the

All Adobe Digital Design Vocabulary Absolute Div Tag Allows you to place any page element exactly where you want it Absolute Link Includes the All Adobe Digital Design Vocabulary Absolute Div Tag Allows you to place any page element exactly where you want it Absolute Link Includes the complete URL of the linked document, including the domain

More information

IT153 Midterm Study Guide

IT153 Midterm Study Guide IT153 Midterm Study Guide These are facts about the Adobe Dreamweaver CS4 Application. If you know these facts, you should be able to do well on your midterm. Dreamweaver users work in the Document window

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

Overview of the Adobe Dreamweaver CS5 workspace

Overview of the Adobe Dreamweaver CS5 workspace Adobe Dreamweaver CS5 Activity 2.1 guide Overview of the Adobe Dreamweaver CS5 workspace You can access Adobe Dreamweaver CS5 tools, commands, and features by using menus or by selecting options from one

More information

Dreamweaver Domain 4: Adding Content by Using Dreamweaver CS5

Dreamweaver Domain 4: Adding Content by Using Dreamweaver CS5 Dreamweaver Domain 4: Adding Content by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA Certification Preparation: Featuring Dreamweaver, Flash, and Photoshop 1 Objectives Define a Dreamweaver site. Create,

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

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

Wolf. Responsive Website Designer. Mac Edition User Guide

Wolf. Responsive Website Designer. Mac Edition User Guide Wolf Responsive Website Designer Mac Edition User Guide Version 2.10.3 Table of Contents What is Wolf Website Designer? Editor overview Save and open website Create responsive layout How to create responsive

More information

Dreamweaver MX The Basics

Dreamweaver MX The Basics Chapter 1 Dreamweaver MX 2004 - The Basics COPYRIGHTED MATERIAL Welcome to Dreamweaver MX 2004! Dreamweaver is a powerful Web page creation program created by Macromedia. It s included in the Macromedia

More information

Internet: An international network of connected computers. The purpose of connecting computers together, of course, is to share information.

Internet: An international network of connected computers. The purpose of connecting computers together, of course, is to share information. Internet: An international network of connected computers. The purpose of connecting computers together, of course, is to share information. WWW: (World Wide Web) A way for information to be shared over

More information

Advanced Dreamweaver CS6

Advanced Dreamweaver CS6 Advanced Dreamweaver CS6 Overview This advanced Dreamweaver CS6 training class teaches you to become more efficient with Dreamweaver by taking advantage of Dreamweaver's more advanced features. After this

More information

Dreamweaver Domain 6: Evaluating and Maintaining a Site by Using Dreamweaver CS5

Dreamweaver Domain 6: Evaluating and Maintaining a Site by Using Dreamweaver CS5 Dreamweaver Domain 6: Evaluating and Maintaining a Site by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA Certification Preparation: Featuring Dreamweaver, Flash, and Photoshop 1 Objectives Conduct technical

More information

ACA Dreamweaver Exam Notes

ACA Dreamweaver Exam Notes ACA Dreamweaver Exam Notes Remember when you need to copy and paste the text you have to open up that actual text file itself and the need to go to edit> select all>, edit> copy>, then go back to the html

More information

PRODUCTION PHASES CHANGES

PRODUCTION PHASES CHANGES PRODUCTION PHASES CHANGES There are changes in the production phases terminology as related to the Adobe certification test objectives. We have added new phase names as identified by Adobe resources linked

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

ICT IGCSE Practical Revision Presentation Web Authoring

ICT IGCSE Practical Revision Presentation Web Authoring 21.1 Web Development Layers 21.2 Create a Web Page Chapter 21: 21.3 Use Stylesheets 21.4 Test and Publish a Website Web Development Layers Presentation Layer Content layer: Behaviour layer Chapter 21:

More information

Getting Started with CSS Sculptor 3

Getting Started with CSS Sculptor 3 Getting Started with CSS Sculptor 3 With CSS Sculptor, you can quickly create a cross-browser compatible layout with custom widths, margins, padding, background images and more. Additionally, you can use

More information

Dear Candidate, Thank you, Adobe Education

Dear Candidate, Thank you, Adobe Education Dear Candidate, In preparation for the Web Communication certification exam, we ve put together a set of practice materials and example exam items for you to review. What you ll find in this packet are:

More information

Working with WebNode

Working with WebNode Workshop 28 th February 2008 Page 1 http://blog.larkin.net.au/ What is WebNode? Working with WebNode WebNode is an online tool that allows you to create functional and elegant web sites. The interesting

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

[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

CLASS 6: March 5, 2014 MULTIMEDIA TOOLS: DGIM 601-W01 (127469)

CLASS 6: March 5, 2014 MULTIMEDIA TOOLS: DGIM 601-W01 (127469) CLASS 6: March 5, 2014 MULTIMEDIA TOOLS: DGIM 601-W01 (127469) AGENDA: Homework Review: Website Logo (Save As: YourInitials_logo.psd ) Photoshop Lesson 6: Start Midterm Set-Up OBJECTIVE: Set-Up Photoshop

More information

Exam : 9A Title : Adobe GoLive CS2 ACE Exam. Version : DEMO

Exam : 9A Title : Adobe GoLive CS2 ACE Exam. Version : DEMO Exam : 9A0-046 Title : Adobe GoLive CS2 ACE Exam Version : DEMO 1. Which scripting language is the default for use with ASP, and does NOT require a language specification at the beginning of a Web page's

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

Systems Analysis and Design

Systems Analysis and Design Systems Analysis and Design Alan Dennis, Barbara Haley Wixom, and Roberta Roth John Wiley & Sons, Inc. Slides by Candace S. Garrod Red Rocks Community College 9-1 User Interfaces Chapter 9 9-2 Key Definitions

More information

With Dreamweaver CS4, Adobe has radically

With Dreamweaver CS4, Adobe has radically Introduction to the Dreamweaver Interface With Dreamweaver CS4, Adobe has radically reengineered the Dreamweaver interface to provide a more unified experience across all of the Creative Suite applications.

More information

Greenwood International School Course Description

Greenwood International School Course Description Ref: GIS ICT G11 2017-2018 Greenwood International School Course Description SUBJECT : Information and Communication Technology (ICT) GRADE LEVEL : 11 DURATION : 1 Year TEACHER : Ms. Sarika GOAL: The students

More information

How to use CSS text styles

How to use CSS text styles How to use CSS text styles Web typography is an important creative tool web designers use to express style and emotion that enhances the goal and overall message of a website. Image-based text gives you

More information

Dreamweaver CS6. Table of Contents. Setting up a site in Dreamweaver! 2. Templates! 3. Using a Template! 3. Save the template! 4. Views!

Dreamweaver CS6. Table of Contents. Setting up a site in Dreamweaver! 2. Templates! 3. Using a Template! 3. Save the template! 4. Views! Dreamweaver CS6 Table of Contents Setting up a site in Dreamweaver! 2 Templates! 3 Using a Template! 3 Save the template! 4 Views! 5 Properties! 5 Editable Regions! 6 Creating an Editable Region! 6 Modifying

More information

Maria A. Cordell CS 6763 Assignment One. September 21, 2004

Maria A. Cordell CS 6763 Assignment One. September 21, 2004 Maria A. Cordell CS 6763 Assignment One September 21, 2004 Part 1: SBF Analysis of Dreamweaver MX 2004... 1 Product Design Capabilities... 1 High-level Function Support... 2 Second-level Functions... 5

More information

Tutorial 2 - HTML basics

Tutorial 2 - HTML basics Tutorial 2 - HTML basics Developing a Web Site The first phase in creating a new web site is planning. This involves determining the site s navigation structure, content, and page layout. It is only after

More information

Lesson 2: Installing Windows 8.1. MOAC : Configuring Windows 8.1

Lesson 2: Installing Windows 8.1. MOAC : Configuring Windows 8.1 Lesson 2: Installing Windows 8.1 MOAC 70-687: Configuring Windows 8.1 Overview Exam Objective 1.2: Install Windows 8.1 o Install as Windows To Go o Migrate from previous versions of Windows to Windows

More information

Dreamweaver CS 5.5. University Information Technology Services. Training, Outreach, Learning Technologies, and Video Production

Dreamweaver CS 5.5. University Information Technology Services. Training, Outreach, Learning Technologies, and Video Production Dreamweaver CS 5.5 Creating Web Pages with a Template University Information Technology Services Training, Outreach, Learning Technologies, and Video Production Copyright 2012 KSU Department of Information

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

Dreamweaver MX Overview. Maintaining a Web Site

Dreamweaver MX Overview. Maintaining a Web Site Dreamweaver MX Overview Maintaining a Web Site... 1 The Process... 1 Filenames... 1 Starting Dreamweaver... 2 Uploading and Downloading Files... 6 Check In and Check Out Files... 6 Editing Pages in Dreamweaver...

More information

ver Wfl Adobe lif Sams Teach Yourself Betsy Bruce Robyn Ness SAMS 800 East 96th Street, Indianapolis, Indiana, USA WlM John Ray ^lg^

ver Wfl Adobe lif Sams Teach Yourself Betsy Bruce Robyn Ness SAMS 800 East 96th Street, Indianapolis, Indiana, USA WlM John Ray ^lg^ Betsy Bruce John Ray Robyn Ness Sams Teach Yourself Adobe Wfl lif ver W ^msssi^ mm WlM ^lg^ SAMS 800 East 96th Street, Indianapolis, Indiana, 46240 USA Table of Contents Introduction What Is Dreamweaver

More information

Adobe Dreamweaver CS5 Tutorial

Adobe Dreamweaver CS5 Tutorial Adobe Dreamweaver CS5 Tutorial GETTING STARTED 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

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

Site Creator User s Guide

Site Creator User s Guide Site Creator User s Guide Version 1.0 National Rural Telecommunications Cooperative 2121 Cooperative Way Herndon, VA 20171 COPYRIGHT Copyright 2003 by the National Rural Telecommunications Cooperative.

More information

Creating consistent content pages

Creating consistent content pages Creating consistent content pages Content pages link from the electronic portfolio s home page. Using the ideas from the class discussion, determine the consistent elements of your content pages and plan

More information

How to Use Serif WebPlus 10

How to Use Serif WebPlus 10 How to Use Serif WebPlus 10 Getting started 1. Open Serif WebPlus and select Start New Site from the Startup Screen 2. WebPlus will start a blank website for you. Take a few moments to familiarise yourself

More information

Working with Images and Multimedia

Working with Images and Multimedia CHAPTER Working with Images and Multimedia You can make your web page more interesting by adding multimedia elements. You can download the files featured in this chapter from www.digitalfamily.com/tyv.

More information

Introduction to Dreamweaver CS4:

Introduction to Dreamweaver CS4: Introduction to Dreamweaver CS4: 1.0.0 published by Antall Training http://www.scottantall.com info@scottantall.com 440/623-3738 Copyright 2003-2009 Antall Training All Rights Reserved. No portion of this

More information

Web Publishing Basics II

Web Publishing Basics II Web Publishing Basics II Jeff Pankin Information Services and Technology Table of Contents Course Objectives... 2 Create a Site Definition... 3 The Dreamweaver CS4 Interface... 4 Panels are groups of icons

More information

build a digital portfolio in WebPlus X4

build a digital portfolio in WebPlus X4 How to build a digital portfolio in WebPlus X4 Get started Open Serif WebPlus and select Start New Site from the Startup Wizard. WebPlus will open a blank website for you. Take a few moments to familiarise

More information

National Training and Education Resource. Authoring Course. Participant Guide

National Training and Education Resource. Authoring Course. Participant Guide National Training and Education Resource Authoring Course Participant Guide Table of Contents: OBJECTIVES... 4 OVERVIEW OF NTER... 5 System Requirements... 5 NTER Capabilities... 6 What is the SCORM PlayerWhat

More information

PASS4TEST. IT Certification Guaranteed, The Easy Way! We offer free update service for one year

PASS4TEST. IT Certification Guaranteed, The Easy Way!   We offer free update service for one year PASS4TEST IT Certification Guaranteed, The Easy Way! \ http://www.pass4test.com We offer free update service for one year Exam : 9A0-046 Title : Adobe GoLive CS2 ACE Exam Vendors : Adobe Version : DEMO

More information

Virto SharePoint Forms Designer for Office 365. Installation and User Guide

Virto SharePoint Forms Designer for Office 365. Installation and User Guide Virto SharePoint Forms Designer for Office 365 Installation and User Guide 2 Table of Contents KEY FEATURES... 3 SYSTEM REQUIREMENTS... 3 INSTALLING VIRTO SHAREPOINT FORMS FOR OFFICE 365...3 LICENSE ACTIVATION...4

More information

WEB GRAPHICS ADOBE PHOTOSHOP CS3. Learning Outcomes:

WEB GRAPHICS ADOBE PHOTOSHOP CS3. Learning Outcomes: WEB GRAPHICS ADOBE PHOTOSHOP CS3 Learning Outcomes: At the end of the course the participant will Design layouts for web pages, Paper Adverts, Brouchers, CD Covers, Package Designing Event and Exhibition

More information

GoLive will first ask you if your new site will be for one individual or a work group; select for a Single User, and click Next.

GoLive will first ask you if your new site will be for one individual or a work group; select for a Single User, and click Next. Getting Started From the Start menu, located the Adobe folder which should contain the Adobe GoLive 6.0 folder. Inside this folder, click Adobe GoLive 6.0. GoLive will open to its initial project selection

More information

FrontPage 2003 Lesson 4 - Creating Individual Pages. Adding a Page Using a Template. Web Page Title. Saving a Web Page

FrontPage 2003 Lesson 4 - Creating Individual Pages. Adding a Page Using a Template. Web Page Title. Saving a Web Page FrontPage 2003 Lesson 4 - Creating Individual Pages Adding a Page Using a Template 1. Open the Practice web site. 2. Click File > New. 3. In the Task Pane, click More page templates. 4. Click the General

More information

Dreamweaver CS4. Introduction. References :

Dreamweaver CS4. Introduction. References : Dreamweaver CS4 Introduction References : http://help.adobe.com 1 What s new in Dreamweaver CS4 Live view Dreamweaver CS4 lets you design your web pages under realworld browser conditions with new Live

More information

Client Interview. Interview Topics. Goals and Target Audience. Activity 3.1 Worksheet. Client Name:

Client Interview. Interview Topics. Goals and Target Audience. Activity 3.1 Worksheet. Client Name: Activity 3.1 Worksheet Client Interview Team Name: Date: Client Name: Interview Topics Goals and target audience Content Design requirements Delivery requirements Goals and Target Audience Identify three

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

Contents. Common Site Operations. Home actions. Using SharePoint

Contents. Common Site Operations. Home actions. Using SharePoint This is a companion document to About Share-Point. That document describes the features of a SharePoint website in as much detail as possible with an emphasis on the relationships between features. This

More information

Creating a Navigation Bar with a Rollover Effect

Creating a Navigation Bar with a Rollover Effect Creating a Navigation Bar with a Rollover Effect These instructions will teach you how to create your own navigation bar with a roll over effect for your personal website using Adobe Dreamweaver CS4. Your

More information

Curriculum/Certification Mapping in MyGraphicsLab

Curriculum/Certification Mapping in MyGraphicsLab Adobe Visual Communication Using FLASH CS5 Curriculum/Certification Mapping in MyGraphicsLab Objectives- 1.0 Setting Project Requirements 1.1 Identify the purpose, audience, and audience needs for rich

More information

Full file at DW Chapter 2: Developing a Web Page

Full file at   DW Chapter 2: Developing a Web Page DW Chapter 2: Developing a Web Page TRUE/FALSE 1. To ensure that all links are current and work correctly, you need to test them regularly. ANS: T PTS: 1 REF: Dreamweaver 2-2 2. Too many text blocks, links,

More information

Exploring SharePoint Designer

Exploring SharePoint Designer Exploring SharePoint Designer Microsoft Windows SharePoint Services 3.0 and Microsoft Office SharePoint Server 2007 are large and sophisticated web applications. It should come as no surprise, therefore,

More information

Dreamweaver CS6. Level 1. Topics Workspaces Basic HTML Basic CSS

Dreamweaver CS6. Level 1. Topics Workspaces Basic HTML Basic CSS Level 1 Topics Workspaces Basic HTML Basic CSS Tour the Workspace The arrangement of panels and menus you use to interact with a document is called the workspace. Much of Illustrator is customizable: you

More information

BUILDING A TOWN WEBSITE Teacher s Guide

BUILDING A TOWN WEBSITE Teacher s Guide A Basic Dreamweaver MX Project from Macromedia BUILDING A TOWN WEBSITE Teacher s Guide Table of Contents Project Description...3 ISTE National Educational Technology Standards for Students...3 Timing...4

More information

1D CIW: Web Design Specialist. Course Outline. CIW: Web Design Specialist Apr 2018

1D CIW: Web Design Specialist. Course Outline. CIW: Web Design Specialist Apr 2018 Course Outline CIW: Web Design Specialist 22 Apr 2018 Contents 1. Course Objective 2. Pre-Assessment 3. Exercises, Quizzes, Flashcards & Glossary Number of Questions 4. Expert Instructor-Led Training 5.

More information

If these steps are not followed precisely as demonstrated in this tutorial, you will not be able to publish your site!

If these steps are not followed precisely as demonstrated in this tutorial, you will not be able to publish your site! Outline *Viewing Note... 1 Myweb Important Setup Steps... 1 Before you begin... 1 Site Setup this must be done correctly in order to publish your files to the server... 2 Authentication Message... 4 Remove

More information

Ektron Advanced. Learning Objectives. Getting Started

Ektron Advanced. Learning Objectives. Getting Started Ektron Advanced 1 Learning Objectives This workshop introduces you beyond the basics of Ektron, the USF web content management system that is being used to modify department web pages. This workshop focuses

More information

Adobe Dreamweaver CS5/6: Learning the Tools

Adobe Dreamweaver CS5/6: Learning the Tools Adobe Dreamweaver CS5/6: Learning the Tools Dreamweaver is an HTML (Hypertext Markup Language) editor, authoring tool, and Web site management tool. Dreamweaver is a WYSIWYG (what you see is what you get)

More information

CIW: Web Design Specialist. Course Outline. CIW: Web Design Specialist. ( Add-On ) 16 Sep 2018

CIW: Web Design Specialist. Course Outline. CIW: Web Design Specialist.   ( Add-On ) 16 Sep 2018 Course Outline 16 Sep 2018 ( Add-On ) Contents 1. Course Objective 2. Pre-Assessment 3. Exercises, Quizzes, Flashcards & Glossary Number of Questions 4. Expert Instructor-Led Training 5. ADA Compliant

More information

Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE

Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE COURSE TITLE WEB SITE DESIGN COURSE DURATION 19 Hours of Interactive Training COURSE OVERVIEW In this 7 session course Debbie will take you through the

More information

Design Importer User Guide

Design Importer User Guide Design Importer User Guide Rev: 9 February 2012 Sitecore CMS 6.5 Design Importer User Guide How to import the design of an external webpage as a Sitecore layout or sublayout Table of Contents Chapter 1

More information

Surveyor Getting Started Guide

Surveyor Getting Started Guide Surveyor Getting Started Guide This Getting Started Guide shows you how you can get the most out of Surveyor from start to finish. Surveyor can accomplish a number of tasks that will be extremely beneficial

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

Siteforce Pilot: Best Practices

Siteforce Pilot: Best Practices Siteforce Pilot: Best Practices Getting Started with Siteforce Setup your users as Publishers and Contributors. Siteforce has two distinct types of users First, is your Web Publishers. These are the front

More information

How to use the Assets panel

How to use the Assets panel Adobe Dreamweaver Guide How to use the Assets panel You can use the Assets panel in Dreamweaver to manage assets in the current site (Figure 1). The Assets panel displays assets for the site associated

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

ADOBE 9A Adobe Dreamweaver CS4 ACE.

ADOBE 9A Adobe Dreamweaver CS4 ACE. ADOBE 9A0-090 Adobe Dreamweaver CS4 ACE http://killexams.com/exam-detail/9a0-090 ,D QUESTION: 74 You use an image throughout your Web site. You want to be able to add this image to various Web pages without

More information

CompuScholar, Inc. Alignment to Utah's Web Development I Standards

CompuScholar, Inc. Alignment to Utah's Web Development I Standards Course Title: KidCoder: Web Design Course ISBN: 978-0-9887070-3-0 Course Year: 2015 CompuScholar, Inc. Alignment to Utah's Web Development I Standards Note: Citation(s) listed may represent a subset of

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

Chapter 1 Introduction to HTML, XHTML, and CSS

Chapter 1 Introduction to HTML, XHTML, and CSS Chapter 1 Introduction to HTML, XHTML, and CSS MULTIPLE CHOICE 1. The world s largest network is. a. the Internet c. Newsnet b. the World Wide Web d. both A and B A PTS: 1 REF: HTML 2 2. ISPs utilize data

More information

Using Dreamweaver CC. Logo. 4 Creating a Template. Page Heading. Page content in this area. About Us Gallery Ordering Contact Us Links

Using Dreamweaver CC. Logo. 4 Creating a Template. Page Heading. Page content in this area. About Us Gallery Ordering Contact Us Links Using Dreamweaver CC 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

Web Site Project (Final Project / 30% of grade)

Web Site Project (Final Project / 30% of grade) Web Site Project (Final Project / 30% of grade) Purpose: To design, develop, and publish a web site using recommended design practices. Your web site will contain a home page and at least six (but no more

More information

FrontPage 2000 Tutorial -- Advanced

FrontPage 2000 Tutorial -- Advanced FrontPage 2000 Tutorial -- Advanced Shared Borders Shared Borders are parts of the web page that share content with the other pages in the web. They are located at the top, bottom, left side, or right

More information

Oracle Eloqua s User Guide

Oracle Eloqua  s User Guide http://docs.oracle.com Oracle Eloqua Emails User Guide 2017 Oracle Corporation. All rights reserved 08-Dec-2017 Contents 1 Emails Overview 6 2 Examples of emails 7 3 Creating emails 19 4 Email authoring

More information

Adobe Dreamweaver CS5

Adobe Dreamweaver CS5 Adobe Dreamweaver CS5 Introduction Web Site Development and Adobe Dreamweaver CS5 Objectives Describe the Internet, the Web, and their associated terms Specify the difference between a Web page and a Web

More information

ADOBE Dreamweaver CS3 Basics

ADOBE Dreamweaver CS3 Basics ADOBE Dreamweaver CS3 Basics IT Center Training Email: training@health.ufl.edu Web Page: http://training.health.ufl.edu This page intentionally left blank 2 8/16/2011 Contents Before you start with Dreamweaver....

More information

1. Which three information fields are the most commonly used fields in a user profile? (Choose three.) A. Disabilities B. Gender C.

1. Which three information fields are the most commonly used fields in a user profile? (Choose three.) A. Disabilities B. Gender C. 1. Which three information fields are the most commonly used fields in a user profile? (Choose three.) A. Disabilities B. Gender C. Online Experience D. Religious Affiliation E. Salary Range F. Political

More information

Microsoft Word Handout

Microsoft Word Handout Microsoft Word Handout Navigating Microsoft Word Maneuvering your way through Word is the key to working efficiently on all of your documents. This guide will help you locate the necessary tools and understand

More information

Week 1 INTRODUCTION TO WEB DESIGN

Week 1 INTRODUCTION TO WEB DESIGN Week 1 INTRODUCTION TO WEB DESIGN Careers in Web Development How many of you want to go into the field of Web Development or Web Programming? Web Designer Web Manager Web Developer Flash Developer Web

More information

Adobe Dreamweaver CC 17 Tutorial

Adobe Dreamweaver CC 17 Tutorial Adobe Dreamweaver CC 17 Tutorial GETTING STARTED 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

More information

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives. Overall Design Is Related to the Site Purpose. Website Organization

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives. Overall Design Is Related to the Site Purpose. Website Organization Web Development & Design Foundations with HTML5 Ninth Edition Chapter 5 Web Design Slides in this presentation contain hyperlinks. JAWS users should be able to get a list of links by using INSERT+F7 Learning

More information

Web Design for Developers A Programmer s Guide to Design Tools and Techniques

Web Design for Developers A Programmer s Guide to Design Tools and Techniques Extracted from: Web Design for Developers A Programmer s Guide to Design Tools and Techniques This PDF file contains pages extracted from Web Design for Developers, published by the Pragmatic Bookshelf.

More information