Navigation

Large, clean buttons tend to draw visitors into your pages. (The links on this page are non-active.)

Home About Articles Events Gallery Roster Services Contact

Webcraft

KV5R crafts custom, hand-made web designs, web sites, and web applications for discerning clients. His designs utilize the latest web standards, clean layouts, and clean code. Applications are developed in XHTML, CSS, ASP, VBScript, and ADO. They are delivered fully tested for accessibility and W3C standards compliance.

Bilgewater

My name is Harold Melton, KV5R. I have been developing web designs and applications for about fourteen years, and professionally for about five years as KV5R Web Designs. I also have diverse backgrounds in writing, publishing, and computer-based training development for major industrial clients.

—kv5r at kv5r dot com

Tropic Breeze

Welcome to the Tropic Breeze Template. This is a fluid, 3-column design, which scales to the user’s browser, screen width, and font size selection. Try it! This is achieved with CSS, without layout tables. It looks its best at 1024x768 resolution and Medium font size, but will not break at different resolutions or font sizes.

Simplicity

Because of the use of CSS and eXtensible HTML in place of tables, this template very easy to modify and maintain. The CSS and XHTML are clearly labeled with comments.

The Design

This template was inspired by the ‘Relic’ template by Kevin Cannon. I have added CSS drop-down menus, CSS buttons, boxes, drop-caps, and many other enhancements. The design is open and airy, with a clean layout, thin-line fonts, and a breezy feel.

CSS classes are provided, and are easily modified, for all aspects of the design. Images may float left or right, font faces and line spacing for header and paragraph text are all fully configurable, and links may be natural, drop-down, buttoned, or boxed.

Lists

The proper top/bottom margin relationship between paragraphs and lists must be forced with css, but the left/right margins must be left as defaults.

This is your typical ordered list:

1. This is ol 1
2. This is ol 2
3. This—believe it or not—is ol 3...

This is your typical unordered list:

• This is ul 1
• This is ul 2
• Nested 2a
• Nested 2b
• This—believe it or not—is ul 3...

Images

This template is very image-friendly, and through the use of classes, images float either side of the text. We can also have images as links. And, again through CSS, you can have mouseover effects by simply adding them to the CSS file.

Tables

Designers have abandoned tables for web page layout, favoring div tags linked to CSS. However, tables still have their place as tabular data units. Here is an example of a data table, which is styled with CSS to match the page:

Element	Background	Size and Margins (TRBL)	Font
Top	img/azul.jpg	100% x 150px	50px Century Gothic with position: absolute
Left	None	20%; 4% 1% 0.5em 2%;	Verdana 0.8em
Middle	None	49.5%; 2% 2% 0.5em 2%;	Century Gothic 1em, with 1.6em line-spacing
Right	None	20%; 4% 2% 0.5em 1%;	Verdana 0.8em

Note the use of color-reversing in the table, where the borders are white, and the cells are colors that match the theme. This is usually more pleasing than dark-bordered cells. Also, the font is forced to Arial 0.9em to conserve space.

Bulletins

Open water impact - craft founders on previously uncharted seamount...
3 sharks attack propeller
Global positioning status
Maritime radio services

This is a paragraph of some text to see how such text will behave in this context. The spacing between lines and paragraphs must be controlled by css to make the layout look nice.

Latest Posts

Tropic Breeze - 08/04/07
Metal - 07/03/05
Sandstone - 03/01/07
Cork - 10/01/06
Marble - 06/01/06
Oak - 05/01/06

Search the Archives

 

This is a paragraph of some text to see how such text will behave in this context. The spacing between lines and paragraphs must be controlled by css to make the layout look nice.