Every time you fire up the web browser and enters a URL, it will present you with a web page. As you can see that a web page is full of text, images, videos. But, Under the hood, A web page is nothing a text file with a bunch of code and content in it. It’s that simple. Nothing more.
The Purpose of HTML (Hyper Text Markup Language)
The only purpose of HTML is to give structure and meaning to your website content. the web browser uses this structure to paint the web page on to the screen.
“Wait! What is the content?”
Content is the information, and on a Web page, you can serve the content using text, images, videos, audio, powerpoint presentations, etc. Content lets you communicate with your website audience (Users of your website!)
“I see a lot of text on websites, Where does the text go inside the code?”
Not only text, but also Every other type of content lives in between HTML Tags, and That’s how HTML gives meaning to the content. For example, Imagine you are writing a novel. You can add quotes using the “<blockquote>” HTML tag. You can divide that long piece of text content into paragraphs using a bunch of “<p>” tags. You can add a beautiful image using the <img> tag. There is an HTML tag for almost every purpose.
The Purpose of CSS (Cascading Style Sheets)
CSS controls the look and feel of the content written in HTML. It deals with the layout of a web page. It adds color to otherwise dull headline and text content. It adds space between those two long paragraphs. It does a lot more. To sum it up, we use CSS for design purposes.
“So, what’s the point?”
Facebook’s Like feature is another example. Facebook gives you immediate feedback showing you that liked a profile picture when you click on the like button.
“But wait, When I visit my Facebook account or any other website for that matter, I do not see any code. I can only see the content. What’s happening?”
The browser makes code invisible
Well, how do you open up a website?
“I open up the Browser, I type a website URL and hit the enter button.”
That’s correct. And when you submit a website URL, Browser gets the webpage with Content and code, goes through it line by line, analyzes it and draws the web page on to your computer screen.
“Hey, Guys! Stop it right there! What is a URL?”
Haha, you skipped the previous lessons, don’t you? URL stands for Uniform Resource Locator. It is nothing but a reference to a web page. For example, the only way you can access the design related questions on Quora is by visiting this quora URL “https://www.quora.com/pinned/Entertainment”.
Now that you understand the ecosystem of a website, in the next lesson, you’ll learn about the Static Website and Dynamic website.