CSS Modern Responsive Web Design Create 5 Different Sites

CSS Modern Responsive Web Design Create 5 Different Sites, available at $79.99, has an average rating of 4.55, with 107 lectures, based on 17 reviews, and has 327 subscribers.

You will learn about Explore how to Create Websites using CSS Float Create Websites Using Flexbox CSS How to create Websites using CSS Grid How to design a modern website mobile first How to create Full Responsive Mobile Ready NavBars This course is ideal for individuals who are Web Designers or Web developers or Web Masters or Anyone who wants to create Websites or Anyone who wants to learn more about applying HTML CSS and JavaScript to create Websites It is particularly useful for Web Designers or Web developers or Web Masters or Anyone who wants to create Websites or Anyone who wants to learn more about applying HTML CSS and JavaScript to create Websites.

Enroll now: CSS Modern Responsive Web Design Create 5 Different Sites

Summary

Title: CSS Modern Responsive Web Design Create 5 Different Sites

Price: $79.99

Average Rating: 4.55

Number of Lectures: 107

Number of Published Lectures: 107

Number of Curriculum Items: 107

Number of Published Curriculum Objects: 107

Original Price: $199.99

Quality Status: approved

Status: Live

What You Will Learn

Explore how to Create Websites using CSS Float

Create Websites Using Flexbox CSS

How to create Websites using CSS Grid

How to design a modern website mobile first

How to create Full Responsive Mobile Ready NavBars

Who Should Attend

Web Designers

Web developers

Web Masters

Anyone who wants to create Websites

Anyone who wants to learn more about applying HTML CSS and JavaScript to create Websites

Target Audiences

Web Designers

Web developers

Web Masters

Anyone who wants to create Websites

Anyone who wants to learn more about applying HTML CSS and JavaScript to create Websites

Build YOUR Portfolio CSS Grid FlexBox

Floats Responsive Design Websites

Explore how you can create 5 Different MODERN Fully Responsive Mobile Ready websites CSS Grid CSS Flexbox Floats Plus

Explore how to Create Websites using CSS Float

Create Websites Using Flexbox CSS

How to create Websites using CSS Grid

How to design a modern website mobile first

How to create Full Responsive Mobile Ready NavBars

“A number of students have approached me to create a course covering more UNIQUE website designs and how to build websites from scratch”  The more different websites you can design and have exposure to the easier it becomes to create your own versions and your own creations.  You can use the content of this course to learn and grow your portfolio of work. 

This course is perfect for anyone who wants to create websites and learn more about designing websites.

All new website designs and methods.   All unique to this product and not available anywhere.  Websites come in such a  vast variety of designs that these are completely and totally different than others that I have created before.  As a web designer the more exposure you have to different designs the better.

Explore how you can create 5 different modern websites from scratch applying Floats, CSS Grid and FlexBox to create MODERN WEBSITES

Create 5 Different MODERN Websites included

WEBSITE #1

CSS Float site – Mobile  ready fully responsive – Single Page design

Create custom grid to add columns and structure content

Single Page design with Sticky Nav Header

Responsive Mobile Menu

Create a Custom Contact Form

Use of Mailto in form to send message to email client

Top resources and tools to add placeholder content

WEBSITE #2

Single Page Modern Flexbox Website – Responsive Design with JavaScript AUTOScroller!!!

Use of Flexbox to create webpage

Flexbox to create custom dynamic Grid options

Create CSS components to reuse in website reuse repurpose components Cards

Flexbox contact form with CSS Flexbox

Responsive Resize with breakpoints

Awesome JavaScript AutoScroll

WEBSITE #3

CSS Grid website with Modern CSS only Responsive Collapsible NavBar

CSS Grid to create a Responsive Website

CSS components to reuse Buttons, Cards

Making images responsive

Different page designs using CSS Grid

Multiple page website design

Responsive and mobile ready design

Navbar with logo and bars icon

Use of FontAwesome and other top resources

Adding Google Fonts

WEBSITE #4

Modern design with Floats – Grid with Columns Flexible Design JavaScript Class Toggle for NavBar

Modern Navbar design – collapsing Navigation menu bar

Responsive Navbar using Floats CSS

Grid structure with multiple columns and rows all responsive

Menu icon with Logo

Use of Top online tools and Resources

Placeholder content

Responsive images as thumbnails

WEBSITE #5

Flexbox Complex Menu Website With Responsive Navbar and SubMenu items

Create a website with Flexbox CSS

Add a collapsing Navabr menu

How to create custom JavaScript submenu items navbar

Responsive navbar with many menu items

JavaScript to create dynamic interactions

Responsive Images

Flexbox for Navbar and website design

Course Curriculum

Chapter 1: Create 5 Websites From Scratch Modern Web Design HTML CSS JavaScript

Lecture 1: How to create 5 unique Websites from scratch Course introduction

Lecture 2: Tools and Resources for the course

Lecture 3: Resources and Links

Chapter 2: Modern Responsive Website using Floats and CSS to create reusable grids

Lecture 1: Single Pages Float Website with Grid Structure done with CSS

Lecture 2: How to setup your web development environment Web Dev Setup

Lecture 3: How to create a website wireframe to plan your site

Lecture 4: How to add Add HTML Main Structure

Lecture 5: How to update HTML with Styles.

Lecture 6: Source Code

Lecture 7: How to create a responsive navbar Create navBar for Site

Lecture 8: Source Code

Lecture 9: CSS Create Mobile Ready Responsive NavBar

Lecture 10: Add more content to your website Top Section Content

Lecture 11: Source Code

Lecture 12: How to create a CSS grid for your website using floats Create a Float Grid.

Lecture 13: Source Code Grid and Cards

Lecture 14: How to add an Image Gallery

Lecture 15: Source Code

Lecture 16: Create content areas multiple columns Content Area 2 Columns

Lecture 17: Source Code

Lecture 18: How to add single column in grid Single Content Area

Lecture 19: Source Code

Lecture 20: How to create a Contact Form using CSS and HTML

Lecture 21: Source Code

Lecture 22: How to add mailto to your contact form Mail to Contact Form

Lecture 23: Source Code Mailto Contact Form Code example

Lecture 24: Add styling to your website Website Footer.

Lecture 25: Source Code

Lecture 26: How to add and move sections for single page site Move Section Down

Lecture 27: Single Page Website Review.

Lecture 28: Final Source Code Single Page Website

Chapter 3: Single Page Flexbox website with auto Scroll JavaScript

Lecture 1: Single Page Flex Website Introduction.

Lecture 2: Flex website how to setup WebPage Setup

Lecture 3: Source Code Basic Setup

Lecture 4: How to create sections to single page website using Flexbox Create Sections

Lecture 5: Source Code Page Sections

Lecture 6: How to create a navbar using Flexbox NavBar

Lecture 7: Source Code NavBar Flex

Lecture 8: How to design and add content Home Screen Section

Lecture 9: Source Code Splash Page Cover

Lecture 10: Apply your own custom Grid 3 Columns with Flex.

Lecture 11: Source Code Columns and Rows with Flex

Lecture 12: How to create CSS Cards Flex box Page Cards with Flex

Lecture 13: Source Code Flex Box Cards Code Example

Lecture 14: How to create a CSS form using CSS flexbox

Lecture 15: Source Code Contact Form in Flex CSS

Lecture 16: How to create a footer CSS Flexbox CSS Page Footer.

Lecture 17: Source Code Pag Updates

Lecture 18: How to create a smooth scroll JavaScript Smooth Scroller.

Lecture 19: Add a JavaScript Smooth Scroller to your website 2

Lecture 20: Final Source Code Single Page Flex CSS Website

Lecture 21: Single Page Flex Website Review

Chapter 4: No JavaScript Checkbox Responsive Navbar Website from scratch CSS Grid Website

Lecture 1: CSS Grid Website Introduction

Lecture 2: Prepare your design CSS Grid Setup HTML

Lecture 3: Source Code start for CSS Grid Website

Lecture 4: Create website CSS Grid Website Sections

Lecture 5: Source Code Website CSS Grid Example

Lecture 6: How to create a CSS Grid responsive Nav Bar Responsive

Lecture 7: Add a Nav Bar Responsive to your website

Lecture 8: Create a fully responsive collapsible navabr Nav Bar Responsive

Lecture 9: CSS Grid Responsive Navbar Code Example

Lecture 10: How to add placeholder content Populate Content HTML

Lecture 11: Populate content create Card Components Code examples

Lecture 12: How to Update Page Footer CSS Grid Website

Lecture 13: Final Source Code – Website CSS Grid Example Code

Lecture 14: CSS Grid Website Review.

Chapter 5: JavaScript Collapsible menu Website Mobile Ready and Fully Responsive Float CSS

Lecture 1: Introduction Float Responsive Website

Lecture 2: Modern website Website Setup and planning

Lecture 3: Create a modern website Setup Main HTML

Lecture 4: Code Example Setup Basic HTML template

Lecture 5: How to make it collapse Responsive NavBar CSS Styling

Lecture 6: Dynamic Collapse menu Responsive NavBar CSS

Lecture 7: Mobile ready navbar menu Responsive NavBar CSS

Lecture 8: Source Code Responsive NavBar and Logo

Lecture 9: Add JavaScript Select and Toggle your nav menu items

Lecture 10: JavaScript Toggle Responsive Navbar Source Code Example

Lecture 11: Custom dynamic Grid Create Website and Columns

Lecture 12: Basic Website Template Source Code

Lecture 13: How to add Add PlaceHolder Content and resources

Lecture 14: Best resources for web design Add PlaceHolder Content

Lecture 15: Source Code Float website Code Example

Lecture 16: Website Tweaks and Adjustments

Lecture 17: Responsive Float Website Source Code

Lecture 18: Float Responsive Website Review

Chapter 6: CSS Flexbox website with responsive Nav sub menu items

Lecture 1: Complex Responsive NavBar Introduction

Lecture 2: Website Planning and Setup for modern website design flex structure website

Lecture 3: Create a website Apply CSS for Website using Flexbox

Lecture 4: Source Code CSS Flexbox for Basic Website Template and Color Palette

Lecture 5: Mobile First Website design Create Responsive NavBar.

Lecture 6: Mobile First design Create Responsive NavBar with menu items

Lecture 7: Flex Responsive NavBar Mobile First Design Source Code Example

Lecture 8: Add JavaScript create interaction JavaScript NavBar Toggler.

Lecture 9: JavaScript Responsive Menu Collapse and Open Toggle Code Examples

Lecture 10: More complex multiple layer menu with submenu items Add NavBar Submenu

Instructors

Laurence Svekis
Instructor, GDE, Application Developer

Rating Distribution

1 stars: 0 votes

2 stars: 0 votes

3 stars: 3 votes

4 stars: 5 votes

5 stars: 9 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!