Web Design for Beginners: Using WYSIWYG Web Builder
4.7 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
11 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Web Design for Beginners: Using WYSIWYG Web Builder to your Wishlist.

Add to Wishlist

Web Design for Beginners: Using WYSIWYG Web Builder

Level up your web design skills, by learning how to create a responsive portfolio website with WYSIWYG Web Builder.
4.7 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
11 students enrolled
Created by Ishmeal Lamptey
Last updated 4/2017
English
Curiosity Sale
Current price: $10 Original price: $20 Discount: 50% off
30-Day Money-Back Guarantee
Includes:
  • 5.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Create any website layout you can imagine
  • Introduce login tools in your website project
  • Work with CMS (Content Management Tools ) in your website
  • Support any device size with Responsive (mobile-friendly) Design
  • Use common vocabulary from the design industry
  • Introduce CSS3 animation into your project
View Curriculum
Requirements
  • A little bit knowledge about using WYSIWYG Web Builder
  • A Localhost Server (WAMP for Windows)
  • A Code Editor (Brackets)
  • WYSIWYG Web Builder version 11 or above
Description

Level up your web design skills, by learning how to create a responsive portfolio website with WYSIWYG Web Builder. This course will help you use most of the available tools (both basic and advanced) in WYSIWYG Web builder to accomplish designing  more complicated websites.

In this course, you will learn how to incorporate Master Pages and sub Master Pages to help your workflow. I will also demonstrate to you how to use video backgrounds and add content to individual pages as well as work with login tools and CMS tools. We will also see the basic way to optimize our website for search engines.

Who is the target audience?
  • Anyone who wants to build websites the "professional" way
  • Anyone who has practiced web design as a hobby but is not confident about their skill set in a professional arena
  • For Teams or Freelancers who wants to build an online presence
  • Anyone who wants to save time and accomplish more in web designing
  • Anyone who likes to learn through practical application and not all theory
Students Who Viewed This Course Also Viewed
Curriculum For This Course
83 Lectures
05:41:58
+
Introduction
2 Lectures 05:21
+
Getting Started
9 Lectures 34:41

We will take a look at some tools which we are going to use in our website project

Preview 03:54

In this video, we will go ahead and configure our workspace

Preview 04:01

In this video, we'll take a look at the various tools available in WYSIWYG web Builder and those we will be using in our project

The Toolbox
03:45

We'll go ahead and take a look at the structure of our website project

Structure of the Website
02:20

Let's go ahead and create the pages we are going to work with in our project

Adding Pages
08:36

To avoid conflict of object ID's, there's the need to rename our objects. Let's take a look at how to achieve that.

Renaming Object ID's
04:59

In this video, we'll go ahead and name our project as well as save it.

Naming and Saving Project
01:07

Let's take a look at some of the properties available in page properties

Page Properties
04:59

In this video, we'll take a look at the page extensions available in WYSIWYG Web Builder and the appropriate one to use in our project

Page Extensions
01:00
+
Working with the Style Manager
1 Lecture 11:59

In this video, we'll create all the styles we are going to use in our project.

Creating Styles
11:59
+
The Master Page
6 Lectures 26:39

In this video, we will take a look at some of the options available in a layer

Layer Options
03:20

In this video, we are going to build our site navigation, this will introduce to us some navigational objects as well as some properties associated with our navigational tool

Creating the site Navigation
06:42

Let's go ahead and design our main master page.

Main Master Page
02:42

In this video, we'll take a look at how to add and configure a jQuery tooltip to our master page

Adding Tooltip to the Master page
03:19

In this video, we will focus on designing our login master page.

Login Master Page
02:57

Finally in this section, we are going to work on the account master page.

Account Master Page
07:39
+
Working on the Homepage
9 Lectures 01:07:54

In this video, we will start working on the introduction section of the homepage

The Introduction Section Part 1
04:55

In this video, we will continue to work on the introduction section and finally wrap it up.

The Introduction Section Part 2
06:36

In this video, we are going to focus working on the about section.

The About Section
08:30

Let's continue to work on the services section of the homepage

The Services Section
14:06

We work on the team's section of the homepage in this video

The Team Section
07:10

In this video, we'll go ahead to work on the pricing section

the Pricing Section
12:36

Still on the homepage, we will now work on the portfolio section

The Portfolio Section
07:20

We will now go ahead and work on the contact section of the homepage.

The Contact Section
04:53

In this video, we are going to take a look at how to add a background video to the homepage.

Adding a Background Video to the homepage
01:48
+
Working on the Contact Form
4 Lectures 13:05

In this video, we will start building the contact form.

Designing the contact form
05:02

We will now configure the contact form to make it functional.

Configuring the contact page
04:35

We are going to add a success page and an error page to the contact form

Adding success and error pages
00:38

In this video, we will go ahead and make some necessary changes to the homepage

Making necessary changes to the homepage
02:50
+
Working with CSS3 animations
1 Lecture 01:46

Let's now take a look at how to add CSS3 animations to our project

CSS3 Animations
01:46
+
Working with login Tools
15 Lectures 20:44

In this video, we will design the signup page

The Signup Page
02:40

Still on the login tools, we will now work on the signup verification page

The Signup Verification Page
01:06

In this video, we will go ahead and design the login page

The Login Page
02:27

We will no go ahead and design the login error page

the Login Error Page
00:53

In this video, we will go ahead and work on the logout papge

The Logout Page
00:52

We will now work on the password recovery page

The Password Recovery Page
01:24

In the video, we will design the password recovery error page

The Password Recovery Error Page
00:47

In this video, we will work on the success recovery success page

The Password Recovery Success Page
01:00

In this video, we will work on the change password page

The Change Password Page
01:30

In this video, we will work on the change password success page

The Change Password Success Page
00:43

In this video, we will work on the edit profile page

The Edit Profile Page
01:26

In this video, we will design the administrator's page

The Admin Page
01:15

In this video, we will work on the edit profile denied page

The Edit Profile Denied Page
01:10

In this video, we will work on the edit profile success page

The Edit Profile Success Page
00:50

In this video, we will design the account homepage

The Account Homepage
02:41
+
Configuring the login tools
6 Lectures 15:15

In this video, we are going to configure the signup page

Configuring the Signup Page
05:46

We will take a look at how to configure the login page in this video

Configuring the Login Page
02:50

We will configure the login error page in this video

Configuring the Login Error Page
01:05

In this video, we will configure the password recovery pages

configuring the Password Recovery Pages
01:37

In this video, we will configure the changes password and the edit profile pages

Configuring the Change password and Edit profile pages
01:02

In this video, we will configure the administrator's page as well as add some useful links

Configuring the Administrator's pages and addition of links
02:55
+
The Site Navigation
2 Lectures 04:59

In this video, we will link the navigational menus to its corresponding section on the homepage

Linking the homepage sections
02:56

In this video, we will apply appropriate master pages to the pages in the project

Applying Master pages
02:03
5 More Sections
About the Instructor
Ishmeal Lamptey
4.4 Average rating
48 Reviews
2,805 Students
3 Courses
Web Designer, WYSIWYG Web Builder Pro

My name is Ishmeal Lamptey, and during my period in the workforce, I’ve trained individuals and groups on how to use WYSIWYG Web Builder to build great and functional websites.

I’m a front-end developer, designer, network engineer and an educator. I’ve been building friendly user interfaces websites for individuals and organizations for a while now.

I'm fortunate to enjoy the work i do, but my true passion is helping people learn.

I look forward to answering your questions and am available for 1-on-1 chats with all of my students as well as freelance website projects.