MENU service case
 Website construction website design Beijing website construction high-end website production company Shangpin China
We create by embracing change
360 ° brand value__
simplified Chinese character
Simplified Chinese English

Shangpin China Joins Hands with Beisheng Internet to Create a New Chapter in Website Construction

Type: Shangpin Dynamic Learn more

Detailed 7 steps of website production

Source: Shangpin China | Type: website encyclopedia | Date: July 16, 2012
Website production 8 detailed steps of

As there are more and more WYSIWYG tools and their use is more and more convenient, making web pages has become an easy job, not like writing lines of source code manually before. Generally, beginners can learn how to make web pages after a short period of learning, so they think that web page making is very simple, and they rush to make their own website. But after they compare it with others, they find that their website is very rough. Why? As the saying goes, "Hot tofu cannot be eaten in haste". Building a website is like building a building. It is a systematic project with its own specific workflow. You can only design a satisfactory website by following this step step by step.

1、 Collect materials

After you have identified the theme of the website, you should start collecting materials around the theme. As the saying goes, "A skillful woman cannot make bricks without straw". To make your website flesh and blood and attract users, you should try to collect materials. The more materials you collect, the easier it will be to create a website in the future. Materials can be obtained from books, newspapers, CDs, multimedia, or collected from the Internet, and then the collected materials can be used as the materials for making your own web pages.

2、 Determine site theme

Website theme is the main content of your website, and a website must have a clear theme. Especially for personal websites, you can't do as much as comprehensive websites to cover everything. You don't have this ability and energy, so you must find the content you are most interested in, do it deeply and thoroughly, and create your own characteristics, so as to leave a deep impression on users. The theme of the website has no rules. As long as it is of interest to you, any content can be used, but the theme should be clear. The content within your theme should be large, comprehensive, refined and deep.

3、 Make Web Page

With the materials and tools available, we need to turn our ideas into reality step by step according to the plan. This is a complex and detailed process, and we must make them in accordance with the principle of big before small, simple before complex. The so-called "big before small" means that when making a web page, first design the big structure, and then gradually improve the small structure design. The so-called simple before complex is to design simple content first, and then design complex content, so that problems can be easily modified. We should use more flexible templates when making web pages, which can greatly improve the production efficiency.

4、 Planning website

The success of a website design largely depends on the planning level of the designer. Planning a website is like a designer designing a building. A beautiful building can be built only after the drawings are designed. The website planning includes many contents, such as the structure of the website, the setting of columns, the style of the website, the color matching, the layout, the use of text and pictures, etc. Only when you take these aspects into consideration before making the website can you be proficient in making the website. Only in this way can the webpage be personalized, distinctive and attractive. How to plan each specific content of the website will be described in detail below. 4、 Select the appropriate production tool

Although what kind of tool you choose will not affect the quality of your web design, a powerful and simple software can often achieve twice the result with half the effort. There are many tools involved in web page production. The first one is web page production tools. At present, most netizens use WYSIWYG editing tools. Of course, the best ones are Dreamweaver and Frontpage. If you are a beginner, Frontpage2000 is the first choice. In addition, there are also image editing tools, such as Photoshop, Photoimpact, etc; Animation production tools, such as Flash, Cool 3d, Gif Animator, etc; There are also special effects tools for web pages, such as voice and color. There are many software in this field on the Internet, which you can use flexibly according to your needs.

5、 Promotion

After the website is completed, we should continue to promote it, so that more friends can know it and improve the visit rate and popularity of the website. There are many ways to promote, such as registering in search engines, exchanging links with other websites, and joining the advertising chain.

6、 Maintenance updates

The website should pay attention to maintaining and updating the content frequently, and keep the content fresh. Don't leave it unchanged once it is well done. Only by constantly adding new content to it can it attract visitors
★ If you want to learn how to make web pages, you must first understand the tools for making web pages.

The main tools for making web pages are as follows

Frontpage: A tool that comes with Office. It is easy to operate, practical, easy to learn, and not very functional. I don't like it very much.

Dreamweaver: This is one of the three swordsmen of web pages. It is a special tool for making web pages. It can automatically generate code for web pages. It is the preferred tool for ordinary web page makers. It has a simple interface and powerful practical functions. It is recommended for beginners.

Another tool is code editing tools, such as Notebook, EditPlus, etc. These tools mainly edit dynamic web pages such as asp.

In addition, there are some network programming tools, such as javascript and java editor.

Web page production is also a popular industry. To really make a good website, you must have good design skills. So I have to learn a lot of marginal software, such as photoshop, flash, etc.

Large websites often need database support, so they also need to understand database. Sql, Oracle, etc.

7、 Upload test

After the web page is created, it must be published to the web server finally, so that it can be viewed by friends all over the world. There are many tools to upload now. Some web page creation tools have FTP functions. With these FTP tools, you can easily publish the website to the home page storage server you apply for. After uploading the website, you should open your website in the browser, test page by page and link by link, find problems, modify them in time, and then upload the test. After all the tests, you can tell your friends your website and let them browse it.  

FrontPage is a very simple web page editing software, which can be used to compile a web page quickly. It is easy to use, learn and use. FrontPage is an ideal integration tool for beginners to create web pages. Dreamweaver is the first visual web development tool for professional web designers. It can easily create dynamic web pages across platforms and browsers

[Keywords] Web page creation, FrontPage, WYSIWYG, Dreamweaver, HTML

When we surf the Internet, we will envy those beautiful web pages. In fact, we can also make our own personal web pages. Now there are many web page production software, mainly the following kinds of unique web page production software.

Microsoft FrontPage - Create powerful pages

Netscape editor - making simple web pages

Adobe Pagemill - Web page for making multi frame, form and image map images

Claris Home Page - Quickly create dynamic pages

DreamWeaver - Homemade webpage with dynamic HTML animation

HotDog Professional - create web pages to add multiple complex technologies

HomeSite - Create a web page that can completely control the page process

HotMetal Pro - making web pages with powerful data embedding capability

Hotlog Professional - a powerful and extremely convenient super web page editing tool

Paintshop Pro - can be regarded as a simplified version of photoshop

Ulead Cool 3d - a popular 3D special effect character making tool

Gif movie Gear - the simplest animation software

Ulead Smartsaver -- optimize and compress images

Among so many web creation software, Frontpage and Dreamweaver are the two most well-known and commonly used popular software. Now I will briefly introduce these two kinds of software to you.

Microsoft FrontPage is one of the most popular web page creation and website management software at present, which can easily and quickly edit the page style. It provides a WYSIWYG "Design" view in the editor, while displaying the "Split" view of the page frame and code, displaying the "Code View" of the code command, and previewing the "Preview" of the page View Four different views for editing web pages. FrontPage has the following characteristics:

1. Visualization. Using Frontpage software does not require a deep knowledge of web page programming technology, nor does it need to understand HTML syntax. It supports WYSIWYG editing.

2. Universality. Its word processing method is basically the same as that of Word. You can insert tables and images into articles as you edit Word files. You can also insert sound files, animation files, and video files.

3. Multiple view windows. You can use the Frontpage Design view to enter text directly and insert pictures and tables. You can use the Frontpage Code view to modify or write command code. You can use the Preview view of Frontpage to browse the pages that are displayed in the browser when you write a web page.

4. Easy to manage. Frontpage can organize multiple pages into one site, and can distribute and effectively manage it.

Dreamweaver is a WYSIWYG web editor developed by Macromedia in the United States that integrates web production and website management. It is the first visual web development tool for professional web designers. It can easily create dynamic web pages across platforms and browsers Together, Fireworks is known as the "three swordsmen" of web page production. These three software complement each other and are the best choice for web page production. Among them, Dreamweaver is mainly used to make web page files, which have good compatibility and high production efficiency. Flash is used to make beautiful web page animations, and fireworks is used to deal with graphics in web pages. Dreamweaver has the following characteristics:

1. Excellent visual environment. Using the visual development environment of Macromedia (as shown in the right figure), you can simply drag and drop the objects in the "Objects" window to the "Documentwindow" through the simple drag and drop technology. For example, if a Web developer wants to add a Table to a Web page, he can simply drag and drop the "Table" from the "object" window to the stage, and Dreamweaver will automatically generate a table, Then modify and adjust the format through the "Properties" form.

2. What you see is what you get. You can adjust the parameters in the "Properties" form, and immediately see its changes in the "Documentwindow" form. If you press "F12", Dreamweaver will automatically generate an HTML file format for viewing, so that developers can further adjust it.

3. Convenient and fast text arrangement. Similar to "Word", it has powerful text editing ability. You can enter text in "Layer", "Table", "Frame" or directly in the "Document window" form. Right click quickly and select options such as "Font" for editing. You can also use the "Text" menu for more detailed layout editing.

4. High quality HTML generation method. The HTML source code generated by Dreamweaver maintains good readability. The code structure is basically the same as the manually generated code, which allows designers to easily master the overall code and modify it.

5. Real time HTML control. Designers can design pages in two ways: visual or text, and can monitor HTML source code in real time. When the designer makes any changes to the code, the results will be displayed immediately.

6.FTP。 Dreamweaver includes an FTP tool with a very friendly interface. Through it, designers can easily upload a single page or a site to the server. At the same time, the designer can also easily download the files that have been uploaded to the server for reference and modification. During file transfer, Dreamweaver will record the whole process for error analysis.

File lock. This is an archive mechanism specially set for the cooperative development environment. You can set read-only or writable attributes through the marking and fetching mechanism to protect documents. This method can prevent unnecessary data loss and enhance security.

These two kinds of software have their advantages and disadvantages. Through analysis and comparison in the actual use process, I find that the advantages and disadvantages of these two mainstream web page editing software are reflected in the following aspects:

1. Code conciseness. When using FrontPage, it is common to use a web page compression software. FrontPage often inexplicably inserts a lot of spaces in the web page. After compression, the web page will be 20%~30% smaller than the original, and these spaces will reappear after the next editing and saving. Dreamweaver, which is famous for its concise code, has no such problem.

2. Operability. In this respect, FrontPage and Dreamweaver have their own advantages: FrontPage has a similar interface and operability to Word, especially in hand drawn tables. Many people think FrontPage is much more convenient than Dreamweaver. FrontPage is also more convenient than Dreamweaver in viewing source code and previewing functions. Another important point for collecting and sorting data is that the original table, link and text formats can still be maintained when the pages copied from the browser are pasted into FrontPage; In Dreamweaver, even if "Paste as text" is used, it can only be pasted as a plain text segment. Dreamweaver has the advantage that its Tag selector can easily and accurately select the object to be edited. In addition, its table and layer transform each other, and the attribute bar that automatically changes according to the object is also popular.

3. Compatibility with Word software. Many people use Word to input and edit the text content of the web page. If you want to cut and paste the content of these documents into FrontPage or Dreamweaver software, you will find that FrontPage is better at this aspect. Because we only need to select the desired part (including pictures) in Word, and then paste it to the text editing area of FrontPage. Not only can the text and pictures be displayed normally, but also the style is almost the same. What is different is that the picture that was originally centered will become left. However, if we select a part of Word, and then want to paste it into Dreamweaver, we will find that the picture is missing, and the text style is also missing, because the text is all crowded together, and even paragraphs cannot be distinguished. Therefore, if we want to adjust these words and pictures, we must spend a lot of time.

4. Site management. Compared with FrontPage's powerful web management, Dreamweaver is slightly inadequate: FrontPage's unique report view can display 15 project details, including unlinked files, slow pages, older files, new files, and unverified links. Dreamweaver does a lot worse in this respect. There are only three simple items: Broken links, External links and Orphaned Files. And unlike FrontPage, each item has a detailed description of the file name, title, size, type, modification date, etc. In addition, Dreamweaver does not believe that the table background image is an indispensable part of the web page. When you move or rename the table background image in the Site Manager, Dreamweaver will not prompt you to update the link. As a result, the link will break. And for the same reason, Dreamweaver will identify the table background image as an orphan file, which also affects the management of the website. Of course, Dreamweaver also has its advantages in site management. It can realize the overall search and replacement of the whole site without opening each file one by one, and its unique HTML tag attribute search is powerful. In contrast, FrontPage can search the whole site but cannot replace it immediately. You need to open and replace the files in the search result list one by one.

5. Use of pictures. When using a picture, if we want to put a picture in Dreamweaver, we must use the "Insert Picture" method to generate it, but cannot use the "Paste" function of the "Clipboard". Therefore, our pictures must be stored in the hard disk in advance and have been named. FrontPage is much easier. We can copy or clip pictures from any software to FrontPage without saving them as files in advance. Because when we want to save a web page, FrontPage will store these pictures in the "same folder as the web page" with the preset file name. Of course, the file name and storage path of the image can be modified.

6. What you see is what you get. FrontPage is better than Dreamweaver in this function. Because this is very important for beginners, web design beginners, including students, all prefer FrontPage. The so-called "what you see is what you get" means that the style we design in the software should be "exactly the same" as the style we finally present in the web page. Unfortunately, when we use FrontPage or Dreamweaver, we cannot achieve the true "WYSIWYG". In other words, the style of our web page editing is often very different from what we see in Internet Explorer and other browsers. Among them, Dreamweaver has a bigger gap. Therefore, we often need to cooperate with the browser to view the results, and then go to the web page editing software to make changes. Especially when dealing with words, I often have unpleasant experience. If you often need to set the "style" of text, it is recommended to use FrontPage.

7. Design dynamic and interactive web pages. We can use Dreamweaver's "Layer" and "Time Line" functions to let pictures or text move freely in the web page. The way of movement can be around the path we set, or it can be left, right or straight. In addition, we can design to make more changes in text or pictures with the click of the mouse. That is to say, when the mouse passes over the text or picture, the text or picture will have a dynamic effect of change. Dreamweaver can also insert Flash. swf animation files and Firework designed HTML files to make the web pages more lively. Although FrontPage can also insert Flash files, the operation is more troublesome than Dreamweaver. Dreamweaver, Flash and Firework are all products of MacroMedia.

It can be seen from this that FrontPage is a very simple web page editing software. With it, you can quickly compile a web page, which is especially suitable for people who are making web pages for the first time. Through FrontPage, you can also make simple multimedia courseware, enterprise planning books, product presentations, etc. It is easy to use, learn, and use. FrontPage is an ideal integration tool for beginners to create web pages. Dreamweaver is a professional HTML editor for designing, coding and developing Web sites, Web pages and Web applications. Whether you are willing to write HTML code manually or prefer to work in a visual editing environment, Dreamweaver will provide you with useful tools to enable you to have a more perfect web creation experience.

Advantages and Disadvantages of FontPage and Dreamweaver Views: 1268 Reward Points: 20 | Questioning Time: October 8, 2008 13:56 | Questioner: 343895975
Everyone says that using FontPage is mostly a novice. If a novice uses FontPage as the enlightenment software for web page production, will it have an impact on the future level of web page production? From another perspective, will it be weaker than the producers who use Dreamweaver?

1 other answer in total
Among the current web page editing software, FrontPage from MicroSoft and Dreamweaver from MacroMedia are the two most well-known and commonly used popular software. Through the analysis and comparison in the actual use process, I got some personal experience about the advantages and disadvantages of these two mainstream web page editing software.
1、 Code conciseness
When using FrontPage, it is common to use a web page compression software. FrontPage often inexplicably inserts a lot of spaces in the web page. After compression, the web page will be 20%~30% smaller than the original, and these spaces will reappear after the next editing and saving. Dreamweaver, which is famous for its concise code, has no such problem.
2、 Operational
In this respect, FrontPage and Dreamweaver have their own advantages: FrontPage has a similar interface and operability to Word, especially in hand drawn tables. Many people think FrontPage is much more convenient than Dreamweaver. FrontPage is also more convenient than Dreamweaver in viewing source code and previewing functions. Another important point for collecting and sorting data is that the original table, link and text formats can still be maintained when the pages copied from the browser are pasted into FrontPage; In Dreamweaver, even if "Paste as text" is used, it can only be pasted as plain text paragraphs.
Dreamweaver has the advantage that its Tag selector can easily and accurately select the object to be edited. In addition, its table and layer transform each other, and the attribute bar that automatically changes according to the object is also popular.
3、 Compatibility with Word software
Many people use Word to input and edit the text content of the web page. If you want to cut and paste the content of these documents into FrontPage or Dreamweaver software, you will find that FrontPage is better at this aspect. Because we only need to select the desired part (including pictures) in Word, and then paste it to the text editing area of FrontPage. Not only can the text and pictures be displayed normally, but also the style is almost the same. What is different is that the picture that was originally centered will become left.
However, if we select a part of Word, and then want to paste it into Dreamweaver, we will find that the picture is missing, and the text style is also missing, because the text is all crowded together, and even paragraphs cannot be distinguished. Therefore, if we want to adjust these words and pictures, we must spend a lot of time.
4、 Site management
Compared with FrontPage's powerful web management, Dreamweaver is slightly inadequate: FrontPage's unique report view can display 15 project details, including unlinked files, slow pages, older files, new files, and unverified links. Dreamweaver does a lot worse in this respect. There are only three simple items: Broken links, External links and Orphaned Files. And unlike FrontPage, each item has a detailed description of the file name, title, size, type, modification date, etc.
In addition, Dreamweaver does not believe that the table background image is an indispensable part of the web page. When you move or rename the table background image in the Site Manager, Dreamweaver will not prompt you to update the link. As a result, the link will break. And for the same reason, Dreamweaver will recognize the table background image as an orphan file, which also affects the management of the website.
Of course, Dreamweaver also has its advantages in site management. It can realize the overall search and replacement of the whole site without opening each file one by one, and its unique HTML tag attribute search is powerful. In contrast, FrontPage can search the whole site but cannot replace it immediately. You need to open and replace the files in the search result list one by one.
A bad by-product of FrontPage's web management is a large number of "_vti_cnf" directories, which record the relevant information of each file on the web. Therefore, if we use MODEM to upload home pages, we must find a better upload software to filter them out.
5、 Use of pictures
When using a picture, if we want to put a picture in Dreamweaver, we must use the "Insert Picture" method to generate it, but cannot use the "Paste" function of the "Clipboard". Therefore, our pictures must be stored in the hard disk in advance and have been named.
FrontPage is much easier. We can copy or clip pictures from any software to FrontPage without saving them as files in advance. Because when we want to save a web page, FrontPage will store these pictures in the "same folder as the web page" with the preset file name. Of course, the file name and storage path of the image can be modified.
6、 WYSIWYG
FrontPage is better than Dreamweaver in this function. Because this is very important for beginners, web design beginners, including students, all prefer FrontPage.
The so-called "what you see is what you get" means that the style we design in the software should be "exactly the same" as the style we finally present in the web page. Unfortunately, when we use FrontPage or Dreamweaver, we cannot achieve the true "WYSIWYG". In other words, the style of our web page editing is often very different from what we see in Internet Explorer and other browsers. Among them, Dreamweaver has a bigger gap. Therefore, we often need to cooperate with the browser to view the results, and then go to the web page editing software to make changes. Especially when dealing with words, I often have unpleasant experience. If you often need to set the "style" of text, it is recommended to use FrontPage.
7、 Text Style
When using text, FrontPage provides more setting functions to allow text to make more style changes. In addition, the text will be changed immediately after the style is set. For example, designers can set "font", "size" and "color" for text, and also set "indent", "line spacing", "paragraph distance" and "font spacing" for text. The last four items cannot be changed in Dreamweaver.
Although FrontPage provides more functions in text style and is also satisfactory in "WYSIWYG", it does not mean that FrontPage has no shortcomings in this respect. Sometimes when we set the color or thickness of the link text, we often encounter a lot of problems. These are matters that software manufacturers should pay attention to in the future.
8、 Fixed part update
To maintain the overall style of the website, the company logo, copyright bar, promotional statements, advertisements and other page elements on each page are one of the necessary elements. When these elements must be modified, the workload of manual modification is unimaginable. To this end, FrontPage and Dreamweaver have their own solutions: FrontPage uses shared borders to share the same content on one side of a single page or all pages on the web and keep it updated uniformly; Dreamweaver, on the other hand, has set up the concept of Library, which can add any part that needs to be repeated in the page to the library project, and freely set it to be reused and updated uniformly in the required page.
Compared with Dreamweaver's library, FrontPage's shared border is much inferior. It can only select locations from four sides of the page. Once set, it affects all pages of the site. For pages that do not want to use shared borders, it can only be set separately one by one. The most fatal point is that when FrontPage uses shared borders, it will set all the contents of the original page in a large table, while the shared borders will be set in another table. This kind of harm is not obvious to the designer locally. However, on the network, because the browser will download a complete form to display it, it will greatly reduce the actual browsing speed of the web page.
9、 Design dynamic and interactive web pages
Users and supporters of Dreamweaver can raise their heads and hold their chests up from now on. Because the following two functions are both the strengths of Dreamweaver and are extremely important.
First of all, Dreamweaver has the function of "designing interactive web pages". We can use Dreamweaver's "Layer" and "Time Line" functions to let pictures or text move freely in the web page. The way of movement can be around the path we set, or it can be left, right or straight.
In addition, we can design to make more changes in text or pictures with the click of the mouse. That is to say, when the mouse passes over the text or picture, the text or picture will have a dynamic effect of change.
Dreamweaver can also insert Flash. swf animation files and Firework designed HTML files to make the web pages more lively. Although FrontPage can also insert Flash files, the operation is more troublesome than Dreamweaver. Dreamweaver, Flash and Firework are all products of MacroMedia.
10、 Template function
In the current website content, Metro will provide a "directory" (main function link) in each page. These directory projects will usually change in the future, but there may be hundreds or even thousands of our web pages. Do we have to make changes to each page? This is obviously impossible.
So we can use the "template" function provided by Dreamweaver (the suffix of the template is. dwt), that is, first design a template or two or three templates (the number of copies can depend on our needs, of course), then "apply" these templates to our web pages, and then as long as we modify the relevant template (maybe only one), then all the pages that apply the template, You can modify all at once. This function is "easy to modify and maintain" for designing large websites or websites with multiple pages.
As for FrontPage, although it provides a "Theme" and can also allow multiple pages to apply certain "Theme" styles, this function of FrontPage is less flexible. In other words, we can't design according to our own ideas in many places. We can only use several fixed styles of FrontPage. Therefore, it is recommended to use Dreamweaver if you want to design a varied application template.
This paper compares some differences between the common functions of two mainstream web editors. For some high-end applications, such as FrontPage's unique server extension applications, working with the OFFICE family, and ActiveX components; Dreamweaver's unique powerful dynamic web page design capability, and its cooperative work with Fireworks and Flash have their own characteristics. Generally speaking, FrontPage is suitable for novices, while Dreamweaver is more used by professional companies. How to choose it depends on the user.
This article was published by Beijing Website Construction Company Shangpin China //ihucc.com/
Source Statement: This article is original or edited by Shangpin China's editors. If it needs to be reproduced, please indicate that it is from Shangpin China. The above contents (including pictures and words) are from the Internet. If there is any infringement, please contact us in time (010-60259772).
TAG label:

What if your website can increase the number of conversions and improve customer satisfaction?

Make an appointment with a professional consultant to communicate!

* Shangpin professional consultant will contact you as soon as possible

Disclaimer

Thank you very much for visiting our website. Please read all the terms of this statement carefully before you use this website.

1. Part of the content of this site comes from the network, and the copyright of some articles and pictures involved belongs to the original author. The reprint of this site is for everyone to learn and exchange, and should not be used for any commercial activities.

2. This website does not assume any form of loss or injury caused by users to themselves and others due to the use of these resources.

3. For issues not covered in this statement, please refer to relevant national laws and regulations. In case of conflict between this statement and national laws and regulations, the national laws and regulations shall prevail.

4. If it infringes your legitimate rights and interests, please contact us in time, and we will delete the relevant content at the first time!

Contact: 010-60259772
E-mail: [email protected]

Communicate with professional consultants now!

  • National Service Hotline

    400-700-4979

  • Beijing Service Hotline

    010-60259772

Please be assured to fill in the information protection
Online consultation

Disclaimer

Thank you very much for visiting our website. Please read all the terms of this statement carefully before you use this website.

1. Part of the content of this site comes from the network, and the copyright of some articles and pictures involved belongs to the original author. The reprint of this site is for everyone to learn and exchange, and should not be used for any commercial activities.

2. This website does not assume any form of loss or injury caused by users to themselves and others due to the use of these resources.

3. For issues not covered in this statement, please refer to relevant national laws and regulations. In case of conflict between this statement and national laws and regulations, the national laws and regulations shall prevail.

4. If it infringes your legitimate rights and interests, please contact us in time, and we will delete the relevant content at the first time!

Contact: 010-60259772
E-mail: [email protected]