HTML - Setup

HTML is a standard document format that tells a computer browser how to render and display a webpage. The documents themselves are plain text files containing special markup "tags" and codes that a web browser parses, interprets, and renders on your computer monitor, tablet, or smartphone screen.

 Plain Text Format: An HTML file is an uncompiled text file containing structured markup tags.

 Browser Interpretation: The tags tell the web browser exactly how to render text, images, multimedia, and layout elements.

 File Extension: An HTML file must always be saved with an .htm or .html file extension.

 Zero Paid Tools: To write HTML, any text editor can be used (Notepad, Notepad++, Visual Studio Code, Sublime Text), and to view the output, any modern web browser (Google Chrome, Mozilla Firefox, Microsoft Edge, Apple Safari) is sufficient.

Top Code Editors for BCA Students & Web Developers

Choosing the right code editor boosts your productivity, eliminates syntax errors, and speeds up your development workflow:

Step-by-Step Guide: Create & Run Your First HTML Page

Step 1: Open Your Text Editor

Press the Windows Key + R, type notepad, and hit Enter. Alternatively, open VS Code or Notepad++ if installed on your computer.

Step 2: Write the Standard HTML5 Code

Type the following clean HTML5 code directly into your editor:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First HTML Webpage - Veewom</title>
</head>
<body>
    <h1>Welcome to Veewom HTML Class</h1>
    <p>Congratulations! You have successfully created and configured your first HTML web page.</p>
    <p>HTML is straightforward, lightweight, and universally supported.</p>
</body>
</html>
							

Step 3: Save Your File Correctly (The Windows Extension Trick)

In Notepad, click File > Save As...:

• Choose a dedicated folder (e.g., C:\HTML_Practice\ or your Desktop).
• Set Save as type to All Files (*.*) (Crucial! If you leave it as "Text Documents (*.txt)", Windows will save it as first.html.txt and the browser won't open it as a webpage).
• Set File name to first.html or index.html.
• Set Encoding to UTF-8.
• Click Save.

Step 4: Open and Test in Web Browser

Navigate to your folder, right-click on first.html, and select Open with > Google Chrome (or Firefox / Edge). You will immediately see your rendered webpage!

Hands-on Practice Session for Students

Problem Statement: Create a project folder named college-portal. Inside it, create two files: home.html and courses.html. Add navigation links between both pages so clicking "View Courses" takes the visitor to the courses page, and clicking "Back to Home" returns them.

File 1: home.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>College Portal - Home</title>
</head>
<body>
    <h1>Department of Computer Applications</h1>
    <p>Welcome to our academic student portal.</p>
    <a href="courses.html">View Available Courses &rarr;</a>
</body>
</html>
							

File 2: courses.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>College Portal - Courses</title>
</head>
<body>
    <h1>BCA Course Curriculum</h1>
    <p>Semester 1: Computer Fundamentals, Programming in C, HTML & Web Design.</p>
    <a href="home.html">&larr; Back to Home Page</a>
</body>
</html>
							

Viva & University Exam Questions (BCA Practical Viva)

Frequently Asked Questions (FAQ)