Media
Images, videos and sounds Feitio did not draw. Feitio gives the frame; the person gives the image.
On this page
The role of media
Images are content, not decoration
A photo gets in because it shows something the text cannot: a product, a place, a person, a result. Stock images "for atmosphere" stay out.
Drawings at home; photos in facades
At home, visuals come from Feitio’s hand drawings, and photos appear only when they are the content itself. In outside facades, photography belongs to the client and can take the lead; Feitio only gives the frame: corners, ratio, caption.
Images
Feitio’s frame: the usual uneven corners, no border, no shadow. The image sits on the paper, it does not float. Fixed ratio, three for everything: the page does not jump when the image loads, and a row stays aligned even with photos of different sizes.
A caption when context is needed
Who, where, when, where it came from. In the sans, small, right below the image.
No filters
The image shows as it is. No extra saturation, no orange tint, no gradient on top.
Do
Feitio corners, no shadow, the image as it is.
Don’t
Blurred shadow, perfect round corner and boosted color: the image becomes an app card.
Detail that matters is seen at full size
A product photo, a screenshot or a detailed diagram must be zoomable. The image itself links to the full file, opening in the same tab: looking and coming back is what the back button already does.
At night, photos stay as they are
A photo is never darkened or inverted. Drawings and diagrams made in ink use the text color and switch with the theme on their own.
Alt text
Every image has alt text (alt): what someone who cannot see the image needs to know about it, right there.
| Image | Like this | Not like this |
|---|---|---|
| Product photo | Brown leather bag with a long strap and a gold clasp | imagem_bolsa_01.jpg |
| Chart | November backups: 29 done, 1 late on the 12th | Chart |
| Avatar next to a name | (empty: the name is already written next to it) | Profile photo of Ana |
| Decoration with no information | (empty, alt="") | Decorative image |
- Describe the purpose, not the technique: no "image of" or "photo of" at the start, unless the type matters.
- If the image repeats what the text next to it says, the
altstays empty, so it is not said twice. - Complex chart or diagram: the
altsummarizes, and the numbers also go in a table or text.
Video and audio
- Nothing plays on its own. Video and audio start when the person presses play. No autoplay, not even muted.
- Controls always visible: play, pause, volume, time. The browser’s are fine.
- Captions and transcripts. Video with speech has captions; audio has a transcript right below.
- Reduced motion applies here too: background video and looping animation do not exist in Feitio.
- Show the duration before play: the person decides whether they have time.
Weight and loading
- Images below the first screen load only when they get close (
loading="lazy"); video does not download before play (preload="none"). - File size follows display size: no 4000-pixel photo in a thumbnail.
- The fixed ratio reserves the space before the image arrives, and the page does not jump.
- While loading, the plain raised surface shows. No blinking skeletons.