Teaching Design and Practice of "Competition Teaching Integration with Competition Promoting Teaching"—Take the Teaching of Website Design and Production as an Example

: In order to promote the growth of double-qualified teachers, promote the construction of high-level and structured teaching innovation and unity, and constantly improve teachers' ability to practice teacher ethics, professional teaching ability, comprehensive education ability and self-development ability, Shanxi Shuozhou


Introduction
The project adheres to the fundamental task of cultivating morality and educating people, deepens the "three education reforms" of teachers, textbooks and teaching methods, implements the strategy of education digitization, promotes the mixed teaching of online and offline, and cultivates talents with both virtue and technology, both virtue and art, and all-round development of moral, intellectual, physical, American and labor.Based on the concept of "vocational education empowering, Caring and assisting agriculture", the project made a local specialty website, established a project curriculum system development team, completed the selection of enterprise experts through research, and reconstructed the catalogue and extracted work tasks under the joint consultation of professional teachers on campus and enterprise mentors off campus [1].The curriculum is based on national vocational standards, guided by project tasks, and centered on comprehensive vocational ability training, so as to realize the integration of theoretical teaching and skill training, and integration of ability training and enterprise practice [2].
Themed website production and scenario-style teaching based on tasks are adopted, and the teaching process is guided by both teachers in and out of school, gradually deepening the integration of teaching and production and cooperation between schools and enterprises.Through the application of information technology, such as school-based loose-leaf textbooks, three-dimensional textbooks, teaching resource management platform, classroom control and evaluation software, and the rectification and application of flipped classroom and modular teaching mode, students can master the necessary knowledge and skills for project courses, and train students' ability of self-learning control, group discussion and time planning.We should build a comprehensive evaluation system of five achievements with teachers, students, enterprises and families as the main body [3].

Content analysis
"Web Design and Production" course is a basic course of computer application specialty, but also one of the basic tools of Web front-end development of computer website.Based on school-enterprise cooperation, the participating courses will formulate themed practical training tasks.With application ability as the core and project and task as the clue, the courses will lead students to learn knowledge, accumulate skills and match vocational post standards in the process of completing project tasks through setting up scenarios, task analysis, guiding demonstration, skill practice, difficulty analysis, skill extension and theme practical training and other links.In the process of transferring knowledge and skills to actual business situations, students not only consolidate basic professional knowledge, but also acquire the ability to calmly face different application scenarios in the future.This project also prepares students for the 1+X Certificate web Front-end Development.
In this project, the teaching structure is designed and arranged according to the actual process of making web pages.The project includes project planning (including demand analysis, project background, project requirements, web layout, web rendering, site and home page creation) and project implementation (including template and library creation, CSS style setting, DIV+CSS layout, results verification and project release).The task decomposition not only takes into account the actual working process of webpage making, but also takes into account the logic of knowledge from simple to deep, from single page making to multiple pages making, from static page making to dynamic page making, so as to ensure that the project theme is prominent, independent and complete, the difficulty is appropriate, and it is easy for students to understand and accept.

Knowledge and skill base
Students have mastered the basic knowledge of web design and production, such as using tables to create simple web frames, insert (graphics, tables, hyperlinks, multimedia), use labels and behaviors, and understand the basic knowledge of Web front-end development.

Cognitive and practical skills
Students can use Photoshop to beautify and edit webpage pictures flexibly, have a certain understanding of Dreamweaver website design process, color matching, website structure, and can draw website sketches by hand.The initial establishment of aesthetic consciousness, innovation consciousness, can be prepared to perceive and express the visual feelings of images.

Learning characteristics
Students have strong independent thinking, strong hands-on ability and love communication and collaboration.Their disadvantages are poor knowledge base, insufficient attention, weak self-learning ability and weak concentration.It is suitable to adopt diversified and flexible teaching organization methods, and adopt interesting and practical teaching methods.

Teaching objectives and teaching difficulties
Under the overall design of web design and production centering on post, class, competition and certificate, the project extracts the specific training objectives of "8+8+4" from three aspects: knowledge objectives, ability objectives and quality objectives, as shown in Fig 1.
Key teaching points: Master CSS text, background, border, layout style Settings; Familiar with templates and library projects; Master the use of HTML to build the structure of each area and complete the style layout; Understand and master the message board page setup and JS plug-in application.
Difficult teaching points: Memory and application of CSS attributes, understanding and application of DIV+CSS, understanding of box model, application of JS plug-in.

Teaching strategies
This project adopts the teaching organization methods of project teaching, case teaching, situational teaching, classroom teaching and practical teaching, and widely uses the teaching methods such as heuristic, inquiry, discussion and participation, which are integrated into the new teaching mode of flipped classroom.When determining teaching activities and how they will be arranged, involve corporate mentors and students as much as possible in the planning.
1) Teachers should timely communicate with enterprise staff when preparing teaching plans, teaching materials, teaching courseware and other teaching materials before class; 2) Proofread the accuracy of ideological and political content with moral education teachers in advance in the course penetration of ideological and political teaching; 3) Students watch and analyse excellent examples of past advertising agencies, which have a practical function of learning and increase motivation; 4) In the process of website production, teachers should organize students' works for many times, evaluate them together with enterprise mentors, and put forward suggestions for modification to promote the implementation of school-enterprise cooperation; 5) The project-driven teaching method is adopted to transform knowledge from shallow to deep, from books to software to complete websites, and from knowledge to skills to practice; 6) The participation of various information resources expands the channels of teachers' lesson preparation resources, improves the teaching evaluation system, enrichis students' classes, and enables students to realize the flexible learning mode of online self-study and offline interactive learning.

Application of information technology
This project makes comprehensive use of school-based loose-leaf teaching materials, threedimensional teaching materials, micro-vision and animation for the course, teaching resource management platform, classroom control and evaluation system, intelligent teaching assistant of cloud class.Details are as follows: 1) School-based three-dimensional teaching materials The key and difficult points in the school-based textbooks adopt the form of two-dimensional code supporting micro-vision or animation, which provides students with self-study before class or consolidation and review of knowledge points after class.It is convenient for students to use their spare time to learn, expand and improve their professional quality.
2) Microvision and animation for the course Micro vision adopts professional teachers to record the important and difficult points in advance, so as to facilitate students to watch repeatedly; Animation is a two-dimensional FLASH animation of difficult points and typical cases in the textbook, which is intuitive, vivid and interesting.
3) Teaching resource management platform The teaching resource management platform built by the school includes ppt courseware, teaching plans, test questions, cases, online courses, teaching materials, animation and other contents, so as to facilitate students to find the teaching resources they need.
4) Classroom control and evaluation system The classroom control and evaluation system includes such functions as attendance, class control, group competition, class evaluation, class scoring, personal summary, etc., which is convenient for teachers to record their scores and form a more comprehensive evaluation. [

Teaching evaluation
Diagnostic evaluation: In the early stage of project teaching, according to the characteristics of students, teachers make suitable teaching plans to carry forward the advantages, supplement the shortcomings, enhance the students' learning enthusiasm, and promote the smooth realization of flipped classroom teaching model; Process evaluation: This course integrates ideology and politics, adopts information teaching methods, focuses on the cultivation of innovative thinking and cooperation between the university and enterprise, with good teaching effect.In the process of operation, group discussion and mutual learning promoted the unity of students.In the process of demonstration and expression, it not only tested the learning effect of students, but also exercised the expression and communication ability required by vocational ability.Teachers have completed the comprehensive evaluation of students from multiple perspectives through the five performance evaluation (attendance score 10%, task score 20%, project score 30%, quality score 20%, other scores 20%).
Summative evaluation: The final summative evaluation is generated by students' knowledge and skills assessment, scores of extended tasks and scores of project completion works.
Based on the characteristics of computer application major with strong practice, strong operation and fast development, a developmental multiple evaluation system is established to promote the overall improvement of students' literacy.

Overall teaching implementation process
The course implements the project content in the form of "project-task-activity", with a total of 16 periods, including project planning and project implementation (including project evaluation).The class is divided into preparation before class, implementation in class and summary after class.The implementation stage in class is further divided into five links, namely guidance, knowledge, technology, expansion and assessment, which respectively correspond to situation introduction, knowledge preparation, skill improvement, project expansion and evaluation summary.

Specific teaching implementation process
Taking the project planning of Teaching Plan 1 as an example, the implementation stage includes four links: pre-class preparation, class internalization, class evaluation and summary improvement.The class is divided into five parts: guidance, knowledge, technology, development and assessment.Guidance refers to introduction, including knowledge point review and situation introduction.Knowledge refers to knowledge learning; Technique refers to the practice of skills; Grade is class evaluation and reflection summary.
In the pre-class preparation, the teacher extracts the teaching content, sets the task modules and time allocation, uploads and arranges the teaching resources on the teaching resource management platform, uses the intelligent teaching assistant of "cloud class" to complete the pre-class questionnaire, and then sends it to the students.The students carefully read the textbook, watch the micro-class video, answer the questionnaire or test questions, and summarize and refine the questions.
In the classroom internalization link, the introduction part is the interpretation of questionnaire survey, the introduction of local specialties, the interpretation of project requirements; Knowledge part is the page layout planning and page layout sketch drawing, skills part is the page layout sketch using photoshop to draw renderings, and then the layout design page renderings; The extension exercise completed the creation of the project site, folder and home page; In the evaluation and summary part, teachers use the classroom control and evaluation system to ask questions, check attendance and score, etc., and use the intelligent teaching assistant of "cloud class" to guide students to upload homework in class, so as to achieve effective control of classroom behaviors.Through group mutual evaluation, inter-group evaluation and teacher evaluation, teachers and students can timely understand the degree of knowledge mastery, and summarize and reflect on the content of this section.
The way to break through the heavy and difficult teaching is to transform the theoretical knowledge into practice and decompose the practice according to the degree of difficulty.For example, when explaining the web layout diagram, it takes three steps.The first step is to analyze the layout diagram, the second step is to draw the layout diagram by hand, and the third step is to use photoshop to make the effect diagram.The layout diagram is completed smoothly from shallow to deep, from the idea to the sketch and then to the effect display diagram.
The integration of ideology and politics is divided into two parts.The first part is the project interpretation, which analyzes the connotation of the website project of "Vocational Education Empowering, Caring and Assisting Agriculture" local specialty products, in order to promote regional economic development.The second part is the operation link, emphasizing the craftsman spirit of being meticulous, rigorous and conscientious, and pursuing the ultimate.
After class, teachers assign homework and send students' works to enterprise tutors, communicate and give guidance, and reflect on and rectify the teaching content of this class.

Students' learning effect
Smooth school-enterprise cooperation mode and improve students' vocational ability and quality.Through the "double guidance" of professional teachers and enterprise mentors, students learn about the new trends, new technologies and new applications of the industry through the enterprise practice, which makes the content of professional courses not disjointed from the production practice and improves the students' vocational ability.
Build a harmonious relationship between teachers and students and promote the cultivation of comprehensive quality of character.Through a large number of group activities, teacher-student interaction and enterprise practice, the teacher-student relationship is more harmonious, the enthusiasm of learning is enhanced, and the professional knowledge, skills, professional quality and personal character are also comprehensively improved.
Improve students' active learning time, classroom satisfaction and homework completion rate.Adopting online and offline synchronous learning, the students' active learning time has increased significantly, 80% of the students' learning time has increased by about 20 minutes a day; The combination of classroom, computer room and enterprise has greatly improved students' enthusiasm for learning.The satisfaction rate of students to the classroom has increased from 80% to 100%, and the homework completion rate has increased from 85% to 100%.The quality of students' works has been greatly improved, and the rate of excellence and the overall rate of reaching the standard have been significantly improved.

Teaching innovation
The project title is "Vocational Education to empower, Love to help Agriculture" local specialty website design and production, centering on the ideological and political theme -consolidating the achievements of poverty alleviation, helping rural revitalization, shaping students' sense of social responsibility and mission; Relying on the digital campus platform, innovative application of "cloud class", equipped with intelligent teaching assistants, construction of intelligent and materialized teaching support links, promote the construction of online learning space, extensive application of online and offline mixed teaching, expand education and teaching space, promote independent learning, ubiquitous learning, personalized fragmented learning; It also integrates ideological and political education with professional education, ensures that students understand the connotation of ideological and political humanism in the process of learning professional knowledge, strengthens the leadership of the curriculum and the characteristics of the times, and fosters technologically qualified personnel in the new era.The core of cultivating lifelong learning ability is to stimulate the driving force.The application in daily teaching and after-class is to teach students according to their aptitude without limits, long board and short board, and instant feedback mechanism.The following methods are summarised, information testing methods, independent learning methods, creative criticism methods, cooperative inquiry methods, and practical methods (including knowledge tree construction, systematic learning methods, induction and analogy methods, reflection and summary methods, etc.)

Reflection and improvement
Website production courses need to further improve the quality of optimization, the development and update of school-based textbooks should take full account of the enterprise website new functions, new modules and new technology needs, at the same time Dreamweaver is the basic course of website production, teachers should be able to learn students to provide deeper guidance, Aesthetic education and innovative teaching should be added in the teaching process to improve students' website design aesthetic feeling and creativity.
Cultivation method of dual-subject education of schools and enterprises should be carefully and perfected.When developing and updating school-based teaching materials, enterprises' demands for new website functions, new special effects and new technologies should be fully taken into account, and professional classrooms should be connected with job requirements, and abilities should be integrated into job requirements.

Conclusion
The teaching method of "integration of competition and teaching, promoting teaching by competition" can not only better stimulate students' interest in learning this profession, but also let students fully understand the mastery of knowledge in practice.In the teaching design, let the students in the competition process fully understand the importance of the spirit of creativity, fully explore the innovative thinking, carry forward the spirit of teamwork.At the same time better promote the good development of teacher-student relationship.

Figure 1 :
Figure 1: Specific teaching and training objectives "8+8+4" map Including check-in, group program, evaluation program, class notification, etc., to help teachers enrich teaching activities and enhance students' learning interest and enthusiasm.
Cloud class] Intelligent teaching assistant functions include cloud textbook, online class, skill