Web & development guides

Previously, we've showed you how to create an image map in Dreamweaver using the traditional 'hot spot' method. Here, we’ll show you how to code much the same thing using a more advanced technique — an unordered list and CSS. You’ll need an image and this time you’ll need to know ahead of time its width and height — ours is 600 pixels wide by 300 pixels tall.

Image maps are a handy way to provide a user with a visual navigation system they can click to move around your site. We’ll show you how to create and code an image map in any version of Dreamweaver. The process of creating an image map is twofold. First, you need to create a suitable image to use; second, you need to define the areas that will be clickable and then link these to places on your web site or to some other web site. Start in your graphics program and create an image to use. Think about which areas you’ll designate as being clickable.

A key skill to have in Visual Basic (VB) is the ability to read data from files and write data to them. You might use this to store information about the program from one use to the next as a simple way of keeping user preferences, for example. You can also use it as a way of storing and delivering information back to your user. In recent versions of VB, the way you determine if a file exists and how you read and write files has changed somewhat, so we’ll see how to do this in VB Express 2010.

Over the years, Dreamweaver has become more like other Adobe applications such as Photoshop. While this makes it easier for you to work with Dreamweaver if you use other Adobe programs, it also means that some things peculiar to Dreamweaver may not be apparent at first sight. Here we’ll look at some of the features of Dreamweaver that can make your work a little easier.

The single biggest benefit to using CSS styles for a web page is the ability to easily change the styles and hence the look of the page at any time in the future. Here we’ll look at styling a form in Dreamweaver. To get started, you’ll need a form, so create a new blank HTML page in Dreamweaver. Go to Insert —> Form —> Form and click inside the form element. To make it easier to lay out, click Insert —> Table and add a five-row by two-column table with a width of 500 pixels. Click OK.

A splash screen appears for a few seconds before your actual application appears. It’s a professional way to introduce your Visual Basic (VB) projects. We’ll show you how to create one. The simplest way to create a splash screen is to use the built-in form, so follow the step by step instructions below to add this form to your project. Test the splash screen by pressing F5 to debug your app. The splash screen should show up first and then the app will appear in its place a few seconds later.

From CS3 onwards, Dreamweaver has included Spry widgets, which provide a range of tools to help you add functionality to your web site without extensive coding. Some of these can be used to validate form fields to ensure the correct entry is made before a form is submitted. We’ll look at how to use the Spry Form Validation tool to validate an email form field on a Dreamweaver web page.

If you need to create content for other people to learn from, Microsoft’s Learning Content Development System (LCDS) provides a structured and easy framework. We’ll show you how to get started creating a course. Download and install the LCDS application from http://www.microsoft.com/learning/ en/us/training/lcds.aspx. It will help you understand how the program works if you download and install a sample training application.

We've previously looked at how to add fonts hosted by Google on your web site. Here we'll explain how to use a font that you host on your server. The first thing to understand is that the fonts you use must be licensed for this type of usage. So, you must have permission to put the font on your web site so others can download it, as this is what they'll be doing, and you must also have the permission for the type of usage involved. Some fonts are licensed for web use, but only for personal sites.

One feature of Visual Basic (VB) is the ability to create random numbers, which lets you create and use numbers that can't be predicted ahead of time. This is often used in games, for example, to ensure they play differently every time. We'll use the random number feature in VB to create a simple dice rolling application. As with many projects, the setup will be more complex than the actual coding. First, we'll need to have a die to roll. A simple solution is to display an animated GIF, so we used this one: http://tinyurl.com/4tmmgzl.