To insert an image in Markdown, a syntax very similar to that of links is used. The basic syntax for inserting an image is as follows:
Copied!
Where:
![Alternative Text]is the text displayed when the image cannot be loaded or to provide an image description for accessibility.(Image URL)is the address where the image is located. This URL can be a link to an image on the web or a relative path to a local file.
By default, images in Markdown are very limited in terms of options. We cannot specify size, or alt.
Basic Example
Suppose we have an image named kitten.jpg in the same folder as your Markdown file, the syntax to insert it would be:
Copied!
If the image is hosted online, for example, on a web server, you can use the full URL:
Copied!
If we render it… oh, a kitten photo!
The image “kitten-photo.jpg” won’t work for you, because it’s an example. Replace it with a public image you can access.
Best Practices Tips
- Image Size: Ensure images are not too large to avoid slow loading times. Compress images if necessary.
- Image Format: Use appropriate image formats for the content, such as PNG for graphics with text and JPEG for photographs.
- Accessibility: Provide meaningful descriptions in the alternative text to improve the accessibility of your documents.
