Explore the Premium Content

Managing Assets

One of the primary goals of Dreamweaver MX is to provide effective site management tools that help you streamline and organize your site work. In fact, one of the most attractive aspects of Dreamweaver MX is the very fact that it can be used successfully to manage almost every aspect of a Web site, from design to server-side development.

 

Assets in Dreamweaver MX help you keep most of the components of a Web site organized and updated. Keeping track of an ever-increasing assortment of HTML pages, images, links, color schemes, templates, Flash, and multimedia files can be a challenge, and without Assets in Dreamweaver MX, you’d have to find another external management tool, or keep running lists of assets by hand.

 

While these alternative methods might work for a small site, try it on one that has hundreds, even thousands of documents and you’ll be running to the pub to calm your nerves in no time!

 

Save your time, sanity - and your liver! -  by getting to grips with Asset management!

Read More

Cornerstones of Dreamweaver Design: The Fabulous Hyperlink

The web is many things, but here’s one thing for certain: The web wouldn’t exist at all without the hyperlink.  We use it to link from page to page, from a web page to email, from a point in a document to another point within that document. We use links to download files from web pages, and to attach behaviours to, as in the case of JavaScript rollovers.

In this tutorial, you'll learn about the many different links available in HTML, how to form them for maximum usefulness, how to style them by removing the default underlines and how to ensure that they are usable for all visitors.

Table of Content:

• Types of Links
• Document-Relative vs. Site-Relative Links
• Hyperlink Attributes
• Add a Link!
• Typing the Path
• Browsing to the File
• Point-to-File
• Drag n' Drop
• Targeting Links
• Intra-Page Links
• Email Links
• Removing Link Underlines
• Adding Accessibility Features to Links
• Descriptive Links
• The title Attribute
• The Hyperlink Dialog
• Add the title Attribute by Hand
• Defining Tab Order
• Using the accesskey Attribute
• LinkMANIA!

Read More

CornerStones of Dreamweaver Design: Text Time!

Everything you know about making text look pretty in Dreamweaver is irrelevant.

The way in which HTML and XHTML are supposed to be used to mark up content uses specific logic, creating a document that is considered well-structured. Unfortunately, this is not necessarily the way you’ve been taught, nor does Macromedia Dreamweaver MX automatically create a well-structured document. You have to understand the purpose and meaning of structure, and then use the tool to create well-structured pages. This article will help. You’ll examine headings, paragraphs, pre-formatted text, and unordered as well as ordered lists. Along the way, you’ll learn why the markup used to format these aspects of text should be structured. You’ll also learn to avoid common hacks, making the text within your documents lean, mean, and ready to be viewed on anyone’s machine. Read More

Using HTML for Presentation

In this second in the "Cornerstones of Dreamweaver Design" series, Molly shows you how to use Dreamweaver to make presentational HTML. If you really want to understand Dreamweaver MX and web site design, you have to learn how to do this, even if it’s not the recommended method anymore. Chances are you will find yourself in many instances having to use HTML for presentation rather than CSS, and in all fairness to our profession, that you know it now rather than later will provide you with an understanding of why we prefer CSS. It's also useful if you find yourself updating an old non-CSS web site that you've made before you started to use Dreamweaver.

This tutorial can be used with Dreamweaver MX and Dreamweaver MX 2004. Read More

Cornerstones of Dreamweaver Design: Setting Up Your Site

Recently, we sought out reader opinion on premium content. And, many of you emailed me and DMXzone that while you have found the information very helpful, the tutorials often assumed complex knowledge when most folks reading are just beginning to work with Dreamweaver as a pro tool, and many of you are even fairly new to web design. You clearly expressed that you wanted helpful tutorials that take you right from the very start of using Dreamweaver on through to using it in more complicated ways. This way you can begin building professional sites in a sophisticated manner, tapping into the workflow that Dreamweaver provides. This way, you can build a sturdy foundation of Dreamweaver knowledge upon which to grow your skills.
 
The series will cover the real how-to about the Dreamweaver program from a no-nonsense, step-by-step, practical perspective. Whether it’s something seemingly simple as today’s topic, “Setting up Your Site” to more involved topics such as collaboration and site testing, the point is to lead you through Dreamweaver so you learn it from the bottom up.

In order to work most effectively with any given site in Dreamweaver, it's important to define the site. Defining the site in Dreamweaver means that you first gather all of your materials (HTML pages, images, media, and so forth) in one place, create a directory structure for the materials that makes logical sense, and in many cases, set up remote server access to the server where your site will reside. Then, you can begin working on your pages in an organized way as well as tap into many of the useful tools Dreamweaver provides in terms of file protection and collaboration (which we'll address in future Cornerstone) topics. Read More

Controlling Page Layout with Templates

Suppose you want to give a template driven sites content editor(s) (using Contribute or Dreamweaver MX+) a little layout control while retaining the lock facility of the main site images, the navigation system and the footer content. By providing the content editors with some layout control (through provision of several Optional regions), you build in the capacity to allow the content editor a little stylistic freedom for the content that they are responsible for.

Below are 5 screenshots, showing the different available layouts of the finished project. The 4th screenshot shows how it'll look if no layout is selected when the page is created from the template, and the 5th screenshot shows more than one layout being enabled on the page. As you can see from the screenshots, there is quite a bit of flexibility for the content configuration of each unique page.

 

 

In this 27 page tutorial, Brad teaches you how to achieve these templated designs to allow content editors the leeway over content and layout that they need, while ensuring that branding or navigation can't get accidentally broken. All the source files, templates and images are provided for download.

Read More

Create a Parameter Error Checking Routine

The main reason for building template-driven sites is so that another user can amend the content themselves using Dreamweaver or Contribute without coming to you for small changes and advice - so you need to make the templates as self-explanatory as possible, to avoid having to field lots of queries on which template parameter takes which values, and ending up with just as many questions as you had before!

In this 17-page tutorial, Brad details how he went about a real-life project to intercept incorrect Template Parameter values and display a list of allowed values to prevent the Dreamweaver/Contribute content editors from causing page or Template engine issues using Template MultipleIf Conditional regions. This requires a little more front-end load time (in the sense that you have to actually build the functionality into the template) but provides the content editor with immediate feedback if they input an incorrect value. Be smart and incorporate this into your template development routine and your users will be happier for it.. and so will you!

Read More

Design Time Style Sheets for Contribute or Dreamweaver

This project teaches you how to link style sheets to templates, how to manipulate these style sheets using a Template Optional Region (non-editable) and its associated Template parameter.

This in-depth 18 page tutorial has a set of finished files that you can preview if you get stuck with the instructions. The finished template is in the Templates folder and named: tut3-dtcss-finished.dwt, its dependant file (instance or child) is in the root folder and named: index-finished.htm. Feel free to view these files at your leisure.

Although CSS support in both Macromedia Dreamweaver MX 2004 and Macromedia Contribute 2.0 has improved, there are still quite a few CSS-P bugs related to Design view and commands (Macromedia Dreamweaver and/or Macromedia Contribute). A curiously absent feature of Macromedia Contribute is that it doesn't directly support Design Time Style Sheets at all, unlike Macromedia Dreamweaver MX, which does, but not as desired for these outlined issues. There are workarounds that you can use to overcome these bugs and missing features, one of which is to employ Design Time Style Sheets (DTCSS), which empower your content editors with the full functionality of either product, as long as you have created the Style Sheets properly.

Read More

Templates: Locking/Unlocking Code Outside HTML Tags

One of the more complex template functions to wrap the ol' noggin around is Dreamweaver MXs capability to lock markup above the opening HTML tag (<html>) or below the closing HTML tag (</html>): <!-- TemplateInfo codeoutsidehtmlislocked="{value}" -->.

Very often people get lost reading the content of Dreamweavers F1 help files due to inconsistencies and plain wrong information regarding templates. That 's where this tutorial comes into play and teaches you what this markup does and how to use it through several examples.

After reading and performing the mini-projects of this tutorial, you will understand what the markup does, how it is inserted, and how to get the best of both worlds (locked and unlocked) as possible

Read More

Templates, Library Items and Includes

Templates are useful for maintaining a consistent layout of the website as well as providing a method of locking areas from user editing with Macromedia Contribute. Once you've mastered Dreamweaver Templates, you will learn that Templates are your friend. They will allow you to create consistent websites with ease and save development time once the template is created and fully functional.

This tutorial summarizes the differences between Templates, Library items and Server-side Includes. Delving into the definition, description of use and sample markup. Once this tutorial is mastered, you will understand better about the various discussed technologies, and which can be used together when developing your website.

Read More

Building your first extension!

In this part of George's articles you will get to learn some advanced stuff about writing extensions. George will explain in detail how to make advanced user interfaces for your extensions, as well dive in the JavaScript needed to build a scrolling marquee extension. He will also explain the hidden power of the standard Macromedia libraries. Also a detailed explanation is included about the Dreamweaver configuration folder – its place and purpose. And last but not least you will find cool samples for messages for your answering machine.

Read More

Intro to writing extensions

DMXzone founder, George Petrov, introduces a series of articles on writing your own extensions for Dreamweaver. Previously, this has always been though of as the task for advanced users with lots of programming knowledge, and has been the territory for expensive books.

However, George's series demands no heavy programming or great experience. He takes you through writing an extension for dreamweaver to creating a property inspector for it so that it integrates perfectly, then gives tips on how to package your extension for distribution or sale. We will start with some basic extensions like objects, property inspectors and tag editors. Then we move on the Behaviors and Server Behaviors - from basic to very advanced.

This first article looks at the extensions that you've already been using (though you probably didn't know it!) and examines the type of extension, their purpose and the circumstances that you'd write one yourself.

Read More