Introduction to web design

Wishlist Share
Share Course
Page Link
Share On Social Media

About Course

This course provides an introduction to the fundamentals of web design, covering the essential technologies that power websites, including HTML (HyperText Markup Language) and CSS (Cascading Style Sheets). Learners will explore how HTML structures the content of a webpage and how CSS is used to style and format that content for a visually appealing design. Through practical exercises and real-world examples, students will learn how to create simple yet effective webpages, covering everything from basic webpage structure to advanced styling techniques. This course is perfect for beginners looking to gain a solid foundation in web design

What Will You Learn?

  • How to structure a webpage using HTML.
  • How to apply styles to webpages using CSS.
  • The basics of creating and styling text, images, and links.
  • How to design layouts using HTML tags and CSS properties.
  • How to troubleshoot and solve common issues in web design.

Course Content

Introduction to HTML and CSS for Web Design
In this lesson, learners will be introduced to the basics of HTML (HyperText Markup Language) and CSS (Cascading Style Sheets), the foundational technologies for creating web pages. Students will explore how HTML structures web content using predefined tags and how CSS styles and enhances the appearance of web pages. The lesson covers the use of plain text editors like Notepad and WYSIWYG editors like Dreamweaver for writing HTML code. Key concepts such as tags, the role of the W3C in standardising HTML, and the basic structure of an HTML document will be explained. Learners will also create a simple webpage.

  • Lesson 1: Beginners Level
  • HTML and CSS Fundamentals: True or False Questions

HTML / CSS – What Do These Tags Do?
In this lesson, learners will explore various HTML tags, focusing on understanding their specific purposes and functions. Learners will dive into tags like , , <title>, , <p>, <h1>, and the unique <img> tag for embedding images. Additionally, learners will explore the difference between ordered and unordered lists, as well as the use of comments in HTML. This lesson will also discuss how to format web content to make webpages more appealing and user-friendly.

Tools for Writing HTML and CSS
This section introduces two main types of editors for writing HTML and CSS: plain text editors and WYSIWYG (What You See Is What You Get) editors. Plain text editors, like Notepad, require manual coding, while WYSIWYG editors, such as Dreamweaver, auto-generate code. Learners will compare these tools in an activity.

Understanding CSS
This section explains CSS (Cascading Style Sheets), a tool for styling and enhancing the appearance of HTML content. CSS allows changes to colors, fonts, and layouts. Learners will practice writing CSS rules to set a light gray background for a webpage and change the heading text color to blue.

Review and Summary
HTML provides the foundational structure for a webpage, defining its content through the use of properly opened and closed tags. CSS enhances this by styling and laying out the content, allowing for customisation in appearance. The basic structure of an HTML document includes essential elements such as , , , and . These components work together to create functional and visually appealing web pages.

Further Practice
In this section, learners are challenged to apply their HTML and CSS knowledge by creating a simple webpage. The task involves embedding an image using the <img> tag, adding a hyperlink with the <a> tag, and using CSS to style the page with at least two properties.

Earn a certificate

Add this certificate to your resume to demonstrate your skills & increase your chances of getting noticed.

selected template

Student Ratings & Reviews

No Review Yet
No Review Yet