Dreamweaver build Web Query system

dreamweaver|web| Query System

This tutorial assumes that you are familiar with HTML, Photoshop 6.0, ASP, Access 2000, WEB configuration, and that you have a foundation for static, dynamic page production of Dreamwaver MX. If you are not familiar with the above technology, please refer to the relevant books, or to the forum discussion.
This tutorial is in my city a 114 phone number query program mainly introduced, the function is relatively simple. Therefore, if you read this tutorial, it is not difficult to develop more advanced programs.
The tutorial is divided into 8 lectures, are: The first lecture: Functional design, the second lecture: Design database, the third lecture: Design the Web page image and Chettu, the fourth lecture: in Dreamweaver MX set up a site, and planning site, five: to establish relevant static pages, the sixth Lecture: the static page is modified to dynamic page, Seventh: The preparation of the background management procedures, the eighth lecture: the overall test.

The following is the first lecture: Functional design

Phone number inquiries are known to be available through 114 phone calls, but the results of the inquiry only includes the name of the business or person corresponding to the telephone. Other information is not available, but also need to pay for the telephone, if the network to achieve, it will be very convenient. At present, the Internet Phone number query site A lot of their functions are very powerful, not only to achieve the most basic telephone number inquiries, but also contains the enterprise's information, corporate propaganda, and even member enterprises of product sales activities. They all belong to the e-commerce class site. We're going to design programs that aren't as complicated as they are, so what are we going to achieve? Let me say a few simple functional requirements:

1, by entering the name of the enterprise or the name of the head of household inquiries telephone number;
2, the enterprise information contains the enterprise's contact method and the operation introduction information;
3, enterprises can achieve rankings, hot enterprises can be displayed in each query to recommend the location of the enterprise to achieve better publicity;
4, the business categories can be customized, at the same time can be in accordance with the business type of business inquiries telephone number;
5, not registered enterprises can fill out the online form automatic submission;
6, provide the backstage management. Including, the enterprise submits the form the audit, the enterprise's display rank, the key recommendation Enterprise's establishment and so on;

What, is the function still OK? Let me say a few words about our technical features:

1, through the inclusion (including) the form of the organization of the page to make the program modular;
2, use Photoshop 6.0 design page, at the same time cut diagram, easy to construct the page layout from the whole angle;
3, in the database uses "One-to-many" relation to construct the database, causes its design to be more reasonable;
4, through the Dreamweaver MX design page, at the same time the application of "database behavior" to create a Web page, so that you feel Dreamweaver mx powerful;
5, manually modify the Dreamweaver MX generated code and explain the code, let you open the function you want to send.

Do you have faith? Some words just pick up the mouse, we come together!

The database chosen by our program is Microsoft Access 2000, and the reason for choosing him is that he is small, included in Office 2000, suitable for access and small amounts of data, and easy to learn. If you are using SQL Server 2000 or some other database, you can build the appropriate library in your database system based on this tutorial.
We turn on Access 2000, and first screen lets us choose an existing database or create a new database, and if we are using it for the first time, we can select "Null Access database", which will let us enter the database name and the path of the selected database. If you are opening a database that has already been built, you can select an existing one in the list box below. Or choose "More files ..."

Locate the database by hand. As shown in Figure 2-1:

Anyway, we'll go to the Design view of the database. As shown in Figure 2-2:

Next, we create a new datasheet, in the window, select the "Use Designer created data table," and then create two tables, the table name is the industry table and the telephone number table, respectively named, Hy and Tele.

Notice here that we create a "one-to-many relationship" between the industry tables by creating a hy_id field in the Tele table to facilitate later expansion of the industry. At the same time, in addition to setting basic telephone information in the telephone table, some landmark fields are also set up. For example: Is_top, Is_good, Is_pass. Meaning: If the value of Is_top is 1, this information will be displayed at the top of the phone number. Is_good is the recommended flag, and if this field is 1, the phone number will be displayed in red text. And Is_pass said, if users fill out the form online, then fill in the content will not immediately appear to the query results, but need to pass our audit, after the approval can be displayed. Then, if the field is 1, the approval is already passed. The default values for all three fields are 0.
So far, our database has been built. The main attention is the establishment of relationships and the establishment of landmark fields. These will effectively improve the functionality of our programs.
in the next section, we'll show you how to design a Web page image and cut the image so that our page has an initial visual effect.

If there is no image in the Web page, the effect must be bad. For the production of web images, each friend has its own method of making. For example, some friends like every use of an image to draw an image, some friends like to directly in other sites to find some GIF animated images or material library inside the material modified directly into their own web page. As for that method is better, I do not prepare to evaluate, after all, each has its own advantages.
Here, I say I do the steps of the Web: the first step is to use Photoshop to create a 760-wide 1000-pixel high canvas, on this cloth to complete the image of each page to draw. If there is flash animation in the Web page, then leave the position, later in flash production. The second step is to cut the drawing of the page. The third step is to flatten these slices in the Dreamweaver MX. Step fourth, draw the next page. Cycle, until all the pages are finished.
This is the way I draw the page, of course, painting the page can also be done in fireworks or imageready, with their pages can also create animation or drop-down menus and other better visual effects. But because we are mainly in the program, so there is not too much to pursue a better visual effect. Also some people like dynamic Flash station, their production order only Flash, ASP (if using ASP to do background programming environment) and database, I will also launch a "with Flash MX + Dreamweaver mx + ASP + Access2000 to create a flash message book in this tutorial.
Finally, the steps above are the steps for a person to build a Web site. If your site is larger, there are specialized programmers to write programs, there are corresponding graphic design interface, as for the database, there are even a special database to establish personnel. Then the established approach will not be just a few steps. After all, we have a lot of netizens who are a person to do the site, what all by a person, then this tutorial will be very suitable for you. (But this form is not a formal form, like a company only one person, such a company how to make it big.) But in the early stage of China's Internet development, only so ^_^)
The Chettu of the Web page is saved in the package, which contains the whole station Chettu and the small pictures that have been cut. As for how to cut the picture, please refer to your Photoshop book.

After painting the Web page and Chettu, our web page layout design has been all done, the rest of the matter can be set up Web pages. If you now find that some features are not considered, you will need to modify the database or modify the page map. So I can tell you very harshly: "What did you do in the design phase?" Only now discover the deficiencies of the program! "However, it is not too late to think now, after all, than all finished in finding good (this is to give you a soothing pill, but try not to have such a problem)
Our page is Dreamweaver MX typesetting. Before typesetting, you need to build the site (do not tell me that you do not have the habit of constructing the site), building a site is necessary to build dynamic Web sites. Therefore the law cannot be suddenly. I personally strongly do not recommend using FrontPage to make dynamic Web sites.
First, set up a Web site in PWS or IIS, and create a method to refer to the book. Since my machine can only install Win98, so I choose PWS (pain), please look at Figure 4-1:

Then, create the appropriate directory structure within the folder where the Web site is located, and this step can be done in the resource manager. Figure 4-2:

To illustrate, I set up a site in the PCITW folder on my local e-disk. Then 114, common, db three folders were established. Column folders, universal folders, and Database folders, respectively, for 114. Create the images and manage folders below the 114 folder to save the pictures and future admin pages that are needed for 114 columns. and the Connections folder is automatically generated for Dreamweaver MX, to save the connection of the database, later will use (Other folders for my machine on the other site, do not refer to)

At this point, the directory structure of our web site and Web site has been established. The construction of the directory structure can also be done in the Site window in Dreamweaver mx. The rest is to build the site in the Dreamweaver MX.
Open Dreamweaver Mx, select menu-> new site, and set site information separately in the Advanced tab. In the Local information class, set the local condition of the site, enter the absolute path (E:/PCITW) of the Web site that you just established in the local root folder, and enter http://localhost/if you are local . Please see figure 4-3:

If the test is done on the local computer, the remote information class can not be set. The test server class is set up below and the data is entered according to the situation. Select ASP Vbscript in the server type (if you prefer to write in other languages ASP can choose the appropriate option) Access mode select local/Network, representing the local test page. In the test server folder, enter the absolute path of the Web folder you just established, which must correspond. Finally, enter the way to access the local file in the URL prefix http://localhost/ See figure 4-4 for details:

The other category settings are not covered because this tutorial is not used.
OK, our web site, Web site Directory situation, Dreamweaver Mx site has been established. We will be able to build the Dynamic Web page in the future can be easily completed.
Put down the mouse, pick up the handle, play a ghost Dou Luo, relax.

Next page