HTML basics, CSS and JavaScript

Language: German

HTML, CSS and JavaScript basics tutorial

The three most important pillars of the web - HTML, CSS and JavaScript. Learn the basics in Jan Brinkmann's tutorial and apply them directly. You can use them to create dynamic websites, subdivide them legibly, integrate images, format text and position various elements. What is HTML? What is CSS? And what is JavaScript - no more questions for you after the tutorial!

62 lessons in an over 8-hour video tutorial to get started with HTML, CSS and JavaScript
Simply acquire basic knowledge and try it out directly in inclusive exercises
By Jan Brinkmann, a passionate web developer with over 15 years of experience

An introduction that will pay off in your everyday use of the web. Add the basics of web development to your know-how repertoire!

Details

Usable with:
content: 8 h Video training
Licence: private and commercial Rights of use
Bonus: including working material

Introduction

free of charge

Basics HTML, CSS and JavaScript - 01 Introduction

Welcome to the course!

download project file

HTML: Basics

Basics HTML, CSS and JavaScript - 02 What is HTML?

To understand HTML, it helps to have a better understanding of what HTML actually is. This lesson deals with precisely this question.

Basics HTML, CSS and JavaScript - 03 Creating, displaying and editing HTML documents

The crucial question if you are just starting out: How are HTML documents created, displayed or modified? You'll find the answer in this video.

Basics HTML, CSS and JavaScript - 04 The DNA of HTML: the tags

Tags are the basis of HTML documents. You will learn about the concept in this lesson.

HTML: Structure of HTML documents

HTML, CSS and JavaScript basics - 05 The header area and meta information

HTML documents consist of a header area with information about the document and the visible content. This lesson first deals with the header area (head).

Basics HTML, CSS and JavaScript - 06 The page body with the main content

The actual content is stored in the body area. You must have understood this basic subdivision. This lesson is therefore mandatory in any case!

Basics HTML, CSS and JavaScript - 07 comments

Extensive documents in particular benefit from comments that are not displayed on the website itself. They can make the code clearer and document it. Learn how to create them.

HTML: Hyperlinks

Basics of HTML, CSS and JavaScript - 08 Relative and absolute path specifications

On the web, you will encounter path specifications again and again - in two variants: as relative or as absolute path specifications. Take a look at this lesson to understand the concept.

Basics HTML, CSS and JavaScript - 09 Internal links

Links within a website are extremely common. You can find the implementation in this article.

Basics HTML, CSS and JavaScript - 10 External links and targets

Links to other websites are just as important and are also part of everyday life on the Internet. The target also specifies how the links are opened. Learn how to implement this.

Basics HTML, CSS and JavaScript - 11 Links in the document

Links within a document are also called anchors. Learn how to set them and refer to areas on the current page.

HTML: Dividing documents

Basics HTML, CSS and JavaScript - 12 headings

A hierarchical structure includes headings, among other things. Here you will learn about the available elements.

HTML, CSS and JavaScript basics - 13 Line breaks, spaces and separators

Spaces and line breaks in HTML documents are limited. It is important that you are familiar with this concept.

Basics HTML, CSS and JavaScript - 14 Insert paragraphs

Paragraphs play an important role in a text. Here you will learn how to set them.

Basics HTML, CSS and JavaScript - 15 Create lists

Texts need to be clear, especially on the web. Lists help the viewer to skim. Therefore, the lesson on ordered and unordered lists is an absolute must.

Basics HTML, CSS and JavaScript - 16 Using tables

Tables are extremely important for preparing data in tabular form. Learn the basics here.

HTML: Other Elements

Basics HTML, CSS and JavaScript - 17 Embedding images

A web without images is unimaginable. Here you will learn how to integrate images.

Basics HTML, CSS and JavaScript - 18 Using HTML entities

Learn to place special characters as HTML entities in your documents.

Basics of HTML, CSS and JavaScript - 19 Integrating iframes

Use iframes to embed other websites directly into your website.

Basics HTML, CSS and JavaScript - 20 Integrating JavaScript

JavaScripts are integrated into HTML documents. You can learn how to do this here.

HTML exercises

Basics HTML, CSS and JavaScript - 21 Exercise #1: Texts and headings

The first HTML practice exercise is about text formatting and setting headings.

HTML, CSS and JavaScript basics - 22 Exercise #2: create a recipe yourself

Here you create a recipe as an HTML document using basic HTML elements.

Basics HTML, CSS and JavaScript - 23 Exercise #3: a long table

The knowledge of tables is now being applied in practice.

CSS: Introduction.

Basics of HTML, CSS and JavaScript - 24 What is CSS?

Get to know the concept of Cascading Style Sheets.

Basics HTML, CSS and JavaScript - 25 inline styles

Learn to assign CSS statements directly to elements.

Basics HTML, CSS and JavaScript - 26 Internal Style Sheets

Internal stylesheets are another way to store instructions directly in the document.

Basics HTML, CSS and JavaScript - 27 External Style Sheets

A very common case: the stylesheets are outsourced to external files and integrated.

Basics HTML, CSS and JavaScript - 28 HTML attributes class and id

The "class" and "id" attributes are extremely important for styling. Get to know them here.

HTML, CSS and JavaScript basics - 29 The role of div containers

Containers in particular play an important role when working with CSS. Here you will get to know the concept using the div tag as an example.

CSS: Basics

Basics HTML, CSS and JavaScript - 30 Floating elements with float

Elements can be positioned differently using the float attribute. A central element in design. Mandatory lesson!

HTML, CSS and JavaScript basics - 31 Positioning elements

The position attribute is also extremely important and belongs on every CSS syllabus.

Basics HTML, CSS and JavaScript - 32 Inside and outside spacing

Get to know the different specifications for spacing ("padding" and "margin").

Basics HTML, CSS and JavaScript - 33 Set width and height

The width and height (height and width) are the subject of this lesson.

Basics HTML, CSS and JavaScript - 34 Setting borders

HTML elements can be displayed with a border. There is a border attribute for this purpose, which you will learn about in this video.

Basics HTML, CSS and JavaScript - 35 Set font size

Everyone has used different font sizes at some point. After this lesson, you will be able to set them with CSS.

Basics HTML, CSS and JavaScript - 36 Define font families

Fonts are not always available on every computer. That's why font families tend to be defined on the web. Learn how to do this in this video.

HTML, CSS and JavaScript basics - 37 Bold, italicized and underlined text

The basis of text design: bold, italic and underlined text. In this lesson, I will introduce you to the CSS instructions.

HTML, CSS and JavaScript basics - 38 Changing text alignment

The alignment of text is also known from word processing and is not uncommon on the web. Find out how this works with CSS.

HTML, CSS and JavaScript basics - 39 Making hyperlinks look pretty

The standard design of links can be significantly improved using CSS. Get to know the different states of links and the corresponding CSS instructions.

JavaScript: An Introduction

JavaScript basics - 01 What is JavaScript?

A brief overview of the question: "What exactly is JavaScript?"

Basics JavaScript - 02 Internal JavaScript

In this crash course, you will integrate JavaScript into an HTML document. First, you will learn how to store this directly in the document.

JavaScript basics - 03 External JavaScript

External JavaScripts are also important and are constantly present on the web.

JavaScript basics - 04 "Document Object Model" (DOM) and HTML elements

Get to know the "Document Object Model".

JavaScript basics - 05 Outputting data

You do not have to output data in TVML/TVJS in this way, but it is still important for the other examples.

JavaScript basics - 06 Handling click events

An essential feature of JavaScript is control through events. Here you will learn about the concept using the example of click events.

JavaScript basics - 07 Replacing text

Learn how to access elements and change the value.

JavaScript: Fundamentals

JavaScript basics - 08 Using variables

Variables - a central concept of every programming language. Here you will learn how to create them in JavaScript.

JavaScript basics - 09 Data types in JavaScript?

Even if JavaScript does not use explicit data types in the declaration, you should still understand the concept.

Basics JavaScript - 10 Arithmetic with JavaScript

A computer ("calculator") is not able to calculate anything without simple arithmetic. JavaScript can do this too, of course.

JavaScript Basics - 11 Compound Assignments in JavaScript

Even if you don't use them directly yourself, you will encounter compound/combined assignments more frequently in practice. It's good if you can read the syntax!

JavaScript basics - 12 conditions with if

It is difficult to imagine programming without conditions.

JavaScript basics - 13 for loops

The concept of repetition is also extremely important. Here you will get to know a variant in JavaScript.

JavaScript basics - 14 while loops

While loops also have their purpose. Good if you know them too.

JavaScript: Advanced Concepts

JavaScript basics - 15 Defining functions

functions you will also use in TVJS. An important concept that needs to be understood.

JavaScript basics - 16 scopes in JavaScript

In order to move around the code properly, you need to know the scopes of JavaScript.

JavaScript basics - 17 events

Here we go into more detail about events.

JavaScript basics - 18 strings

You will probably encounter strings in every app. That's why they also definitely belong in a crash course.

JavaScript basics - 19 Computing with JavaScript

Topics such as random numbers and other complex calculations are also important.

JavaScript basics - 20 Using arrays

You are also sure to encounter arrays in the JavaScript and TVJS environment. Good if you know them.

JavaScript: Object Orientation

JavaScript basics - 21 Defining objects

Objects are also used in TVJS. So you should at least know the JavaScript implementation.

JavaScript basics - 22 Properties of objects

Properties are part of object orientation and should always be understood.

JavaScript basics - 23 methods

Methods are also important and you will encounter them more frequently in the TVJS examples.

Details of the content

HTML, CSS, JavaScript - learn the basics and apply them directly
In many areas, working with the Internet has become part of everyday life. Whether blogger, copywriter or online marketer, whether developer, editor or journalist - a basic understanding of HTML, CSS and JavaScript makes web work easier and opens up numerous opportunities to independently delve into the lines behind websites.
In particular, the integration of text and image content as well as their formatting and positioning are often useful techniques that are quick and easy to master. Your trainer Jan Brinkmann will teach you all the relevant aspects in theory and practice in a tutorial lasting over eight hours . The contents at a glance:

HTML - the basis for your websites

The course is divided into three large blocks: HTML, CSS and JavaScript. In each block you will find different chapters that deal with a specific main topic. After you have learned what HTML is all about, you will get to know the structure of HTML documents, set hyperlinks, divide your documents by using headings, line breaks, paragraphs, lists and tables and finally you will be able to integrate other elements such as images, iframes or JavaScript.

CSS - the formatting for your pages

The CSS learning block provides your websites with structure, overview and format. Once you know what the function of cascading style sheets is, you will be able to position elements, define spacing, set font sizes and families and use numerous other formatting options in subsequent lessons.

JavaScript - Dynamics for your web projects

Finally, JavaScript allows you to dynamize your static HTML documents. You will learn more about the integration of JavaScript elements and cover topics such as the Document Object Model and advanced concepts such as strings, events and arrays.

What you will learn in the HTML, CSS and JavaScript basics tutorial

On the one hand, you will understand the basic functioning of the web, and on the other hand, after the video training you will be able to create HTML documents yourself in a clearly readable program structure, design websites with CSS and incorporate more dynamics with JavaScript. This will give you skills that you can apply and use again and again in your day-to-day work or for private projects. Your web journey could then continue with PHP or CSS and Sass, for example.