Home > Web Front-end > CSS Tutorial > Web page skills for website production_VML related

Web page skills for website production_VML related

WBOY
Release: 2016-05-16 12:09:02
Original
1336 people have browsed it

I believe that when all netizens surf the Internet, they will definitely see many personal webpages with unique designs, novel creativity, and attractive pages. When you encounter these webpages, you will definitely stop and appreciate them carefully. At the same time, your mind will You may also have the idea of ​​​​making a personal homepage of your own. If you really have this idea, then please continue reading the following content. The web design skills provided below will definitely feast your eyes and allow you to design your own homepage with ease in the future. Okay, having said all that, let’s get right to the point and let’s take a look at what webpage production skills the author brought today:

1. Plan before designing

Designing a homepage may not be very difficult. But this work, like the preparation of traditional promotional materials, requires careful handling and planning. In other words, we must first determine the main information we need to convey, then carefully consider and organize all the ideas in a reasonable way; then design a page style, try it on representative users, and then revise it repeatedly to strive for perfection.

2. The content you choose should be fresh

New things are constantly appearing on the World Wide Web, and there are new tricks every day. If your homepage never changes, users will get bored quickly. Therefore, the selection of web content should be unconventional, and the word "new" should be highlighted. This principle requires us not to copy other people's content when designing website content, but to create a unique website based on our own actual situation. Looking at it, many personal homepages on the Internet are simply "grocery stores", with all-inclusive content and the same themes. Everyone is "software downloads" and all have "network navigation". There is no trace of "freshness" from beginning to end. meaning. Therefore, when we design a web page, we must focus on selecting materials. The selection of materials should be as "few" as possible but "fine", and the "new" must be highlighted. If we can insist on updating it every day, I believe that this kind of webpage will be welcomed by everyone.

3. The content is relatively practical

Although a web page is designed to be interesting and engaging, this is not the best reason to attract users. To maximize user retention, the first thing is to make it useful. A very simple way to do this is to offer reciprocal participation - have readers do something like sign up for a regularly sent newsletter, and repay their participation in some way, like a weekly prize draw or a chance to download something.

4. Web page naming should be concise

Since a website cannot be composed of just one web page, it has many sub-pages. In order to effectively connect these pages, users can finally give these pages some representative and concise and easy-to-remember web page names. . This will not only help you manage web pages more easily in the future, but also make it easier for others to index your web pages when submitting them to search engines. When naming a web page, it is best to use lowercase English letters that you commonly use or that match the content of the page. This is directly related to the links on the page.

5. Make sure the page is well navigable

One of the most important functions of the homepage is as a navigation tool, guiding users to access the information you store on your website or other locations. Therefore, when designing your homepage, you should try to make the navigation process as easy as possible. For reasons of clarity and speed, hyperlinked content on the homepage should be limited to a few high-level categories, such as companies, products, services, etc. Generally, it is more appropriate for an A4 page size web page to use six to eight super links. In addition, you must ensure that the number of layers of super connections cannot be too many. More than 4 layers of connection information will be boring. So you have to strike a balance between breadth and depth. If you have too much information on your website, you may want to make the page longer or use more connection levels. You may even want to create multiple homepages, each with different information. If you can allow users to find the information they need using keywords or words on the homepage, it will definitely be popular with users.

6. Make good use of tables for layout

Don’t list the content of a website one by one like a report. Pay attention to using tables to highlight the hierarchy and space of the website content so that people can see the key points of your website at a glance. Prominent and clear structure.

7. Reasonable design of visual effects

Don’t fill the page with images to add visual interest. Use colored dots whenever possible - they are smaller and add color vibrancy to list items (and can be used in colored lists). Colored dividers also enhance the graphic feel without disrupting bandwidth. In addition, after the web page is designed, be sure to test the home page under different types of browsers and different resolutions. For example, many browsers use a resolution of 640×480, although some Web pages look good at a high resolution of 800×600. Very attractive, but probably overshadowed in 640×480 mode. Make a small effort to design a web page that can display normally under different resolutions and different types of browsers.

8. Pay attention to details when typesetting

Don’t be tempted to center text and use bold or italic characters. In addition to visual clutter, many browsers don't display italics well and don't compensate for the change in white space caused by slanting letters. Make your page attractive and easy to read by using short paragraphs, bulleted lists, appropriate block quotes, horizontal lines to break up sections, and image maps to guide key links. In addition, the author reminds everyone not to put important content layout at the end of the web page, because readers' eyes may stay more on the home page, or some readers may not have the patience to look down that far.

9. Make good use of images in GIF and JPG formats

Users travel around the Internet, and you must find ways to attract and maintain their attention to your homepage. One of the greatest resources of the World Wide Web is its multimedia capabilities, so we must take advantage of it at all costs. It is best to have eye-catching images, novel pictures, and beautiful fonts on the homepage to make it unique and unforgettable. The content of the image should have a certain practical effect and should not be pretentious or exaggerated. Currently, most images on the Internet use GIF and Jpeg interactive formats, because images in interactive formats are displayed hierarchically - first displayed at a very low resolution, then gradually increasing the resolution, until finally reaching normal display - this This approach can sometimes make larger images appear to load faster, which is not the case, but it is a beneficial illusion. This also makes it easier for readers to see what the image looks like while it's loading, giving them the opportunity to interrupt the transfer or look elsewhere if they don't like or don't want to see it.

10. Add text description to the picture

Add a text description to each graphic so that you can see the relevant content before it appears, especially for navigation buttons and large pictures. In this way, when the network speed is too slow to download images or when users are using text-type browsers, they can still read the content of the web page. In the future, users will always have a sense of intimacy when visiting your site and think that you are You are attentive, considerate, and consider others all the time. I believe your kindness will be rewarded.

11. Use more image thumbnails

For example, there is an 800×600 pixel scanned image with 16 million colors, which occupies about 50K space. Use an image editing tool such as PhotoShop to resample the original image, for example, to a height of 100 pixels (height and width are important to ensure that the browser can instantly display the image at the appropriate size. Perhaps to meet your own requirements You'll have to adjust to find the perfect size, but start by dividing the height by 4 to 6) and PhotoShop will automatically calculate the width of the new image. Save the new image, its size should now be 8K or less. Then add this HTML code to the source file: , then when the browser interprets and executes the Lowsrc command, it will require the browser to load the low-resolution image before the real picture is loaded, so that the visitor will know what will happen. What kind of pictures appear.

12. It is not advisable to use too many animations

Everyone likes to use GIF animation to decorate web pages. It is indeed very attractive, but when we choose, are we sure that GIF animation must be used? If the answer is no, then choose a still picture because its capacity is small. Much more. For a logo of the same size, the GIF animation capacity is 5K, while the static logo is only 3K. Although the difference is only 2K, if it increases, it will affect the download speed. Therefore, if some are not necessary, choose the smallest one.

13. Don’t use flashing text too much

It is understandable that some designers want to attract the attention of visitors through flashing text, but there should be no more than three flashing words on a page. Too many will give users a dazzling feeling, which will actually affect the When users access other content on the website, as the saying goes, "things must be reversed when they go to extremes."

14. Page length should be moderate

You should pay attention when a page is very long, because its transmission time is obviously longer than that of a shorter page. Page transmission that is too long will make visitors lose patience while waiting. And in order to read these long texts, visitors have to use the scroll bar, which also wastes the user's time surfing the Internet. If you have a large number of text-based documents, they should be placed as files in Adobe Acrobat format so that your visitors can read them offline, thus saving valuable time.

15. It is better to use less Java programs

Do not use large-format Java programs. If you can use javascript to replace the effect, try not to use java. Because at present, the running speed of java is really unbearably slow, which often makes viewers impatient to wait for the entire page to be displayed. , so your careful design will have no effect.

16. The style of the entire page should be consistent

All images and text on your web page, including background colors, distinguishing lines, fonts, titles, footnotes, etc., must be unified in style throughout the entire site. In this way, readers will look comfortable and smooth, and it will leave a "very professional" impression on your website.

17. It is best not to use the counter

Since the counter is also designed by the program, the process of displaying the counter is actually the process of executing a program, which takes up the user's valuable Internet time. Moreover, most viewers think that counters are meaningless and they can be easily made. Fake, viewers don’t want to see ads either. Therefore, the author recommends not to lightly consider placing an eye-catching click counter on your website. You design your website to provide a service to your visitors, not to sell something you think is important. If you show how popular your site is, you'd better provide a link that shows access logs.

18. Each page must have a navigation mark

All pages must use navigation signs from beginning to end, especially the "return to homepage" link. You can do this on every page. For example, there is a small series of icons at the top (or bottom) of each page. The first one returns to the home page, the second one returns to the chapter, and the third one returns to the section. If it is an image navigation button, it must have a clear label so that people can understand it. Don’t just focus on the lively visual effects and make people confused about east, west, north, south; and the link color of text navigation is best to use the conventional: unvisited , blue; clicked, purple or maroon. In short, text links must be distinguished from other text on the page to give readers a clear direction.

19. Try to use relative super connections

When making image or text hyperlinks, use relative hyperlinks as much as possible. This is because the web page is more portable. For example, when moving a set of source files to another place, the relative path name It is still valid without the need to re-modify the target address of the connection; in addition, the amount of input when using a relative super connection is less. Of course, the connection items on the same page should use relative addresses, because after using absolute addresses, each connection may be selected. Reload the page. If you are connecting to a file that is not directly related, it is better to use an absolute path, so that you do not need to change the connection if you move the source file to another directory in the future.

20. Ensure that the super connection is intuitive and effective

Hyperlinks on the page should enable users to quickly find what they are looking for. Most good websites have the same navigation bar at the same location on each page, allowing viewers to intuitively access any part of the website from each page.

In addition, especially "Please click here" should be avoided. Anyone who wants to "click here" will carefully consider whether it is exactly "here" and the connection is correct. Don't make the name of the connection different from the URL of the connection. This will waste the reader's time.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template