Web page lesson plans, lesson plans for beginners_HTML/Xhtml_Web page production

Teaching Topics
Webpage
Applicable grades
Second grade in high school
Teaching hours
1class time
Textbook Analysis
Key points: the composition and working process of static web pages and dynamic web pages
Difficulty: the working process of dynamic web pages
Learning Objectives
Understand the basic concepts of web pages, homepages, websites and the relationship between them, understand the concepts of static web pages and dynamic web pages, understand the technology of static web pages and dynamic web pages, and be able to explain their working process
Required resources and environment
Digital Resources
1. Search engine (www.google.com, www.baidu.com)
2. Several demo web pages (static web pages and dynamic web pages)
General Resources
1. Chapter 5 of the textbook "Network Technology Applications" Section 1 ；Supporting CD
2. Teacher’s Book for Teaching Materials
3. 《Web Page》Learning Task List
Teaching Support Environment
Computer network classroom, multimedia network classroom software or LCD projector
Instructional Design

Question
Purpose
Key points/Difficulties/Key points
Teaching guidance question design
What is a website? What is a web page? What is a homepage?
Understand the meaning of websites, web pages, and homepages

What is the website made of?
Understand the various components of the website
Website logo, header area, hot recommendation area
What are the web pages we usually see on the Internet made up of? ?
Let students understand the composition code of static web pages——HTML
Understand the structure and basic tags of HTML language
How are static web pages displayed in the browser?
Master the working process of static web pages in the browser
The browser’s interpretation process of HTML code
What are those web pages with interactive operations made of?
Let students understand the composition of static web pages
Understand scripting languages
How are dynamic web pages displayed in the browser under user interaction?
Master the working process of dynamic web pages in the browser
Execution process of dynamic web pages
Teaching Process
1. New lesson introduction:
Every student who has been exposed to the Internet should have visited websites and seen web pages. The web pages that everyone sees generally have some fixed formats, such as titles, website logos, etc. As for the classification of web pages, they can generally be divided into two categories. One category does not change with the user's operations. One type is called a static web page, and the other type changes with the user's operations. This type of web page is called a dynamic web page.
Today I will discuss the issue of web pages.
2. Teaching content:
Search some typical websites through search engines and show them to students.
1. The concepts of website, webpage, homepage and the relationship between the three
The international Internet that people visit today is composed of websites, and websites are composed of specific web pages. The home page is equivalent to the start page of the website, which plays a role in guiding connections. , Generally speaking, users can access most of the web pages of the website through the home page.

Question: What is a website? What is a web page? What is a homepage?
Activity: The teacher explains the meaning of websites, web pages, homepages and the relationship between the three.

2. Web page structure
The page structure of a common website generally consists of page title, website logo (LOGO), header area, navigation bar, login area, search area, recommended hotspot area, and main content area, footer area, etc.

3. The concept of static web pages
Static web pages are web pages that are stored as files on the server and sent to customers in the same format.
Static web pages are files written in Hypertext Markup Language.

Question: What are the web pages we usually see on the Internet made up of? ?
Activity: The teacher explains the composition of static web pages and the characteristics of Hypertext Markup Language (HTML).
Exploration: Student operation, viewing the source files of the webpage when browsing a webpage.

4. How static web pages are displayed in the browser
Static web pages are files sent to clients in the same format from the server, but after this file reaches the browser, the browser needs to find the HTML code, and then display the specific HTML code in a specific form to form the web page that the user sees.

Question: How are static web pages displayed in the browser?
Activity: The teacher explains the browser’s interpretation process and effect of hypertext markup language.

5, the concept of dynamic web pages
Dynamic web pages refer to web pages automatically created by the computer system during user browsing. They are usually used to display real-time information or display specific content based on user interaction.
Features of dynamic web pages: interactivity, automatic updating, and changing according to place, time and person
Common forms of dynamic web pages: counters, chat rooms, discussion boards, BBS, alumni records, etc. There are two common situations that constitute dynamic web pages: dynamic web pages composed of pure client mode and dynamic web pages composed of client-server mode

Question: What are the web pages with interactive operations made of?
Activity: The teacher explains the two common situations of forming dynamic web pages, dynamic web pages composed of pure client methods and browsers /The respective composition methods and characteristics of dynamic web pages composed of server mode.
Communication: How to accurately adjust colors using the system palette

6, The principle of dynamic web page display
Dynamic web pages composed of pure client methods: This method does not require interaction with the server, and is usually embedded directly in the web page in the form of JAVAsmall programs and scripting languages . Its dynamic performance is as follows: users operate the display content or form of web pages through various technologies supported by technologies such as javascript, javaapplet etc. .

Reflection after class

Teaching Plan Designer

Unit/Address/Postcode


Email

Contact number

"Web" Learning Task Sheet

1. Web page related concepts

Students browse the web, view a website with a clear, reasonable and distinctive page layout, and complete the following operations.

Website name: Home page URL: Page title:

2.

Static web page and dynamic web page

1.

What language is the static web page written in?
?__________________________________________ 2, What are the characteristics of dynamic web pages?? ________________________________________

3.

What are the common dynamic web page technologies
? _____________________________________________
3. Experiment:Experience the dynamic web page effect on the client
Experimental requirements: (1) Through the following short examples of dynamic web pages, learn about some simple methods to achieve dynamic effects on client-side web pages.
(2) By modifying the properties of certain objects in the program, master the simple method of modifying the dynamic effects of web pages.
(3) Master an easy way to create dynamic web pages through the experience activity of inserting web page special effects code into web page code.
Example of experimental steps:
1. Enter the following source code of a dynamic web page, observe and experience the dynamic effect of the web page generated by this code segment on the browser.