When placing images in your FAQs, keep your app’s supported device ratios and default app orientations in mind. These settings can impact the appearance and rendering of your images, causing them to appear blurry or pixelated.
Though you cannot manually resize images within the Text Editor, Helpshift automatically creates thumbnails and compresses file sizes for varying resolutions with fidelity to keep the original ratio intact. Images are rendered in a web view on the FAQ page and are loaded just like a typical web page.
Typical device aspect ratios (landscape):
- 4:3
- 3:2
- 16:10
- 5:3
- 16:9
Depending on the device orientation, the width of the image will be maxed and height will be adjusted. Let’s use a 5 inch diagonal high density device with resolution 720 X 1280 as an example:
- An original image of 1464 X 1130px will be resized to 480 X 370px
- Any image which is greater than 480px wide will be resized to 480px (max width)
- Any image which is lesser than 480px wide will not be resized, and will have more quality retained
Please note that, on the web, clicking on a compressed image causes it to open the full size image in a new tab. Additionally, the max-width value will vary per device, so take time to adjust this value per the most common aspect ratio and resolution used by your users. Developers have access to override the max width with custom CSS. We recommend bringing the size of your file down to 1-2 mb to ensure the fastest load time.
The following image formats are supported on Helpshift:
- .PNG (recommended)
- .JPG
- .GIF
With regard to images with embedded text: keep in mind that due to compression and resizing, embedded text may lose enough quality to compromise legibility. This can also be an issue with longer, vertical images.
Smaller images with width lesser than or equal to max width are recommended for use to prevent quality loss due to resizing.
GIFS can take 4-5 minutes to process. After processing, the file is immediately available on mobile, web, and the admin dashboard.