WyzGuys Computer Tutors

 Computer Instruction. Web Design Instruction,  and Web Hosting 

 

Working with HTML in Code or Split View

 

Site Navigation

Home
Student Registration
Class Resources

Day One

Introduction
Student Sites
Web Structure
Computer Settings
Site & Pages
Explore FrontPage
Web Site Wizard
Shared Borders
Web Page Themes
Page Header
Adding Text
Homework 1
Web Hosting 101
Web Site Design
Home Page Design

Day Two

Introduction
Your Home Page
Adding Pages
About Us Content
Add More Pages
Deleting Pages
Navigation
Link Bars
Custom Link Bars
Hyperlinks
Adding Hyperlinks
Hyperlink Exercise
Publishing
Copy Your Site
Homework 2

Day Three

Introduction
Bullet List
Numbered List
Tables
Table Uses
Create Tables
Graphics Intro
Image Sizing
Photo Editing
Adding Graphics
Photogalleries
Gallery Tool
Saving Images
Adding Music

Day Four

Form Wizard
Custom Form
Form Exercise
Form Properties
Web Components
Add a Map
Add Search Box
Marquee
Buttons
Hit Counter
Split & Code View
On-Line Sales
PayPal Buttons
Building Traffic
Meta Tags
Search Engines
Appendix & FAQs
Adv Techniques
Interactive Web
Conclusion
Evaluation

We use and recommend

for your on-line transactions

About Working with HTML

Eventually, you may need to work directly in the HTML code.  If you sign up for Affiliate Marketing program, or want to insert a PayPal click-to-pay button, you will need to understand a little about how the code works.

Hypertext Markup Language (HTML) is a standard for creating pages for the World Wide Web. HTML uses special markers, called tags, that indicate how Web browsers should display page elements such as text and graphics.  A tag is a text string used in HTML to identify a page element's type, format, and appearance. Many elements have start and end tags that define where the element starts and stops.

You can edit or format HTML code using tools available in Code or Design views. Design view is a WYSIWIG view where you can work with HTML tags indirectly.  WYSIWYG: Acronym for What You See Is What You Get. Allows you to view a document as it will appear in the final product and to directly edit the text, graphics, and other elements within that view.

When you edit a Web page in Design view, or in the design pane in Split view, you can show or hide HTML tag markers that indicate the start and end of underlying HTML tags.

Editing HTML

Microsoft FrontPage provides a variety of features that help you edit HTML more easily.

  • IntelliSense provides you with a list of available choices when you're adding tags or attributes.

  • The Quick Tag Selector enables you to select entire tags, or the contents of tags, without having to switch to Code view.

  • All of the standard editing commands are also available for editing code. For example, you can Copy, Cut, Paste, Find, and Replace while editing your Web page.

  • The properties of HTML tags are displayed so you can change them yourself.

  • Line numbering helps you to locate and move between specific lines of code.

Formatting HTML

HTML formatting defines how the code is structured on the page. The basic formatting techniques — line breaks, white space, and indentation — make HTML easier to read and edit.

You can specify these settings in FrontPage and set the font color and size uniquely for tags, attributes, values, and scripts.  A script is a type of computer code used to perform tasks on Web pages, such as incrementing a "number of visitors" counter each time there is a new visitor. Web scripts can be written in several script languages. Scripts do not need to be compiled to be run. You can also specify settings to keep the format of the original code, or to apply new format settings to pages you edit.

If you want to delve more deeply into working directly in the HTML code, see the demo on the FrontPage web site.

Another good resource is The Bare Bones Guide to HTML.  There is a comprehensive list of code tags explains what the code does.

Code View and Split View

You can play with the HTML code in either the Code or Split view.  Because I am NOT an HTML coder, I use the split view to help me keep track of what I am doing to my page design.

The illustration that follows gives you an idea of what you will see in the Split view.

Back To Exercise Next

 

Curriculum developed by WyzGuys Computer Tutors

All Rights Reserved - updated 12/07/2006

Hosted by WyzHost.com

contact support@wyzhost.com