Tutorials for New and Old
Courtesy of the folks at HB Graphics, Guilford CT

Welcome to our Tips and Tutorials on random HTML and JavaScripting topics. Most of this information comes from our reading, surfing and investigating as we try to keep abreast of the fast moving Internet technologies. Many people have asked us how this or that effect is created.
      With just a little encouragement, we decided to create these tips and tutorials with page/code fragments from some of our work. Quite frankly, I learn best by doing, and when I see a site I like, I replicate the effect in my own way to better understand it...and sometimes I just play around. So here are some of our musings.
View the tutorials by clicking on the selections below. The tutorial is contained in the HTML source document so that you may read the comments and discussions along with the actual code. In addition to our own tutorials, there is also an incredible list of quality resources available...some of which are listed below. If you find some neat sites in your travels we would appreciate an .
      Needless to say, but I will anyway, these tutorials assume you have some basic understanding of HTML code, table, forms, image and list structures. Unfortunately, rollovers and image replacements do not work with Internet Explorer 3.x (or look alike) browsers, so please consider upgrading to a Netscape 4.x browser.
      We also wrote an interesting word game using JavaScript which you might find both entertaining and instructional...JAVVO.

Please be so kind as to visit our web site and review what we have been doing for our clients. HB Graphics
133 North Street, Guilford, CT 06437
203-453-5313   
Have fun and happy programming...
Tips & Tutorials
HTML Topics
JavaScript Topics
Articles We've Written
Print Media
Internet Articles
Programming Links


Tips & Tutorials

HTML Topics     
This Page
Use of simple tables, colors and fonts to create some interesting, low fat (fast download), colorful pages. Don't miss the one-bit gif used in several places to create lines. View Source Code.
Cross-Browser Table Considerations
Table structures render differently in the Netscape and Internet Explorer browsers. View this tutorial page with both browsers placed side by side to get the full effect. The desired table is a simple structure of 6 elements with a thin border around them.
Wrapping Images Around Text
Sometimes having a graphic wrap around both sides of your page can have a pleasing effect. Here are two variations of this theme using tables and sliced up images surrounding some text.
JavaScript Topics     
Easy Image Rollovers
If you want image rollovers, then this is the tutorial for you. We discuss how to make it happen using several images. This is a must to understanding the other rollover operations described below.
Multiple Images in a Graphic
On this page we use multiple image rollovers on a single 'title' image through the use of an image map. It could create some interesting effects. JavaScript is the manipulator. You might have to move your mouse over the image to trigger all the images.
Variations on Menu Selectors
Here we present two menu bar schemes both using image maps. One scheme mimics a drop down menu structure.
Intelligent Contact Form
JavaScript is very powerful in checking and assisting a user in filling out a contact form which will be emailed to a client. This page fragment represents a comprehensive approach to the problem.
Image Map with Form Text Box
This page fragment presents an interesting approach to using an image map and a form element to create an interactive map situation. The design was to keep the graphic content low (fast download) yet provide lots of information.
Slide Show Virtual Tour
I have always wanted to experiment with simple concepts of creating a 'virtual tour' of Guilford's museums. Here we use arrays to hold image data, titles, comments and navigation.
Variable Speed Animation
Animated GIFs are neat...but sometimes you might just want to control the animation speed of a sequence of images. Well, here is the code to do just that.
Making "Includes" with JavaScript
Have pages with repetitive "footers" that take a lot of time with cut-and-paste to maintain? Here is a simple approach the works with all 4.x browsers, and with limitations, to older browsers.



Articles We've Written

Published on Other Internet Sites     
Building an Intelligent Contact Form. Filling out forms can be an onerous task for any present or potential customer. But an intelligent form can make the process virtually painless. This article discusses the creation of a JavaScripted user-friendly form that guides the end user.
Creating Virtual Tours. Many Web sites lead visitors on a 'Virtual Tour' which turns out to be a long page with too many pictures that take too long to load. This article discusses a more efficient, JavaScript driven presentation of a virtual tour, that works with limited-bandwidth connections.
Variable Speed Animation. Animated GIFs add eye candy to a Web site, but sometimes you might want to change the animation speed to produce different effects. This article describes an approach which employs multiple single-cell images and JavaScript.
Writing Structured Code. The last thing anyone wants to do is to learn how to structure code. We would all rather be writing it and having fun. But the fun ends quite abruptly when you go back a few weeks later and you wonder who wrote this code. This article discuses some basic constructs to guide structuring.
Those Pesky Tables. HTML tables act as containers for text and images. They organize and separate portions of a page, and they add color and design. In short, they control page topography and in essence become the page. This article focuses on some techniques a developer might use to create tables that perform the same across major browser brands.
My brother-in-law Designs Web Pages. Al DiMarzio and his colleagues have developed a design methodology that they follow with clients. This article discusses that process and offers tips for effective communication with your own clients.
Keeping the Customer Focused. Keeping a Web site's products and/or services in front of the customer during the decision making process is essential to making the sale or closing the deal. I am definitely not advocating we splash our Web pages with banners and images, but we can provide timely decision-making aids at critical locations on our pages. This article will discuss "child" Web pages, commonly known as pop-up windows, and how they can benefit both customer and client.
Guided Missives: Form Validation Techniques Fill-in-the-form web pages have the potential to generate frustration for both the customer and the business owner. This feature article by Al DiMarzio of HB Graphics discusses the use of form validation techniques beyond the scope of simply testing whether the form field is empty or not and discusses email and credit card validators. A similar process can be used for Phone, Social Security and other data.

Reprints from Newspapers/Magazines     
Designing Brochures that Work. Some light reading if you want to do a good job at getting your message across.
Internet for the Business Person. Very basic introduction for a non-Internet business person.
The Relationship of Elements in a Set Thoughts about getting a business community to work together.
Challenge, Change and Cooperation. More of getting businesses to recognize their mutual needs.



Great Programming Links

Danny Goodman's page. Author of the JavaScript Bible...one of the best and easiest to read books I have found on the subject...a must for the serious developer.
Allaire's JavaScript Guide. A great place to start learning JavaScript.
HomeSite Editor We think Allaire HomeSite assisted text editor is the best on the market. Here is their developers forum.
Cold Fusion (ODBC) We design all our data intensive sites using Allaire's Cold Fusion. One could say it is the best product in it's category ... MS might differ, but they are wrong. Here is their Developers forum.
Netscape's Developers Edge on-line, Open Studio. Your Resource for Building Web Sites.
Netscape's Developers Edge on-line, View Source Magazine.
View Source Articles list from Netscape's Developers Edge on-line, View Source Magazine.
ZDNet's JavaScript resource library.
WebCoder.com's how-to section on JavaScripting and DHTML.


Whith job core This is wal mart jobs Whith work from home jobs Information on travel nurse job Buy summer jobs Whith nursing job I need nurse jobs Following a hrdc job bank For jobs online