Scribd
Upload
18 views5 pages

ETECHQ2M2

The document is a learning activity sheet focused on web page design using WYSIWYG platforms and templates, specifically highlighting tools like Jimdo and Microsoft Word. It defines key terms related to web design, outlines steps for creating a website, and provides tips for using the Jimdo editor. Additionally, it includes questions for reflection on the advantages of WYSIWYG editors and personal web preferences.

Uploaded by

wowitspizza
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
18 views5 pages

ETECHQ2M2

The document is a learning activity sheet focused on web page design using WYSIWYG platforms and templates, specifically highlighting tools like Jimdo and Microsoft Word. It defines key terms related to web design, outlines steps for creating a website, and provides tips for using the Jimdo editor. Additionally, it includes questions for reflection on the advantages of WYSIWYG editors and personal web preferences.

Uploaded by

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

Empowerment Technologies

Name: ___________________________ __ Grade Level: _____


Section: ________________________________ Date: ____________

LEARNING ACTIVITY SHEET


Quarter 2 – Module 2: Web page design using templates and online WYSIWYG platforms

Definition of Terms

WYSIWYG editor- It allows you to create and design a web page without any coding knowledge.

HTML- stands for Hypertext Markup Language

CSS- Stands for Cascading Style Sheets

Jimdo- a free website provider with WYSIWYG editor

Template- a ready-made design for a website

SEO- stands for Search Engine Optimization- a feature that maximizes the search engine optimization feature so visitors
can easily locate your website.

Online Platform is technologies that are grouped to be used as a base upon which other applications processes or
technologies are developed some of the examples of an online platform are Presentation/Visualization, Cloud
Computing, social media, Web Page Creation, File Management and Mapping.

WYSIWYG is an editor that allows you to create and design web pages without any coding knowledge. You can use
Microsoft Word and Microsoft Excel as a WYSIWYG editor. Jimdo is a WYSIWYG web hosting service offering free and
paid services. Jimdo has tools that will allow you to sell your products online. Create your own photo gallery, and videos,
and many more. You can also maximize the search engine by properly tagging your site.

WEB DESIGN PRINCIPLES AND ELEMENTS

Website Template- Also known as web template is a predesigned webpage, simply by adding your text and
customization to create your desired web page. It is usually built with HTML and CSS code.

WYSIWYG editor- It allows you to create and design a web page without any coding knowledge

WYSIWYG- the acronym for “What You See Is What You Get”

- This means that whatever you type, insert, draw, place, rearrange, and everything you do on a page is what the
audience will see. It shows and prints whatever you type on the screen.
Basic Web Page Creation

Creating a Website using Microsoft Word

1. Open Microsoft Word.

2. Type anything on the page like “Hello World!”

3. Click on File > Save As > Type any file name.

4. In the Save as Type, select “Web page (*.htm, *.html)”

Click the Change Title button

Input the title as seen below, then click OK then Save


Open your saved file and you will see that you just created a webpage using MS Word.

Creating Your Own Website using Jimdo


Jimdo is WYSIWYG web hosting service. It offers free, professional, and business web hosting service . Jimdo also has an
iOS and Android app which you can use to manage your website whenever you do not have access to a PC. For this
exercise you will create own personal website that focuses on your passion or hobby.

1. Create an account on Jimdo by going to www.jimdo.com and clicking Create Your Website.

2. You will be instructed to choose a template. Pick any template that you want.
3. Chooses URL for your website. Enter your email and password.

4. Your website will be generated and soon you will end up in the site’s WYSIWYG editor.

5. The editor is pretty easy to use. The center shows the preview of your website. The design tools are located on the
right. It is now time to edit the website to your liking. Use the following tips to achieve it.

Tips in using the editor

By default, the home page is shown on your editor. To navigate to another page, simply click the page title on your
navigator. The site navigator contains a set of links going through the different pages of your website. The navigator
currently available to you depends on which template you used.

Inserting a Page
1. However your mouse pointer over the site navigator. The Edit Navigation button will appear.

2. Click on the Edit Navigation button. Click on Add a New Page.

3. Rearrange pages using the tools on the right of the page title.

4. Click Save when done

Editing Elements

Hovering over a text, image, or any element you see on the website will highlight the
element.

Move element up- used to move the element up by one level

Move element down- used to move the element one lower

Delete element- used to remove the element

Copy element- used to copy the element


Drag tool- click and drag the element to avoid part of the page

Clicking on an element will show more options regarding on what visual element you clicked:

I. Header- If it is a header, clicking will allow you to edit the text and change its font size.

II. Image- If it is an image, several options would also appear. It also allows you to upload an image directly from your
computer or a Dropbox account.

III. Paragraph- If it is a paragraph, you will be treated to even more options similar to using a word processor:

Adding Elements

1. To add elements on screen, hover the mouse pointer over the top or bottom of an existing element until the Add
Element button appears

2. Select the visual element you want to add


3. Edit the element to your liking then click Save
Settings
 The settings option contains important information that you should edit to
make the most out of your Jimdo website.
 The account settings include changing your password, email, and personal
profile.
 The website options allow you to change your site title and footer; checks your
storage; creates your privacy policy and your favicon (the icon of your website
shown on a browser).
 The Mobile Settings is used to prepare you page for mobile devices.
 The Email and Domain Management setting is a premium feature. It is used
to manage email accounts for your website.
 The Store settings allow you to manage the items you sell on your website.
 The SEO option is a premium feature that maximizes the Search Engine
Optimization feature of Jimdo so visitors can easily locate you website.
 The Apps option contains settings for embedded apps on your website like
Dropbox, OR Codes, Google Analytics, and Twitter
 The Jimdo settings allows you to remove the Jimdo Box on your website
(premium feature) and check News.

Read and answer each question concisely.

1. What are the advantages and disadvantages of a WYSIWYG editor?

2. What is the difference between your WordPress blog and your wix Website?

3. List down three more WYSIWYG web hosting services and their URL?

4. List down at least three websites you normally visit.

5. What makes you normally visit the site- graphics, layout, or content? Why?

You might also like