Images and Media Assets
Overview
Images can quickly help visitors understand your brand, products, works, and spaces. However, images are also the easiest way to make a website look unprofessional: too large and they fail to upload, too small and they become blurry, and without descriptions, search engines and assistive tools won't understand them.
Kanorio's general website images are uploaded and used when you edit a module. Currently, there isn't a separate "media library" for you to store and select from. In other words, decide which module the image will go into first, then upload or select the asset from that field.
Where to Upload Images?
Image fields appear depending on the module. For example, page hero images, image and text layouts, image galleries, product displays, header logos, website favicons, and page share images each have their own image selector.
1. Open the Module to Edit
Click the module in the editor preview, or select it from the "Layout" list. Once you find the image field, click to upload, select, or replace the image. If you don't have a suitable content block yet, you can add one from "Sections".
2. Choose the Image Source
The image selector typically offers three sources: "Upload," "Image URL," and "Stock Photos." You can select files from your computer, paste a publicly accessible image URL, or choose images from Pexels or Pixabay stock libraries. After selecting, wait for the load to complete, then confirm the preview is correct.
If you see a cropping tool, adjust the visible area before completing the crop. Don't rush to leave the settings panel before cropping is finished. When using external image URLs, ensure you have the right to use them and that the source website allows public loading. If the source removes the image, changes the URL, or restricts access, your website may no longer display it.
3. Fill in the Image Description
For fields that support ALT text, provide a description next to the image. ALT text is not lengthy copy for general visitors but a brief, specific explanation of the image's content.
Supported Formats and Sizes
General website images can be uploaded in JPG, JPEG, PNG, and WebP formats. The maximum file size for a single file is 10 MB. Files exceeding this size, empty files, or unreadable files will be rejected.
General Images and Media Storage
General website images do not count towards the media storage quota for PDFs, audio, and videos. However, this does not waive the individual 10 MB file size and format restrictions for images. If you need to upload or manage PDF, audio, video, or digital product files, please read Managing Website Storage.
| Format | Suitable Scenarios |
|---|---|
| JPG / JPEG | Photos, venue shots, portraits, and images with rich color gradients. |
| PNG | Logos, icons, or design drafts requiring a transparent background. |
| WebP | For a web-friendly format that typically results in smaller file sizes. |
| HEIC / HEIF | Common iPhone formats; after selection, they are converted to a compatible image in the browser before uploading. |
HEIC or HEIF are not formats directly stored by the server. Kanorio will first convert them in your browser and then process them as uploaded compatible images. If conversion fails, please export them as JPG on your device and try again.
The system also limits mass uploads within a short period. The current protection limit for general image uploads is 20 times per minute. If you are temporarily restricted, please wait a minute before trying again; do not repeatedly click.
What is Image ALT Text?
ALT text (alternative text for an image) is a piece of text describing an image. It provides an alternative explanation when an image cannot load. Visitors using screen readers will also understand the image through it. Search engines like Google also use it to help understand image content.
Good ALT text describes "the key visual elements" rather than stuffing keywords.
| Poor Practice | Better Practice |
|---|---|
| Coffee, Taipei coffee, coffee shop | Hand-drip coffee and light roast beans on the counter at a Taipei coffee studio |
| Image | A dark brown handmade tote bag displayed at a leather goods studio |
| Our best service | A consultant explaining brand strategy to two founders at a conference table |
Decorative images may not require detailed ALT text. However, products, works, people, venues, processes, and important infographics should be clearly described.
Automatic Image ALT Text Completion
In the editor's "Settings" → "Advanced", you can enable automatic image ALT text completion. When you publish or update your website, the system will attempt to add descriptions to compatible images missing ALT text. It will not overwrite text you have manually entered. This provides basic assistance, but for important images, it's still recommended to manually review and revise, as the system cannot know which specific detail you most want visitors to understand.
Free Stock Photos
The image selector provides two free stock photo sources: Pexels and Pixabay. When you don't yet have your own images ready, you can search by keyword and then select suitable photos to add to your module.
Pexels and Pixabay Usage Licenses
According to the current terms of the Pexels License and Pixabay Content License, content from both libraries can be used for free on personal and commercial websites. You can also crop or modify them as needed for your website. You do not need to pay extra, nor do you need to credit the photographer or stock photo source on your public website.
Kanorio will display the image source and photographer information in the selection interface, making it convenient for you to learn about the creators. If you wish to credit them, it is still a welcome practice.
These licenses do not mean "no restrictions on any use." Do not sell or redistribute stock photos as standalone assets without substantial modification, nor use the images themselves as trademarks, brand logos, or other identifying marks.
When using stock photos, choose images that genuinely represent your content. For restaurants, shops, products, teams, or works, if you have real photos, prioritize using them. They usually build more trust than generic stock images.
Stock photos may still contain recognizable people, trademarks, brands, buildings, or artworks. When an image will be used for core brand visuals, advertising, main product images, or other sensitive contexts, please first confirm whether you still need consent for models, trademarks, portraits, property, or other third-party rights. Neither Kanorio nor the stock photo terms can substitute your own judgment regarding licensing for specific uses.
Image Quality and Website Performance
Kanorio uses Cloudflare Images to store and deliver general website images, allowing public websites to obtain more suitable image versions based on usage context. You should still select clear images with appropriate composition from the source, as the system cannot turn an originally blurry photo into a clear, professional one.
Before uploading, consider these principles:
- For banners or covers, choose landscape images; for portraits or vertical works, choose portrait orientation.
- Do not place important text near the edges of images, as it might be cropped out on mobile devices.
- Use similar aspect ratios and lighting for a group of portfolio images for a more consistent look.
- Do not compress to the point of pixelation just to reduce file size; also, do not upload files much larger than actually needed.
Share Images and General Images
When someone shares your page on platforms like Facebook, LinkedIn, or X, a social sharing preview will appear. This image is called an OG image (social sharing preview image) and is not a general module image.
Please manage the share image for each page from the SEO settings in "Pages". If you haven't manually uploaded a share image and the automatic share image function is enabled, the system will generate a preview image based on the page title and brand settings. For a deeper understanding of SEO, please read "Complete SEO Setup."
Videos and Other Media
This article primarily explains general website images. If you want to display YouTube, TikTok, Spotify, Apple Music, Podcasts, forms, or booking tools on your website, use the corresponding integrated modules instead of uploading video files as images.
Tips
- Before uploading, add the purpose to the filename, e.g.,
coffee-studio-bar.jpg, to make organizing local assets easier later. - For important images, write the ALT text before publishing; don't wait until an SEO check to fill them all in at once.
- After replacing an image, preview it on mobile to check the cropping result, especially for covers and full-bleed images.
- Stock photos are just a starting point; once you have real case studies, prioritize replacing them with your own photos.
Frequently Asked Questions
The maximum size for a single image is 10 MB. Please first reduce the dimensions or export a more web-appropriate JPG, PNG, or WebP using photo editing tools, then re-upload. Do not repeatedly upload the same oversized file.
It might be due to low original image resolution, the image being enlarged beyond its original size, or only a small area remaining after cropping. Use a clearer original image and check the cropping area in the preview.
Yes. The "Image URL" tab in the selector allows you to paste a publicly accessible image URL. The system will warn you about the risks of external images. Only use sources you have the right to use; do not paste URLs that require login, expire, or are not allowed for external loading. If the image is a critical asset for your website, it's more advisable to upload your own file to avoid issues if the source website changes its address, removes the image, or restricts access.
Check sequentially that the file does not exceed 10 MB, the format is correct, your internet connection is stable, and you are not uploading a large number of files in rapid succession. If it still fails, try again after converting to JPG or WebP, and record any error messages for customer support assistance.
Important content images should have ALT text. Purely decorative images may not need a long description, but ensure that images of products, works, service processes, or those containing important text are not left without a description.
Yes. According to the current licensing terms of both stock libraries, their content can be used for free on commercial websites, and usually, you do not need to credit the source yourself. However, recognizable content such as people, trademarks, brands, or buildings may have additional rights restrictions; please verify yourself before important commercial use.
Kanorio attempts to convert HEIC or HEIF in the browser. If your device or the image cannot be converted, please export it as JPG on your phone or computer first, then re-upload.