What three parts does the web front-end include?

The three parts of the web front-end: 1. The structural layer is the skeleton of the web page, created by HTML or XHTML markup language, used to build the structure of the document and define the content of the web page, such as title, text, images, etc. ; 2. The presentation layer is the style of the web page, created by CSS, and is used to set the presentation effect of the document, such as color, font, background, etc.; 3. The behavior layer is the behavior of the web page, created by the JavaScript language, and can be updated in real time The content in the web page, such as getting data from the server and updating it to the web page, can make the web page more vivid.

The operating environment of this tutorial: Windows 7 system, Dell G3 computer.

Three parts of the web front-end

W3C refers to the World Wide Web Consortium (World Wide Web Consortium), founded in October 1994 moon. The emergence of W3C is to customize the standards for web development, so that the same web page can have the same effect in different browsers, so our custom-written web pages need to follow W3C specifications.

According to W3C standards, a web page is mainly composed of three parts: structure layer (HTNL), presentation layer (CSS) and behavior layer (JavaScript).

Structural layer

The structural layer is the skeleton of the page, created by HTML or XHTML markup language, and used to build the structure of the document.

HTML is used to define the content of a web page, such as title, text, images, etc.;

Presentation layer

The presentation layer is the style of the page, consisting of CSS (Cascading Style Sheets) is responsible for the creation and is used to set the presentation effect of the document.

CSS is used to control the appearance of the web page, such as color, font, background, etc.;

Behavior layer

The behavior layer is the behavior of the page, consisting of The JavaScript language is created to implement document behavior.

JavaScript is used to update the content in the web page in real time, such as obtaining data from the server and updating it to the web page, modifying the style of some tags or the content thereof, etc., which can make the web page more vivid.

To put it simply, JavaScript, HTML and CSS together constitute the web page we see

• HTML is used to define the content of the web page. For example, title, text, images, etc.;

• CSS is used to control the appearance of the web page, such as color, font, background, etc.;

• JavaScript is used To update the content in the web page in real time, such as obtaining data from the server and updating it to the web page, modifying the style of some tags or the content thereof, etc., to make the web page more vivid.

HTML is HyperText Markup Language (HyperText Markup Language), which is a standard markup language used to create web pages. HTML is responsible for the structure of the three components of a web page. HTML uses tags to identify different components of a web page. The so-called hypertext refers to hyperlinks, which allow us to jump from one page to another.

CSS refers to Cascading Style Sheets. Styles define how to display HTML elements and are used to control the appearance of web pages. CSS is responsible for the performance of the three components of a web page, and styles are usually saved in external .css files. We only need to edit a simple CSS document to change the layout and appearance of all pages.

JavaScript is a scripting language ("JS" for short), a lightweight programming language used to control the behavior of web pages. JavaScript is responsible for the behavior of the three components of a web page. It can be inserted into the programming code of the HTML page. After JavaScript is inserted into the HTML page, it can be executed by all modern browsers.

How to learn HTML, CSS, JavaScript

1. Systematic learning of html and css

Html and css are relatively simple, but they still require systematic learning.

2. Deep understanding of Javascript

An excellent front-end programmer must deeply understand the principles, mechanisms, origins, and object-based nature of Javascript. It is recommended to read more open source projects, after all, practice brings true knowledge.

Web front-end development technology follows the process from easy to difficult, which requires Web front-end development technicians to be proficient in learning basic Web development technology, beautification of website performance, SEO and basic server-side On the other hand, there are specific requirements for developers, such as being able to use various tools skillfully and sensitively to assist development.

At the same time, it is necessary to master relevant basic knowledge theories, representative of which include: code maintainability, hierarchical semantic templates, ease of use of components, etc. Front-end development technology covers Javascript, Traditional technologies such as CSS, Adobe RIA, Google Gears, relatively conceptual interactive design, and visual design with strong artistic color, etc.

Using the Internet as an analogy, everything that passes from the browser to the client computer is collectively called front-end technology. Relatively speaking. What is stored on the server side is collectively called back-end technology. Front-end technologies include: JavaScript, ActionScript, CSS, xHTML and other "traditional" technologies, Adobe AIR, Google Gears, as well as conceptual interactive design and artistic visual design. Etc. There are many positions in Web front-end development. First, take the three positions of "front-end development engineer", "senior front-end development engineer" and "front-end architect" as examples to analyze their respective responsibilities.

Front-end development engineer (or "webpage production", "about webpage production engineer", "front-end production engineer", "website reconstruction engineer"), the main responsibility of such a position is to interact with Designers and visual designers work together to innovate and use HTML and CSS to complete the production of website pages based on the design drawings. On this basis, it is necessary to perform basic maintenance on the completed page and optimize the front-end performance of the website accordingly.

In addition, a qualified front-end development engineer should have his own set of cognitions in terms of aesthetics and his own set of ideas in art operations. Only in this way can visual collaboration be well achieved. Having a certain aesthetic ability and basic art operation ability are indispensable abilities for engineers. Front-end development technology covers a wide range of areas, such as software engineering and other fields. When conducting actual analysis of front-end development technology, we can use the Internet to understand and analyze front-end development technology. That is, as long as it follows the computer from the browser to the user-end design, this technology can be collectively referred to as front-end technology. The main content of back-end technology is Technology required to be stored on the server side.

On December 5, 2015, the information given in the "Guangzhou Internet Industry Talent Shortage Index (TSI) Report" showed that front-end development engineers have become the most in-demand positions in the Guangzhou Internet industry.

Front-end development technology covers a wide range of areas, such as software engineering and other fields. When conducting actual analysis of front-end development technology, we can use the Internet to understand and analyze front-end development technology. That is, as long as it follows the computer from the browser to the user-end design, this technology can be collectively referred to as front-end technology. The main content of back-end technology is Technology required to be stored on the server side. On December 5, 2015, information provided in the "Guangzhou Internet Industry Talent Shortage Index (TSI) Report" showed that front-end development engineers have become the most in-demand positions in the Guangzhou Internet industry.

The task of Web front-end development further focuses on software development, analyzing the usability of the website, and optimizing problematic areas in the front-end design of the website based on information fed back by users. In this process, through the trinity of Javascript, flashactionscript3.0. and HTML CSS technology, the page can help users bring a better experience after optimization. For example, the picture browsing function in QQ space used to be that pictures were only browsed after taking pictures, and were also viewed in categories on the web page. Now, browsing pictures directly on the web page is one of the functions developed by front-end development engineers. In addition, there are various information websites that can display slide effects, ajax technology, etc.

When starting the Web front-end, the front-end architecture design and underlying data transmission will be used. Therefore, Web front-end development requires better basic programming skills than the former, and it also requires understanding of the website. Understand the background language. At today's stage, front-end development technology is developing very rapidly, which puts forward more stringent requirements for practitioners. It is necessary to master new front-end development technologies while clarifying the future direction of the front-end world. Otherwise, it will be difficult to combine the advantages of the technology with Functions are fully realized.

Xunfajia of front-end technology is a condensation of the development and changes that come with the Internet itself. In its initial stage, HTML technology is only used to simply display pages. If you want to implement maintenance and update functions, you will directly face big problems. The article gradually analyzes and grasps the future development route of the Internet from Web 1.0, Web 2.0, Web 3.0 to Web 4.0. Web1.0 is characterized by basic editing. After the website editor performs editing and processing operations, the website provides users with corresponding content, and users can exercise their right to browse. This process of transition from website to user is a one-way behavior. In the Web 1.0 era, the three major portals Sina, Sohu, and NetEase played the role of the three giants.

Web 2.0, a level higher than the previous stage. The interaction between the website and its users has been strengthened. The content in the website can come from what users provide to the website. In this way, users can better participate in the construction of multiple functions of the website. The one-way communication between the website and users has changed. Through two-way communication, the participation relationship between users can be realized. Unlike Web 1.0, the interactivity of Web 2.0 is the key to its potential. In the Web 2.0 era, Blog China, Yiyou Dating, and Liaison have become outstanding representatives. Users in this type of website have their own data repository, and it is completely based on the Web, and the browser can implement all functions.

Web3.0, the concept of change was proposed by Microsoft, and has successfully applied for a number of patents. On various Web 3.0 websites, information can be exchanged and interacted directly. At the same time, third-party information platforms can also integrate and classify the rich information provided by different websites. Using the Web 3.0 system, users can also have their own data on the Internet. What is more advanced than Web 2.0 is that users can use these data on different websites. The realization of functions is completely based on the Web, and various operations that can only be performed by complex system programs can be completed by simply using a browser.

Web 4.0, similar to a multi-person dinner party, Web 4.0 will connect everyone together and integrate the resources owned by everyone. Everyone can choose from the resource owner according to their own needs. The platform plays a connecting role. This platform is an agreement rather than a website. Every user needs to abide by this agreement. The website is a user who surrounds the agreement. If each user has his own website and revolves around Next to the protocol, mankind can truly enter the Internet era, which must be an era composed of many websites.

When the Web standards were first formulated, front-end development had already begun to be researched, but the progress was very slow. Only after Javascript gradually became a mature language for Web front-end development did front-end development make greater progress. With the application of Web 4.0 and the emergence of products such as Weibo, blogs, web games, SNS, and video websites, people have put forward higher requirements for web pages. Therefore, designers need to consider more issues during the development process. Currently, the Javascript language is very important in web development, and the current Web front-end development marked by Javascript is developing very rapidly.

Currently, Web front-end development has become a hot research topic. In order to meet the usability requirements of different sites and improve the user experience of products, various "user experience" teams have developed rapidly, and the positions in the development team have been divided. It is also more clear that interaction designers, user experience analysts, front-end development engineers, web designers, etc. mainly design and develop strong front-end applications.

For Web front-end developers, they need to master the following skills and technologies: familiarity with W3C standards, a deep understanding of Web semantics, separation of performance and data, etc.; understanding of back-end development (C/C/PHP/Java, etc.), Algorithms, data structures, etc.; familiar with page architecture and layout, proficient in web page production technologies such as CSS, HTML/XHTML, and web development technologies such as Ajax and Javascript.

With the development of technology, front-end development technology will continue to improve. HTML5, CSS 4.0 and other technologies will become the mainstream technology of front-end development. Even if HTML5 becomes a reality, there will be more front-end development As technology emerges, you must always pay attention to the latest technology in front-end development.

At present, front-end development technology has just matured. In the next few years, it is believed that the demand for its talents will further increase. But when any demand is saturated, the saturation of talent demand is also a sign of true maturity of front-end development. In the future, front-end developers will have a broader space for development, greater challenges, and a higher stage for people to show their strength. At the same time, scientific researchers must continue to improve their own capabilities and develop more products that meet user needs.

(Learning video sharing: web front-end)

The above is the detailed content of What three parts does the web front-end include?. For more information, please follow other related articles on the PHP Chinese website!