Class 02: Basics of HTML, CSS & JS

As a software developer, understanding the basics of HTML, CSS, and JavaScript is fundamental and foundational. HTML (Hypertext Markup Language) provides the structure and content of web pages, serving as the backbone of the web. CSS (Cascading Style Sheets) enables you to control the presentation and layout, making content visually appealing and responsive. JavaScript, on the other hand, is a versatile scripting language that adds interactivity and dynamic behavior to web applications. Together, these technologies form the core of modern web development. Proficiency in HTML, CSS, and JavaScript empowers software developers to create and customize web interfaces, ensuring a seamless user experience. As web technologies increasingly integrate with various software platforms and technologies, a strong grasp of these fundamentals becomes a valuable asset in the broader software development landscape.

Why is it important to use semantic elements in our HTML?

Semantic elements in HTML are elements that specifically describe what content goes between the opening and closing tags of the element (and also where on the page that element goes). These elements communicate to the browser how, and sometimes where, to display these elements on the webpage; giving the content the correct meaning, function, or appearance. Semantic elements also optimize the webpage for assistive technologies (i.e., audio readers for visually impaired users). Lastly, semantic elements boosts Search Engine Optimization (SEO) for your website. These reasons make it quite important to pay attention to semantic elements.

How many levels of headings are there in HTML?

There are six levels of headings in HTML, from <h1> (the highest level) to <h6> (the lowest level).

What are some uses for the <sup> and <sub> elements?

The <sup> and <sub> elements are used to create superscripts and subscripts (respectively). Some uses for them are to mark dates, chemical formulae, mathematical equations, or a numerical link to reference material.

When using the <abbr> element, what attribute must be added to provide the full expansion of the term?

When using the <abbr> (abbreviation) element, you must add the title attribute to provide full expansion of the term.

What are ways we can apply CSS to our HTML?

There are three ways we can apply CSS to our HTML:

1. With an external stylesheet
2. With an internal stylesheet
3. With inline styles

Why should we avoid using inline styles?

You should avoid using inline styles in your HTML for three main reasons:

1. It is against best practices
2. It is the least efficient manner to implement CSS in your code
3. External, internal, and inline styles mix up and can cause confusion as to which style is to be rendered

Code review

   h2 {
     color: black;
     padding: 5px;
   }

What is representing the selector?

The h2 represents the selector

Which components are the CSS declarations?

The color and padding

Which components are considered properties?

The black and 5px

What data type is a sequence of text enclosed in single quote marks?

A string.

List 4 types of JavaScript operators

1. Addition operator: +
2. Assignment operator: =
3. Strict equality operator: ===
4. Subtraction, Multiplication, Division operators: -, *, /

Describe a real world Problem you could solve with a Function

A real world problem that you could solve with a function could be a function to visually scan and read mail, parse the receiving address information, then disseminate the physical mail to the right inbox by a person’s name.

An if statement checks a __ and if it evaluates to ___, then the code block will execute

condition, true

What is the use of an else if?

The else if statement is used to chain on extra choices/outcomes to your conditional statement.

List 3 different types of comparison operators

Three types of comparison operators are:

1. === and !==: used to test if one value is identical to, or not identical to, another.
2. < and >: used to test if one value is less than or greater than another.
3. <= and >=: used to test if one value is less than or equal to, or greater than or equal to, another.

What is the difference between the logical operator && and ||?

The && logical operator checks two or more expressions; all must evaluate to true for the conditional statement to be met (run). The || logical operator checks two or more expressions; only one of the expressions must evaluate to true for the condition to be met.

Things I want to know more about

At this moment, I cannot think of anything that I want to know more about regarding this subject.