IB Web Design Syllabus

Instructor's Name:  Mrs. Procopio
Course Name:  IB Web Design
Course #:  CB89
Grade Levels:  6, 7 and 8
Course Description:  The focus of this course is website design.  Students apply the IB Design Cycle as they code websites with Hypertext Markup Language, Cascading Style Sheets, JavaScript and graphics applications.  In this project-based course, emphasis is placed upon time management, project management, and personal responsibility Students' projects are assessed with IB Criteria.

Supplies:  USB drives are not permitted at the Mesa Academy!  Students are required to bring the following supplies to class each day:

  • Inexpensive pair of earbuds (purchase at the dollar store)
  • Helpful classroom donations - Kleenex and hand sanitizer

I.  Course Outline

CB89 IB Web Design is an introduction to website development as outlined in the International Baccalaureate Middle Years Programme (MYP) Year 1 for Digital Design, Arizona CTE Career Preparation Standards for Web Page Development, and the Arizona College and Career Ready Standards for English Language Arts and Literacy in History/Social Studies, Science and Technical Subjects.  

Throughout this course, IB students will be asked to reflect on their progress along the Learner Profile continuum, which includes becoming motivated and principled learners. Students will expand their global outlook through research, problem-solving, and communication.

The key concepts for this course are creativity and systems, with related concepts of form, function and innovation.  Content instruction is based upon current website development standards established by the World Wide Web Consortium (W3C), which students will explore and apply to their own creations.  Additional foci will include pre-production, production, post-production, quality assurance, and presentation phases of website development.  Students will create and present a website that showcases their selected topic research, coding techniques, layout design, and website functionality.

II. IB Aims and Objectives


The aims of MYP Year 1 - CB89 are to encourage and enable students to:

  • enjoy the design process, develop an appreciation of its elegance and power, develop knowledge, understand and skills from different disciplines to design and create solutions to problems using the design cycle.
  • use and apply technology effectively as a means to access, process and communicate information, model and create solutions, and to solve problems.
  • develop an appreciation of the impact of design innovations for life, global society and environments.
  • appreciate past, present and emerging design within cultural, political, social, historical and environmental contexts,
  • develop respect for others’ viewpoints and appreciate alternative solutions to problems.
  • act with integrity and honesty, and take responsibility for their own actions by developing effective working practices.


The objectives of MYP Design courses are to encourage and enable students to:

  • Investigate a problem
  • Plan a solution
  • Create a solution
  • Evaluate a solution

While students will employ ICT (Information and Communication technology) skills throughout the semester, the focus of this class is DESIGN, not rote skill-building.  Students should be able to:

  • design authentic creations that are not the result of template application or secondary source compilations.
  • explore, select and use ICT tools to solve real problems by creating a digital solution.
  • demonstrate the acquisition of digital design skills by MYP Year 5.
  • develop a series of practical skills such as:
    • generating original digital material
    • programming software
    • manipulating and combining images, text, video and audio, and
    • converting solutions to different formats

Additionally, ATL (Approaches to Learning) is always present and helps students “learn to learn” with tools to enable them to become life-long, independent learners.  ATL skills include thinking, social, communication, and research skills.

III. Topics

The product/outcome of this class will be a website.  Major topics of inquiry include HTML (Hypertext Mark-up Language), JavaScript and CSS (Cascading Style Sheets).   

Units of study, including assignments, assessments and projects, are as follows (and subject to change, as needed):

CB89 - IB Web Design Units of Study
Get Ready! Get Set! Go!
Unit #1 - Digital Citizenship
Unit #2 - Introducing the Internet and the World Wide Web
Unit #3 - Tag!  You're It! (Introducing HTML, CSS and JavaScript)
Unit #4 - Putting it All Together (IB Design Project)
Part #1 - Using the IB Design Cycle to Investigate and Plan a Website
Part #2 - Using the IB Design Cycle to Create a Website
Part #3 - Using the IB Design Cycle to Evaluate a Website
Unit #5 - Evaluations - Peer and Self


IV. Global Contexts

Global Contexts provide a framework on which to build each unit of study. The six Global Contexts will be integrated within the various units of study to reinforce the connections between concepts and problem-solving as it relates both to content and universal concepts.  The six Contexts are Identities and Relationships, Scientific and Technical Innovation, Fairness and Development, Orientation in Space and Time, Globalization and Sustainability, and Personal and Cultural Expression; however, of particular emphasis in this subject content will be Personal and Cultural Expression (artistry, craft, creation, and beauty).  

V.  Internationalism

Computer code, like musical notation, is a universal language that is “spoken” by programmers throughout international communities, regardless of linguistic and cultural differences.  Each year, our students participate in an “Hour of Code”.  This week-long initiative encourages school systems to grow computer science education worldwide, with special emphasis on women and students of color to learn computer science.

VI. Teaching Methods

Teaching methods for this class incorporate study skills with demonstrations, explanations, modeling, Think-Pair-Share, direct-instruction and questioning, problem-based learning, inquiry-based research, hands-on cooperative learning experiences, note-booking, and formative checks and summative assessments,  using a variety of modalities (visual, auditory, kinesthetic, and tactile).

Students will incorporate the use of the IB Design Cycle (investigate, plan, create and evaluate) to build their summative website projects.  The student will:


  • develop the requirements of a personal website to be used to present a favorite topic to the class.
  • present the main points of an inquiry into the need and analysis of a website that is similar to his or her initial thoughts.


  • list the requirements of a suitable website.
  • develop ideas for its purpose and look, and identifies digital components that he or she will use to create the website, including text, images and color.
  • determine whether the design meets the stated needs, adapts and finalizes the design.
  • outline a step-by-step plan to make the website and alters it where necessary. Makes excellent use of a simple text-editor application to generate the basic structure of his or her design.


  • create the website, lists any changes that were needed to be made.


  • test the website to ensure that pages link appropriately and asks peers to use it. After testing the website to ensure that pages link appropriately, asks peers to use the website, gathers feedback, and uses this information to outline the success of the website, how it could be improved, and how the website acts as a tool to present his/her favorite topic.

VII. Assessment

Mesa Academy Grading Practices

All teachers at Mesa Academy have committed to the following grading practices in alignment with the MPS strategic goal.  Mesa Academy teachers have agreed that implementing school-wide, consistent grading practices will allow for greater clarity, communication and transparency for students and parents.  You may want to download the Synergy Parent Vue app to your phone for convenient access to the MPS Portal/ParentVue.  Please communicate any questions or concerns regarding grades or grading practices to your student’s teacher. 


Zeros may be marked as “missing” (or “incomplete” or “absent”) to act as a placeholder until the end-of- quarter deadline. During Remote Learning teachers will connect with students to provide extra support with getting work submitted. During In Person learning, students may be referred to the counselor to attend the Success Center or lunch tutoring to provide support with getting work submitted. Zeros will remain as a zero (assuming all reasonable effort has been made to get completed work in from student) with a “missing” label after the quarter deadline. 

Late Work

Students are expected to complete all assignments by the posted deadlines. Late work will be accepted for no more than one week after the assigned deadline unless previous arrangements have been made with the teacher. Late assignments will not be accepted for any assignments after the late work deadlines.

In the Grade Portal

  • Assignments will be marked as "missing" with zero credit given until the assignment is submitted.
  • Once submitted, assignments will be marked as "late".
  • Late work will be graded by the teacher after all on-time work is graded and recorded.


Students who seek to redo or retake an assignment or assessment will contact their teacher to request a retake. The teacher and student will determine which preparation activities (ie. using a different study technique or fixing their mistakes) would benefit the student to promote success on the redo/retake.  The student will then complete the preparation activities and contact the teacher for approval before the redo/retake is permitted.  After the redo/retake has occurred, the student will see their new score in the Portal (unless the new score is lower).  The highest score earned will be entered in the Portal. 


Due to the cumulative, project-based nature of IB Design, students MAY NOT resubmit a semester-long, summative project.


Most assignments will be completed in-class; however, students should expect to study for quizzes at home, and complete pre-writing and research for their final projects on their own time to allow more in-class time for coding. 

IB Design Four-Criteria/Eight-Point Grading Rubrics Explained

Each design objective corresponds to one of four equally weighted assessment criteria. Each criterion has eight possible achievement levels (1–8), divided into four bands with unique descriptors that teachers use to make judgments about students’ work (IBO Design Brief).

Selected assignments will be assessed using the four IB Design Assessment Criteria (click the following links for grading rubric documents):

Criterion A: Inquiring and analysing

Students are presented with a design situation, from which they identify a problem that needs to be solved. They analyse the need for a solution and conduct an inquiry into the nature of the problem.

Criterion B: Developing ideas

Students write a detailed specification, which drives the development of a solution. They present the solution.

Criterion C: Creating the solution

Students plan the creation of the chosen solution, then follow the plan to create a prototype sufficient for testing and evaluation.

Criterion D: Evaluating

Students design tests to evaluate the solution, carry out those tests and objectively evaluate its success. Students identify areas where the solution could be improved and explain how their solution will impact on the client or target audience.

Students are given opportunities to demonstrate mastery of knowledge and the Criteria A-B-C-D skills using a variety of assessments:

  • Diagnostic (pre-assessments) given at the beginning of the semester to determine a baseline of students' understanding of course content. 
  • Formative (observations, teacher-directed questioning, quizzes, and informal presentations) given throughout the learning process.  They are used to check students' understanding and assist the teacher in planning subsequent instruction.  Additional learning activities may be planned to ensure student success. 
  • Summative (mid-term/final exams and final projects) given at the quarter and end of the semester to assess students’ mastery of a course content.  Performance-based assessments are first evaluated first by the student against the assessment criteria outlined in the assessment guide sheet or on a rubric.  This way, students are given an opportunity to self-reflect and refine their product prior to teacher evaluation.  Students present their summative projects to their classmates for peer-evaluation, and submit their projects to their teacher for final grading. 

Grading Categories

CB89 coursework is divided into the following categories:  assignments (15%), assessments (25%), IB Design Folder (20%) and IB Design Project (40%).  Daily assignments consist of HTML, JavaScript and CSS coding tasks; assessments are in the form of unit quizzes, the IB Design Folder contains Cornell research notes and project sketches, and the IB Design Project is a seven-page website that contains topic research and website requirements.  Students must redo incomplete or incorrect assignments.

CB89 is a project-based class with emphasis on a capstone website.  Students work on the components of their final project for four months and present it during the fifth month.  The project must be completed by the due date.  

Grading Scale

Student grades will be based on the following scale:

90-100% . . . . . . A

80-89% . . .  . .. . B

70-79% . . . . . . . C

60-69% . . . . . . . D

less than 60% . . F

VIII. Texts and/or Resources

International Baccalaureate Middle Years Programme (MYP) Year 1 for Digital Design - Design

Arizona CTE Career Preparation Standards for Web Page Development - Web Page Development

Arizona College and Career Ready Standards for English Language Arts and Literacy in History/Social Studies, Science and Technical Subjects

Arizona College and Career Ready Standards for English Language Arts and Literacy - Literacy in Science Explanations and Examples


IX. Class Policies

Classroom Rules and Procedures, and Three-Strikes Classroom Discipline

Instructional Presentation

Strike 1 - Warning

Strike 2 - Parent or guardian contacted

Strike 3 - Referral to principal