Differences

This shows you the differences between two versions of the page.

--- interactivity_gap_fill_page [2022/12/02 10:57] – removed - external edit (Unknown date) 127.0.0.1
+++ interactivity_gap_fill_page [2025/01/09 15:03] (current) – jsmith
@@ Line 1: / Line 1: @@
+====== Interactivity > Gap Fill ======
+A page that enables you to create a gap fill task, with a choice of 3 ways of presenting this to learners;
+  * Drag Drop (learners drag missing words into spaces)
+  * Fill in Blank (learners type missing words into spaces)
+  * Drop Down Menu (learners choose missing words from drop-down menus embedded in the text)
+===== Example demo =====
+The example below shows the Drag Drop format - use the links on the page to view the other formats.
+{{url>https://xot.xerte.org.uk/xapi_launch.php?template_id=116&group=xertepagetypes#gapfilldraganddrop}}
+or view at [[https://xot.xerte.org.uk/xapi_launch.php?template_id=116&group=xertepagetypes#gapfilldraganddrop|Xerte Page Types > Interactivity: Gap Fill]] (opens in new tab).
+===== Editor Interface =====
+{{:xerte-inter-gapfill-editor.png?600&direct|Screenshot of Interactivity > Gap Fill page in editor}}
+==== Core Properties ====
+^ Property ^ Description ^ Type ^ Additional information ^
+| Page Title | Text that appears in header of published page | Text |   |
+| Introductory Text | Content that appears in the left panel on the page, unless Panel Width is set to //Full// (see below). | Text+ (Toolbar) | Use this to give the context or instructions for the task.  Other content (e.g. images, audio, video) can be embedded here. |
+| Gap Fill Text | Text including gaps to be filled | Text+ (Toolbar) | Text with "missing words" marked up with delimiters.  Mark-up for Drag Drop and Fill in Blank is identical.  For Drop Down Menu, all options need to be added for each gap, with correct answer as the first item.  |
+| Interactivity | Choose Gap Fill format here {**Drag Drop**/Fill in Blank/Drop Down Menu}  | Drop-down | :!: **New in 3.13**. When the default **Drag Drop** format is active, two additional options (**Gap Appearance** and **Gap Width**) are visible. See below for more information.  These options are __not__ visible when the either of the Fill in Blank or Drop Down Menu options have been selected.  |
+| Feedback | Feedback revealed after hitting //Check //button | Text+ (Toolbar) |   |
+| Panel width | Dimension of the right panel (gapped text). Choose from {Small/**Medium**/Large/Full}.  //Full// puts the Introductory Text above the gapped text. | Drop-down | For Drag Drop, it may be better to use //Large //or //Full //so that all the draggable objects and the drop zones can be seen without scrolling or zooming.  |
+| Gap Appearance (only for Drag Drop) | {**Background Colour**/Outline/Underline}**Keep When Filled** allows you to retain the gap appearance after the gap has been filled. | Drop-downTick Box | :!: **New in 3.13**.This determines the appearance of the gap - experiment with these to decide which you prefer. |
+| Gap Width (only for Drag Drop) | {**Longest Text**/Correct Text/Compressed/Bespoke}.  **Compress When Filled** | Drop-downTick Box | :!: **New in 3.13**.  The **Compressed **option sets all the gaps at 5 pixels, and the gaps expand when longer words are dropped in. The **Correct Text **option may give learners clues guiding them to the correct answer, if the draggable items are words of different lengths.**Compress When Filled** is only available when you also choose the **Longest Text** gap width. This makes the text look more natural before checking. |
+==== Optional Properties ====
+=== Page-specific ===
+^ Property ^ Description ^ Type ^ Additional information ^
+| Case Sensitive | Enforce specific capitalisation (Fill in Blank only) | Tick Box | Add if it matters whether upper or lower case is used in answers  |
+| Delimiters | Delimiters for marked word, distractors and Drop Down Menu options | Text | Defaults are given for: **Marked Word** (Drag Drop, Fill in Blank); **Correct Answer** (Fill in Blank: separating multiple acceptable answers); **Distractor**;** Drop Down Menu Option** (Drop Down Menu: separating options, with the correct answer first) |
+| Distractors | Drag Drop only - add any words you want to appear as distractors  | Text  | Add distractor words separated by spaces, or set a custom delimiter in //Delimiters// property (see above).  |
+| Drop Down Menu Options | Drop Down Menu only - order in which options appear {**Alphabetic/**Random}** **  | Drop-down  |   |
+| Hints | //Show Hint// applies to the Fill in Blank format only.\\ //Correct Answers Button //applies only when //Mark at End// (see below) has been added.\\ //Attempts before Hint// indicates how many incorrect characters need to be typed in before a hint is given.  | Tick Box & Text  |   |
+| Mark at End | Gives feedback only when all gaps have been attempted  | Tick Box  | Use this when tracking score (e.g. when deploying as a SCORM package).  |
+| Space Lines Evenly | Ensures even line spacing in gapped text.  | Tick Box  | This does not need to be added as an Optional Property because the default is for even line spacing.  If you want to save space, you can add this property and untick the box.  |
+| Tracking Score Weight | Allows the task on the page to be weighted relative to other scored pages in the project.  | Text  | See the [[:trackingandweighting|Tracking and Weighting ]]page for more information on weighting.  |
+=== General ===
+See [[:optional_properties#General optional properties|General Optional Properties]]
+==== Language Options ====
+^ Property ^ Description ^ Type ^ Additional information ^
+| Check Button Text | Text on Submit button | Text | Default - "Check"  |
+| Show Button Text | Text on button to show answers | Text | Default - "Show Answers" |
+| Gap Fill All Wrong | Feedback if __all__ answers are wrong  | Text  | Default - "You have not filled in any answer correctly. Please try again"  |
+| Gap Fill Part Wrong | Feedback if __some__ answers are wrong | Text  | Default - "Your correct answers are shown in green. Try again with those you have got wrong."  |
+| Gap Fill Incomplete | Feedback if Gap Fill is not attempted.  | Text  | Default - "Please complete the exercise."  |
+| %%Answer Field Hidden Aria-Label%% | Hidden label for screen readers so that the text field where learners should respond is labelled and spoken, e.g. "Answer"  | Text  | Default - "Answer" |
+| Gap Fill All Wrong (Tracking) | Feedback, if project is deployed as SCORM or LTI/xAPI, and __all__ answers are wrong  | Text  | Default - "You have not filled in any answer correctly." |
+| Gap Fill Part Wrong (Tracking) | Feedback, if project is deployed as SCORM or LTI/xAPI, and __some__ answers are wrong  | Text  | Default - "Your correct answers are shown in green." |
+===== Further information =====
+This page can be tracked.
+Typically "gaps" are **one **missing word.  However, they can also be **two or more words**.  This works fine for the **Drag Drop** and **Drop Down Menu** options, and less well for **Fill in Blank** where slips in keyboarding may cause frustration for users.
+Ideally, for **Drag Drop**, all the draggable objects and the drop zones need to be visible to the user without scrolling.  Zooming out will help, but may reduce readability, so in practice there are constraints on the size of the text and the number of gaps.
+For **Drag Drop**, the width of the draggable objects and the drop zones, and in the case of **Fill in Blank** the width of the text entry boxes is determined by the length of the biggest gap on the page.  The page will look better if all the gaps are within a fairly narrow range of total characters.
+{{tag>pagetype interactivity}}