Scribd
Upload
17 views3 pages

Day 3 Report Training Session at Child Development Center

The fourth day of training at the Child Development Center focused on introducing responsive web design, covering media queries, fluid layouts, and flexible images. Participants engaged in hands-on activities to create adaptable web pages and demonstrated a strong grasp of the concepts. Overall, the session was successful, with children showing enthusiasm and progress in their web design skills.

Uploaded by

Wesley Wenceslaus
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
17 views3 pages

Day 3 Report Training Session at Child Development Center

The fourth day of training at the Child Development Center focused on introducing responsive web design, covering media queries, fluid layouts, and flexible images. Participants engaged in hands-on activities to create adaptable web pages and demonstrated a strong grasp of the concepts. Overall, the session was successful, with children showing enthusiasm and progress in their web design skills.

Uploaded by

Wesley Wenceslaus
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

Daily Report Training Session at Child Development Center, Homabay

Date: 9th Dec 2024


Instructor: Wenceslaus Wesley

Subject: Report on Day Four Training Session: Introduction to Responsive Design

Overview

The fourth day of training focused on introducing the children to the concept of responsive web design.
The session covered the use of media queries, fluid layouts, and flexible images to create web pages that
adapt seamlessly to different screen sizes and devices.

Participants engaged enthusiastically, applying these concepts to build adaptable web designs.

Session Objectives

1. Explain the importance of responsive design in modern web development.

2. Teach the use of media queries to apply CSS rules based on screen size.

3. Introduce fluid layouts and flexible images for dynamic adaptability.

4. Provide hands-on practice to create responsive web pages.

Activities

1. Review of Day Three:


Recapped the CSS box model and layout properties to establish a foundation for responsive
design.

2. Introduction to Responsive Design:

o Explained the concept of responsive design and its role in ensuring websites look good
on all devices (desktops, tablets, and mobile phones).

o Demonstrated how responsiveness improves user experience.

3. Media Queries:

o Introduced media queries with examples

o Discussed the use of breakpoints to define styles for different screen sizes.

4. Fluid Layouts:

o Explained how to use percentage-based widths for flexible layouts.


o Demonstrated the use of the max-width property to prevent elements from becoming
too large.

5. Flexible Images:

o Showed how to use the max-width: 100% property to ensure images resize
proportionally.

6. Hands-On Activity:

o Participants created a simple web page with:

 A responsive layout using percentage-based widths.

 Flexible images that resized dynamically.

 Media queries to change styles for mobile and desktop views.

7. Creative Exercise:
Children were encouraged to design their own responsive pages, experimenting with layouts and
styles for different devices.

Achievements

 All participants successfully applied media queries to modify styles based on screen size.

 Most were able to create fluid layouts and resize images effectively

Feedback

 Positive Observations:

o The children demonstrated a strong grasp of media queries and were excited to see their
designs adapt to different screen sizes.

o Many participants began exploring advanced styling options on their own.

 Challenges Identified:

o A few participants struggled with the syntax of media queries but improved with
guidance.

Conclusion

Day Four successfully equipped the children with foundational skills in responsive design, empowering
them to create adaptable and user-friendly web pages. Their enthusiasm and progress have been
remarkable, and they are well-prepared to explore advanced web design concepts.

Prepared By:
Coding Instructor
Child Development Center, Homabay

You might also like