O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Web Design Essentials

Video Description

Master Web Design on your terms with this one-of-a-kind video training course Web design requires knowledge of multiple software tools and coding languages, like Dreamweaver, Flash, Silverlight, Illustrator, Photoshop, HTML, and CSS, among others to craft truly unique, robust, and interactive websites that work across a variety of platforms. Now, you can learn the ins and outs of web design - from a working knowledge of popular design tools to bringing your vision online- with Web Design. Our instructors provide expert, straight-forward, user-friendly training to help you tackle new topics the way you want to learn. Master basic skills, boost your creativity, and challenge yourself in bold new directions. Delve into the basics of good web design and get familiar with the most common web development tools Conceptualize your site, outline its key features, and implement your design concepts Incorporate user experience and solid interface design techniques into your site design to create a website that is both functional and attractive Includes over 6 hours of Web Design video training. If you're looking for real-world Web Design instruction, you'll find it here.

Table of Contents

  1. Web Design: First Steps
    1. Defining User Experience 00:09:59
    2. Wireframes, Mockups and Prototypes 00:09:22
  2. Fundamentals of the Web
    1. Website Basics 00:13:04
    2. Separating Style, Structure and Interactivity 00:06:46
  3. Web Design Tools
    1. Text Editors versus WYSIWYG Applications 00:10:39
    2. Creating a Site in Dreamweaver CS 5.5 00:06:19
    3. Creating a Site in Expression Web 00:04:12
    4. Working with Web Browser Development Tools 00:06:09
  4. Fundamentals of HTML, XHTML and CSS
    1. An Introduction to HTML Markup 00:06:10
    2. Validating your Web Pages 00:06:57
    3. Adding Links and Images 00:06:59
    4. Styling a Heading with CSS 00:06:27
    5. Using a CSS Class 00:05:53
    6. Creating an External Style Sheet 00:06:59
  5. Working with Web Graphics
    1. Resize an Image for the Web 00:07:17
    2. Optimize a JPEG Image in Photoshop 00:10:38
    3. Create a Transparency Effect with a JPEG Image 00:04:45
    4. Optimize a GIF Image in Photoshop 00:11:23
    5. Create an Animated GIF in Photoshop 00:08:49
    6. Optimize a PNG Image in Photoshop 00:07:33
    7. Creating a Web Button in Photoshop 00:10:04
    8. Working with Slices 00:10:34
  6. Formatting Text With CSS
    1. The Basics of Styling Text with CSS 00:05:49
    2. Sizing Text with CSS 00:08:18
    3. Adding Space Between Text with Margins 00:05:48
    4. Working with Line-Height and Other Text Styles 00:07:17
    5. Working With Lists 00:08:19
    6. Styling HTML Lists 00:10:53
  7. Introduction to CSS Layout
    1. Working with a CSS Reset File 00:07:38
    2. Working with the HTML div Element 00:10:06
    3. Understanding the Float Property 00:08:44
    4. Creating Columns with the Float Property 00:05:27
    5. Working with the Clear Property 00:06:08
    6. Creating a List-based Navigation Bar 00:08:01
    7. Controlling Column Layouts with Padding 00:07:21
    8. Controlling Column Layouts with Margins 00:10:55
    9. Styling a Footer with CSS 00:06:45
  8. Advanced Layout
    1. Creating Basic Layout Styles 00:06:16
    2. Working with CSS Background Images 00:07:23
    3. Solving Common Layout Problems 00:09:23
    4. Creating an Enhanced CSS Navigation Bar 00:12:48
    5. Using Absolute Positioning for Precise Layout 00:08:55
  9. Browser Compatibility
    1. Browser Testing Fundamentals 00:13:02
    2. Tools for Browser Testing 00:09:46
  10. Introduction to JavaScript and jQuery
    1. JavaScript Basics 00:11:54
    2. JavaScript Events 00:04:28
    3. The Document Object Model and JavaScript Frameworks 00:07:32
    4. Hiding an Element with jQuery 00:07:43
    5. Adding the jQuery Show Effect 00:08:32
  11. Mobile Design with Media Queries
    1. Using Media Queries to Deliver Page Layouts to Different Size Screens 00:08:50
    2. Creating a Single-Column Layout for a Smartphone 00:10:41