Some Web page layouts commonly used in website production

Source: Internet
Author: User

Open a Web site, first presented in front of the site is the layout, while good page layout can make it easier for visitors to find the information they need on the site, so the site-making beginners should be familiar with the page layout knowledge.

First, the type of page layout

Web page layout can be divided into "country" font, corner type, title body type, left and right frame type, upper and lower frame type, comprehensive frame type, cover type, respectively, discussed below.

1. "state" font : Also can be called "with" font, is a number of large sites like the type, that is, the top is the title of the site and banner ads, the next is the main content of the site, left and right to split some of the two pieces of content, the middle is the main part, with the list in the end, The bottom of the website is some basic information, contact details, copyright notice, and so on. This structure is one of the most common types of page layouts we see online.

2. Corner type : This kind of structure and the last one is actually only the formal difference, actually is very similar, above is the title and the advertisement banner, next left is a narrow column link and so on, the right column is very wide body, below is also some website auxiliary information. In this type, a very common page layout is the top is the title and ad, the left is the navigation link.

3. title Body type : This type is the top is the title or something similar, the following is the text, such as some article page or registration page is such a class.

4. left and right frame type : This is a two-page frame structure, usually left is a navigation link, sometimes the top will have a small title or Peugeot, the right is the text. Most of the large forums we see are this structure, and many corporate websites are often used on the inside pages. This type of structure is very clear and at a glance.

5. Upper and lower frame type : Similar to the above, the difference is simply a two-page framework.

6. Integrated Frame type : The combination of the above two structures, a relatively complex frame structure, more common is similar to the "corner" structure, but the use of frame structure.

7. Cover Type : This type basically appears on some website's homepage, most for some fine graphic design combined with some small animation, put on a few simple links or just a "go" link or even directly on the homepage of the picture to do the link without any hint. Most of this type appears on branded corporate websites and personal homepages, and if handled well, it can be a pleasing experience.

 

Second, about the first screen

The so-called first screen refers to the part that we can see when we open a Web site without dragging the scroll bar. So how big is the first screen? In fact, this is unknown. Generally speaking, in the most common 1024x768 resolution mode, the default state after IE installation (that is, the toolbar address bar is not changed), IE window can see the part, generally speaking, we take this size as the standard on the line, after all, in the case can not be suitable for all, we can only for the majority of consideration.

The first screen of course to put the most important content, the key to know is that we have to the first screen can show the area to have an estimate, and not just to their own machine to prevail. In fact, one of the most troublesome parts of Web page making is that visitors ' machines and browsers are unknown.

Third, about the position of the navigation bar

Navigation bar allows us to navigate easily to different pages, is a very important part of the page elements, so the navigation bar must be clear, eye-catching, generally speaking, the navigation bar in the "first screen" can be displayed, but sometimes the first screen may be relatively small, based on this consideration, The horizontal navigation bar is better than the vertical navigation bar to consider, the reason is simple: if the first screen of the viewer is very short, the landscape can still see all, and the longitudinal is difficult to say, because the width of the window is generally not affected by the browser settings, and the vertical is much more uncertain.

Iv. What is the best layout?

This is a question that the Web maker may ask. In fact, this should be specific to the specific analysis, if the content is very much, it is necessary to consider the "country" or corner type, and if the content is not too much and some descriptive things more, you can consider the title body type; A common feature of several frame structures is easy to navigate, fast, but not flexible in structure change; If is an enterprise website wants to display the enterprise image, the cover type is the first choice. In the actual site production, only constant changes will improve, will continue to enrich our web design!

Some Web page layouts commonly used in website production

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.