Sections
What is H5P?
How do I create my own H5P interactive content?
University projects using H5P
Disclaimer
Accessibility
Open Education Resources (OERs)
Exemplars
What is H5P?
H5P is a free and open-source content collaboration framework based on JavaScript. H5P is an abbreviation for HTML5 Package, and aims to make it easy for everyone to create, share, reuse and modify interactive HTML5 content. Currently there are over 50 default content types available, but you can add more from the community or create your own bespoke template.
- Accordion – Create vertically stacked expandable items
- Advent Calendar (beta) – Create an advent calendar
- Agamotto – Present a sequence of images and explanations
- AR Scavenger – Augmented reality fun!
- Arithmetic Quiz – Create time-based arithmetic quizzes
- Audio Recorder – Create an audio recording
- Branching Scenario – Create dilemmas and self paced learning
- Chart – Quickly generate bar and pie charts
- Collage – Create a collage of multiple images
- Column – Column layout for H5P Content
- Complex fill the blanks – Fill in the missing words
- Cornell Notes – Take notes using the Cornell system
- Course Presentation – Create a presentation with interactive slides
- Crossword – Create a crossword puzzle
- Dialog Cards – Create text-based turning cards
- Dictation – Create a dictation with instant feedback
- Documentation Tool – Create a form wizard with text export
- Drag and Drop – Create drag and drop tasks with images
- Drag the Words – Create text-based drag and drop tasks
- Essay – Create essay with instant feedback
- Fill in the Blanks – Create a task with missing words in a text
- Find Multiple Hotspots – Create many hotspots for users to find
- Find the Hotspot – Create image hotspot for users to find
- Find the words – Grid word search game
- Flashcards – Create stylish and modern flashcards
- Guess the Answer – Create an image with a question and answer button
- Iframe Embedder – Embed from a url or a set of files
- Image Choice – Create a task were the alternatives are images
- Image Hotspots – Create an image with multiple info hotspots
- Image Juxtaposition – Create interactive images
- Image pairing – Drag and drop image matching game
- Image Sequencing – Place images in the correct order
- Image Slider – Easily create an Image Slider
- Impressive Presentation – Create a slideshow with parallax effects
- Interactive Book – Create courses, books or tests
- Interactive Video – Create videos enriched with interactions
- KewAr Code – Create QR codes for different purposes
- Mark the Words – Create a task where users highlight words
- Memory Game – Create the classic image pairing game
- Multiple Choice – Create flexible multiple choice questions
- Personality Quiz – Create personality quizzes
- Questionnaire – Create a questionnaire to receive feedback
- Quiz (Question Set) – Create a sequence of various question types
- Single Choice Set – Create questions with one correct answer
- Sort the Paragraphs – Create a set of paragraphs to be sorted
- Speak the Words – Answer a question using your voice (Chrome only)
- Speak the Words Set – A series of questions answered by speech (Chrome only)
- Structure Strip – Interactive structure strip
- Summary – Create tasks with a list of statements
- Timeline – Create a timeline of events with multimedia
- True/False Question – Create True/False questions
- Virtual Tour (360) – Create interactive 360 environments
How do I create my own H5P interactive content?
There are 3 quick ways to start creating H5P content:
- Use the free H5P.org authoring tool (free user account required) and publish content on their server
- Add the H5P plugin to your existing publishing system (WordPress, Moodle or Drupal)
- If you are a University of Edinburgh staff or student, please contact us for free access to this H5P repository (you will be given your own dedicated space within this website)
University projects using H5P
For news about University of Edinburgh projects and people using H5P interactive content please read our ‘H5P’ tagged blogs posts.
Disclaimer
Please be aware that this website is not an centrally supported ISG business service (high priority), but a technical service which relies on the lower priority ISG web hosting service.
Accessibility
How accessible is H5P content?
H5P content types have all been tested against the criteria for Web Content Accessibility Guidelines (WCAG) 2.1 AA support. The content types have gone through a lot of testing with various screen readers, keyboard navigation, zooming, code inspection and more.
Full list of H5P content types and their accessibility status
WCAG 2 requirements (success criteria) and techniques
Guidance on making your H5P content accessible
For expert advice on making sure your courses are inclusive and accessible please read the University’s Learning Technology and Accessibility webpages:
Accessibility guidance for course creators
University’s Accessible and Inclusive Learning Policy.
OERs
Open Education Resources (OERs) are online resources that are available for others to use to support learning. They are part of a worldwide movement to promote and support sustainable educational development – the use of the term ”OER” is attributed to a UNESCO workshop in 2002. The sharing of open educational materials is in line not only with University of Edinburgh’s mission but also with a global movement in which research-led institutions play a significant role.
The University of Edinburgh has an ‘OER policy’, which outlines the institutional position on OERs and provides guidelines for practice in learning and teaching. You can find the policy on the Academic Services, Policies page under ‘Learning and Teaching’, or link directly to the document here:
To find out more on OERs please visit the University of Edinburgh’s Open.Ed website.
Exemplars
Below is a small selection of H5P content types that you can play with, download, share or embed.
Image Hotspot
Interactive Video
Image Juxtaposition
The Ecce Homo (Behold the Man) in the Sanctuary of Mercy church in Borja, Spain, is a fresco painted circa 1930 by the Spanish painter Elías García Martínez depicting Jesus crowned with thorns. Both the subject and style are typical of traditional Catholic art.
While press accounts agree that the original painting was artistically unremarkable, its fame derives from a good faith attempt to restore the fresco by Cecilia Giménez, an untrained elderly amateur, in 2012. The intervention reinterpreted the painting and made it look similar to a monkey, and for this reason it is sometimes known as Ecce Mono (Behold the Monkey).
Compare the painting before and after by sliding between the two images.
Both images within this interaction are copyright © Associated Press 2013.