Length: 3 Days

Cost: $1475

Time: 9am - 4pm

Free Retakes: 8 Months

Upcoming Dates:

Register

Adobe Dreamweaver and HTML5/CSS Level 1: Web, Mobile and Digital Development

Class Description

Adobe Dreamweaver Level 1: Website Development is a 3-day course which provides web designers the skills to create, design, manage edit and publish professional websites. Students leave this class with the comprehensive abilities to build, incorporate graphics, set up interactivity and publish their websites.

Class Prerequisites

Solid computer skills.

Getting to Know Dreamweaver

  • Touring the Workspace and switching and splitting views and Working with Panels
  • Selecting a Workspace layout
  • Adjusting Toolbars and Personalizing preferences, creating custom keyboard shortcuts
  • Using the Property Inspector
  • Understanding the code level and visual ways to interact with Dreamweaver

HTML Basics

  • Overview of HTML code and structure and how HTML5 changes the landscape of web development
  • Writing HTML code by hand

Cascading Style Sheets (CSS)

  • Overview of CSS3 code and structure
  • Using CSS to control the style of a web page without compromising structure
  • Understanding the differences between HTML and CSS3 formatting
  • Separating visual design elements for elevated visual and typographic control
  • Understanding the CSS Box Model
  • Understanding the HTML default formatting
  • Formatting text and objects
  • Creating compound selectors and custom classes

Getting a Quick Start in Dreamweaver

  • Defining a Dreamweaver site and Using the Welcome screen
  • Selecting a pre-built CSS layout
  • Saving a web page
  • Modifying the page title and Changing Headings
  • Inserting text and importing graphics from other applications
  • Using the Images Property inspector to set properties for an image
  • Selecting and modifying CSS styles: Adjusting fonts, colors, and sizes for text
  • Using Dreamweaver's CSS Property inspector and the HTML Property inspector.
  • Previewing a page in Live view and in a browser

Creating a Web Page Layout

  • Overview of designing web pages
  • Working with thumbnails and wireframes
  • Modifying one of the existing CSS-based layouts
  • Working with the modern HTML5 container elements.
  • Adding a background image to page components
  • Inserting new components
  • Modifying the page width and background color, modifying existing content and formatting
  • Inserting an image placeholder and placeholder text
  • Modifying the footer
  • Checking browser compatibility
  • Adobe Creative Suite integration with Photoshop, Illustrator, Flash and more
  • Taking in consideration multiple devices including personal computers, tablets, and phones

Working with Cascading Style Sheets

  • Creating and modifying CSS with the new CSS Designer Panels
  • Defining Global Styles and Media Query stylesheets
  • Working with the CSS Styles Panel to track CSS rules and properties affecting a currently selected page element
  • Creating new CSS rules
  • Modifying hyperlink behavior using CSS
  • Creating faux columns using CSS
  • Moving CSS rules to an external style sheet and creating style sheets for other media types
  • Using Check Browser Compatibility to spot bugs
  • Attaching an external style sheet that updates all documents linked to that particular CSS
  • Separating "Content" (HTML) from "Presentation" (CSS) on your web pages with CSS
  • Using CSS to guarantee a consistent look to a number of pages within your website
  • Choosing a CSS layout and choosing the best option for your project
  • Using DIV tags to apply attributes
  • Creating new CSS rules to identify formatted elements and style properties: the Selector and Declaration
  • Understanding the hierarchy of Style Sheets and how the browser decides how the page displays
  • Different browsers and how they use default style sheets

Working with Templates

  • Creating a template from an existing layout
  • Inserting editable regions
  • Producing child pages from a template and updating a template and child pages
  • Using Dreamweaver's template system to manage multi-page websites
  • Associating the home page and new pages with a template
  • Updating a template
  • Creating and using Library items.

Working with Text, Lists, and Tables

  • Importing text from different programs
  • Creating headings, creating bulleted and numbered lists, creating text indents, creating and style tables
  • Spell checking web pages
  • Finding and replacing text
  • Styling tables with CSS and using Table tags for all tables within a website

Exploring New Web Font Options

  • Using Google webfonts
  • Taking advantage of Adobe's Typekit, online type library
  • Adding your own fonts using @font-face

Working with Images

  • Overview of web image file types and structure: JPG, GIF and PNG
  • Overview of vector and raster web graphics
  • Inserting images
  • Adjusting Image Position with CSS classes
  • Working with Dreamweaver's Insert Panel
  • Using Adobe Bridge, the cross-platform file browser locate, organize, and browse images for your site
  • Working with non-web image file types
  • Inserting images by Drag-and-Drop

Working with Navigating (Hyperlinks)

  • Overview of hyperlink structure and coding
  • Creating internal hyperlinks, image-based links, and external links
  • Setting up email links
  • Targeting page elements with hyperlinks
  • Specifying link locations: _blank, _parent, _self and _top
  • Working with jQueryUI navigation components
  • Adding a jQueryUI Accordion
  • Checking pages for broken links

Working with HTML5 and/or Flash

  • Understanding Flash and the limitations of Flash in mobile devices
  • Adding Flash animation to a page versus HTML5, jQuery and JavaScript
  • Comparing Adobe Edge Animate with Adobe Flash Pro and CreateJS Toolkit
  • Inserting a standards-based animation using HTML5 canvas
  • Inserting an animation from Adobe Edge Animate
  • Adding Flash video to a page
  • Using HTML5 to add video to a page to ensure mobile compatibility

Publishing to the Web

  • Defining a remote site and setting up a remote FTP site
  • Establishing a remote site on a local or remote web server
  • Cloaking folders and files
  • Putting your site online
  • Synchronizing local and remote sites
  • Monitoring file sizes and download times
  • Synchronizing files both locally and remotely
  • Updating and maintaining your website after it's published