12 Dreamweaver Use Tips

Source: Internet
Author: User
Tags continue dreamweaver

I. Background analysis

For professional web-page makers who want to make complex Web pages in a visual environment, Dreamweaver has gradually emerged as a web-editing tool, making it the best choice for professionals to write Web pages. According to the Macromedia Company's investigation, Dreamweaver currently has accumulated more than 700,000 users, the share of the web editing tools in the crown, such as "Adobe golive" and "NetObjects Fusion" and other competitors are left behind. It is therefore generally estimated that the use of Dreamweaver will continue to increase.

In this overwhelming penetration, it is conceivable that Dreamweaver built-in functions can be said to be more and more rich, complete. In our presentation, there are new features that provide web makers with faster design, easier coding, and more integrated functionality. Without further ado, here's how to make good use of some of the features in Dreamweaver. The following technology has a total of 12, can be divided into four themes. are: Design page page (dreamweaver with flexible page design function), with Macromedia other products with the use of Dreamweaver (make animation and pictures do not ask for), custom use of the interface (enjoy personalized use of experience) and the final addition to the Dreamweaver extension program (Load the extended advanced feature in the Web page).

Second, the design of the Web page tips

Whether you're writing a Web page verbatim and verbatim using HTML's original syntax, or using a standardized window for visual design, the following tips can come in handy.

Tip 1: Make the page page size more flexible

Some Web developers say the technique described below is "liquid," where the technique is called a "stretch-stretching technique." This is a technique that adjusts the page size when the visitor's browser window is resized, so if the window is too large, there is no margin; the window is too small to run out of the moving bar. In fact, most simple Web pages will be the size of the browser window to adjust the size of the page, but if it is a Web page with many different frames and tables, the page size is difficult to automatically adjust. Web page designers typically design page pages using a mix of fixed-width frames, and GIF images as intervals, so that the page size is fixed and not run, whether it's Internet Explorer or Netscape Navigator. With Dreamweaver 4.0, it is easy to design a Web page that will automatically adjust flexibly. How do you do it?

What you do: Open the page with the buttons on the tool panel (Object palette) and convert to Layout view. You can see the bar of the text box, the box above each column has a small drop-down arrow, click the small arrow above the bar where you want to set the flex display, and then select "Set the bar to flex display" (Make Column Autostretch). (Set the width of the AutoFit column to one column) a wavy line appears above the box, not the number that originally represents the bar. Dreamweaver will automatically create a fixed layout of the space picture, this blank image is the top of the bar of the two long blank table, so that the layout will automatically be filled to complete the elastic layout settings. (The first time you add a blank picture will jump out of a dialog box to ask you if you want to use the built-in picture, for the effect, we recommend that you let Dreamweaver automatically produce a, or you do not use a blank picture to fill the layout.) )

Tip 2: Create a personal palette

Dreamweaver new Assets Panel (property Control Panel) is a new tool that can manage files in a file format, such as pictures, styles, and so on when editing a Web site.

The practice: When you define a new site (click Site New site), all types of objects are automatically added to the appropriate table box in the Asset panel. The newly added "Assets Panel" property Control Panel also has a color box that stores all the colors used in your site, including the color of the text, the color of the background, and the color of the hyperlinks. This is a user-tailored web site navigation color plate. Just start the "Assets panel" (First choose "Window" and then Point "Assets"), then point to the left of the small color scroll, you can see a variety of color options on your site. Of course you can pull these colors into certain selected text. Even when you choose a color, the screen will appear on the color of the 16 value of the color light concentration, and three primary color control code (RGB). If you want to shrink the palette toolbar a little, you can even add some colors to the palette's "My Favorites". You can do this by simply clicking on the selected color and clicking on a button called "Add To My Favorites" (bottom right button) in the window.

Tip 3: Make a pop-up menu navigation system

There are a lot of Java script syntax and techniques to be used to make the pop-up menu navigation system (pop-up menu navigation systems), but if you have Dreamweaver, Fireworks Studio, Can be easily quickly and easily.

What to do: Start with Fireworks, select a picture, and then click Insert pop-up menu in the "Set pop-up menu" dialog box, you can enter the name of the item (items) and click "Plus" (add) button, To add the item. You can continue to set the details in the pop-up message box, such as the text and hyperlinks you want to use for the item, and, of course, add a submenu and rearrange the settings for the next level. When you are finished, click Next to continue setting various parameter values, such as colors, fonts, and so on. When the menu is complete, you can preview both the HTML syntax and the image. And then "Finish" (finished). When the mouse moved to the original picture, the menu system will appear in the Content list. Then, when you export the made file, "Fireworks" automatically produces all the HTML, Java script, and image files that all Dreamweaver need to use.

Tip 4: Get the picture moving.

If you have Dreamweaver and Fireworks Studio installed at the same time, the perfect combination of these two software will make you full of praise. Even if you are not a professional picture designer, in the design of the Web page also more or less want to modify some GIF pictures vivid. Dreamweaver allows you to make animations without begging for help.

What to do: Select the picture you want to modify in the standard window, and then click Edit in the property Inspector. If you install the Dreamweaver with "fireworks", "fireworks" is the Dreamweaver preset picture editor, then the picture will automatically load to "fireworks." (If you look closely, you'll notice that fireworks will appear with words and patterns like "Editing from Dreamweaver", indicating that you can edit the picture in Dreamweaver.) OK, now click on "Fireworks" to edit the picture, select "Modify Animate Animate Selection". Next completes the "Animate dialog box" The setting, selects the animation the frame number, the animation movement direction, the transparency and so on sets. You can also click the "Frames" tool to set the move speed and select the "Object" Panel to change the settings. To export a file, simply click the "Optimize" toolbar and select "Animated GIF" where the file type is. When you're done, Fireworks will automatically export the picture as an optimized setting, and automatically update the GIF image, and display the updated picture in the Dreamweaver. Click "File Preview in Browser" so that you can preview the cute picture you just made in the browser.

Tip 5: Let the button have a flashing effect

In Dreamweaver, there is no flashs, you can also make Flash button objects with flashing effect. Dreamweaver has several Flash button objects built into it and can produce several different forms of buttons.

Practice: Click the Insert Interactive Images Flash button to see the built-in buttons. In the dialog box you can even use the mouse to point to the form of the button you want to use, and then see how it works in the browser. Use the mouse pointer to select the button you want to use, and then enter the parameters in order, such as the text on the button, font style, color, hyperlink, etc., or the name of the file itself. Press OK. Then there will be a SWF format file, and the file will be automatically imported into your Web page. By clicking on this file, you will see that the properties of the file are displayed in the property Inspector (attribute details). When you display the file properties, if you extend the file properties list, you will see play, and you can preview the flashing effect of the button without opening the browser after clicking.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.