What size images work best?
Images are the rocket fuel for quizzes – the right pictures can turn an average quiz into an awesomely engaging one.
Riddle’s quiz maker gives you a range of image options, including Google, Pexels, Giphy, and plus uploading your own images or animated GIF. (You can also use videos like YouTube, Vimeo, or your own MP4 clips – or add MP3 audio files.)
Plus – you can edit/crop any image directly in our quiz creator.
You can make quizzes in three orientations – wide, tall, or square. Each uses different image dimensions.
- Widescreen: 960 x 540
- Square: 720×720
- Tall: 720×960
- File size: 250KB is a good target.
- Format: .jpg or .png
Using our ‘Epic’ layout?
Every image (except answer choices) do not have a fixed size. Instead, we center the images as the background (title, questions, answer explanations, results) – they resize automatically for each question based on how much text or how many answer options you have.
Want to learn more about adding animated GIFs to your quiz? Click here to skip ahead to that section.
Orientation for quiz images in the title screen
- Your orientation will apply to every main picture quiz-wide.
- You can’t mix/match different ratios in a quiz.
- All quiz answer images must be wide (16:9) ratio.
Please note: once you select a format, every main answer image will be in that ratio… for example, you can’t mix/match wide with tall images.
This is on purpose – we didn’t want your quiz resizing every question to accommodate different image layouts.
Example image dimensions – by orientation
Let’s take a look at an example question and the right image sizes.
Here’s our default ‘wide’ option – 16:9 main image and 16:9 answer images.
Next up? Our ‘square’ option – with 1:1 ratio images in the main question and title images, plus 16:9 for answer images.
And here’s our ‘tall’ option – best for portrait-style pictures, with 9:16 ratio main question images, and 16:9 pictures in answers.
Our ‘Epic’ layout – a special case
Our Epic layout is a little different – we move each question’s main image to be the background. (Answer pictures are still 16:9, however.)
This means your quiz height might vary every question – based on how many answers options or how much text you have.
However – you can use our wide ratio as a good starting point.
Need to edit your image size?
We include a ‘crop’ tool – just click on ‘edit’ on any image.
(We’re also big fans of Canva’s image editor – free for most users, and you can quickly create images around a certain dimension.)
Don’t worry if your file is bigger than that. We automatically compress all pictures by 80% – which works for most folks.
However, a smaller image will mean your quiz loads faster for your quiz takers.
If you have some very large files, you can speed up your quiz loading times by reducing the overall pixel dimensions and file size.
For example, in our example, a 400KB file uploaded becomes a 50KB file – but a 10MB file would still be 2MB… which can result in slow load times for your quiz takers, especially on smartphones.
Animated GIF file sizes
Animated GIFs are super popular – and great for engagement.
How big is a typical GIF file? That’s a common question – and figuring out the file size for an animated GIF’ is a little tricky.
Don’t look at the file size in your computer.
Instead, a GIF’s size is the total resolution x the number of frames.
Our image provider has a 100MB limit for your GIF’s total file size.
With animated GIFs, file size really is <resolution> X <# of frames>.
So for example, a GIF of 1,000 pixels high x 800 pixels wide x 200 frames = 800,000 pixels x 200 frames = 160,000,000 bytes (160MB!).
Average size of a GIF
We’re often asked – how big should a GIF be? There’s no standard GIF size or the right average size of a GIF – but here are some tips:
- To avoid this issue, you want to make each frame as small as possible in Photoshop or whatever your designer used.
- 960×540 for our wide format is ideal.
- Second, you can reduce the # of frames per second – something like 5 or 6 per second is fine.
- Third, you can use a free tool like https://ezgif.com/optimize to reduce the file size by about 40%.
But your .GIF size can be a big files – and they’re a bit slower slow to load, especially if you’re using several in a single riddle quiz. (Unless you’re using our new lazy loading option – which cleverly loads ‘just in time’ vs. loading all of your quiz images at once.)
Quiz GIFs auto-converted to video – for faster loading
The good news?
Now, all animated GIFs you upload (or use from Giphy) will automatically be converted to MP4 videos (max file size: 7MB).
No loss of quality, and a much faster experience, especially for mobile users on slower connections. Huzzah!
Any questions about images or GIFs?
Ask away – we’re happy to help answer any questions about images or animated GIFs.
We’re often asked about GIFs in particular – such as the average .GIF size or what’s the best .GIF file size in your quiz.
And we’re fast – use our support chat, and you’ll see our entire team from our CEO Boris on down drop everything to answer you quickly!