Introduction to Web Development and Web Design | HTML CSS and JavaScript for Beginners

Book Overview & Buying
Table Of Contents

HTML CSS and JavaScript for Beginners - A Web Design Course

By : Laurence Svekis

3 (1)

Buy this Video

HTML CSS and JavaScript for Beginners - A Web Design Course

3 (1)

By: Laurence Svekis

Buy this Video

Overview of this book

This course starts from scratch, teaches you how to create websites, and covers everything from the basic syntax (all the common tags used to develop web content and how and where you can write HTML) top resources and links included. You will learn about HTML structure within web pages; explore HTML5 semantic elements; build your own HTML template; create HTML lists, hyperlinks, and add images; build tables for even more HTML structure; create forms with in-depth form examples and HTML tag explanations; add iframes and more cool HTML elements; create your own mini-HTML site using only HTML; and everything you want to know about CSS, JavaScript, JavaScript Document Object Model (DOM), JSON, AJAX, and jQuery. By the end of this course, you will be able to build amazing interactive and dynamic websites using HTML, CSS, JavaScript, and jQuery. The code files for this course are available at https://github.com/PacktPublishing/HTML-CSS-and-JavaScript-for-Beginners---A-Web-Design-Course.

Introduction to Web Development and Web Design

Introduction to Web Development

How to Use This Course

Learn HTML Course Section

Introduction to HTML

Getting to Know HTML

What is an Element

HTML Page Structure

HTML Metadata

HTML Doctype

Try to Make Index Page

Element Formatting HTML

HTML Headings

Self-Closing Tags

HTML Exercise #2

HTML Comments

Preformatted Text

HTML Entities

HTML Text Formatting

More HTML Text Formatting

Practice Text Formatting

Divs and Spans to Organize Content

HTML5 Semantic Elements

Exercise 3: HTML5 Semantic Elements

Placeholder Content

Hyperlinks Anchor Tag

Try to Build a Page

Adding Images to Your Page

Exercise 4: Images

HTML Lists

Exercise 5: Adding Lists

Exercise 6: Rebuild the First Website

Exercise 7: Nested Lists

HTML Tables

HTML Tables with Style

HTML Forms

Create a Contact Form

HTML Form Options

Form Submission

More Input Types HTML5

More with HTML5 Forms

HTML Form Fieldset

Exercise 9: Form Practice

HTML iframes

Exercise #10: Build a Site

CSS Section

Introduction to CSS.

What is CSS

Basics of CSS

CSS Inline Style

CSS Style Tag Styling

Creating and Using CSS File

CSS Selection and Classes

CSS Colors.

CSS Background Property

CSS Display Property

CSS for List Items

CSS Exercise #1: Style a Simple Website

Measures and Properties of CSS

CSS Divs and Spans

Styling Text CSS

CSS Font Family

Google Fonts CSS

CSS Exercise #2

CSS Floats Images

CSS Float Elements

CSS Box Model

Exercise 3: CSS

Exercise 3: Solution

CSS Outline

CSS Position

Exercise #4: Image Grid

CSS Fun with Hyperlinks

CSS Pseudo Classes

CSS and Tables

CSS Overflow and MaxWidth

CSS Element Alignments

Website Project Part 1

Website Project Part 2

Website Project Part 3

Learn JavaScript Section

Welcome to JavaScript

Write JavaScript

Update HTML Element

JavaScript Code

JavaScript Variables

JavaScript Variables in Action

JavaScript Try it, Exercise #1

Operators and Assignments

JavaScript Functions

JavaScript Exercise #2: Function

r Look at Functions

JavaScript Objects

JavaScript #3 Exercise: 3 Objects

JavaScript Arrays

Array Methods

Condition Statements JavaScript

Combine with Functions

JavaScript Switch

JavaScript Loops

JavaScript String Methods

ES6 JavaScript

Document Object Model

Eventlisteners JavaScript

JavaScript Exercise #4: Event Checker Exercise

JavaScript Document Object Model

Introduction to JavaScript DOM

What is the DOM

JavaScript DOM Manipulation

JavaScript DOM Selection

Element Text Manipulation

Change Classes DOM

Change Styles DOM

Element Attribute Manipulation

Interactive DOM Events

Select Multiple Elements

KeyPress Events.

JavaScript Mouse Events

JavaScript DOM Create Your Own Elements

Event listeners to New elements

Create Dynamic List

List Project Exercise Input: Add New Element

Project Bonus: Adding Object Value

JavaScript JSON and AJAX

Introduction to JSON

What is JSON

JSON as Data

Solution Create JSON

JSON Details

Solution: Output JSON to HTML

JavaScript Arrays of Objects

JavaScript Solution Array Objects

JavaScript Loop Object Data

Solution Loop Object Data

JavaScript Add to Object

JavaScript JSON methods

Local Storage Values

Solution: Local Storage

JavaScript Fetch

Solution: JavaScript Fetch.

Catching Errors Shorthand

JSON with Multiple Items

Solution forEach JSON

JSON Conclusion

Learn jQuery

jQuery Introduction to the Section

Why jQuery and What is it

Selecting with jQuery

jQuery Fun with Styling

jQuery Content

jQuery Attributes

Image and Form Attributes

jQuery Click Events

Document Ready Event Listener

jQuery Mouse Events

Keyboard Events jQuery

jQuery on Event listener

jQuery Effects Hide Show

jQuery Fade Effect

jQuery Slide Effect

jQuery Animate Effect

jQuery AJAX

Load and CORS error

AJAX and Form Data

Multiple Items in Response Output

Select Element

Course jQuery Exercise

Web Design and Development: Questions, Answers, and Code Snippets

JavaScript PopUp Modal

Box Model and Border Box Sizing Example

How to Select Dynamic Elements from the Page Using QuerySelectorAll

Add Page Elements Dynamically to DOM add Event Listeners, All Matching Elements.

HTML CSS and JavaScript for Beginners - A Web Design Course

By : Laurence Svekis

HTML CSS and JavaScript for Beginners - A Web Design Course

By: Laurence Svekis

Overview of this book

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access