Html Css Bootstrap Build Your First Website Today

Quickly learn HTML5 and CSS3 + Bootstrap - the basics of Web Development - to design your own responsive websites.

Last updated 2022-01-10 | 4.6

- You will learn how to build a custom website with HTML
- CSS
- and Boostrap
- You will learn real-world skills to build professional and modern websites
- You will learn the basic building blocks to becoming a web developer

What you'll learn

You will learn how to build a custom website with HTML

CSS

and Boostrap

You will learn real-world skills to build professional and modern websites

You will learn the basic building blocks to becoming a web developer

You will learn to build websites while you learn each building block - HTML

CSS

Bootstrap

You will get bonus downloadable cheat sheets and guides to help you quickly design your websites

You will learn how to use each skill in the real world with case studies

You will learn basic web design tips so your websites look and act professionally

* Requirements

* No coding experience necessary
* Seriously
* you don't need to know anything about websites or coding!
* Any computer will be fine - Windows
* OSX or Linux
* We'll show you free tools that you can use to follow along and build your own websites in the course

Description

*** A perfect HTML5 and CSS3 COURSE for beginners on UDEMY! ***

Do you want to learn how to build your own websites?

Do you want to become a web developer?

Do you just want to know how to customize the design of a website created with Wordpress (or other web-builder) so it looks like you want it to?

HTML & CSS are the basic building blocks of the website world! And this is the perfect course for you to dive right in and learn them.

Why should you enroll in this course?

1. It's great for absolute beginners, with NO coding or web development experience required!

Many of the other courses on HTML5 and CSS3 on Udemy are too advanced, or use language that is confusing to a beginner. We break down every definition and step of the process so you never get lost.

2. Project-based learning. Plus it's free to build websites!

Learning is better when you're actually doing. As you follow along with each section of the course, you'll be building your own websites. Plus, we'll be using free applications to do so - Brackets and Google Chrome. No matter what type of computer you have - Windows, Mac, Linux - you can get started.

Seriously, within the first hour of the course, you'll be building your own basic websites!

3. No more boring lectures!

If you've watched other HTML5 and CSS3 courses or tutorials before, you know that it can be difficult to make it interesting and fun. The instructors Nick and Phil strive to make each lesson fun and interesting, so you feel like you're actually learning something new... and progressing... all while having fun!

4. Real world case studies!

It's great to learn how to use HTML and CSS, but it's even better if you know how what you are learning applies to real-world websites. Throughout the entire course, Nick shows how real websites are using HTML and CSS today. Phil follows up with personal case studies of how even beginner's can use HTML and CSS to customize their own websites.

WHAT WILL YOU LEARN IN THIS COURSE?

Start by understanding how to use HTML5, CSS3, and Bootstrap
Each section builds upon the previous ones to give you a complete understanding of the basics of HTML, CSS, and Bootstrap
Once you are in the Bootstrap section, you'll learn how to quickly develop and design beautiful responsive websites
Finally, you'll put all your knowledge together with full website projects such as creating a modern landing page

IS THIS THE PERFECT COURSE FOR YOU?

YES - if you are a complete beginner with no experience building a website.

YES - if you already know some HTML and CSS, but want to learn everything from the ground up so you know how to build a complete website.

YES - if you don't necessarily want to be a web developer, but want to understand how HTML and CSS work so you can customize your own WordPress site (or other type of website)

NO - if you already know the basics of HTML and CSS. If that's the case, we recommend a more advanced HTML and CSS course.

WHAT DO YOU GET WHEN YOU ENROLL?

Lifetime access to all of our videos. Start whenever you want - and go at your own pace!
Download any of the lectures, so you can easily watch back on your computer or device.
Downloadable cheat sheets and guides that make writing website code much more efficient.
High quality support in the course Q&A for whenever you are stuck and have any questions.
An amazing new skill that is in high demand for getting a well paid job.

READY TO ENROLL?

With our 30-day 100% money-back guarantee, there's no reason to hesitate. Enroll now to try out the course completely risk free!

We can't wait to see you in the course!

Nick and Phil

Who this course is for:

Absolute beginners who want to learn the first building blocks (HTML & CSS) for creating websites
Anyone with a website that wants to be able to customize it with HTML and CSS to make it look like you imagine
Anyone looking for a quick refresher of how HTML, CSS, and Bootstrap works

Course content

9 sections • 82 lectures

Welcome 5 lectures

Welcome to the Course + 3 Tips for Better Learning Preview 02:34

Welcome to this course on HTML, CSS, and Bootstrap! We're so excited to have you here. In this lesson, you'll learn how this course will work, what you will learn, exactly who this course is for, and how to succeed.

How to Install Brackets & Start Editing Websites Preview 05:04

In this lesson of the HTML, CSS, and Bootstrap course, you'll download the different tools we will use in this course - such as Brackets and Google Chrome.

Plus, you'll get a quick orientation of Brackets, the program you'll be using to create and edit your code. Literally, you'll see how code affects a website right in this video!

DOWNLOAD: HTML Cheat Sheets Preview 00:15

Quick Hello from Phil Preview 01:42

In this lesson, Phil introduces himself and what he'll be bringing to the table in this course!

Tips to Improve Your Course Taking Experience Preview 01:06

HTML 5 15 lectures

Intro to the HTML Section Preview 00:46

In this section of the HTML, CSS, and Bootstrap course, you'll learn what HTML is, and how to use it. Let's get ready to rock and roll!

What is HTML? See how it's used EVERYWHERE! Preview 10:39

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn more about what HTML actually is, and how is it used - and it's history. It's important to understand the basics of what HTML is, to know the foundations of HTML.

You'll learn the different versions of HTML (ie. HTML 5 vs HTML 4).

See how HTML actually works - from text file to browser.

Also, see the HTML behind any website.

Learn how to manipulate how any website looks using simple HTML edits.

Case Study: Changing the President's Tweets Preview 02:28

Here's a case study to show you how to change anyone's tweets with HTML.

Start a New HTML File & Use Tags Preview 11:36

Start your first HTML website in this lesson of the HTML, CSS & Bootstrap course. Learn how to start a new HTML file in Brackets. Also, learn how to save an HTML file.

Next, you'll learn about how to use basic tags within your HTML document.

Header Tags: How to use them + why they are important. Preview 05:23

In this lesson of the HTML, CSS, & Bootstrap course, you'll learn about creating headers using the header tag. These are important, not just for style but also for SEO purposes as Google uses your website's headers to determine what is important on your page.

Case Study: Using Header Tags to Improve SEO Preview 07:22

In this case study, Phil shows you how he uses headers on his website, and how to make text turn into a header using HTML.

Edit Text: Spacing, Styles, Paragraphs and more! Preview 08:31

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to properly edit text via HTML. For example, you'll learn how to create paragraphs, line breaks, and more.

You'll also learn how to affect your text style with HTML tags - such as italics, bold, and underlining.

Links: Create Clickable Text-based Hyperlinks Preview 08:59

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add links to a website using HTML. A link (also known as a hyperlink) will let users go from one page to another (or one website to another) via a clickable piece of text.

This is also called an a tag.

Images: Add Images to Your Website with HTML Preview 09:48

In this lesson of the HTML, CSS, and Bootsrap course, you'll learn how to add images to your website with HTML text.

Learn the importance of using alternative text for your images for visually impaired website visitors and SEO purposes.

You'll also learn how to adjust placement and size of your images as well.

Case Study: Add an Clickable Image to My Website Preview 06:44

In this case study, Phil walks through adding a clickable image to your website with HTML.

Lists: Create Bullet-Point and Numbered Lists with HTML Preview 04:09

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to create a list of items using HTML tags.

First, you'll learn how to create an unordered bullet-point list. Next, you'll learn how to create a numbered list.

Challenge Exercise 1: Build Your First Basic Website with HTML Preview 15:59

Welcome to the first challenge of the course. Follow the instructions in the course from Nick to complete the first challenge, which is building your first basic website in HTML.

Outro: Congrats, you know the basics of HTML! Preview 00:55

Thank you so much for completing this section of the course! We hope you enjoyed it. If you have any questions about HTML, please let us know how we can help!

HTML Source Code Preview 00:05

Basic HTML for WordPress Users Preview 02:55

Here are the most popular HTML tags that you'll use if you have a WordPress website.

CSS 3 16 lectures

Intro to CSS Preview 03:43

In this section of the HTML, CSS, and Bootstrap course, you'll learn what CSS 3 is, and how to use it. Let's get ready to rock and roll!

How to Add CSS Styles Preview 16:09

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add CSS styles to your website. For example, you'll learn how to change the background color of an entire website, or to specific parts of a website like a Heading 1.

Case Study: Change the Header Style for My Website Preview 05:29

In this case study, Phil shows you how to add custom CSS to any WordPress website with a plugin. For example, he'll show you how to change all the headers to a specific brand color.

Classes and Ids Preview 07:27

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add classes and ids to your css styles. This allows you to edit only specific parts of your website with CSS styling.

Borders Preview 05:32

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add borders around different elements of your website.

Sizing Preview 04:13

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to change the sizing of an element with CSS.

Padding and Margin: Putting Space Between Elements Preview 07:14

In this lesson of the CSS, HTML, and Bootstrap course, you'll learn how to create space around the edges of your elements. Understand the difference between padding and margin. This allows you to space out the different elements of your website so it looks better.

Case Study: Using Padding & Margins to Adjust My Website Preview 04:11

Text Styles: Alignment, Justification, and more! Preview 04:26

Divs: Add Styling to a Group of HTML Code Preview 07:57

In this lesson of the HTML, CSS, and Bootstrap course, let's how to us Div tags to edit multiple pieces of html at once.

With divs, you can add things like borders and styles to a group of text.

Positioning: Move Around Elements on Your Screen Preview 07:34

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to move elements of your website around.

Hover: Change the Style while Hovering Preview 02:32

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to change the style of an element when the mouse hovers over an item.

Easily Center Elements with CSS Preview 02:29

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to center elements with CSS.

Fonts: Change the Font of Your Website Preview 05:42

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to change the font of your website.

Challenge Exercise 2: Create a Website with CSS Preview 23:29

Welcome to the second challenge of the course. Follow the instructions in the course from Nick to complete the second challenge, which is building your first basic website in CSS.

Outro: Congrats, you know the basics of CSS! Preview 00:56

Thank you so much for completing this section of the course! We hope you enjoyed it. If you have any questions about CSS, please let us know how we can help!

Bootstrap 10 lectures

Intro to Bootstrap Preview 01:44

In this section of the HTML, CSS, and Bootstrap course, you'll learn what Bootstrap is, and how to use it. Let's get ready to rock and roll!

Bootstrap Fix Preview 00:05

Install Bootstrap: Get Started with Bootstrap Preview 10:08

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to install (integrate) Bootstrap for your website. You'll also prepare your previous work for working on upcoming projects.

You'll learn what Bootstrap is, and how to get started with the Bootstrap code available online - including understanding Bootstrap CDN and why we encourage you to use that.

Indenting and Containers Preview 07:19

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to use containers with Bootstrap - such as making the width of your website a specific size. Also, learn how to install a new extension in Brackets to properly indent your code.

The Grid System: Make Your Website Responsive Preview 16:24

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to use the grid system in Bootstrap, which helps makes your website more responsive - perfect for any size of screen from mobile device to desktop computer.

Images: Add Images with Bootstrap Preview 06:46

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add images to your website. You'll also learn a great place to find beautiful images for your own website. You'll also learn how to make your website responsive.

Buttons: Create Beautiful Buttons with Bootstrap Preview 06:12

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to create buttons with Bootstrap. These buttons can be different sizes, colors, and styles.

Challenge Exercise 3: Create a Website with Bootstrap Preview 11:05

Welcome to the third challenge of the course. Follow the instructions in the course from Nick to complete the third challenge, which is building your first basic website with Bootstrap.

Outro: Congrats, you know the basics of Bootstrap! Preview 01:03

Thank you so much for completing this section of the course! We hope you enjoyed it. If you have any questions about Bootstrap, please let us know how we can help!

Bootstrap Source Code Preview 00:05

Project 1 - Design a Landing Page 9 lectures

Intro to Website Project 1 Preview 01:10

Welcome to this brand new section of the HTML, CSS, and Bootstrap course. This section is the first full website project that we'll be working on. Now, you'll put all your previous knowledge together and design a landing page that looks professional and is responsive. Plus, as you work through this project, you'll learn some new tips and tricks to make your website even more professional!

Sketch Your Website Preview 04:53

In this lesson of the HTML, CSS, and Bootstrap course, you'll sketch up your landing page - and learn the importance of sketching up your website.

Design the Top Section of Your Website Preview 16:18

In this lesson of the HTML, CSS, and Bootstrap course, you'll work through the first part of your website - including finding and adding icons, centering your content, adding a Sign Up button, and adding images.

Polish the Top Section of Your Website Preview 05:53

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to make your text pop out from the background image, finesse the spacing of your web content, and generally make your website look better.

Add Images to Your Website Preview 10:59

In this lesson of the HTML, CSS, and Bootstrap course, you'll add a row of images to your website. You'll also learn how to crop images, and make them look good on a responsive screen.

Add Main Points to Your Website Preview 14:07

In this lesson of the HTML, CSS, and Bootstrap course, you'll add a container that includes highlights, icons, and aligning them to the right and left side of your page.

Collect Emails: Add an Email Opt-in Form to Your Website Preview 10:44

In this lesson of the HTML, CSS, and Bootstrap course, you'll learn how to add an email opt-in form to your website. This allows you to collect website visitor's email addresses which is so important for growing your own website and brand.

Challenge Exercise 4: Create Your Own Landing Page Preview 03:00

Welcome to the fourth challenge of the course. Follow the instructions in the course from Nick to complete to build your own website.

Outro Preview 01:37

Thank you so much for completing this section of the course! We hope you enjoyed it. If you have any questions about this project, please let us know how we can help!