Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Software Development Tools No-Code Development
Business
Entrepreneurship Communication Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certifications Network & Security Hardware Operating Systems & Servers Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Paid Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement & Gardening Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition & Diet Yoga Mental Health Martial Arts & Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Learning Teacher Training Test Prep Other Teaching & Academics
Web Development JavaScript React Angular CSS Node.Js Typescript HTML5 PHP
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Amazon AWS Cisco CCNA CompTIA Security+ Microsoft AZ-900
Microsoft Power BI SQL Tableau Data Modeling Business Analysis Data Analysis Data Warehouse Blockchain Business Intelligence
Unity Unreal Engine Game Development Fundamentals C# 3D Game Development C++ Unreal Engine Blueprints 2D Game Development Mobile Game Development
Google Flutter iOS Development Android Development Swift React Native Dart (programming language) Kotlin SwiftUI Mobile App Development
Graphic Design Photoshop Adobe Illustrator Drawing Canva Digital Painting InDesign Design Theory Procreate Digital Illustration App
Life Coach Training Neuro-Linguistic Programming Personal Development Personal Transformation Life Purpose Mindfulness Sound Therapy Emotional Intelligence Coaching
Business Fundamentals Entrepreneurship Fundamentals Freelancing Business Strategy Online Business Startup Business Plan Blogging Amazon Kindle Direct Publishing (KDP)
Digital Marketing Social Media Marketing Marketing Strategy Internet Marketing Copywriting Google Analytics Email Marketing Startup Advertising Strategy

DesignWeb DesignCSS

Modern Web Design Beginners HTML CSS JavaScript 25+ Projects

Web Design with HTML CSS JavaScript How to create Web Pages web development build websites create WebSites from scratch
Rating: 4.6 out of 54.6 (86 ratings)
838 students
Created by Laurence Svekis
Last updated 3/2022
English
English [Auto]

What you'll learn

  • Build custom websites and Applications - Over 50 Coding Challenges and Projects
  • Bring your webpages to life with Dynamic and Interactive web content JavaScript and more
  • Support and create fully responsive web pages and mobile friendly web site
  • Apply modern web design techniques HTML5 and CSS3 - using the latest syntax
  • Apply Amazing looking styles and customize the look and feel of your web pages
  • Use JavaScript to create interactive and dynamic web content
  • Common syntax and how to apply styling properties to customize the website layout the way you image it
  • Create simple web pages with HTML
  • Add Styling with CSS to design your website
  • Create web templates and website designs with CSS
  • Design and code modern & responsive landing pages
  • Code websites & applications with HTML5 & CSS3
  • Code at an expert level of proficiency with HTML & CSS
  • Animations with CSS3 and jQuery
  • Plan, design and program robust, and fully custom websites and applications

Requirements

  • Desire to learn HTML CSS and JavaScript
  • Computer and access to download applications

Description

Launch a career as a web designer and frontend web developer by learning HTML5, CSS3, JavaScript and responsive design.  Discover how you can design and create websites that are mobile ready, fully interactive and modern design. This course covers everything you need to know about FRONT END web design.

Create modern website designs + Float designs, CSS Grid Designs, Flexbox Designs+++ examples and  source code.

This is real world coding - designing website for the real world.  Learn  the syntax step by step training.  With all the source code included.

Loaded with projects and challenges to help you learn.

Complete frontend web developer and web design course - loaded with examples and challenges to get you coding and creating your own websites

Modern web design and development, REAL WORLD Coding - Taught by an instructor with over 20 years of web development experience - ready to help you learn more about web design! I've taught web design and web development to countless students worldwide.  The design of the course is unique with many challenges in the lessons - then demonstrating how to create the code afterwards.   

Discover how you can create custom websites - right on your computer.  Create amazing HTML pages, add some styling with CSS and then bring them to life making them dynamic and interactive with JavaScript.  You can launch a new career, coding and creating web sites is easy to get started with.  We cover all the tools and top resources to get you started quickly and easily. 

Learn web design perfect for beginners or as a refresher for anyone who wants to learn more about HTML CSS and JavaScript

Professional websites with modern coding techniques - loaded with examples and source code so that you can try the code out and get a feel for what you can do with it. 

HTML and CSS - Loaded with Over 25 Coding Challenges to get you coding - try it for yourself.

Get familiar with the basics - no prior coding experience required!!!!!

Web Design with HTML CSS JavaScript How to create Web Pages web development build websites create WebSites from scratch

Explore the core technologies of the web learn how you can get started with Web development.

Learn to become a web Developer explore web development build websites explore HTML CSS JavaScript

Coding for beginners to learn more about web design and web development. Learn HTML5 CSS3 and JavaScript. Modern coding is explained loaded with examples and sample code. Website development building blocks learn to code. Make it Responsive learn responsive web design with how to create a website responsive and more. Perfect course for html and css for beginners.

Real world Coding with HTML CSS and JavaScript

HTML elements are the building blocks of HTML pages. HTML5 is the starting technology for anything online - perfect to get started as a web designer and web developer.

Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser.

Course Covers HTML for Beginners-

  • HTML and HTML5 for modern website Design and Development.

  • Learn about modern HTML elements

  • Basic of HTML elements and how they work

  • Debugging HTML and Comments within code

  • Create HyperLinks and Links to page content and other web pages anchor tag

  • Bold and Headings to make content stand out with HTML

  • Coding Challenge - Tags Exercise

  • Coding Challenge - Apply HTML tags create Page Structure - Mini Website Creation exercise.

  • Adding MailTo to send emails with HTML links

  • Images within HTML adding img tag and source options

  • Coding Challenge - Getting social linking to your social profiles coding exercise with HTML tags.

  • How to create lists with HTML tags.

  • Adding tables with HTML table tag element attribute options.

  • Coding Challenge - Create an achieved old school website from scratch. Simple HTML website Challenge exercise .

  • Semantic elements and blocks and spans with HTML

  • Coding Challenge - Resume upload Challenge - create your Resume and upload to the web.

  • Explore how to create HTML forms form tags and form elements.

  • Different text formatting options with HTML tags

  • Using IFrames in HTML code
    What are HTML Meta tags and what HTML meta tags should be used HTML Meta Tags
    HTML and Audio options Playing Sound Audio and Video Tags

  • Adding Audio and Video to play within HTML tags

Find out more about CSS What is CSS and how it works. Cascading Style Sheets is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript

Advanced CSS Explore more with CSS3 Create webpages easily ,

  • How to Create CSS Linear Gradients

  • How to Create CSS Radial Gradients

  • How to create CSS 2D Transforms

  • Learn about CSS 3D Transforms and how to apply CSS 3D Transforms

  • How to make animations with CSS - CSS Animations

  • Apply CSS3 rapid web design with CSS3 -

CSS grid CSS Flexbox and modern website and webpage design and development with CSS apply Styling and more

Course Covers CSS for Beginners-

  • How to write CSS adding CSS to web pages and CSS Syntax

  • How to comment CSS code ways to apply Comments CSS

  • What are CSS selectors and how to use CSS selectors to get page elements

  • Setting colors different CSS Color Units Listed

  • Coding Challenge CSS - CSS color Background Challenge

  • Setting CSS background properties and values

  • How to set Element Height and Width with CSS

  • How to Use Chrome DevTools

  • How to add and create CSS Borders

  • How to apply Margin with CSS to elements on the web page

  • CSS Padding options - setting padding top bottom left and right for an element.

  • What is the Box Model and how it works in CSS - Border - Padding - Margin

  • Examples of Pseudo Classes CSS and what are CSS Pseudo Classes

  • What are Pseudo Elements CSS - how to write CSS code for Pseudo Elements

  • Adding Font Styles - selecting web fonts and updating font-family Fun Fonts CSS

  • How to add Google Fonts to your website using Google Fonts CSS

  • How to use the CSS Display Property setting values

  • Coding Challenge - Make a Navigation bar turn your html list items into a NavBar - NavBar Maker Exercise

  • How to set CSS Position - position property options for values

  • How to set CSS Float Elements CSS

  • Coding Challenge - 3 Column Website Project using Floats create a website from HTML code apply styling to create a three column standard website

  • Coding Challenge - Create a Website Image Gallery Website Using Floats - create website from scratch

  • Update Mouse Cursor pointer with CSS - Mouse Cursor Changes

  • How to Use CSS Advanced Selectors and more selection options

  • CSS selector specificity how CSS selector specificity works.

  • How to Create CSS Linear Gradients and How to Create CSS Radial Gradients

  • How to create CSS 2D Transforms and CSS 3D Transforms

  • How to make animations with CSS - CSS Animations

  • What is CSS FlexBox Layout how to create a layout with Flexbox

  • Coding Challenge - How to create a NavBar using Flexbox - Flex NavBar Challenge

  • How to apply element Sizing with Flexbox.

  • How to use Flexbox to size items on the page- Flex items Size

  • Coding Challenge - Flex Image Gallery Challenge - Create an image gallery web page using Flexbox applying CSS to position elements

  • Introduction to the CSS Grid Layout - creating websites with Grid Layout

  • How to use CSS Grid to make Rows and Columns

  • What are Grid Items CSS Grid lesson

  • Setting CSS Grid Area Names and more

  • Coding Challenge -creating websites using CSS Grid - setup and design web pages with examples of CSS Grid webpages.

JavaScript for Web Design - Create interactive and dynamic web pages using JavaScript code.

JavaScript lessons cover the fundamentals of using JavaScript

  • Explore how to add JavaScript to your HTML pages

  • how to add Comments JavaScript

  • Output options document write and console log and alert methods

  • Introduction to JavaScript Variables using let const and var

  • Different Data type within JavaScript

  • Coding Challenge - Create User input with Prompt Code JavaScript

  • JavaScript template literals to create strings

  • Coding Challenge - JAVASCRIPT Code Challenge -Prompt Challenge

  • Explore JavaScript Type Conversion and Coercion.

  • Coding Challenge - Get the data type Type Challenge using JavaScript Code

  • What are JavaScript Operators and how to use them

  • What are JavaScript Assignment Operators

  • JavaScript Comparison Operators

  • JavaScript Truthy and Falsey explained

  • JavaScript if else and else if Conditional Statements

  • Coding Challenge - practice JavaScript code learn and explore the code with a challenge to code

  • JavaScript Ternary Operator Conditional (ternary) operator

  • JavaScript Logical Operators Example

  • JavaScript Switch Statement

  • Coding Challenge - Create a Simple Game Switch Friends Challenge with JavaScript

  • Introduction to JavaScript Functions

  • JavaScript Function Expression vs function declaration with examples

  • JavaScript Function Scope explained

  • Example of JavaScript Closures how to create a Closure

  • What is JavaScript Function Recursion with recursion examples

  • Coding Challenge - Explore how you can use JavaScript code to create a fun simple Game - Number Guesser Challenge

  • IIFE (Immediately Invoked Function Expression) JavaScript function

  • ES6 JavaScript New Arrow Functions JavaScript.

  • Explore JavaScript Objects create objects with JavaScript

  • Coding Challenge - Objects around Create a Car Object Challenge

  • Introduction to JavaScript Arrays - create arrays to hold data with JavaScript

  • Do more with Arrays - using Array Methods JavaScript

  • How to create JavaScript Loops - iteration with JavaScript code

  • Array contents loops

  • Create random values using JavaScript Math

  • JavaScript Date object - set and get date values

  • Welcome to JavaScript DOM - Introduction to dynamic and interactive webpage content

  • Select and Element JavaScript DOM

  • How to Select Web Page elements using JavaScript - Element Selectors

  • How to use Element QuerySelectorAll JavaScript DOM element selection methods

  • DOM content updates - JavaScript Manipulation InnerContent

  • How to update Element Attributes - using JavaScript DOM

  • Element Children and Traversing web page elements using JavaScript

  • Element Manipulation Styles

  • How to create Page Elements using JavaScript Code

  • Coding Challenge - Page Element Append Prepend Challenge using JavaScript Code

  • How to Remove an Element from your webpage using JavaScript Code

  • Creating element clones - JavaScript code to duplicate page elements

  • JavaScript Web page interactions - Adding Event Listeners.

  • JavaScript Element Events Bubble and Capture Event Listeners

  • JavaScript Event Listeners for Keyboard Events also on elements keyboard events

  • Coding Challenge - Dynamic Shopping List using JavaScript List Challenge Events

  • JavaScript String and Number methods

  • How to get Random Item From Array - randomize array items select random value

  • Coding Challenge - how to create Random Page Background

  • Load JavaScript once page is loaded DOMContentLoaded document ready

  • Coding Challenge - Element Mover Challenge move webpage elements with JavaScript

  • JavaScript Date, LocalStorage, Prototypes, Fetch requests


The Document Object Model (DOM) is a programming API for HTML and XML documents. It defines the logical structure of documents and the way a document is accessed and manipulated.

With the Document Object Model, programmers can create and build documents, navigate their structure, and add, modify, or delete elements and content. Anything found in an HTML or XML document can be accessed, changed, deleted, or added using the Document Object Model, with a few exceptions - in particular, the DOM interfaces for the internal subset and external subset have not yet been specified.

Who this course is for:

  • Experienced developers looking to renew their HTML5 & CSS3 knowledge as well as updates to JavaScript
  • Anyone who wants to build websites professional websites
  • Anyone who wants to improve their skillset HTML and CSS and JavaScript
  • Experienced web developers and designers looking to renew and refresh their skills
  • Anyone who wants to improve their knowledge of HTML5 and CSS3 and JavaScript versions
  • Anyone who wants to learn frontend web design and web development HTML CSS and JavaScript

Instructor

Laurence Svekis
Instructor, GDE, Application Developer
Laurence Svekis
  • 4.3 Instructor Rating
  • 52,132 Reviews
  • 863,025 Students
  • 329 Courses

I'm here to help you learn, achieve your dreams, come join me on this amazing adventure today
Google Developers Expert - GSuite

Providing Web development courses and digital marketing strategy courses since 2002.

Innovative technology expert with a wide range of real world experience. Providing Smart digital solutions online for both small and enterprise level businesses.

"I have a passion for anything digital technology related, enjoy programming and the challenge of developing successful digital experiences. As an experienced developer, I created my first computer applications in 1990, and my first website in 1998.  I enjoy sharing my knowledge with others and want to help you share in the wonderful opportunities that the internet provides."

"Learning, understanding with a strong passion for education.  The internet has provided us with new opportunities to expand and share knowledge."

Want to learn more about becoming a web developer, do you want to experience the freedom that technology provides for us? Learn how to bring amazing things to life online.  Technology connects us all in many ways.  It opens up doors to those who embrace it and learn how to make those connections real.

"My courses are designed to help you achieve your goals, learn and update skills"

Background : An experienced web application developer, having worked on multiple enterprise level applications, hundreds of websites, business solutions and many unique and innovative web applications.  Web application development areas of expertise include HTML, CSS, JavaScript, JQuery, Bootstrap, PHP and MySQL. Anything to do with web creation and digital experience. Passionate about everything to do with web application development, programming to online marketing with a strong focus on social media and SEO. 

"Understanding technology provides a means to better connect with users.  It also opens so many doors.   Knowledge is the key to success and I want to help you experience what technology has to offer. I'm passionate about web technologies, and look forward to sharing my knowledge and experience with you!"

Top companies choose Udemy Business to build in-demand career skills.
NasdaqVolkswagenBoxNetAppEventbrite
  • Udemy Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Investors
  • Terms
  • Privacy policy
  • Sitemap
  • Accessibility statement
Udemy
© 2022 Udemy, Inc.