5.0 (1 rating)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1 student enrolled
Wishlisted Wishlist

Please confirm that you want to add HTML AND CSS WEBSITE FOR BEGINNERS to your Wishlist.

Add to Wishlist


5.0 (1 rating)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1 student enrolled
Created by Ylber Murtezaj
Last updated 1/2017
Curiosity Sale
Current price: $10 Original price: $20 Discount: 50% off
30-Day Money-Back Guarantee
  • 1 hour on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Create the website that is shown in the introduction
View Curriculum
  • Should know what HTML AND CSS are ABOUT

Create Simple Website in 40 minutes

If you wish to start or launch in Web Software Development, you need to do this from the bottom, so you need to start little in order to touch the highest mountains.

Learn how to use HTML and CSS to make webpages. HTML is the markup language that you surround content with, to tell browsers about headings, lists, tables, etc. CSS is the stylesheet language that you style the page with, to tell browsers to change the color, font, layout, and more.

HTML is the base of all Sites, every page almost has HTML codes

Look how the site would be without having CSS.

So, if we style our webpage using CSS, look how nice our site can be : 

Hope to see you for an awesome class together.

Kind Regards

Who is the target audience?
  • All people who want to create a simple website
Students Who Viewed This Course Also Viewed
Curriculum For This Course
9 Lectures 47:48

The link where you can download the notepad ++

Preview 04:32

You have to know that everything that we open in HTML or CSS has also a closed tags 




In this lesson we'll write our first code.

First Code on HTML

CSS stands for Cascading Style Sheets.

CSS describes how HTML elements are to be displayed on screen, paper, or in other media.

CSS saves a lot of work. It can control the layout of multiple web pages all at once.

CSS can be added to HTML elements in 3 ways:

  • Inline - by using the style attribute in HTML elements
  • Internal - by using a <style> element in the <head> section
  • External - by using an external CSS file
First code on CSS

The <body> tag defines the document's body.

The <body> element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.


body { 
    display: block;
    margin: 8px;

body:focus { 
    outline: none;

Html BODY design

The <title> tag is required in all HTML documents and it defines the title of the document.

The <title> element:

  • defines a title in the browser toolbar
  • provides a title for the page when it is added to favorites
  • displays a title for the page in search-engine results

    <title>CREATE A SIMPLE WEBSITE</title>

Design of the TITLE (header)

A navigation bar needs standard HTML as a base.

In our examples we will build the navigation bar from a standard HTML list.

A navigation bar is basically a list of links, so using the <ul> and <li> elements makes perfect sense:<ul>
  <li><a href="default.asp">Home</a></li>
  <li><a href="news.asp">News</a></li>
  <li><a href="contact.asp">Contact</a></li>
  <li><a href="about.asp">About</a></li>

Design Navigation list

The Container Class

The w3-container class adds a 16px left and right padding to any HTML element.

The w3-container class is the perfect class to use for all HTML container elements like:

<div>, <article>, <section>, <header>, <footer>, <form>, and more.

Preview 06:10



<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

Let's Design the paragraphs and heading (p, h3)

The <footer> tag defines a footer for a document or section.

A <footer> element should contain information about its containing element.

A <footer> element typically contains:

  •  authorship information
  • copyright information
  • contact information
  • sitemap
  • back to top links
  • related documents

You can have several <footer> elements in one document.

We have finished our site, now you are ready to post in online and everyone around the world can see it.

FOOTER - End of the class
About the Instructor
Ylber Murtezaj
4.5 Average rating
7 Reviews
38 Students
4 Courses
French Teacher and Web Developer

Bonjour ! , my name is Ylber, I was born in Novosello, a small village in the south east of Kosovo, now I live in Montpellier which is a city in south of France, exciting and much more dynamic. I studied French Literature at the university of Montpellier but also English as a foreign language. I have been teaching for 5 years now in many schools and associations. I really enjoy teaching. It gives me the opportunity to learn about the different cultures around the world.

I have become a self taught, Depending on the complexity of a topic, learning something new can take a long time. And it’s bound to be frustrating as you grapple with new terminologies, new models, and apparently irrelevant information. When you are learning something by yourself, there is nobody to control the flow of information, to make sure you move from basic knowledge to intermediate and finally advanced concepts.

Keep in mind these three things :

1. Believe in God

2. be patient and

3. never give up !

Patience with your topic, and more importantly with yourself is crucial — there’s no field of knowledge that someone in the world hasn’t managed to learn, starting from exactly where you are.
I'm constantly trying to improve my teaching skills in order to satisfy the needs of my students. Internet is a very useful tool to experience new methods

I truly believe that learning new things opens the mind and allows you to be more tolerant. I’m quite open minded and flexible and always promote a positive way of learning - I like to tailor my lessons to my students’ needs so that I really can help them progress at their own place in a fun and caring environment!

My job is a passion and I look forward to share my expertise with you ! A bientôt !

I hope you enjoy learning as much as I enjoy teaching !