Saturday 28 May 2011

Manually Resize Pictures and Add Tags

If you include a lot of images in your posts, then you may find it useful to resize pictures manually to ensure they fit well on your page and it can help to balance them out so that the series of images are in proportion to each other. This offers more control than if you use the pre-set small, medium or large options that Blogger offers.

You may also find it useful to add image tags (also known as 'alt tags'). If you're unfamiliar with these tags, they are the pop up tags that often appear when you hover your mouse over the image. These are there for people who are unable to view the images, but they are also useful for getting your images to rank in search engines. If you have a website or blog that supports the sales of your handmade or other products, then this is a good way to help people find your blog or products via searches such as Google Images.

To resize your picture's manually, rather than using the small, medium or large, the  first thing to do is upload your images. It is still worthwhile using the size the corresponds with the general size  you wish to use, and then start to resize the images once they are on the blog.


The first step to change the image size is to click on the Edit HTML tab (no. 1).
Once you are on this screen, you then need to look for the width and height part of the code (no. 2). These may be grouped together or further apart, depending on your blog.
To resize the image, you need to change these numbers. One of the most important aspects of this is to ensure that you keep the proportions in balance as much as possible to prevent your picture from looking distorted.

In this second screen shot, you can see that I've changed the sizing to reduce the images roughly by half, bringing the size down from 810 x 720 to 404 x 362.  (If you have an image that you wish to make bigger, be aware that this may result in fuzziness/image pixellation. )


Once you've done this, take a look in the preview and make further changes as necessary. The more familiar you are with this, the easier it will become for you to estimate sizes.


The final step I'm going to show is how to add in image tags to describe your pictures. To do this, look for the part of the code marked alt. Next to that between the " and " you can add a few words to describe your image. The more relevant these are also to your post content and overall blog content, the better it is for your blog or site SEO.

Once you've done all that - you can preview your post and if you're happy, it's ready to be published!

Tuesday 3 May 2011

Crafty Blog Colours

Welcome to my blog - I'm really excited to be starting this new 'venture'. If you've already visited my other blog, then you're probably know how much I love crafty stuff and all things handmade! (And if you haven't been there, you can visit my other blog - Lulliloo - here!)

I don't really talk about my everyday work over there, so it's going to be a whole new experience for me to be writing my own blog and talking about things like SEO, web design and online marketing. Hopefully I'll be able to come up with lots of useful and interesting information that will be relevant for all those out there who love crafty stuff as much as I do and are trying to figure everything out when it comes to starting an online home based business.

Colour is so important in design, and if you're setting up a blog, getting the right colours and doing it consistently may be a little overwhelming. If you're like I was when I started my first blog about 6 years ago - you're probably wondering how on earth to keep track of the colours you've used so that you can create a really 'clean' and pretty blog. (And if you're a crafty sort like me, you're probably grinding your teeth in frustration that you can't get everything just right!)

So for my first post, I'd like to introduce you to a site called Colour Lovers. Whether you're looking for a great palette to use on your blog, or looking for a way to store a palette that you already use, you'll find this site has everything you need. The great thing about this is that you can keep track of your favourite palettes, or you can create one that you can then use as you make changes on your site.

You will have to register for the site, but this is a good way of keeping track of any colours/pallettes you've used - and you'll find a host of other features on there including patterns (which is how I created the background here). And in my book, having your palette stored in one place instead of trying to use a colour picker tool makes life a whole lot easier!

Once you've signed in, you'll need to select the palette option like this:


This will then take you to a screen similar to the shot below. Here you'll be able to pick the colours you like and save them as a palette of up to 5 different colours.
 

After you've chosen the colours that you want, you can give the palette a name and scroll down the page to save it. Using the colours you've chosen, you can now accurately and consistently make changes to your site - knowing that you're using the same colours each time.

The screen shot below here shows 4 of the 5 colours in the palette that I used for this blog - and in order to help you when you're making changes to colours on your blog, I've circled some important things here that I'll explain now.


The circle on the left shows a number called a Hex number. This is used in the HTML code of your blog to identify the colour for fonts, borders, backgrounds and a range of other colour related selections. If you've been trying to use the colour picker each time, you'll find that you can now use this number instead. Best of all, this number can be used in other design programs, so you can create headers, banners, frames and even blog signatures, all in the same colour by simply using this number.

The 3 numbers circled on the right work in a similar way, and these are Red Blue Green numbers (or RGB). If you use these, you'll need to enter the 3 different numbers into the corresponding spaces, so generally, it's much easier to work with Hex numbers RGB is not usually used when carrying out basic blog changes.

Colour is one of the most important ingredients in a great design and once you have picked out your perfect palette, you can make sure that your colour choices are coorinated across different sites and when creating things like headers, buttons and even pages for your online stores.