When converting an Adobe Photoshop PSD to a website HTML template, there are additional tasks that must be performed in order to provide the needed search engine optimization; in order to ensure that the website will receive proper spidering from search engines such as Google and Bing. By simply converting the template from PSD to HTML and ignoring the formatting that Adobe Photoshop places in the HTML file, you lose valuable code within the template of your website.
Upon reviewing the HTML code, you will see various meta structures that are placed in your newly created HTML template after the document has been converted from Photoshop. There are multiple things that you will need to change within the document’s code in order to receive proper SEO crediting and search engine spidering.
Below are the list of changes that need to be reviewed and corrected:
1) Meta description and keyword tags
2) Title tags
3) Alternate text for images
You should first create a meta description and keyword tag for your page, that includes your business’ description; which will appear below the listing within a search engine’s search query. This description should include your website’s keyword, as it is important to mention the keyword in text multiple times so that the search engine spiders will be able to properly categorize your website.
Keyword tags should also be implemented into the section of your website. Within this section, you should list keywords that are relevant to your website and your business location in order to be categorized properly and found more easily within a search.
Alternate text / “alt” tags should also be added to images as a description.
In addition, there are ways to optimize the site during the conversion of your document to HTML from Adobe Photoshop. The most important and easiest step is to name the files properly during the “Save To Web” option that is chosen during conversion. When the filename box appears, you should enter your site’s main keyword as the filename to save the document and images.
For instance, if you are selling aquariums in Los Angeles, name your images and files “aquarium-store-los-angeles” – which provides an extra keyword within your website from the images. In addition, your images will now be listed in Google Images search under the keyword that you just provided as a filename. If someone searches for “Aquarium Store Los Angeles” within the Google Images search, they would easily be able to find your website through this method. The main reason that you would appear so high in the rankings in an image search is that most other website designers ignore this simple technique of gaining additional traffic and SEO.
Alex Petrovic — Advanced SEO strategist is a link building team leader at Dejan SEO company. Besides regular SEO services as reputation management, viral marketing and social media, my main interest is web design.