HTML (HyperText Markup Language) is the standard language used to create web pages. It is a markup language that uses various tags and attributes to define the structure and content of a web page. HTML provides a set of elements and attributes that can be used to define the different types of content on a web page, including headings, paragraphs, links, images, etc.
CSS (Cascading Style Sheets) is a style sheet language used to define the layout and appearance of HTML files. CSS allows web developers to separate the presentation of a web page from its content, making it easier to maintain and modify the layout and style of a website. With CSS, you can define the colors, fonts, margins, padding, and other design elements that give your web pages a personalized look.
In a nutshell, HTML and CSS work together to create visually appealing and interactive web pages.
Fundamentals of Web development
- Front-end: HTML, CSS, and JavaScript development
- Back-end: Consists of a server, an application, and a database.
- Full-stack: Involves both developments.
Essential attributes to work with in web development
JavaScript: Programming language; used for adding functionality to web pages.
React: Library – Frameworks help build websites faster.
Git & GitHub: Version Control Systems – keep track of project history.
- With HTML we can define all the building blocks of code.
- CSS styles objects and provides visual effects.
- JavaScript helps features to be interactive.
How the web works
- The client/device asks and consequently, the Server responds.
- The client/device requests a service to the server, and the server retrieves it.
- This process is formatted on HTTP/Hypertext Transfer Protocol and HTTPS protocol, secure (encrypts) communication and data transfer between a user’s web browser and a website.
Explanation:
The browser/client sends an HTTP request to the server to receive an HTTP response, the HTTP response contains an HTML document, and the browser reads the HTML document to construct a document object model and render/display de page.
Note: HTML and CSS validators give insight into what we should do to improve our code and the errors found.
Code Example:
Visual Example (Live Server):
Glossary:
<DOCTYPE html> Initializes a new HTML file, we can type “!” for a full HTML well-structured empty template every time a new .html file is created.
<html lang = “en”>specifies the language of the file so that when a user is browsing, the websites/pages pop up according to the user’s language</html>
<body>In order for the browser to render an HTML file, we must have a body, otherwise an error will occur</body>
<p>for paragraphs</p>
<h#number>for the heading size or order</h#number>
<style>The CSS instructions are inside the style element, usually used with classes and ids to modify specific content</style>
<a href=””>is used for hyperlinks, images, emails, etc</a>
This Blog just describes what HTML and CSS are for, I will be writing more about these web tools soon.