Wednesday, August 31, 2011

Web Development Tools 1.Microsoft FrontPage


There are many tools used to develop web sites. Most popular tools are


Microsoft FrontPage
Macromedia Dreamviewer
Adobe Fireworks

In this book we are going to discuss two of the most popular web developing tools. First we are going to discuss the Microsoft FrontPage

FrontPage Screen Layout

Below is a diagram of the default page layout in FrontPage.  You can change the view by selecting a different View Option.


Views
  • Page view gives you a WYSIWYG editing environment for creating and editing web pages.
  • Folders view lists all of the files and folders in your web for easy management.
  • Reports view identifies problems with pages and links in the web including slow-loading pages, broken links, and other errors.
  • Navigation view lists the navigation order of the site and allows you to change the order that a user would view the pages.
  • Hyperlinks view allows you to organize the links in the web pages.
  • Tasks view provides a grid for inputting tasks you need to complete in your web.


Monday, August 29, 2011

Color Names


Most browsers support a collection of color names.

Note: Only 16 color names are supported by the W3C HTML 4.0 standard (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow). For all other colors you should use the Color HEX value.

 










Color
Color HEX
Color Name

#F0F8FF
AliceBlue

#FAEBD7
AntiqueWhite

#7FFFD4
Aquamarine

#000000
Black

#0000FF
Blue

#8A2BE2
BlueViolet

#A52A2A
Brown

 





Friday, August 26, 2011

HTML Colors Color Values


Colors are displayed combining  RED, GREEN, and BLUE light sources.

Color Values

Colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one light source is 0 (hex #00). The highest value is 255 (hex #FF).
This table shows the result of combining Red, Green, and Blue light sources:.













Color
Color HEX
Color RGB

#000000
rgb(0,0,0)

#FF0000
rgb(255,0,0)

#00FF00
rgb(0,255,0)

#0000FF
rgb(0,0,255)

#FFFF00
rgb(255,255,0)

#00FFFF
rgb(0,255,255)

#FF00FF
rgb(255,0,255)

#C0C0C0
rgb(192,192,192)

#FFFFFF
rgb(255,255,255)


Wednesday, August 24, 2011

Table Tags















Tag
Description
<table>
Defines a table
<th>
Defines a table header
<tr>
Defines a table row
<td>
Defines a table cell
<caption>
Defines a table caption
<colgroup>
Defines groups of table columns
<col>
Defines the attribute values for one or more columns in a table
<thead>
Defines a table head
<tbody>
Defines a table body
<tfoot>
Defines a table footer

Sunday, August 21, 2011

Headings in a Table


Headings in a table are defined with the  <th>  tag.

<table border="1">

<tr>

<th>Heading</th>

<th>Another Heading</th>

</tr>

<tr>

<td>row 1, cell 1</td>

<td>row 1, cell 2</td>

</tr>

<tr>

<td>row 2, cell 1</td>

<td>row 2, cell 2</td>

</tr>

</table>

 

How it looks in a browser:






Heading
Another Heading
row 1, cell 1
row 1, cell 2
row 2, cell 1
row 2, cell 2

Empty Cells in a Table

Table cells with no content are not displayed very well in most browsers.

<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td></td></tr></table>

How it looks in a browser:





row 1, cell 1
row 1, cell 2
row 2, cell 1

Thursday, August 18, 2011

Tables and the Border Attribute


To display a table with borders, to use the border attribute:

 

<table border="1">

<tr>

<td>Row 1, cell 1</td>

<td>Row 1, cell 2</td>

</tr>

</table>




row 1, cell 1
row 1, cell 2
row 2, cell 1


Note that the borders around the empty table cell are missing (NB! Mozilla Firefox displays the border).

To avoid this, add a non-breaking space (&nbsp;) to empty data cells, to make the borders visible:

 

<table border="1">

<tr>

<td>row 1, cell 1</td>

<td>row 1, cell 2</td>

</tr>

<tr>

td>row 2, cell 1</td>

<td>&nbsp;</td>

</tr>

</table>


Wednesday, August 17, 2011

HTML Tables


With HTML you can create tables.

 

Tables

Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

 

<table border="1">

<tr>

<td>row 1, cell 1</td>

<td>row 1, cell 2</td>

</tr>

<tr>

<td>row 2, cell 1</td>

<td>row 2, cell 2</td>

</tr></table>

 

 

How it looks in a browser:





row 1, cell 1
row 1, cell 2
row 2, cell 1
row 2, cell 2




.

List Tags


Friday, August 12, 2011

List Tags

Tag Description
    Defines an ordered list
      Defines an unordered list

    • Defines a list item
      Defines a definition list

      Defines a definition term

      Defines a definition description

      Deprecated. Use
        insteadDeprecated. Use
          instead

Wednesday, August 10, 2011

Definition Lists

A definition list is not a list of items. This is a list of terms and explanations of the terms.

A definition list starts with the <dl> tag. Each definition-list term starts with the <dt> tag. Each definition-list definition starts with the <dd> tag.
 


<dl><dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt><dd>
White cold drink</dd>
</dl>


Here is how it looks in a browser:
Coffee
Black hot drink
Milk
White cold drink
Inside a definition-list definition (the <dd> tag) you can put paragraphs, line breaks, images, links, other lists, etc.

Saturday, August 6, 2011

HTML Lists 2. Ordered Lists


An ordered list is also a list of items. The list items are marked with numbers.
An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

Here is how it looks in a browser:
·         Coffee
·         Milk
Inside a list item you can put paragraphs, line breaks, images, links, other lists, etc.


Search Engine Submission - AddMe

HTML Lists 1. Unordered Lists

·           An unordered list is a list of items. The list items are marked with bullets (typically small black circles).
·           An unordered list starts with the <ul> tag. Each list item starts with the <li> tag.
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

Here is how it looks in a browser:
·         Coffee
·         Milk
Inside a list item you can put paragraphs, line breaks, images, links, other lists, etc.

Thursday, August 4, 2011

Background


The background attribute specifies a background-image for an HTML page. The value of this attribute is the URL of the image you want to use. If the image is smaller than the browser window, the image will repeat itself until it fills the entire browser window.

<body background="clouds.gif">
<body background="http://www. schoolnet.com/clouds.gif">

The URL can be relative (as in the first line above) or absolute (as in the second line above).
When using a background image, consider the following:

·         Will the background image increase the loading time too much? 

·         Will the background image look good with other images on the page? 

·         Will the background image look good with the text colors on the page? 

·         Will the background image look good when it is repeated on the page? 

·         Will the background image take away the focus from the text? 


.

Tuesday, August 2, 2011

HTML Backgrounds


A good background can make a Web site look really great.

Backgrounds

The <body> tag has two attributes where you can specify backgrounds. The background can be a color or an image.

Bgcolor

The bgcolor attribute specifies a background-color for an HTML page. The value of this attribute can be a hexadecimal number, an RGB value, or a color name:

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

The lines above all set the background-color to black.