Creating a folder structure for your website

First, let’s get all the written content you created earlier into folders to make life easy down the line.

1. Create a new folder on your desktop and name it My Website.

2. Within the My Website folder, create folders for every page you plan to have on your site and name them Home, About, Gallery etc.

3. If you have sub-pages (for example, sections of the Gallery), create folders within the folders you have already created. So for within the ‘Gallery’ folder for Daren Redman’s site I included two sub-folders for the different sections of the gallery (‘Art for the home’ and ‘Installations’).

4. Now open a new document in a plain text editor such as TextEdit for Mac or TextPad for Windows and name it HomeText. Write the text for your homepage in this document (if you have already written it in a different programme such as Word, copy and paste it into a plain text editor with no formatting). Having no formatting will make life much easier later on when transferring the content to WordPress.

5. Save this document to the folder you created called Home (which is in the My Website folder).

6. Repeat Steps 4 and 5 for every page on your site. For any pages with sub-pages, create a new document for each sub-page and save it to the appropriate folder. For example, if you have chosen to have a sub-page entitled ‘Quilts’ under the ‘Gallery page’, type up the introductory text for this section followed by a list of the images included, along with their individual information (Title, year, dimensions, techniques used etc.).

Preparing images

Now let’s get your images web-ready in the simplest way possible (using Adobe Photoshop) and organise them into the folders you’ve created.

There are free online tools that can perform the same transformations; these include Pixlr.com.

Although there may be further image editing to do once you’ve chosen a theme for your website, the majority of image optimization can be done in advance.

In general, the smaller the image (in kilobytes) the more web-friendly it is. Large images may look great, but they can significantly slow down your site and take a long time to load. It is of course important not to severely compromise the quality of images, especially as your are building a website specifically to showcase your artwork. Photoshop can significantly reduce the image size without it becoming distorted.

1. Open your image in Adobe Photoshop.

5. On the right hand side of that window, select JPEG from the Optimized file format dropdown menu. JPEG is generally the best option as images can be compressed to up to 5% of their original size making them quick to load on the internet.

NOTE: If you are showcasing a sculpture or something that requires a transparent background, a PNG file format will better suit your needs.

6. Underneath that you’ll see options for Compression Quality in another dropdown menu. It is tempting to choose Maximum because you want your images to look as crisp as possible. I would suggest that High is nearly always the best option, as it gives us the best of both worlds: good image quality and relatively small file sizes. Selecting the High preset will automatically set the Quality setting to 60.

7. Make sure the Optimized option is checked – this will reduce the file size further, making it even more web-friendly.

8. Next click Save and give the file a name. I like to use the following naming convention as it makes things easier when uploading to WordPress later on.

Artistname_artworktitle_year.jpg

So for the image I’ve been preparing for Daren Redman’s site I would name it: darenredman_breakingdown_2011.jpg.

9. Next choose the folder in which you’d like to save the image to (refer to the list of images you made earlier so you know where to place it – if you’d like the same image on more than one page of your site, save it in both of the appropriate folders) and click Save.

10. Repeat the process for every image you wish to use on your artist website.

[mc4wp_form]