Making Images Into Div tags …

  • Firstly create a new file in your root folder named ‘images’ so you can store all the images for your website.
  • Go to the HTML and find the image you that you want to place into the Div tag.
  • Open the image into Photoshop.
  • Before doing anything make sure the file is in RGB.
  • Use the crop tool to adjust the image to the right sizes of your Div tag.
  • Before changing the sizes, make sure you make the sizing pixel/inches. And the resolution 72 as it’s the standard resolution for wed based designs.
  • When complete, insert the accurate sizing’s of the Div tags on the image.
  • If the image is digital based save it as a GIF, if it’s a photographic image save it as a JPEG.
  • With both settings you can change the sharpness of the image helping it fit best with your website.
  • Once you have completed this save the image to your file on the root folder, but make sure when closing Photoshop you click don’t save as it will save it as the cropped image otherwise.
  • Delete the text in your div tag and click insert image, and chose the image you previously cropped.  Make sure you fill in the description box with the appropriate text describing the image.
  • Finally open up the images in a browser to see if it is all successful.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s