Basic Web Page Creation

Lesson Objectives Create a web page using Microsoft Word Create your own website using free host Design a website using an online WYSIWYG platform; and Edit and insert elements for their website

W.Y.S.I.W.Y.G. is an acronym for What You See Is What You Get. It means whatever you type, insert, draw, place, rearrange, and everything you do on a page is what the audience will see.

Creating a Website using Microsoft Open Microsoft Word Type Anything on the page Click on File > Save As > Browse On the Save As dialog box, locate the activities folder and create a new folder named “Sample Web Page” Specify the filename “Sample Web Page”

On the Save As type, select “Web page (*.html; *.html).” Click on the Change Title Button. Input the title, then click OK then save. Check the file on your Sample Web page folder.

What is Jimdo Jimdo is a WYSIWYG web hosting service. It offers free, professional, and business web hosting services

Create a Website using Jimbo Create an account in Jimbo by going to www.jimdo.com and clicking Create Your Free Website Pick any template you want Choose a URL website. Enter your Email and password Your website will be generated and soon you will end up in the site’s WYSIWYG editor The editor is pretty easy to use.

Editing Elements Move element up – used to move the element up by one level Move element down – used to move the element down by one level Delete element – used to remove element Copy element – used to copy the element Drag tool – Click and drag the element to a valid part of the page

Sizing tools – Used to make image larger or smaller or restore to the actual size Align tools – Used for left, right and center alignment page Rotate tools – Used to rotate the image clockwise or counter- clockwise View Tool – Used to enable enlarge image, link photos and remove link Other tools – Caption and alternative test; allow sharing to Pinterest

Inserting Tools

Heading – to insert heading type of text Text – to insert a paragraph type of text Photo – to insert a single photo Text with photo – to insert photo surrounded with text Photo gallery – to insert multiple photos in one area Horizontal Line – to insert horizontal line Spacing – to add a space with a specified size

Columns – to insert columns that divide an area vertically Video – to insert a video Form – creates a Send an Email from a feedback Store Items – adds a space for selling an item Share buttons – adds buttons for the site visitor to share your website Additional elements – includes other options like Google maps, file download, widget

Templates – changes the design template selected Style – changes the design style of the page Blog – creates a blog for your website Upgrade – upgrades o JimboPro or jimboBusiness Settings – changes account and website settings SEO – search engine Optimization; used for otheres to easily find tour site using search engines Store – manages the other made from our website Statistics – views your sites statistics Help – accesses Jimbo’s help archive

Key Terms WYSIWYG – What You See Is What You Get HTML – Hypertext Markup Language CSS – Cascade Style Sheets Jimbo – free webpage provider Template – a ready-made design for a website Heading – the topmost label of the webpage SEO – Search Engine Optimization