Webucator Blog

|

Creating and Using AP Divs in Dreamweaver CS5

You may be familiar with divs and how to construct them generally using Dreamweaver CS5, but you can also create another type of div, called AP Divs. The “AP”, which means absolutely positioned, means the div will remain in its position totally independent of any other object in the HTML document, unlike relative positioning. AP divs also operate in a unique manner since they are considered a page element, which means Behaviors can be applied to them. You can also place AP divs anywhere within the page!

Continue Reading »

|

Using a Web Widget to Create a Photo Gallery in Adobe Dreamweaver CS5

As you may already know,  Adobe Dreamweaver provides some very useful functionality through the Spry JavaScript Framework, such as the Spry Menu Bar.  However, there are many other popular JavaScript Frameworks which have additional Widgets. Of course, if you know JavaScript adequately well, you may write your own JavaScript.  What if you do not know JavaScript, though? Continue Reading »

|

Creating Image Maps in Dreamweaver CS5

Adding images to your site is one of the simplest and easiest ways of making your web content come to life. I’d say it’s almost mandatory, actually. After all, what better way to ensure your content resonates with your viewers than to provide visual aids and imagery? You can add further interactivity to your site, however, by making your images more than static visual aids, but a dynamic, multi-part navigation system that can link to other pages on your site. These types of images are called image maps. Continue Reading »

|

Creating a Rollover Effect with CSS

I recently discovered there’s yet another way to create rollover images in Dreamweaver. This method actually doesn’t even require any knowledge of JavaScript, even minimally. You only need to know basic CSS. In fact, it doesn’t even require images.

How to create a rollover effect in CSS

If you remember how rollover images work, they are essentially two images that swap with each other depending on whether the cursor is hovering over them. We can create a similar effect in CSS through the use of the <a> tag’s pseudo-classes.
Continue Reading »

|

Creating Rollover Images in Dreamweaver CS5

Rollover images are flashy yet simple visual effects that can help your website to stand out from others and may even unwittingly aid visually impaired viewers. If you are even an occasional web user, I’m sure you have encountered them before. Any button that has ever changed as you rolled your cursor over it is likely a rollover image. Continue Reading »

|

Camtasia Studio Tutorial

I will be providing a brief internal training webinar for Webucator’s trainers on how to use Camtasia for creating vlogs.  The following video is my rehearsal for the second half of the webinar, which will cover Camtasia Studio, covering everything from title clips, transitions, flash hotspots, to voice narration. If you need to, feel free to review my Camtasia Recorder tutorial.

Use the table of contents to the left to jump to your area of interest! (A nifty Camtasia feature.)

To hear about the latest news, blogs, and training, subscribe to our newsletter. Click here to subscribe.

Continue Reading »

|

Sharing Snippets in Dreamweaver CS5

Snippet Folder and Snippet
How would you share this folder/snippet with others?

I’ve recently written on the usefulness of creating snippets in Dreamweaver CS5 for easily and instantly reusing long, complex pieces of code that recur through your document. What if you work with a team of web developers, however, with whom you take turns working on the site? You’d certainly want to share your innovative, time-saving snippet with them to make their lives easier, as well. How would you do that, though?

For instance, I recently had to correspond with an associate who is developing a class for the first time using Webucator’s HTML-based courseware system. He requested any snippets that I had for the courseware creation. A prime example that I had already blogged about came back: my “Webucator” snippet folder, and my “Exercise” snippet.

The Secret Behind Snippets in Dreamweaver

Snippets are really just files stored in a Dreamweaver directory on your computer. Specifically, the directory is the Dreamweaver directory in the Application Data folder of your Windows account/Mac computer.  The path for the directory on a Windows OS would be: C:Users[YOUR ACCOUNT NAME]AppDataRoamingAdobeDreamweaver CS5en_USConfigurationSnippets, where you’d substitute “[YOUR ACCOUNT NAME]” for your actual account name. Continue Reading »

|

Creating Keyboard Shortcuts in Dreamweaver CS5

If you read my last blog post on creating snippets in Dreamweaver CS5, you should now know how convenient and powerful they are, especially if you continuously reuse large pieces of code. You can simplify this task down to selecting a snippet in a list. You can even further simplify this task (and almost any other task in Dreamweaver), however, down to the push of a button–and whatever button you like by creating a keyboard shortcut. Continue Reading »

|

Camtasia Recorder Tutorial

I will be providing a brief internal training webinar for Webucator’s trainers on how to use Camtasia for creating vlogs.  The following video is my rehearsal for the first half of the webinar, which will cover Camtasia Recorder, with features such as setting your recording area, and adding mouse click effects. Continue Reading »