Before making a web page, let’s take a look at these so-called specifications

This article has compiled some so-called specifications for you to review before making a web page. I hope it will be helpful to everyone. This article has compiled some so-called specifications for you to review before making a web page . I hope it will be helpful to everyone.
01 File naming standards <br />File naming principles: use the fewest letters to achieve the most easily understood meaning.
General file and directory naming conventions:
Each directory should contain a default html file, the file name is uniformly index.htm
The file name should be a combination of lowercase English letters, numbers, and underscores, and should be translated into English as much as possible. For example: feedback (feedback), aboutus (about us)
Multiple files of the same type are named using English letters plus numbers, with letters and numbers separated by _. For example: news_01.htm. Note that the number of digits is proportional to the number of files, and any missing digits will be padded with 0. For example, there are 200 news items, and the 18th item is named news_018.htm
Image naming conventions:
The name is divided into two parts, the first and the last, separated by an underscore.
The header part indicates the general nature of this image. For example: We name rectangular images such as advertisements and decorative patterns placed at the top of the page: banner; we name iconic images: logo; we name small images with links that are not fixed on the page as button; we name images of link columns that appear continuously at a certain position on the page and have the same nature: menu; we name decorative photos: pic; we name images without links to represent titles: title, and so on.
The tail part is used to indicate the specific meaning of the picture and is expressed in English letters. For example: banner_sohu.gif banner_sina.gif menu_aboutus.gif menu_job.gif title_news.gif logo_police.gif logo_national.gif pic_people.jpg pic_hill.jpg.
For the images with onmouse effect, the two images are named by adding "_on" and "_off" to the end of the original file name.
Other file naming conventions
The naming principle of js is to use English words for the functions. For example: the js file name of the advertisement banner is: ad.js
All CGI files have the suffix cgi. The configuration file for all CGI programs is config.cgi
02 Directory structure specifications <br />Principles of directory establishment: provide the clearest and simplest access structure with the least levels.
The directory name consists of lowercase English letters and underscores. (Refer to naming conventions)
The root directory usually only stores index.htm and other necessary system files. Each major column has a corresponding independent directory. The images under the root directory is used to store public images used by all pages, and the images directory under the subdirectory stores private images used by the pages of this column. All JS, ASP, PHP and other scripts are stored in the scripts directory under the root directory. All CGI programs are stored in the cgi-bin directory under the root directory. All CSS files are stored in the style directory under the root directory. Each language version is stored in a separate directory. For example: Simplified Chinese gb
All flash, avi, ram, quicktime and other multimedia files are stored in the media directory under the root directory
03 Size specifications <br />Please adjust the size specifications according to your actual situation:
The page is designed with a standard resolution of 800*600 and a recommended size of 766*430px
In principle, the page length should not exceed 3 screens, and the width should not exceed 1 screen. Each standard page is A4 format, that is, 8.5X11 inches. 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 and 120*60 are also standard sizes for small icons. Each non-homepage static page including pictures does not exceed 60K bytes, and the full-size banner does not exceed 14K.

04 Home page code standards <br />The key to the home page code is in the head area. The head area refers to the content between <head> and </head> of the home page HTML code.
The logo and copyright note that must be added to the head area
Web page display character set example:
Simplified Chinese: <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
Traditional Chinese: <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=BIG5">
English: <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
Original creator information <META name="author" content="[email protected]">
Website Introduction<META NAME="DESCRIPTION" CONTENT="Fill in the introduction of your website">
Search keywords <META NAME="keywords" CONTENT="keyword 1,keyword 2,keyword 3,...">
CSS specification for web pages <LINK href="style/style.css" rel="stylesheet" type="text/css">
Page title <title>Here is your page title</title>
In the head area, you can choose to add a logo to set the expiration time of the web page. Once a web page expires, it must be retrieved from the server.
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
Prevent the browser from accessing page content from the local machine's cache.
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
Used to prevent others from calling your page in the frame.
<META HTTP-EQUIV="Window-target" CONTENT="_top">
Automatic jump.
<META HTTP-EQUIV="Refresh" CONTENT="5;URL=https://www.jb51.net">
5 finger time stays for 5 seconds.
Web search robot wizard. Used to tell the search robot which pages need to be indexed and which pages do not need to be indexed.
<META NAME="robots" CONTENT="none">
The parameters of CONTENT are all, none, index, noindex, follow, and nofollow. The default is all.
Favorites Icon
<link rel = "Shortcut Icon" href = "favicon.ico">
JS call specification All javascript scripts should be called externally as much as possible
<SCRIPT LANGUAGE="JavaScript" SRC="script/xxxxx.js"></SCRIPT>
CSS writing standards All CSS should be called externally as much as possible
<LINK href="style/style.css" rel="stylesheet" type="text/css"> When writing, redefine first, pseudo-class second, and customize last (among them, a:link a:visited a:hover a:actived should be written in order) to make it easier for yourself and others to read.
In order to ensure that the font size remains consistent on different browsers, it is recommended to define the font size using points pt and pixels px. pt generally uses 9pt and 11pt of Chinese Song font, and px generally uses 12px and 14.7px of Chinese Song font. These are optimized font sizes. When using boldface or Song font, it is generally more appropriate to use font sizes of 11pt and 14.7px.
CSS recommended template.
<style type="text/css">
<!—
p { text-indent: 2em; }
body { font-family: "宋体"; font-size: 9pt; color: #000000; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px}
table { font-family: "宋体"; font-size: 9pt; line-height: 20px; color: #000000}
a:link { font-size: 9pt; color: #0000FF; text-decoration: none}
a:visited { font-size: 9pt; color: #990099; text-decoration: none}
a:hover { font-size: 9pt; color: #FF9900; text-decoration: none}
a:active { font-size: 9pt; color: #FF9900; text-decoration: none}
a.1:link { font-size: 9pt; color: #3366cc; text-decoration: none}
a.1:visited { font-size: 9pt; color: #3366cc; text-decoration: none}
a.1:hover { font-size: 9pt; color: #FF9900; text-decoration: none}
a.1:active { font-size: 9pt; color: #FF9900; text-decoration: none}
.blue { font-family: "宋体"; font-size: 10.5pt; line-height: 20px; color: #0099FF; letter-spacing: 5em}
-->
</style>
In order to ensure browser compatibility, the body tag must set the page background <body bgcolor="#FFFFFF">
05 Image design standards <br />The overall CI image of the website includes the following elements: logo
The website must have an independent logo. The logo can be designed with the Chinese and English names of the website, or a special pattern can be used. The principle is simple and easy to remember.
The logo must be clearly displayed in black and white and in color. The name of the logo image is "logo_domain name.gif", for example: logo_sina.gif
Try to provide vector images of the logo. Try to use the logo's standard color on every page. The website should have its own standard color (main color).
In principle, there should be no more than two standard colors. If there are two, one should be the standard color and the other should be the standard auxiliary color. The standard color should be within the 216 web-safe colors. The exact RGB and CYMK values of the standard color must be provided. Please use the standard color as much as possible. Standard fonts. The website should define a standard font (referring to the font used in the logo and pictures).
In principle, two standard fonts are defined: one Chinese font and one English font (excluding text content fonts).
The name and font library of the standard font must be provided. Please use the standard font as much as possible.
06 Content Editing Standards <br />The content must comply with the provisions of China's "Measures for the Administration of Security Protection of International Networking of Computer Information Networks". No unit or individual may use international networking to produce, copy, consult and disseminate the following information:
(1) Inciting resistance to or undermining the implementation of the Constitution, laws, or administrative regulations;
(2) Inciting subversion of state power and overthrow of the socialist system;
(3) Inciting the splitting of the country or undermining national unity;
(4) Inciting ethnic hatred or discrimination, or undermining ethnic unity;
(5) Fabricating or distorting facts, spreading rumors, or disrupting social order;
(6) Propagating feudal superstition, obscenity, pornography, gambling, violence, murder, terror, or instigating crime;
(7) Openly insulting others or fabricating facts to slander others;
(8) Damaging the credibility of state organs;
(9) Other violations of the Constitution, laws and administrative regulations.
When reprinting, the original source must be found, and after contacting the original source, the title used should be short, eye-catching, novel and attractive.
Leave two spaces at the beginning of each paragraph in the text to keep consistent with the traditional format. Leave one space between paragraphs to make the article clearer and easier to read. Avoid typos, misspellings, and self-made characters. Traditional Chinese characters should not be mixed in the simplified version. The translated names should follow our country's standards. For example: singapore is translated as "Singapore" and cannot be translated as "星加坡".
Full-width numeric symbols (excluding punctuation) should be changed to half-width
07 New technology usage specifications <br />The principles for using new technologies are: browser compatibility, ensuring download speed, and taking care of the largest number of users.
Cookies are used to identify, track and support visitors. Through cookies, you can understand the user's access path, collect and store the user's preferences, but you must consider the situation where the user turns off cookies. If you must use cookies, you should provide a comprehensive solution.
Java is a cross-platform object-oriented programming language. Its main application on the Web is Java Applet. However, the download speed of Java Applet is slow, so use it with caution.
On the server side, it is best to turn on SSI parsing, but do not use too much SSI nesting. When SSI cannot be used, include Library can be used instead, but the effect is less satisfactory.
Flash is already a common technology and is recommended for use.
It is recommended to use XHTML standards when creating new web pages to facilitate future integration with XML.
XML series technologies can be used on the server side, but are not recommended for the client side unless otherwise required. It is not recommended to provide multimedia technologies on web pages that require downloading additional plug-ins. Cross-platform languages such as PHP, JSP, and Java are recommended. CGI and ASP technologies are not recommended.
08 Navigation Standards <br />Navigation should be simple and clear. It is recommended that there should be no more than 3 levels of links. The text used for navigation should be concise and the number of words should be limited to one line. For the homepage, the first-level pages of each column are linked to each other, and the first-level pages of each column and the second-level pages of the column are linked to each other. For more than three levels of pages, a navigation bar should be set at the top of the page to indicate the location. Highlight the most recently updated information and add the update time or New logo. Continuity pages should include previous page and next page buttons. For content that exceeds one screen, there should be a go top button at the bottom. For content that exceeds three screens, an outline should be set at the head and directly linked to the anchor point in the text.
09 Database Usage Specifications <br />All operations related to the database on the server can only be performed by server administrators.
When accessing the database in the program, use a unified user and a unified connection file to access the database.
In principle, only one library can be created for each column. The library name should be consistent with the English name of each column, and the library should contain several tables. For larger and more important columns, you can consider creating a separate database, and the database name should be consistent with the English name of the column.
The names of a series of database-related things, such as databases, tables, fields, indexes, and views, must all be named using English words related to the content. If a word is difficult to express, you can consider using multiple words connected by underscores (_) (no more than four words) to name them. (See Naming Conventions)
Databases and tables that are no longer in use should be deleted and must be backed up (including structure and content) before deletion.

<<: JavaScript Closures Explained

>>: Introduction to CSS BEM Naming Standard (Recommended)

Win10 DVWA download, installation and configuration graphic tutorial detailed explanation (novice learning penetration)

Before making a web page, let’s take a look at these so-called specifications

Win10 DVWA download, installation and configuration graphic tutorial detailed explanation (novice learning penetration)

js to achieve 3D carousel effect

What should I do if I want to cancel an incorrect MySQL command?

Mysql 5.6 "implicit conversion" causes index failure and inaccurate data

Analysis and solution of the reasons why MySQL scheduled tasks cannot be executed normally

Talking about Less and More in Web Design (Picture)

Implementation of Docker packaging image and configuration modification

An example of implementing a simple infinite loop scrolling animation in Vue

How to mount a disk in Linux

Detailed explanation of JS browser event model

Recommend

Build a Scala environment under Linux and write a simple Scala program

Getting Started Tutorial for Newbies ⑤: Website Registration is Very Easy, Quick Registration Tips

Vue implements upload component

Summary of methods to prevent users from submitting forms repeatedly

HTML code analysis of text conversion effects for left and right movement

Solution to Apache cross-domain resource access error

Installing MySQL 8.0.12 based on Windows

Summary of MySQL common functions

How to install centOS8 in VMware12 (tutorial on installing centos8 in vm virtual machine)

How to use geoip to restrict regions in nginx

JavaScript uses setTimeout to achieve countdown effect

Teach you how to use MySQL8 recursive method

MySQL master-slave configuration study notes

Win10 configuration tomcat environment variables tutorial diagram

How to solve the problem of not finding the password after decompressing the MySQL free installation version