Home > Developer > Web Develop
1. Primary improvement
Many designers and developers don't know what Doctype,doctype is for.
DOCTYPE is a shorthand for document type. It is used primarily to illustrate what version of XHTML or HTML you are using.
The browser interprets the page code according to the DTD (document type definition) you doctype define.
So, if you don't pay attention to setting the wrong doctype, the result will be a surprise to you.
XHTML1.0 offers three types of doctype to choose from:
(1) Transition type (transitional)
(2) strict type (Strict)
(3) frame type (Frameset)
For our primary improvement, it is possible to choose a transitional type of declaration.
It can still be compatible with your form layout, performance logo, etc., so that you do not feel too much change, difficult to master.
TIP: If you're too lazy to type in the transition code above, you can access the Http://www.macromedia. com/ website 's homepage, then view the source code and paste the same code in the head area.
Add the following code directly after the DOCTYPE declaration:
A namespace is a detailed Dtd,namespace declaration that collects element types and attribute names, allowing you to identify your namespace by pointing to an online address. Just enter the code so you can.
All XHTML documents must declare the encoding language in which they are used in order to be interpreted correctly by the browser and through identity checks. The code is as follows:
The coding language stated here is the simplified Chinese GB2312, which you can define as BIG5 if you need to make traditional content.
XML is sensitive to capitalization, so XHTML is also case-insensitive. All XHTML elements and attributes must have a lowercase name.
Otherwise, your document will be verified as invalid. For example, the following code is not correct:
The correct wording is:
The same,<b> changed to <b> and so on. This step is easy to convert.
Adds an alt attribute to all pictures. The ALT attribute specifies that alternate text is displayed when the picture cannot be displayed, which is not necessary for normal users , but is essential for plain text browsers and users who use screen readers.
Only the Alt attribute is added, the code will be passed by the correctness check. Note that we want to add a meaningful alt attribute, which is meaningless as follows:
The correct wording:
In HTML, you don't need to quote attribute values, but in XHTML they must be quoted.
Example: height= "100", but not height=100.
In XHTML, every open label must be closed. Just like this:
This rule avoids the clutter and hassle of HTML.
For example, if you do not close the image tag, there may be problems with CSS display in some browsers. This way you can make sure that the page is displayed just as you designed it.
It is necessary to note that empty labels are also closed, using a forward slash "/" at the end of the label to close themselves. For example:
After the above seven rules are processed, the page basically conforms to the requirements of XHTML1.0. But we also need to check if it really meets the standard.
We can provide free calibration service (http://validator.w3.org/). Modify the errors once they are found.
In the list of resources that follow, we also provide additional validation services and URLs that guide validation, which can be supplemented by the Web-site verification.
When you finally pass the XHTML validation, congratulations have taken a big step toward website standards. It's not that hard to imagine!
Represent >,< with solid characters, space,&, etc.
The following end should be added '; ' Semicolon
2. Intermediate improvement
Then our improvement is mainly in the separation of structure and performance, this step is not as easy as the first step, we need the change of concept, and the study and application of CSS2 technology .
But it takes some time to learn any new knowledge, doesn't it? The trick is to learn while doing.
If you've been using a tabular layout, you don't have to use CSS at all, and you don't have to say goodbye to table layouts, you can use style sheets instead of font tags first.
The more you learn, the more you can do. OK, let's see what we need to do:
We have developed a habit of writing logos when we want the font to be large and use
We always want to
In fact,
We cannot force the performance of structural elements , we should use CSS to determine the appearance of those elements. For example, we can make
The original default Level 6 title can look the same size:
Many people may never know that HTML and XHTML elements are designed to express structures.
Many of us are accustomed to using elements to control performance, not structure. For example, a list of contents might use the following identity:
If we take an unordered list instead it would be better:
You might say, "but <li> shows a dot, I don't want to use dots." In fact, CSS does not have a set element to look like, you can completely turn off the dots with CSS.
Give a table or form a unique, structured tag, such as
Next, when writing a stylesheet, you can create a "menu" selector and associate a CSS rule that tells the table cell, text label, and all other elements how to display it.
In this way, you do not need to attach to each%lt;td> label some of the extra, bandwidth-consuming performance layers, height, width, alignment, and background color, and so on.
The
requires only one attached tag (the ID tag of the "menu"), and you can perform a special presentation layer for clean, compact code tags within a detached stylesheet.
Intermediate Improvements We first listed the main three points, but it contains a lot of content and knowledge points, we need to gradually learn and master, until the end of the implementation of the full use of CSS and no table to implement the layout.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
