Website Design Specifications

Source: Internet
Author: User
Website size specifications // Website Logo Design Specifications // website file naming conventions // website directory settings specifications

Website Construction dimension Specification

· The page standard is made at a resolution of 800*600. The actual size is 778 * 434px.
In principle, the page length cannot exceed 3 screens, and the width cannot exceed 1 screen.
· Each standard page is an A4 size, that is, 8.5x 11 inch
· The full-size banner is 468 * 60px, the half-size banner is 234 * 60px, and the small banner is 88 * 31px.
In addition, 120*90,120*60 is also the standard size for small icons.
· Each non-homepage static page contains no more than 60 k image bytes, and the full size banner cannot exceed 14 K
-------------------------------------------------------------------------

Website Logo Design Specifications

The logo application has always been the basis and most direct form of CIS import. Its importance is self-evident.
Network ID design is particularly true.
I. Functions of the logo:
As a unique media symbol, logo has always become a visual and cultural language for spreading special information. With a letter, the earliest identification instance that conforms to the CIS spirit is a "Zeng" font icon on a HALDE of Zeng Hou and Yi, who was buried in Chu, China before 2433. No matter from the complicated European logo and Chinese dragon text in ancient times, to the abstract pattern and simple word mark of modern scouring, the purpose of the logo body is:
Through identification, difference, association, and memory enhancement of the logo, it promotes communication and communication between the identified object and the identified object, so as to establish and maintain the cognition and identity of the identified object, to improve recognition and reputation. As an avant-garde of the times, the design of the network logo should follow the overall rule of CIS and make breakthroughs.

Ii. Basic principles of network Logo Design:
The uniform principle is emphasized in the design of network logo. Unification is not a repetitive design principle. It should be like any other design principles: various principles that are well-known to designers, such as dominance, from attributes, relationships, balancing, proportions, repetition, inversion, rhythm, symmetry, comparison, borrowing, reconciliation, and variation, correctly applied to the complete design performance. It can also be interpreted as a more general and comprehensive principle that shares the principles described above.
The components that constitute the logo elements generally share a kind of commonality and difference. This difference is also called uniqueness or change, and unity is to extract diversity into a major embodiment, it is called the principle of diversity and unification. A uniform element in each part has a size, material, position, and other factors that have a dominant effect on the whole.
Elements are called dominance. Precisely grasping the diversity and unification of objects and highlighting the supporting elements is a necessary technical factor for designing network logos.
The identification and uniqueness highlighted by the logo on the Network lead to a proper association between the design of the logo font and the nature of the logo body, and a similar style.
I remember when eastecho's online forum was reopened recently, there was a little witch's logotable for the Forum.
An objection was raised. The logo of a simple printed font deviated greatly from the unique style and excellent quality inherent in the waste, and was not associated with the logo of the entire website, resulting in cognitive ambiguity. However, I made a Chinese logo attempt as a prodigal website filled with English logos. Let's make a breakthrough.
Network logo design should pay more attention to the grasp of things tension, in the concentration of culture, background, objects, concepts and various design principles of the tone, achieve the most impulsive visual embodiment of objects. It can also be understood as the most restrictive impulse, in the case of insufficient tension in any aspect, well-designed logos are often rejected, rejected, or forgotten by users for reasons that do not understand, disagree, be unrealistic, be unavant-garde, be unartistic, or be unhonest. Therefore, it is useless to understand the application objects of users and logos right away. Without considering the national conditions and the user's level of understanding, it is essential to estimate the insufficiency of the design capability. In China, the boss who sells computers designs a $3 million Lucent red circle logo, which is easily seen as money fraud.
Iii. Network logo representation:
As a logo with media characteristics, in order to realize all the visual recognition functions in the most effective space, it is generally through the combination of special patterns and special texts, to present, describe, communicate, and communicate with the identified entity, so as to guide the audience's interests and enhance reputation and memory.
The combination of expressions is generally divided into a special pattern, a special font, and a synthetic font.
1. display pattern:
It is a symbolic representation. It is unique, eye-catching, and the pattern itself is easy to distinguish and remember. It is represented by the logo body through implicit, associative, generalized, abstract, and other painting methods, the concept is expressed in a general way, while the image is not directly related to the identified object. The audience is easy to remember the pattern itself. However, the cognition of the relationship between the identified object needs a relatively tortuous process, however, once a contact is established, the impression is profound and the memory of the identified object remains relatively persistent.
Therefore, when the requirements for long-lasting memory are high, we should design a good logo image, better design, such as Apple's tooth printing apple, and be right to grasp all the elements of the logo-oriented promotion, in other cases, if you want to establish an image within a short period of time, you should design appropriate mascots to enhance communication and understanding with familiar concepts like apple.
In the era of modern spiritual fast food, longxun's red circle is also becoming fashionable. However, this kind of design can only be received by the website of the design company in China, but the logo of a cable TV's latest film and TV variety show shows a spiral lucky circle, I can sigh, but I have a lot of courage and lack of creativity.
2. special characters: they are ideographic symbols. In communication and communication activities, the names of the identified objects or their product names are repeatedly used in a unified text format. It has a clear and direct meaning and is closely related to the identified body. It is easy to understand and recognize. It also plays a role in explaining the concepts expressed, however, because of the similarity of the text itself, it is easy to blur the memory of the audience on the logo itself, thus weakening the long-lasting memory of the logo.
Therefore, the special text is generally used as a supplement to the special pattern. The selected font should be consistent with the overall style, and try to create a brand new distinctive style.
The complete logo design, especially the logo design with Chinese characteristics, under the international requirements
Generally, we should consider at least two Chinese and English forms. We should consider the proportion of Chinese and English characters, A combination of Chinese, English, Chinese, and English patterns. Some also need to consider traditional Chinese and other specific language versions. In addition, it also takes into account the appearance of the logo or text after the expanded application, this is necessary for the background and other production, is conducive to the pursuit of symbol expansion effect.
The Flash client empire and its predecessor, the bianchenglang logo, all have excellent designs, but they do not consider Chinese. However, the prodigal son seems to have been not convinced of the expressive power of Chinese characters, such as the lack of extremely small fonts and the lack of characteristic fonts, it may lead him to think about the design of Chinese. This is a pity for the logo of websites targeting domestic netizens.
3. merge text:
It is a kind of representation ideographic synthesis. It refers to the combination design of the text and the pattern, and has both the attributes of the text and the pattern, but all lead to a relatively weak influence of the relevant attributes. For different object orientations, A logo with a partial pattern or text may be significantly different in expression. For example, simply modify the printed font or convert the text into a decorative shape for everyone to guess. Its comprehensive functions are as follows:
A. The impression of the identified object can be directly understood by readers through text styles;
B. The words after the styling are easy to impress and remember;
Iv. Design of Network logo
The ancient royal emblem provides conditions for the audience to understand its identity, status, level, and other attributes through repeated identifiers, which can be designed to be extremely complex, however, modern people's demands for simplicity, clarity, smoothness, and instant impressions affect the logo design and are increasingly pursuing a unique and highly practical experience, companies and groups that have already had an impression on the user group, in order to strengthen the distinctive memory of the audience and continuous brand loyalty, enhance the recognition of existing ideas by designing patterns that are more unique and easier to understand. Some old companies are actively updating the logo, and Coca-Cola's logo has been easily drafted.
However, some groups that want to quickly recognize the audience will strengthen their direct needs for text expression and express them through the synthesis of text with obvious characteristics, and through a large number of times of modern media to strengthen and maintain easily blurred memory. For example, the logo format composed of Intel's e-word simple displacement.
In the design of the network logo, a large number of designs using synthetic text, such as Yahoo, Amazon
Text logos and almost all ISPs in China, which are restricted by the inch screen size of webpages and require logo
The size of the website should be as small as possible. On the other hand, because of the lack of participation of excellent image designers at the beginning of the construction of these websites, most of the decision makers are technical personnel, there is a kind of intuitive pursuit of straightforward, concise, and bright. The most important thing is that the characteristics of the network decide to only rely on a short and clear memory of the logo, through a large number of low-cost and repeated browsing, this will not only produce the part of the impression memory that requires images to be improved. Therefore, the pursuit of the Web logo for text synthesis has gradually become a fact specification of the Web logo.
With the intervention of managers, designers, and planners, more efficient logo design has also been well explored. In particular, some design websites have made many meaningful attempts to logo design. For example, to explore the 3D and dynamic representation of the logo based on the digital features of the website logo, the common practice is to protect the logo as a representative of the overall image, it is only suitable for dynamic changes without the overall defect deformation of the logo, that is, only proportional amplification, reduction, movement, etc., rather than rolling, tilt, and other changes, to ensure respect for the seriousness of the logo, and to make a 3D network logo for the existing logo, it has become a more and more common network logo production solution.
V. Network logo specifications
When designing the logo, it is of great practical significance to guide the overall construction of the website by standardizing the various conditions of the application. The minimum logo display size must be standardized, the appropriate background color system that may be used for Logo Design, anti-white, and clear logo display, for the logo to develop some specific conditions of color, auxiliary ribbons and other convenient applications in the production of banner and other occasions. In addition, the text and the image edge should be clear, and the word and the pattern should not overlap. In addition, you can also consider the vertical effect of the logo and the arrangement method when the background is used.
A network logo should not only consider the Display Effect on the designer's high-resolution screen, but also consider the effect required by the promotion activities when the overall development of the website reaches a high level, it can also give full play to the visual effect when applied to various media; at the same time, it should be used to give the majority of the audience a good impression and popular shape.
Therefore, we should consider the monochrome effect, anti-white effect, textile effect on the fabric, and paint effect on the car body of the logo on paper media such as fax, newspaper, and magazine, the metal effect and three-dimensional Wall Shape effect when the badge is created.
8848 the logo of the website ignores the reasonable combination of fonts and backgrounds, and turns the four-character circle into a background of 8, the identifiers that can be identified in the online color are confused when advertising in the newspaper. This design is far from the positioning of the market "\'_~~~~~~~
One of the simplest ways is to convert the logo into black and white, and correct and good expression of the logo meaning is qualified.
Bytes ---------------------------------------------------------------------------------------------------
Website file naming rules

· File naming principle: it is easier to understand with the least number of letters.
· The index file system uses the index.html file name (in lower case)
The index.html file is used as a "bridge page". It only serves as a jump page and a meta tab without any specific content. The main internal page is main.html.
· For English translation by menu name, use a single word as the name. For example:
About Us \ aboutus
Feedback \ feedback
Product \ Product
The names of all single English words must be in lowercase, and the names of all combined English words must start with the first letter;
All file names are connected by underscores (_).
· Image naming rules are based on English letters. The size principle is the same as above.
For example, the website logo image is logo.gif.
The name of the mouse sensor is "image name + _ + ON/OFF ".
For example: menu1_on.gif/menu1_off.gif

V. Naming rules for other files
1. js naming rules are named by functional English words.
For example, the JS File Name of the AD bar is ad. js.
2. All cgi files are suffixed with CGI.
The configuration files of all CGI programs are config. cgi.
Bytes ----------------------------------------------------------------------------------------------------
Website directory settings

Directory creation principle: Provides the clearest and simplest access structure at the minimum level.
Root directory.
The root directory refers to the storage directory of index files directed to by the DNS server.
The default FTP upload directory on the server is HTML.

Root directory file
Only index.html and main.html files and other necessary system files can be stored in the root directory.

Each language version is stored in a separate directory. The language of an existing version is set:
Simplified Chinese \ GB
Traditional Chinese \ big5
English \ en
Japanese \ JP
Each main function (main menu) creates an independent directory.
The images in the root directory stores public image directories, and private images in each directory are stored in their independent images directories.
Example: \ menu1 \ Images
\ Menu2 \ Images
All JS files are stored in the unified directory \ Script under the root directory.
All CSS files are stored in the style directory under the root directory.
All CGI programs are stored in the \ cgi_bin directory in the root directory.

(The above is just a standard. You don't have to stick to one things. You need to innovate and then innovate !)

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.