0% found this document useful (0 votes)
38 views6 pages

SLMQ1SHSEmpTechM8 v2

Uploaded by

Fatima Batas
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
38 views6 pages

SLMQ1SHSEmpTechM8 v2

Uploaded by

Fatima Batas
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Lesson

2 Basic Web Page Creation


The purpose of this module is to introduce the web-based application
so that the learners can understand more about the design of a website. The
learners will also learn about the use of web-based applications.

What is It
What does Web Page mean?

A Web page is a document for the World Wide Web that can be
accessed and displayed on a monitor or smartphone using any web browser.
Web pages are made up of Hypertext Markup Language (HTML) and can be
created and modified by using basic application like Notepad and
professional HTML editors.

HTML is Easy to Learn and Use


HTML is easy to learn and understand. For someone who wants to learn web
development, HTML is the first and foremost computer language that you
need to take note but do not worry, it is not a sensitive case and as simple
as it is. It already has some tags that serve a specific purpose to make. One
can easily understand others’ code and make changes in it when required
without reading a whole book of a manual. Moreover, it does not throw any
error or create any problem like other programming languages do when the
developer forgets to close the tags or makes mistakes in coding.

HTML is Free
One of the biggest advantages of HTML is that it is free of all cost and there
is no need to purchase specific software for it to be used.
Online Website Builder - Easy Use of Drag-And-Drop Interface
For those who love to make changes to their website, a drag-and-drop
interface is convenient.

WYSIWYG
WYSIWYG is the acronym for What You See Is What You Get. This means
that whatever you will type, insert, draw, place, rearrange, or whatever you
do on a web page is what the audience will see. Just like using the Microsoft
Word, WYSIWYG shows and prints whatever you will type on the screen.

HTML

• HTML stands for Hyper Text Markup Language


• HTML describes the structure of a web page
• HTML consists of a series of elements
• HTML elements tell the browser how to display the content
• HTML elements are represented by TAGS
• HTML TAGS label pieces of content such as “heading”, “paragraph”,
“table” and so on...
• Browsers do not display the HTML tags, but use them to render the
content of the page

Requirements in creating a web page using the html

1. Editor – using the Notepad


(source code) in text and
extension name - .html or
.htm.

2. Browser – responsible for


reading HTML instruction
and displaying the web page
output. (ex. Internet
Explorer, Mozilla Firefox,
Google Chrome)

Creating a Website Using Notepad

Web pages can be created and modified using professional HTML editors.
However, in learning HTML, it is better to use a simple text editor like
Notepad.

Follow the steps below to create your first web page with Notepad.
Step 1: Open Notepad HTML DOCUMENT

<html>
<head>
<title> My First Website </title>
</head>
<body>
<h1> Hello World </h1> </body>

</html>

For Windows 8 or above computers:


a. Open the Start Screen (the window symbol at the bottom left on your
screen).
b. Search and open the Notepad

Step 2: Write the following HTML:

HTML document is divided into two main sections the head and the body.
Each section contains specific information. The head section contains
information about the documents like title, search engine or keywords but
is not visible to the reader. The body section contains the information or
content that you want to appear on the web page.

Step 3: Save the HTML Page


Save the file on your computer. Select File > Save as in the Notepad menu.
Name the file "MyfirstWebsite.html"

Step 4: View the HTML Page in Your Browser

Open the saved HTML file in your browser (double click on the file, or right-
click - and choose "Open with").

Creating a Website Using an Online Website Builder

Wix.com is a WYSIWYG cloud-based web development platform that was


first developed and popularized by the Israeli company also called Wix. It
allows users to create websites and mobile sites through the use of online
drag-and-drop tools.

For this topic, you will create your own personal


website that focuses on your passion or hobby.
1. Create an account on Wix through their website www.wix.com and click
GET STARTED.
2. Select “Create a New Site” from the drop down menu in the top right
corner of the dashboard. Once it’s clicked, Wix will ask what type of
website do you want to create. There are options for everyone, from
online stores to personal portfolios.

3. Customize your website with the Wix Editor.


Once you select a template, you can be able to customize it in the Wix
Editor using simple drag-and-drop editing.

4. Update the Texts and Images


At this point, you can get to see a preview page of your chosen template.
This is where you can play around with simple but brilliant editing features,
like the dragand-drop design and text boxes.

5. Personalize the Background

If small images are still not enough, you can also change your template
background. The left-hand sidebar features a ‘Background’ button, which
you can use to click and change with ease.

6. Add Pages

Once you created a stunning homepage, there are few other more pages you
can add to ensure that your website has everything visitors are looking for.
For example, make sure to include a “Home”, “About” and a “Contact Us”
page.
7. Publish your Wix website

To make your website publicly accessible, you need to publish it. To do so,
click “Publish” from the top menu. However, before Wix will publish your
site, the last step in the process is to create your own subdomain or connect
a custom domain. For a serious website, you should connect your own
custom domain name, rather than using a Wix subdomain.

You might also like