How can I store my own images online?

Question

How can I store my own images online so that I can link to their urls within my own websites?

Answer

There are sites that allow you to upload your images to the web. Once your image is uploaded, you can then use its web address as the value for the <img> element’s src attribute. More commonly, images and project assets are stored within a folder that also contains our HTML document. This allows developers to create paths to be used as src values that are relative to the HTML document. In other words, images and HTML files often exist on the same server or computer.

21 Likes

10 posts were split to a new topic: What happens if the site where the image is hosted is down?

2 posts were split to a new topic: Is the a way that I can reduce the size of my image?

2 posts were split to a new topic: Use a file path from your personal computer to upload an image

6 posts were split to a new topic: Do i need to always have my personal computer active

Are there any advantages in uploading images in one’s own site? Or is it just a waste of space because you can just upload it somewhere else and then insert the link of the image in one’s site?

The advantage would be that you have better control over the images if they are on your own server (or stored in your own hosting account). If you wish to keep images from being indexed by search engines then this would be where to start.

The downside is that your pages may load slower if the images are large files. Most servers only allow two connections at any one time. The more images in the page, the longer the download process will take.

There are ways we can optimize images so they load quickly among which are using fixed sizes to match the width and height attributes and save the files as optimized for the web. A 400 X 300 JPEG can be optimized to as low as 32kb (or lower) at a reasonable quality level (compression) so that they take virtually no time to transfer; or, using a single image comprised of all the images much like a contact sheet a photographer would create. Using CSS the images can be located in the sheet, also known as a sprite.

CDNs (Content Distribution Network) are useful for a couple of reasons…

  • they have several hundred (or thousand) servers, all storing the same content but situated in various high traffic regions of the world;
  • they offer more consecutive connections than the two allowed on the host server so more downloads can take place in background.
12 Likes

Will images be indexed by search engines through reading their alternative text? If so, why not just have the text somewhere else and save storage?

If large images load slower, what about using SVG (vector) images?

Not as a direct result, no. It’s their IMG tag and SRC attribute that the robots crawl for. The alternate text comes into play when the search engine is determining where to insert the image into the index (as in which index to add them to).

Consider,

  • A search robot discovers a link to your site.
  • The robot requests the resource.
  • The robot’s boss, the search server quickly parses the document and creates a list of href and src attribute values.
  • The list above gets compared to the index and rankings of the target sites are recalculated’.

The next step is to continue crawling your site. Search engines know to look for specific pages and folders.

Home
About
Contact
Products
Services
etc.

and,

images
videos
audio
media
etc.

If there are no robot restrictions and those folders are searchable, the SE will add every file to the ‘src’ list that it already has. We can protect folders, but that is for another discussion. Just know that search engines will go anywhere we do not restrict them from going. A web server is a search robot’s playground. Like JS, they are determined to get the job done by whatever means.

2 Likes

What’s the image tag?

<img src="url_to_image_file">

1 Like

This is old so not sure if I will receive any reply, but it seems like the URL for Instagram posts will not work, I guess because to have o .jpeg/.png at the end? Ar all Instagram photos not usable with the tag?

Many sites protect the images on their platform to prevent what is known as, hot-linking, a practice highly discouraged on the web because it steals traffic away from the host site of the image. To see the image we have to be on the host platform so they can get paid for the advertising embedded in their pages.

Best practice: Never link to images on another site unless you have their written permission to do so, on an image by image basis.

1 Like