Four completed activities separate same-staff height from pitch naming. Three show original five-line drawings and choices for A higher, B higher or same height. The fourth asks for a letter without a clef and accepts an explicit cannot-determine response. Each item has a checkable attempt and its own explanation.
Give positions an unambiguous text reference
The worksheet numbers placements from the bottom: bottom line 0, first space 1, second line 2, second space 3 and middle line 4. The remaining upper lines are 6 and 8. These are drawing indexes, not note names or frequency values. The three comparison drawings each include five staff lines and separately labeled markers A and B.
Open Music Theory explains that vertical staff position communicates relative pitch height and that clefs provide the reference for pitch assignments. For this activity, compare only markers on the same staff. Do not apply the comparison across different clefs or use an unlabeled index as a letter name. Text placement descriptions remain next to the drawing for inspection without relying only on its appearance.
Check the three relative comparisons
M01 places A on the bottom line at 0 and B in the second space at 3. B is higher. A wrong A-higher attempt gets a prompt to compare the bottom line with the second space; the feedback points to the supplied locations instead of merely saying incorrect.
M02 places A on the middle line at 4 and B in the first space at 1. A is higher. M03 puts both at 2 on the second line. Same height is the supported answer even though the markers are horizontally separated. Keep both labels visible so equal height does not resemble a missing marker. Horizontal spacing does not alter this comparison.
Make missing information a real answer
M04 shows one marker at 2 with no clef. Its question is the letter name. The choices include a specific cannot-determine answer alongside letter guesses. Leaving the response blank means unanswered; selecting cannot determine is a reasoned response to the missing reference.
The explanation identifies the missing clef reference needed to assign letter names. It does not assume treble because a learner recognizes a familiar worksheet shape. Relative height and a letter name need different information. The page provides no audio, rhythm question, accidentals, octave naming or measured frequency. Keep the task within the notation actually shown.
Use checks to support an explanation
Select an item, choose an answer, and activate Check answer. An item without a choice asks for an attempt first. An optional reasoning field stays available for the learner's own words. The local checker evaluates only the fixed choice; it does not grade the prose or infer musicianship.
Changing a choice clears earlier feedback. Moving to another item loads its own drawing, placement description and question. A separate teacher-reasoning reveal lets an instructor inspect the reference without claiming that a learner supplied it. Reset clears choices, notes and reveal state while retaining the four original tasks.
For a class packet, preserve the blank learner sheet and separate key in the required school format. Check that the teacher's terminology and access arrangements suit the group. Use the response and explanation together when deciding what to practice next; four checked choices alone do not establish a general learning outcome.
Copy this prompt
Create a complete original HTML example in US English for this task: Interactive music worksheets. Return one self-contained HTML file. Include all styles, data and JavaScript in the file. Use no remote dependencies. Return the working page, not an outline.
Four original five-line staff items. Index 0 bottom line, 1 first space, 2 second line, 3 second space, 4 middle line. M01 A0/B3: B higher. M02 A4/B1: A higher. M03 A2/B2: same height. M04 one marker 2 with no clef: letter cannot be determined from supplied information. These indexes are not note names.
Render each staff as original responsive inline SVG, with labels and a text placement description. Offer item buttons and appropriate fixed answer buttons. Keep attempt blank initially; Check answer requires a choice before displaying item-specific reasoning. M04 must include explicit cannot determine, distinct from no response. A teacher-key reveal is deliberate and separate. Changing an answer clears stale feedback, changing an item loads its own context, and reset clears answers, explanations and reveal state. No audio, scoring service, letter/octave guesses without a clef, saved responses or actual teaching-result claims. Provide a reasoning field for teacher discussion, not semantic grading.
Use a page design suited to this particular task, readable text at least 16 px, generous spacing, visible keyboard focus and explicit labels. At 360 px, stack the content without page-level horizontal scrolling. Use type="button" click handlers for actions. Keep source facts and sample results distinct from actual observations. Leave unknown details visible rather than inventing them. Controls update only this temporary page; distinguish local changes from actual records. Provide concise task-specific feedback and a reset that clears entered answers and stale results.
Use the result
Ask the learner to explain one height comparison and then name the missing reference in M04. The original drawings and reasoning can be viewed together in NOS for lesson preparation. Return the selected practice questions to the maintained learner packet, with relative placement and pitch naming still treated as different tasks.