Introduction to web technology Section 3

(Section 1 Section 2  Section 4 Section 5)

Control the appearance and semantics of text.

Headings: <h1> to <h6> (for different levels of headings)

Paragraphs: <p>

Strong/Emphasis: <strong>, <em>

Lists: <ul> (unordered list), <ol> (ordered list), <li> (list item)

Hyperlink Tag:

Anchor Tag: <a> (used to create hyperlinks to other pages or sections)

Media Tags: Embed multimedia content.

Image: <img> (used to embed images)

Audio: <audio>

Video: `<video>

<audio>: This tag is used to embed (fixing )audio content, such as music or sound effects. It can include attributes like src (source file), controls (to display playback controls), autoplay, and loop.

Who invented html language?

1989: Tim Berners-Lee invents the Web with HTML as its publishing language.

Who invented xhtml language?

XHTML (eXtensible HyperText Markup Language) was developed by the World Wide Web Consortium (W3C). 

It was released in 2000 and was designed as a stricter, XML-based version of HTML, aiming to bring the rigorous syntax rules of XML into web development for improved consistency, compatibility, and data handling.

Who invented html5 language?

HTML5 was first released in a public-facing form on 22 January 2008, with a major update and "W3C Recommendation" status in October 2014. Its goals were to

Web design principles

What are Principles of Design?

The principles of design are basic rules that help make designs look good and work well. They guide how to arrange elements in a design to make it visually appealing and effective.

These rules include balance, contrast, emphasis, movement, pattern, rhythm, and unity. By using these principles, designers can create more attractive and effective designs.

Here are the main principles of design:

Balance: Distributing elements evenly to create a sense of stability.

Contrast: Using differences in color, shape, or size to make elements stand out.

Emphasis: Highlighting the most important parts of a design.

Movement: Guiding the viewer's eye through the design in a specific way.

Pattern: Repeating elements to create a sense of order and consistency.

Rhythm: Creating a sense of movement by repeating elements at regular intervals.

Unity: Making sure all parts of the design work together as a whole.

Web design principles, while not exclusive to HTML, are fundamental concepts that guide the creation of effective and user-friendly websites, many of which are implemented and structured using HTML. These principles aim to enhance usability, accessibility, and visual appeal.

Here are key web design principles and how they relate to HTML:

Simplicity:

A clean and uncluttered design improves usability. In HTML, this means avoiding excessive elements, complex nesting, and ensuring clear content organization using semantic tags like <header>, <nav>, <main>, <footer>, <article>, and <section>. (uncluttered - not having or impeded by too many objects)

Consistency:

Maintaining a uniform look and feel across all pages builds trust and predictability. HTML elements, combined with CSS, should consistently apply styles for headings, paragraphs, buttons, and navigation elements.

Visual Hierarchy:

Guiding the user's eye to important information through visual cues. HTML structure, along with CSS, can achieve this through varying heading sizes (<h1> to <h6>), bolding, color, and strategic placement of elements.

Navigation:

Providing clear and intuitive (understand, know) ways for users to move around the site. HTML's <a> tags create hyperlinks, and the <nav> element explicitly defines navigation sections, often containing lists (<ul>, <li>) for menu items.

Responsiveness and Mobile Friendliness:

Ensuring the website adapts to different screen sizes and devices. While primarily achieved with CSS media queries, a well-structured HTML document with a responsive viewport meta tag is crucial for this to function correctly.

Readability and Typography:

Making content easy to read and understand. HTML provides elements for text formatting, and developers use CSS to control font families, sizes, line heights, and colors for optimal readability.

Fast Load Times:

Optimizing for speed to prevent user frustration. HTML structure, image optimization (using <img> with loading="lazy" and appropriate src and srcset), and efficient use of external resources (CSS, JavaScript) contribute to faster loading. Faster page loading times, which is a critical design principle for user experience.

Accessibility:

Designing for all users, including those with disabilities. HTML elements like alt attributes for images, semantic tags, proper heading structure, and ARIA attributes are vital for creating accessible web content.

User-Centric Design:

Prioritizing the needs and experience of the user. This overarching principle influences all design decisions, from content organization in HTML to interactive elements.