Html in Web design and Development.pptxt.pptx

Sabian secondary school
Web-Design
Java-script

Introduction to markup language
•Markup languages refers to a collection of codes and instructions that are
utilized to annotate and format text within a document.
•These languages enable the addition of structure and meaning to content,
facilitating its interpretation and presentation across different platforms and
devices.
•A markup language is a set of rules that defines how the layout and
presentation of text and images should appear in a digital document.
2

Types of markup languages
Markup languages can be classified into various categories based on their purpose and
functionality. These categories include:
Presentation Markup Languages: These markup languages are primarily used to define
the visual presentation of a document or webpage. Examples of presentation markup
languages include HTML and CSS
Data Markup Languages: Data markup languages are designed to structure and
organize data within a document or database. XML (eXtensible Markup Language)
is a widely used data markup language that allows for the representation and exchange of
structured data.
Mathematical Markup Languages: These markup languages are specifically designed
for representing mathematical equations and formulas. MathML (Mathematical Markup
Language)
Document Markup Languages: Document markup languages are used to structure and
annotate textual content within a document. Examples of document markup languages
include SGML (Standard Generalized Markup Language) and LaTeX. 3

Introduction to HTML
• HTML stands for HyperText Markup Language. It is used to design web
pages using a markup language and creates a complete website structure of
web pages.
• HTML is a combination of Hypertext and Markup language.
• Hypertext defines the link between web pages.
• A markup language is used to define the text document within the tag
which defines the structure of web pages.The language uses tags to define
what manipulation has to be done on the text.
• HTML is the basic language for web content creation. It is used to create a
structure or blueprint of the web documents. It uses various tags to define
the different elements on a page, such as headings, paragraphs, and links.
•
4

•HTML 1.0 (1993):- The first version of HTML, HTML 1.0, was released in
1993. It laid down the initial foundations for building web pages.
•HTML 2.0 (1995):-HTML 2.0 was officially published in 1995. It expanded
and introduced new elements and features.
•HTML 3.2 (1997):-HTML 3.2 brought more enhancements, including support
for tables, forms, and image maps.
•HTML 4.01 (1999):-HTML 4.01 was a major version released in late 1999. It
introduced features like frames, style sheets, and improved form controls.
•HTML5 (2008):-HTML5, the most recent and robust version, emerged in
2008. It revolutionized web development by introducing new semantic
elements, multimedia support (such as <video> and <audio>), and the
powerful <canvas> element for graphics and animations. Additionally,
HTML5 works seamlessly with JavaScript and CSS, making it the go-to 5
HTML VERSIONS

The characteristics of HTML are as follows:
• HTML is not a programming language. It's a markup language.
• HTML is a widely used language on the web.
• HTML is used to create web pages and web applications. We can create a
static website by HTML only.
• HTML elements tell the browser how to display the content
• HTML supports a wide range of media types, including text, images,
audio, and video, which makes web pages more engaging and interactive
• HTML is a flexible language that can be used with other technologies, such
as CSS and JavaScript, to add additional features and functionality to a
web page
• Since HTML is compatible with all browsers, web pages created in HTML
are displayed across a variety of platforms and devices.
6
CHARACTERISTICS OF HTML

• Easy to Learn and Use: HTML has a simple and straightforward syntax,
making it relatively easy for beginners to learn.
• Platform-Independent: HTML is platform-independent, meaning it can
be viewed on any device or operating system that has a web browser.
Whether you're using a computer, tablet, or smartphone, HTML content
will render consistently across different platforms.
Support for Multimedia: HTML allows the embedding of multimedia
content such as images, videos, and audio files directly into web pages
using tags like <img>, <video>,<audio>, etc.
Markup Language: HTML stands for Hypertext Markup Language. As a
markup language, HTML uses tags to define the structure and content of
web pages.
7
FEATURES OF HTML

Simple Markup Language: HTML is indeed a simple markup language. Its
syntax consists of tags that are easy to understand and use. Tags are enclosed
in angle brackets (< >) and provide a straightforward way to structure
content on a web page.
Easy Implementation: HTML's simplicity makes it easy to implement. With
just a basic understanding of its syntax, users can start creating web pages.
Website Creation: HTML is the backbone of web development. It serves as
the foundation for creating websites by defining the structure and content of
web pages. While HTML alone can create static web pages, it is often
combined with other technologies such as CSS for styling and JavaScript for
interactivity to create dynamic and engaging websites.
8
THE IMPORTANCE OF LEARNING HTML

Simple Markup Language: HTML is indeed a simple markup language. Its
syntax consists of tags that are easy to understand and use. Tags are enclosed
in angle brackets (< >) and provide a straightforward way to structure
content on a web page.
Easy Implementation: HTML's simplicity makes it easy to implement. With
just a basic understanding of its syntax, users can start creating web pages.
Website Creation: HTML is the backbone of web development. It serves as
the foundation for creating websites by defining the structure and content of
web pages. While HTML alone can create static web pages, it is often
combined with other technologies such as CSS for styling and JavaScript for
interactivity to create dynamic and engaging websites.
9
TOOLS REQUIRED IN WEB DESIGN

10
BASIC HTML DOCUMENT STRUCTURE
• <!DOCTYPE html>
• <html>
• <head>
• <meta charset="utf-8">
• <meta name="viewport" content="width=device-width, initial-
scale=1">
• <title></title>
• </head>
• <body>
• </body>
• </html>

11
<!DOCTYPE
html>
<html>
<head>
<title>
<body>

12
•<!DOCTYPE html>
•This declaration specifies the version of HTML that the document is written in.
• It is usually the first line of an HTML file
• <html> element:
•This is the root element of the document and encloses all other elements
•<head> element
•This element contains metadata about the document, such as the title, author, and
character set. It does not contain any visible content on the page
•<Mata> element:
•This element is HTML elements that provide information about a webpage to search
engines and website visitors. It is are used to provide metadata about a webpage, such
as its title, description, and keywords, which can improve its visibility in search
engine results

13
•<title> element:
•This element is nested within the head element and specifies the title of
the web page, which appears in the browser's title bar
•<body> element
•This element contains all visible content on the page, such as text,
images, links, and other HTML elements.

14
HTML ELEMENTS
•HTML uses predefined tags and elements which tell the browser how to properly
display the content. HTML Tags and Elements are sometimes perceived as the
same. However, they are not. There is a subtle difference between HTML elements
and tags that many people aren't aware of.
•An HTML element is defined by a start tag, some content, and an end tag. The
Element can be articulated in the following form or syntax.
•Syntax: <element> content </element>

15
BUILDING BLOCKS OF HTML
An HTML document consist of its basic building blocks which are:
Tags: An HTML tag surrounds the content and apply meaning to it. It is written
between < and > brackets.
Attribute: An attribute in HTML provides extra information about the element,
and it is applied within the start tag. An HTML attribute contains two fields:
name & value.
Syntax
<tag name attribute_name= " attr_value"> content </ tag name>
• Elements: An HTML element is an individual component of an HTML file. In an
HTML file, everything written within tags are termed as HTML elements.

The main types of malwares include
Virus: An intrusive program that infects computer files and may cause
damage.
Worm: Self-replicating malware that uses a computer network to send
copies of itself to other computers.
Trojan: Destructive program that masquerades as an application.
Spyware: Malware that collects information on user browser habits
without their consent.
16

Pedagogi cal Approaches
2
.
C
o
l
l
a
b
o
r
a
t
i
v
e
A
p
p
r
o
a
c
h
4
.
I
n
t
e
g
r
a
t
i
v
e
A
p
p
r
o
a
c
h
5
.
I
n
q
u
i
r
y
B
a
s
e
d
A
p
p
r
o
a
c
h
2
.
C
o
l
l
a
b
o
r
a
t
i
v
e
A
p
p
r
o
a
c
h
4
.
I
n
t
e
g
r
a
t
i
v
e
A
p
p
r
o
a
c
h
5
.
I
n
q
u
i
r
y
B
a
s
e
d
A
p
p
r
o
a
c
h

Teaching, Learning, and Quality Teachers (8 hrs.)
Objectives
 Understand the concepts of teaching and learning
 Understand the qualities of ideal or effective teachers
 Analyze the different professional attributes and standards of general
education teachers
 Recognize the TPACK of teachers and other knowledge areas
 Understand the different active learning strategies to address learning
diversity.
 Apply the various active learning strategies in their classroom
teaching.
 Differentiate the roles of students and teachers in active learning
 Integrate experiential learning and inclusion of indigenous knowledge
in the curriculum
 Appreciate the values of indigenous knowledge for students’ learning.

 As a Teacher, how do you
conceptualize the following terms?
 Teaching
 Learning
 Theory of Learning
 Knowledge
 Understanding
 Skills
 Attitudes

Teaching for knowledge transmission
Is a Teacher-center activity in which knowledge and skills are transmitted
to novice learners.
Teaching for knowledge construction
Is a earner-centered activity in which the instructor supports, guides and
encourages learners in their active and independent/interdependent
construction of knowledge.

Learning
o is a process that leads to improvement, change and development which
occurs as a result of knowledge, skills, attitude and experience.
o The change may happen at the level of:
• Knowledge
• Skill
• Attitude

1.Knowledge
•It refers to the theoretical and practical understanding of
concepts, facts, and principles relevant to a specific job or
field.
It is about gathering an authentic information, re-arrange it
and use it in daily life.
In order to know some thing, one must have been part of it.
If you never try, you will never know.

2.Understanding
It is a psychological process which require an individual to think and use
concepts in different angles.
• Example: We know that exercise is good for us, but we may
not understand why.
• When we understand the benefits and the impacts on our health, mind,
and creativity this growing understanding should compel us to act,
whereas simply knowing does not.

3. Skills
Skills are the practical applications of knowledge.
It is about the way we do something in an efficient manner.
Types of Skills
A) Conceptual/ Cognitive/ Problem-Solving Skills

The way we understand how the various parts of something relate
to each other.

It involves:
•Good judgment and creativity
•Analytical ability and logical thinking
•Inductive and deductive reasoning
•Effective collaboration
•Leadership skill

B) Interpersonal /Social /Soft Skills
 It includes skills about:
•Understanding human behavior ( feelings, attitudes, and motives of others).
•Ability to communicate clearly.
•Ability to work with others.
C) Technical skills
It includes skills about :
•Planning, implementation assessment and evaluation skills
•Class room management skills
•Resource management skills
•Diversity managements kills
•Pedagogical skills
•proficiency in coding or data analysis

4.Attitude
Is a negative or positive evaluation of an object.
Components of Attitude
1)Cognitive Component: is the set of information about an object.
2)Affective Component: is emotions and feelings towards an object.
3)Behavioural Component: is the tendency to behave towards the object.

An orange is rich in vitamins. It is good for skin and has
good taste (Cognitive component)
I like an orange (Affective component)
I eat an orange daily (Behavioural Component)

Quality teachers and their professional attributes
Objectives
After completing this session, trainees will be able to:
 Identify the characteristics of quality teachers.
 Recognize the major professional attributes or knowledge areas
of quality teachers.
 Apply a variety of content and pedagogical knowledge in their
teaching.
 Apply technological and pedagogical content knowledge in
their teaching lessons.

Activity 1
List some characteristics of effective teachers and ineffective teachers
Characteristics of effective teachers
?
?
?

Qualities of an Effective Teacher
A) Having the knowledge of subject matter
• Knowing the subject well to teach with confidence
• Preparing daily for effective teaching
• Selecting appropriate materials, methods and learning
experiences
• Reading extensively around the subject matter

B) knowledge about human behavior
• He/she should know how a human being develop and learn.
• He/she should be able to reflect on a pupil’s performance and make
suggestions for improvement.
• He/she should be able to identify fast, medium and slow learners.
• He/she should find ways of assisting slow learners.

c) Display Of Attitudes That Foster Learning And Genuine Human Relation
Ship
• you must be friendly
• you must be sympathetic/understanding
• Treating students as human beings(with respect)
• Ability to explain difficulties with patience
• Being firm and impartial/fair
• Show interest in students as well as their parents
• you must always strive to motivate students

D) Teaching skills
• He/she must be versatile/ adaptability
• Using a variety of skills
• Ready to adapt to changes
• Focusing on the 3Hs (head, hand & heart)

Professional Attributes/Domains /of teachers
The three Domains
34
Professional
Practice
Profession
al
Engageme
nt
Professional
Knowledge

Professional Attributes and their 8 Standards
Professional Knowledge
– Know students and how they learn
– Know the content and how to teach it
Professional Practice
– Plan for and implement effective teaching and learning
– Create and maintain supportive and safe learning environments
– Assess, provide feedback and report on student learning
– Integrate ICT to support the teaching and learning
Professional Engagement
– Engage in professional learning
– Engage professionally with colleagues, parents/care givers and the community

Introduction to markup language
markup languages" refers to a collection of codes and instructions that are utilized to annotate and
format text within a document.
These languages enable the addition of structure and meaning to content, facilitating its interpretation
and presentation across different platforms and devices.
A markup language is a set of rules that defines how the layout and presentation of text and images
should appear in a digital document.
Types of markup languages
Markup languages can be classified into various categories based on their purpose and functionality.
These categories include:
Presentation Markup Languages: These markup languages are primarily used to define the visual
presentation of a document or webpage. Examples of presentation markup languages include HTML and
CSS
Data Markup Languages: Data markup languages are designed to structure and organize data within a
document or database. XML (eXtensible Markup Language)
is a widely used data markup language that allows for the representation and exchange of structured data.
Mathematical Markup Languages: These markup languages are specifically designed for representing
mathematical equations and formulas. MathML (Mathematical Markup Language)

Theory of Learning is a guide that gives you a direction:
•About effective teaching practices.
•How learning takes place.
there are a number of influential theories that particularly influencing
teaching and learning process.
1.Behaviorists
2. Cognitivists
3.Constructivists

1.Behaviorism
 It is developed by B.F skinner
 It is about Stimuli----response----reinforcement
 Associations between stimuli and responses lead to a new behavior or change in
behavior.
 Learning is the process of acquiring knowledge and skills in organized way.
 It views the mind as a "blank box"
 Knowledge is acquired rather than constructed.
 It ignore the possibility of thought processes occurring in the mind.
 It is about traditional methods of teaching(teacher center)

Learners are extrinsically motivated.
• Achieving attractive grades
• Praise from teachers and family
• Rewards for achievement
learners are: passive, individual and dependent.
Most of instructional time is covered by teachers.
It is about response generalization.

Cognitivist
• Is a learning theory that focuses on how people process information.
• It focuses how people understand, process, and store information.
• It holds that learning is an active process, which involves making
connections between new information and what we already know.
• It is the process of confectioning between the information we know
before and new information, resulting in a deeper understanding of
new information.
• Emphasis is given on mental processes (thinking, memory, knowing,
&problem solving).
• It focuses on the internal mental processes involved in learning
rather than observable behaviors.
• It focuses on how people understand, process, and store information.
• Teaching focuses on understanding how learners process, store and
retrieve information.

3.Constructivism
Learning is the process of constructing knowledge based upon past
experiences(experiential learning)
Learning if the result of the interaction b/n learner and learning environment.
Knowledge is constructed rather than acquired.
Learners mind is not a blank slate.

Learners are intrinsically motivated.
• Having long vision
• Creativity
• Enjoying difficult activities
• Taking more risks in learning.
• Having better study strategies

Most of instructional time is covered by students.
It is about student center method of teaching.
Learners are: active, individual and in dependent.
It creates classroom atmospheres in which learners
competed with each other.

4. Social Cognition
 Teaching is the process of creating something new and/or extending
existing knowledge and culture.
 Knowledge and skills are constructed gradually through experience,
interaction and peer support.
 It is about student center.
 Students are active, interdependent and socially motivated.
 Instructors are expected to adapt to the role of facilitators rather than
traditional teachers.
 Most of instructional time is covered by students

Types of Social Cognition
Socio-cultural: focus on cultural contexts and social practices.
Social Constructivist: stressed the importance of collaboration and social
interaction in the learning process.
Emphasizes the role of experienced participants in supporting less
competent learners via cooperative learning.
Scientists in today's world often work in teams to solve complex problems,
so it is necessary that students are taught how to be an effective member of
a team.

Active Learning Strategies
Session Objectives
• Define the term active learning
• Identify the different active learning strategies
• Understand the misconceptions of active learning
• Create favorable conditions for the active involvement of students
• Identify the roles of students and teachers during the active learning

What is active learning?

Active learning is an instructional approach that actively engages students in the
learning process.

It is any teaching approach where by all students are fully and meaning fully
engaged in their learning.
It provides students with opportunities to take an active role in their learning.

It required student -centered approach with a shift in emphasis from passive to
participatory learning.
Key characteristics are:
• Student engagement,
• Critical thinking,
• Collaboration,
• Feedback,
• Application of knowledge,
• Reflection, etc.

Activity
1. What makes teacher-centered teaching different from the
learner-centered approach?
2. What is active learning? What makes learning “active”? How
do teachers prepare students active from the start? Why is it
necessary to make learning active?
3. How do you help students acquire knowledge, skills, and
attitudes... actively? And how do you make learning unforgivable?

The key concept in active learning
Knowledge cannot be transferred rather than constructed.
Students have to:
 Collect authentic information
 Record it systematically
 Discus it
 Draw conclusions
 Communicate what is concluded
 Put it into practice

Common Misconceptions About Active Learning
Lecture method should be abandoned.
Active Learning Method is:
• simply group discussion and activities.
• not well researched to back it up.
• does not fit with Ethiopian culture.

Some Challenges to Using Active Learning Methods in Ethiopia
•Large class size/Large group
•Shortage of resource
•Course/module content too large
•Students and Instructors’ resistance
•Lack of management support
•Lack of planning, preparation and time management
•Lack of knowledge and skill about utilization of ALMs

Activity
As a teacher, List some active learning methods that you have used in your sessions so far.

Some active learning strategies
Active Learning
Methods
Brain storming
Ranking order
Demonstration Formal/Informal
Gapped lecture
Hot seating
Golden fish bowel
Balloon Gaming
Bus stop
Mindmapping
Picture analysis
Future wheel
Pyramiding
Gallery Walk
Cross over
Jigsaw

Inclusion of indigenous knowledge
Activity-1
1. How do you conceptualize indigenous knowledge and experiential learning?
2. Are students coming to school without knowledge and skills gained through life experience?
3. How the indigenous people are controlling soil erosion, use medicines, construct buildings prepare
food items and alcohol, etc,?
4. How do the local communities cultivate crops, rear, and adapt different animals?
5. What local medicines are you familiar with in your areas and for what purpose are they used?

55
Inclusion of Indigenous knowledge & experiential learning ….
Activity
Discuss on the following activities
by analyzing the pictures
associated with it.
Are students coming to school
without prior experience of
indigenous knowledge?
Why the mathematics teachers are
teaching students about a Circle
and circle formula (to find
circumference, diameter, radius,
arc, etc?
Local material Corresponding Global picture
Measurement
V
olume
and
surface
area
of
cone
and
cylinder
Volume
and
surface
areas
of
cones
and
cylinders
from
a
realistic
perspective.

• .
Volume
and
surface
areas
of
frustums.
Volume
and
surface
areas
of
cone
and
sphere

Learners’ diversity in classrooms and accommodating
their learning needs
Activity
1. Are all students in the classroom the same? If not what are their differences?
2. If all students in the classroom are diverse, what were the methods of teaching you have
employed to address the diverse needs and interests of students?
3. Is it possible to differentiate contents/ lessons, methods of teaching, assessment strategies,
and learning environment in the same classroom teaching? Why?
4. How is a homogenous assessment practice possible for heterogeneous class students in our
context?

Activity 3:Is our classroom teaching different from this?

Key Ideas:
No two students are exactly alike!!!
• Readiness levels
• Educational experiences
• Interests
• Learning styles
• Intelligences
• Personal experience
• Learning profiles
Students came with a variety
of

Introduction to HTML
What is an HTML:
 HTML stands for HyperText Markup Language.
 It is used to structure the content on the web by using various
elements (commonly known as tags).
 These HTML elements define the different sections of a web page,
such as headings, paragraphs, links to other webpages, listings,
images, tables, etc.
 HTML is HyperText + Markup Language.
HYPERTEXT refers to the way in which Web pages (HTML
documents) are linked together. ".
Markup Language, which means you use HTML to simply "mark
up" a text document with tags that tell a Web browser how to
structure it to display.

HTML Page Structure
• <!DOCTYPE html> − It defines the document type as HTML.
• <html> − It is a root element for an HTML document. All elements
are placed inside this element.
• <head> − The head tag may contain scripts and styles that are useful
page functionalities. Meta tags are also placed inside this tag.
• <title> − It defines the webpage's title.
• <body> − It defines the body of the webpage, all elements that are
used to display content on the browser placed inside the body tag.
• <h1> and <p> − The h1 tag defines page heading, and p tag defines
paragraph.
• HTML page structure contains <!DOCTYPE html>, <html>, <head>, <title>, <body>, and
other tags that will be shown on the homepage.

1) Auditory style
• They do not take a lot of notes.
• They are good at listening skills.
• Easily remember what the other said.
• They read loudly or by moving their lips.
• They talk to themselves when solving problems.
• They like to sit in front of the other.
• They would prefer talking to explain about new procedure.
• They like listen to music with their free time.
• They are comfortable when messages is through telephones.

They absorb information best through sound and spoken words.
They prefer listening to lectures, discussions, and audio recordings.
To cater to auditory learners, teachers should:
• focus on verbal communication.
• engage students in discussions and debates to encourage active
listening;
• use lectures, podcasts, and audio recordings to deliver information;
• encourage students to explain concepts verbally
• provide opportunities for students to present their ideas and findings
orally.

2)Visual style
• Take a lot of notes.
• They are good at reading skills.
• They need to eye contact when talking.
• They make notes to remember things better.
• When meeting a person for the first time, they observe the style of the person.
• They like to sit at the back.
• They would prefer to write to explain new procedures.
• They like to read or watch TV during their free time.
• They prefer a note for a message.

• They prefer to see and observe information through images,
diagrams, graphs, and videos(visual format).
To cater to auditory learners, teachers should:
• incorporate visual aids and creating visually stimulating learning
materials in their lesson.
• use visual aids like info graphics, charts, diagrams, and mind
maps to present information and enhance comprehension and
retention;
• encourage visual note-taking to organize information.
• provide written instructions and handouts to supplement verbal
explanations.

3) Kinesthetic/Physical/Tactile/style
• Not good at reading and listening skills.
• Prefer working things at hand.
• Emotionally support their talking.
• Moving their lips while reading.
• They like to move around.
• Using their hand a lot to say some thing.
• Their work place appears disorganized.
• They prefer demonstration to explain new procedure.
• They are comfortable when massage is by talking.
• They like exercising with their free time.

They prefer to engage in practical experiences.
They learn through touch and manipulation.
To cater to kinesthetic learners, teachers should:
• Incorporate experiential learning and real-world applications into their
teaching methods.
• include hands-on activities, experiments, and simulations.
• encourage students to participate in role-plays and physical
demonstrations.
• provide opportunities for students to engage in practical applications of
knowledge.
• provide opportunities for movement during lessons, such as allowing
students to work in groups.

Conducive classroom management
Activity
1.As a teacher, how do you conceptualize classroom management and class room organizations?
2. What types of sitting arrangements do you know? Mention them with their advantages and limitations.
Which type of sitting arrangement is mostly applied in the classrooms?
3. Is a flexible group arrangement or a fixed group arrangement advantageous? Why?
4. Is there large class size in your schools? How large is it?
5. Is large class size an opportunity or a challenge?
6. What techniques can you apply to manage large class size in classroom teaching?

Classroom management and organization
• CRM- refers to actions that teacher takes to create and maintain a
learning environment that is conducive to successful instruction.
• It refers to the wide variety of skills and techniques that teachers
use to keep students organized, orderly, focused, attentive, on task,
and academically productive during class.

Classroom organization
• Classroom organization is the intentional planning of the physical
space and materials to create classrooms that are well organized
predictable, orderly and create a learning environment that is
designed to meet students needs.
• Furniture arrangements, location of materials, displays are all part
of classroom organization.

Activity 2.
1. Mention what types of classroom management approaches they
are applying in their classroom teaching.
2. Compare the strong and weak sides of the following classroom
management approaches
• Bb
• 2.
Authorit
arian
approach
_____
__
_____
__
_____
__
Instructional/
Democratic
approach
________
________
_______
Cookboo
k
approac
h
______
__
______
__
Lessiez-
faire/
Permissive
approach
_______
_
_______
_
Intimidati
on
approach
_______
_
_______
_
_______

Classroom Management Approaches
A) Authoritarian style: Controls their classroom completely.
• In these classes, there is no flexibility for students to make their own
decisions or be involved in setting out what happens in class.
• Students may not get to choose what they do in class, or may simply get
to vote or voice their opinions.
B) Democratic/Instructional Approach: It engages students in living
democratically by promoting values such as inclusion, voice,
representation, and participation.
High-trust relationships and shared power between teachers and students.
In this approach, the teacher uses methods to encourage creative and
critical thinking.

C) Lassies-faire Approach: is a style where teachers display littlie
behavior to control students and demand littlie from them.
• In this style, teachers accept and watch students’ behavior and
reactions, never hurt their feelings and emotions and hardly say
‘no’ to their students.

D) Intimidation Approach: It attempts to control students behavior
through strategies that create fear.
• It views classroom management as the process of controlling student
behavior like the authoritarian approach but it emphasize the use of
intimidating teacher behavior.
• The role the teacher is to compel the student to behave as the teacher
wishes out of a fear to do otherwise.
• These strategies include threats, sarcasm, ridicule, disapproval,
psychological coercion, and physical force.
E) Cookbook Approach????????

Students Misbehavior
Activity
1. What are misbehaviors to you?
2. What is the root causes of the student misbehavior? Try to guide the trainees to discuss
the root causes by framing their discussion as teacher related, student related, school
leadership related, parent/ community related misbehaviors.
3. How can you tackle or minimize students’ classroom misbehaviors?
4. What are preventive techniques?
5. What are also curative techniques for student classroom misbehavior?

Students Misbehaviors: As stated by doyle (2006),
students misbehavior can be defined as any kind of student
behavior that disturbs the plan of learning process in the
classroom.
It can have a negative impact on the learning process, because the
learning process cannot run effectively.

Some Examples of Students Misbehavior
• Be an cooperative
• Argue, even about small and unimportant things.
• Refuse to follow rules and regulations.
• Deliberately annoy others, and become easily annoyed by other
people.
• Blame others for their mistakes.
• Behave in angry, resentful/feeling of bitterness, spiteful/desire for
revenge, and vindictive ways.

Root causes of behavioral issues
It can be multifaceted and may include a combination of the following:
Genetic-certain genetic factors can contribute to the development of
behavioral issues. Ex: a family history of behavioral disorders or mental
health conditions can increase the risk.
• Environmental factors: adverse experiences, such as trauma, neglect,
abuse, inconsistent parenting, unstable living conditions can impact a
students behavior.
• Social factors and peer influences: peer relation ships, social
dynamics, can also contribute to behavioral issues in students.

• Mental health conditions-behavioral issues can be associated
with underlying mental health conditions such as attention deficient,
anxiety disorders…
• Learning difficulties-some students with learning difficulties may
exhibit behavioral issues as a result of frustration, low self –steem,
difficulty coping with academic challenges.
• Classroom condition-it happen when the class is inactive and
boring.

Concepts, Purposes, and Characteristics of Assessment
Session Objectives
 After this training, trainees will be able to:
• Understand the concepts of assessment and continuous assessment,
• Differentiate the concepts of assessment from measurement and evaluation
• Analyze the different types of continuous assessment.
• Recognize the characteristics of continuous assessment.
• Differentiate the purposes of continuous assessment before, during, and after instruction
• Apply different assessment techniques before, during and after instruction.

Activities
1. What is assessment for you? How can you differentiate assessment
from measurement and evaluation?
2. How can you check whether your students are learning or not?
3. What are you going to assess? When do you think is assessment
provided? Why do you assess your students? How do you assess your
students?
4. Is assessment part of the teaching-learning process? How?
5. What assessment tools can you apply to measure knowledge, skill, and
attitudes?

What is the difference????
Evaluation
Exam

A)Assessment
Assessment is the process of
• Collecting,
• Organizing,
• Interpreting,
• Recording and
• Using information about the students’ performance /achievements.

B)Measurement: The explicit quantification of the results obtained through
assessment tools.
C)Evaluation: The placing of value or interpretation of a measurement and
assessment.
• It is providing decisions based on assessment results.
• It is concerned with making judgments on the performance of students.
Evaluation = Measurement + Assessment + value judgment
Evaluation = Quantitative (measurement) + qualitative description (non-
measurement) + value judgments.

Languages Types
▪Scripting Language
▪Interpreted command by command and remain in their original form.
▪Programming Language
▪Compiled, converted permanently into binary executable files (i.e.,
zeros and ones) before they are run.
▪Markup Language
▪A text-formatting language designed to transform raw text into
structured documents, by inserting procedural and descriptive markup
into the raw text.

Typse of Language
Scripting
Language
Typse of
Language

▪JavaScript is a scripting language.
▪Designed to add interactivity to HTML pages and create dynamic
web sites.
▪i.e. Change contents of document, provide forms and controls,
animation, control web browser window, etc.
▪JavaScript statements embedded in an HTML page can recognize
and respond to User Events.
▪JavaScript is very simple and flexible.
▪Powerful, beautiful and full-fledged dynamic Programming
Language
▪JavaScript is an interpreted language (means that scripts execute
without preliminary compilation)
▪Everyone can use JavaScript without purchasing a license
▪A scripting language is a lightweight programming language

Scripting languages
 Interpreted execution: Scripting languages are typically interpreted rather than
compiled, meaning the code is executed by an interpreter at runtime rather than
being compiled into machine code beforehand.
 High-level syntax: Scripting languages often have a simplified and high-level
syntax that is easy to read and write, making them accessible to non-
programmers and beginners.
 Examples of popular scripting languages include:
JavaScript (primarily used for web development but can also be used for
server-side programming with Node.js)
Python, Ruby, PHP, Perl, Bash (shell scripting language), PowerShell, etc.

Introduction to JavaScript
 JavaScript is a high-level, interpreted programming language that was initially created to add
interactivity to web pages. It was developed by Brendan Eich in 1995
 JavaScript is a programming language that executes on the browser. It turns static HTML web
pages into interactive web pages by dynamically updating content, validating form data,
controlling multimedia, animate images, and almost everything else on the web pages.
 JavaScript is the third most important web technology after HTML and CSS.
 JavaScript can be used to create web and mobile applications, build web servers, create games,
etc. JavaScript can be used in various activities like data validation, displaying popup
messages, handling events of HTML elements, modifying CSS, etc.
 In early 1995, Brendan Eich from Netscape designed and implemented a new language for
nonjava programmers to give newly added Java support in Netscape navigator. It was initially
named Mocha, then LiveScript, and finally JavaScript.

Advantages
 JavaScript can put dynamic text into an HTML page - A JavaScript statement
like this: document.write("<h1>" + name + "</h1>") can write a variable text
into an HTML page
 JavaScript can react to events - A JavaScript can be set to execute when
something happens, like when a page has finished loading or when a user
clicks on an HTML element.
 JavaScript can read and write HTML elements - A JavaScript can read and
change the content of an HTML element

JavaScript Where To
•JavaScripts in the body section will be executed WHILE the
page loads. JavaScripts in the head section will be executed
when CALLED.
•Scripts in the head section: Scripts to be executed when they
are called, or when an event is triggered, go in the head
section. When you place a script in the head section, you will
ensure that the script is loaded before anyone uses it.
<html>
<head>
<script type="text/javascript">
...
</script>
</head>
<body>
</body>
</html>

•To insert a JavaScript into an HTML page, we use the <script> tag. Inside
the <script> tag we use the type attribute to define the scripting language.
•So, the <script type="text/javascript"> and </script> tells where the
JavaScript starts and ends:
<html>
<head>
<script type="text/javascript">
...
</script>
</head>
<body> </body> </html>

Types of Assessment
Diagnos
tic
assessm
ent
Diagnostic
assessment
Diagnostic
assessment
Formati
ve
assessm
ent
Summat
ive
assessm
ent

1.Diagnostic Assessment
DA-Is a form of pre-assessment or a pre-test where teachers can
evaluate students individual strength, weakness, knowledge and
skills before their instruction.
It usually don't count for grades.
It intended to help teachers to identify the knowledge, skills and
experience the students come with.
It may help teachers determine what students understand in order
to build on the students strengths and address their specific needs.

2.Formative Assessment
Assessment for learning(improvement)
It is to assist the learning process by providing feedback
It is continuously gathering evidence about learning.
It has the greatest impact on student learning.
It is diagnostic and remedial
It is non-graded
Can be done formally or informally for feedback.
It is process oriented (cultivating the learner)
Carried out during instruction
It is part of the teaching method.
.

3. Summative Assessment
known as assessment of learning
It takes place at the end of a unit/term/semester.
the purpose is to gather evidence of student achievement after
instruction.
used primarily to make decisions for grading or certification
purpose.
to judge the learner’s overall performance.
for checking mastery
to pass or fail
to determine what has been learned from the lesson
to summarize student progress.

4.Continues Assessment
It provides day-to-day feedback about the learning and teaching
process.
 It can be used as summative assessment and
formative assessment.
Regular evaluation of students learning progress throughout a
course or program.
It intended to Improve learning and Track progress.

Assessment for learning v Assessment of learning

Tools of Assessment
Assessment
Tools
Classwork
Homework
Practical activities
Cases
Demonstrations
Q&A Quiz
Projects
Portfolio
Observations
Tests/Assignments

Measuring Knowledge Skills and Attitudes
•Effectively measuring Knowledge, Skills, and Attitudes involves
using various tools and methods tailored to each component.
•Here’s a breakdown of how to evaluate each aspect, along with
examples of performance metrics and Key Performance Indicators
(KPIs) that can help track them.
•here how to measure knowledge skills and abilities and evaluation:

Evaluating Knowledge
1. Certifications
•Certifications serve as evidence of competence and demonstrate that an individual has mastered the
theoretical and practical aspects required for a specific role.
•For example, certifications in ICT or project management indicate a solid grasp of essential concepts.
2. Qualifications
•Academic and professional qualifications, such as degrees or diplomas, show acquired knowledge in
specific fields.
•For instance, a master’s degree in ICT reflects advanced theoretical and practical knowledge.
3. Tests and Exams
•Regular assessments through tests and exams measure theoretical knowledge and the ability to apply
learned information.
•These evaluations help gauge how well students understand, retain and utilize their knowledge over
time.

Measuring Skills
1.Work Quality
•The accuracy and effectiveness of an students work provide insight into
their skill levels.
•Evaluating work quality over time avoids the pitfalls/drawbacks of one-
time assessments and provides a more comprehensive view of skill
proficiency.
2.Practical Skill Assessments
• Practical tests demonstrate how well students apply their knowledge and
experience to solve real-world problems.
•These assessments offer a hands-on evaluation of skill levels.
3.Skills Matrices
• A skills matrix provides an overview of
employees’ skills and qualifications. It allows for a quick assessment of
knowledge levels, proficiency, and certification status.

Measuring Attitudes
• Measuring students attitudes can be done through various methods, each
providing different insights.
Activities
1. List some assessment tools that used to measure the attitude of your
students.

Html in Web design and Development.pptxt.pptx

Html in Web design and Development.pptxt.pptx

More Related Content

Similar to Html in Web design and Development.pptxt.pptx

Recently uploaded

Html in Web design and Development.pptxt.pptx

Editor's Notes