Web Design Professional

In an increasingly digital world, the demand for skilled web designers is higher than ever. Our Web Design Professional course equips you with the comprehensive skill set needed to excel in this dynamic field, covering essential topics like HTML, CSS, JavaScript, Bootstrap, and Vue.js, as well as lessons in color theory, typography, and industry-standard tools like Adobe Animate and Photoshop.

Course Hours

390

Learning Outcomes
Upon successful completion of this course, participants will be able to:

1. Build and Style Web Pages: Construct and style web pages using foundational languages like HTML, CSS, and JavaScript.

2. Create Responsive Websites: Utilize Bootstrap and Vue.js to develop responsive, user-friendly websites.

3. Design Engaging Graphics: Use Adobe Animate and Photoshop to create visually appealing graphics and layouts.

4. Apply Color Theory and Typography: Enhance the aesthetic and usability of web designs through principles of color theory and typography.

5. Manage Web Design Projects: Acquire essential skills for managing web design projects from inception to completion.

6. Construct and Validate Web Forms: Create, style, and validate web forms to ensure a secure and user-friendly experience.

7. Develop a Professional Portfolio: Compile a series of hands-on projects, including a fully functional website, to showcase your skills to potential employers.

This course provides a well-rounded skill set that encompasses both the technical and creative aspects of web design, preparing you for a rewarding career in this rapidly growing field.

Outline

• Animate

  • Introduction to Animate

  • Animation Basics

  • Drawing Tools

  • Character Design

  • Advanced Techniques

  • Working In the Animation Industry

• Photoshop

  • Photoshop Crash Course

  • Selections and Masks

  • Reconstructing and Retouching

  • More Layers and Selections

  • Brushes and Painting

  • Working in the Design Industry

• Introduction to HTML

  • A Quick Overview of Web Development

  • Introduction to HTML

  • Paragraphs, Headings, and Text

  • HTML Links

  • HTML Images

  • HTML Lists

  • HTML Tables

  • Sectioning a Web Page

  • Audio and Video

• Color Theory

  • Terminology

  • Building an Efficient Color Theme

  • Color Theory Principles

  • Color Context

  • Implementing Color

• Typography

  • Anatomy

  • Typeface vs. Font

  • Rules for Typography

  • Types of Typography

  • Type Hierarchy

  • Building an Efficient Style Guide

• Introduction to CSS Training

  • Crash Course in CSS

  • CSS Fonts

  • Color and Opacity

  • CSS Text

  • Borders, Margins, and Padding

  • Backgrounds

  • Display and Visibility

  • Pseudo-classes and Pseudo-elements

  • Styling Tables with CSS

  • Positioning

  • Transforms and Transitions

  • Layouts

  • CSS Lists as Hierarchical Navigation

  • Media Queries

• Introduction to JavaScript Training

  • JavaScript Basics

  • Variables, Arrays, and Operators

  • JavaScript Functions

  • Built-In JavaScript Objects

  • Conditionals and Loops

  • Event Handlers and Listeners

  • The HTML Document Object Model

  • CSS Object Model

  • Errors and Exceptions

• Creating, Styling, and Validating Web Forms

  • HTML Forms

  • JavaScript Form Validation

  • Styling Forms with CSS

  • Regular Expressions

  • Node.js and Server-side Form Validation

  • JSON

• Introduction to Bootstrap Training

  • Getting Started with Bootstrap Basics

  • Bootstrap Layout

  • Creating Responsive Navigation

  • Bootstrap Typography

  • Tables

  • Bootstrap Forms

  • Images

  • Bootstrap Components

  • Bootstrap Utilities

  • Bootstrap Flex

• Advanced JavaScript Concepts

  • Node.js

  • Scope, var, let, and const

  • Arrow Functions

  • Rest Parameters

  • Spread Operator

  • Array Destructuring

  • Template Literals

  • Objects, Context, and the this Object

  • Array map() Method

  • Array filter() Method

  • Array find() Method

  • JavaScript Modules

  • npm

• Introduction to Vue 3 Training

  • Getting Started with Vue.js

  • Basic Vue Features

  • Directives

  • Implementing Game Logic

  • Transitions and Animations

  • Vue Routing

• Managing Web Design Projects

  • Design Process

  • Project Scope

  • Mock-ups

  • Functionality Model

  • Integration

  • Usability and Accessibility Rules

  • Roll-out o Analysis

External Partnership
In an effort to broaden our course offerings, Syracuse University has partnered with leaders in their respective fields to provide learning opportunities for our students. This course is brought to you through our partnership with ed2go. Once you have completed the checkout process, you should expect to be contacted by a ed2go representative within 1-3 business days with information on how to access your course material and getting started. They will be your main point of contact while you are going through the coursework. Feel free to reach out to Syracuse University if you have any questions at microcredential@syr.edu or 315.443.2588.