Image Naming Conventions

When saving images for web usage it is important to adhere to a naming convention or folder structure to keep your files in a logical order. When working on large web designs you can quickly lose track of file names and where they were saved. I thought I would share the convention I am currently using to organise my images.

image

As well as these folders I also like to name image files using prefixes. An example of this is icon-help.gif, bg-sidebar.gif, btn-approve.gif. I find that by using this structure and image prefixes I save a lot of time trying to remember where certain things are saved when I am writing my CSS and HTML.

As well as saving time when writing the code it also provides a baseline when re-using CSS code. I can just save the image using my convention and the CSS can already be written.

It would be good to hear other ways and ideas of naming images.


Share this article

Posted in Development

Call us on 01785 279920

Our friendly Magento experts are happy to answer your questions.

Contact us now

Email alerts

Get the latest eCommerce news, reviews and expert advice in your inbox.