Name: Simply Learn HTML5 and CSS3
Rating: 4.3 (30 reviews)

Udemy Business

Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Created bySean McCammon

Last updated 12/2015

English

What you'll learn

Create their own HTML5 page with CSS styling
Create a CSS Style Sheet and add this into a webpage
Understand how CSS is used to style a HTML document
Use a form to pass input from a page into PHP
Re-create a Bootstrap and HTML5 Page
Add Animation to the Webpage
Re-create the HTML5 Webpages in this course

Course content

12 sections • 92 lectures • 4h 1m total length

Introduction2:31
Let me introduce myself and this course...
Brackets - our editor of choice1:00
Brackets with some plugins is going to be our editor of choice. In this lecture I just show you the editor and what plugins we are going to be using.
Start with the basics1:51
Lets start with the basics...
Very first HTML5 Page2:15
Lets create our first ever HTML5 Page
Brackets - Unable to Create Folder Error - Watch if can't create folder1:40
Some of you may get this error where you are unable to create a folder; says not writable. In this lecture i show you the solution to this issue so that we can get started on the assignments.
W3C Validation1:08
A quick overview of the W3C Validation plugin
Brief outline on page structure3:11
In this lecture I wanted to just give a quick and brief outline of the html page structure so that moving forward you know where everything is
Assignment 10:41

HTML5 section tags3:24
In this lecture we start to examine the sections that are or can be in our html5 page
Webpage structure1:15
We take a look at the structure of our webpage to be
Webpage header section4:29
In this lecture we add some elements to our header section, including our webpage menu
Adding menu pages1:34
Lets expand on what is in the menu and give some actual content.
Adding the webpage body3:34
In this lecture I will show you what you will be doing to add the rest of the body for our page
Assignment 20:34

Types of CSS Style Sheets3:30
We have Internal Style Sheets, Inline Styles and External Style Sheets.
Element, Class and ID Selectors2:36
How we write the elements, class and id selectors in the CSS file is different. In this lecture we give a quick overview of how they are defined.
Loading an External Style Sheet2:04
In this lecture we look at how you load in an external style sheet into a HTML Page

Adding Styles to the Webpage Body2:46
We look at how we add styles for the body of the webpage in this lecture
Sizing and Centering The Webpage3:09
Start Styling the Nav Menu7:54
In this lecture we start to style the navigation menu to make it look more like a nav menu and less like a list
Continue Styling the Nav Menu6:55
In this lecture we will continue with the styling of the Navigation Menu
Adding The Logo1:18
Lets add our logo image
Start To Style the Divs2:49
Lets start adding styles to our div elements on the page
Adding Contact Us Div Elements3:35
Adding CSS Styling to the Welcome Section1:58
Lets start styling the Welcome div section of the page
Adding CSS Styling to the NewsLetter Section4:50
Lets continue with adding some styling to our news letter section
Using CSS to Style Sections to Look Like Floating Individual Sections3:26
Using CSS we start to style so that each section looks detached and floating above the background using shadow
Styling the Footer3:03
Before we style other elements, in this lecture we look at just adding a little style to the footer section
Styling the Final Div Elements on the Page7:14
In this lecture we style the final 2 div elements on the page, completing our page with CSS Styles
Assignment 30:26

Bootstrap Introduction1:41
Brackets Plugins for Bootstrap2:45
Brackets has a great plugin to ease the creation of Bootstrap files..
Introducing Bootstrap and CSS Files5:40
We use pre-defined CSS files in Bootstrap. In this lecture I introduce them to you
Start by Adding the Columns4:38
I start this page by adding the 2 columns at the bottom of the page. In this lecture we do that task.
Creating the Webpage Body3:42
In this lecture we re-create the website main body; adding a little content to it.
Working on the NavBar5:00
In this lecture I show you how to edit and create your nav bar in Bootstrap
Continue with NavBar Changes1:22
Few more tweaks to the Navbar
Using Forms and Input in Bootstrap5:36
In this lecture we create a form and input fields; then show you how you can call Php
Adding your own CSS3:12
In this lecture we see how to add our own CSS to a Bootstrap webpage
Assignment 40:25

Welcome to Animations0:27
What we will be doing in this section1:49
Just a brief on what we plan to cover
Keyframes - FadeIn an Element on The Webpage2:35
Lets define the keyframes for FadeIn
FadeIn an Element on The Webpage CSS Code6:24
Using the keyframes, now we define the CSS code
Keyframes - FadeOut an Element on The Webpage1:11
Keyframes definition for FadeOut
FadeOut an Element on The Webpage CSS Code3:19
Keyframes - Rotate an Element on The Webpage3:37
Keyframes definition for Rotate item
Rotate an Element on The Webpage CSS Code2:51
CSS Code for the rotate functionality
Keyframes - Moving an Element on The Webpage2:09
Keyframe definition for moving elements; the H2 in this page
Moving an Element on The Webpage CSS Code2:03
CSS code for moving elements on the page; h2 in this example
Assignment 50:32

Contact Page -Introduction1:17
A brief introduction to what we are creating in this section
Creating the Contact Page - Part 14:07
In this lecture we create the barebones structure of the page
Create The Contact Page - Part 29:01
In this lecture we complete the HTML for the contact page
Style the Contact Page2:58
Lets add some CSS styling to match our website
Create and Define Structure of PHP Post Email Code1:50
Create a PHP page and define the barebones structure
Complete the PHP Post Email Page5:43
In this lecture we complete the PHP Code required to post an email
Lets See This Page In Action1:47
Running the page and seeing it work
Assignment 60:50

Requirements

No prior knowledge is required
Will require a PC or Mac computer

Description

POST BLACK FRIDAY SALE - Get this course for a limited time at $25

Have you always wanted to learn HTML but find all that reading of books boring or difficult? Well, welcome to my easy and fun course on HTML5 and CSS3.

My goal was to create a course on HTML5 and CSS3 that anyone could follow along with and learn from; regardless of if you have never created a page or have some skill in webdesign. This successful course now has over 2000 students learning, designing webpages and using HTML5 and CSS3.

The best thing is; its follow by example so no hours of theory upfront!

Here are a couple of reviews from students that have taken this course and are creating pages now:

"Takes you from the basics to a fully working site.

This is a great course to learn HTML5 & CSS3, with a bit of PHP thrown in for good measure. If you don't know where to start then this is a course that I would recommend." by Kenneth Rough

"I liked the way this course was laid out. It got straight into the practical side with explanations afterwards. Using Brackets to build a Bootstrap site was also very very useful." by Max Kelly

"Just Do It!

Very apt title and enjoyable course.

feeling a lot more comfortable with my understanding of HTML5/CSS3" by Mike Veldsman

These are just some of the great reviews on this course; a course I like to say is so easy even your Granny could do it...

Creating a Webpage can be easy. Why spend hours reading and learning the theory? You could be joining over 2000 students who are currently learning HTML5 and CSS3 by following along in this course and actually creating a webpage.

Then; taking it further by creating a Bootstrap page and adding Animation using HTML and CSS. There is even a section where you can follow along and create a Contact page written in PHP where visitors can send contact emails direct to you.

We start by showing you how to create a simple HTML5 page; something you can create so easily you will wander why someone never told you this before. So easy, you will only need to add 1 line of HTML.

Next, you will be taken one lecture at a time and shown how easy it is to create a more complex page. Then; how to add CSS to style the page. By the end of this section you will have created a webpage and styled it - giving it borders, shadows and how to section off giving it a floating look..

Once you've finished your first HTML page you will more onto - how to create a Bootstrap page. Its so easy you hardly have to enter any code... You will learn by following along; how to quickly and easily create the base Bootstrap page; how to add elements and then add your own custom CSS.

Once completed, its time to learn about animation in HTML5 and CSS3. Yes; you can animate elements on your page just with HTML5 and CSS3!!! No need for Javascript, PhP or any other.. You will learn by following along how to add and create animation.

By the end of this course you will have built HTML5 pages with CSS; a Bootstrap page AND added your animation. So easy your granny could do it...

So, are you ready to create a webpage? If so; this is what we will be doing :

Follow along example of HTML5 and CSS webpage
Now includes follow along example of Bootstrap webpage
Create some webpages
Add styling using CSS
Learn some great HTML based annimation techniques
Gain what you need to create your webpage
Create a Mobile Responsive website with Bootstrap
Add animation to your webpage

So, why not join over 2000 students who are currently learning HTML5, CSS, Bootstrap and Webpage Animation in this course..

8th June 2015

I've just added a new section and 10 new lectures; teaching by example how to use Bootstrap to create a mobile responsive website. By the end of these lectures you too will be able to reproduce the Bootstrap page.

17th June 2015

Animation in Webpages has come a long way and to show how it can be done I have added a new section to this course on animation.

20th Just 2015

I've just added a new section; section 9 which in how to create a simple contact us page using HTML, CSS3 and PHP.

07th December 2015

HTML5 brought native commands for loading audio and video into HTML5. I've just added updates to the course to detail how to do this in your pages.

Who this course is for:

Anyone looking to create the HTML5 and CSS3 without having to go through lots of theory first
Anyone looking to learn HTML5 and CSS
Anyone looking to just get into creating the page
Anyone that like to learn through practical application and not all theory
Anyone looking to start with Bootstrap

What you'll learn

Explore related topics

Course content

Let Us Begin With The First Page8 lectures • 14min

Lets Start Creating Out Second Page6 lectures • 15min

Starting With CSS3 lectures • 8min

Styling Our Webpage13 lectures • 49min

Adding Easy Animation To Our Menus2 lectures • 5min

Adding the Final Content2 lectures • 12min

Bootstrap - Creating A Mobile Responsive Website By Example10 lectures • 34min

Animation - Animating Elements On The Webpage11 lectures • 27min

Audio and Video In Webpages3 lectures • 8min

Create the Contact Us Page - Using HTML, CSS3 and PHP8 lectures • 28min

Requirements

Description

Who this course is for: