Friday, September 16, 2011

Uploading Image to Server - How to Make Your Pic Stick

Uploading image to server; a very basic skill for those who are new to the art of website creation. For me it seemed so simple when it was first explained. You simply open your web editor, put the cursor where you want the image to be and click; then click on the image icon in your web editor. A window will appear where you will fill in the details about the location of your desired image, click again and voila! The image pops up right where it is supposed to be. It sounds simple, right?

Everything seemed to work fine until, after uploading, I attempted to view my newly created page live on the web. It was then I realized that for some reason the image had not uploaded correctly. Everything was there on the screen minus the image. For some reason it just wasn't there!

The image was there when I had created the new page for my website and viewed it with the web editor on my computer at home. I had obviously done something wrong while uploading to my hosting account.

Odds are that this scenario is something you will have to or are currently dealing with if you are a newcomer to website creation. Be of good cheer, this is a skill that is not hard to master once you know a couple of things to be on the lookout for.

There are two main reasons that I have found are the culprits of this dilemma:

The first mistake is easily understood once discovered. The image simply was forgotten when uploading to the hosting account.

The files that you have uploaded to your host are the various pages of your website and mixed in among those files is your image folder. Since all of the images for your website are kept in the image folder, it makes perfect sense that the new image must be uploaded to the image folder at your hosting account for the whole thing to work correctly.



The second mistake can be a bit tricky for newcomers in terms of understanding what has gone wrong.

The problem can arise if we end up with more than one copy of the same image on our computer. For example I usually duplicate images to a folder I've labeled 'webimages' in case I want to use them in future projects. So I end up with two of the exact same image on my computer; one in my webimages folder and one in the folder of the project (website) that I am working on and will eventually be uploading to my hosting account. In this project folder there is a folder labeled 'images' not webimages. Now I have a situation where the same image is in a folder labeled webimages and in another folder labeled images. Although both images are identical their locations are not and this is where the possibility for a mistake arises.

When creating a web page we use web editing software that allows us to create the visual effects that we desire. As I mentioned earlier the web editor will prompt us for details about the location of the image that we are using. It will show an image and give the option to click 'OK' if this is the image we desire. It is all too easy, seeing the correct image, to be unaware that we are looking into the wrong folder. We must pay close attention here, as we view the image, that we are also observing the details presented about the folder we are looking at.

In the example above the wrong folder would be my webimages folder. The web editor is going to prompt us to click 'OK' if this is the image we want. Once we click 'OK' the location of that image will be established in the computer code. If we establish the location as a folder (webimages) that does not later get uploaded to our hosting account then, once at our hosting account, the computer code will be looking for a folder that is not there.

We must make sure that we are looking at our desired image in the correct folder (images folder) when we indicate to the web editor that this is what we want. That way when the project folder (which has our images folder inside) is uploaded to the hosting account the image that is in the correct folder, and therefore the correct location, will go with it.

0 komentar:

Post a Comment

 
;