Email management: Gmail setup for your email address

Do you log into different places to check your various email addresses? Why?! Watch this tutorial to see how to set up gmail to be able to seamlessly use your various emails. You can compose an email to be sent from any email address you own, and when you reply to an email it automatically replies from the email the message was sent to. Get things done more efficiently by only logging into one place for all your emails.

Email management - set up gmail to manage all your addressesVideo link: https://youtu.be/UUDL1OfKnI

.pngs and .pdfs – Why those two file types are all you need.

If you have a graphic or a logo designed, you will be likely to receive 6, 7, 8 or more file types for the same image. In reality you need only 2 – .png and .pdf. All other file types can be converted/saved from these!

What image file type are you most comfortable with? Chances are, you like .jpg [jay-peg] or .bmp [bitmap]. That’s because your pictures are (usually) saved as .jpg, or because you use Microsoft Paint which automatically saves as .bmp.

Am I right?

I’d like to explain more about image files, in particular RASTER files and why my favourite two file types are .png and .pdf. First, heres a quick summary of what you need to know when you commission, or receive graphics:

Image files come in two types: RASTER and VECTOR.

 

RASTER files are made up of lots of tiny dots. If you zoom in the dots get bigger and your image looks ‘pixellated’, however these are the best files for photos, images with lots of detail, ‘effects’ and realism. (.jpg, .png, .gif, .tif, .psd)

Raster graphic - Showing Pixels

‘Pixels’ make up RASTER Graphics

VECTOR files are made up of shapes. Each shape has vertices, lines and curved lines which make up it’s edge. The shape itself has a colour, and the edge of the shape has a colour and a thickness. With enough shapes you can get a pretty detailed overall image. The best thing about vector images are that you can zoom in and out an infinite amount and the image will always be clear and in proportion. The problem is that high levels of detail is almost impossible to achieve. (.pdf, .svg, .eps, .ai)

Vector Graphic Example

Vector Graphic Example

Roughly speaking, RASTER files are used online or onscreen, VECTOR files are used for anything printed in real life.

 

The best RASTER in my opinion is .png – it supports different levels of transparency and yet retains good detail. It is perfect for online work.

 

The best VECTOR in my opinion is .pdf – lots of people can receive and view .pdf and it is easily imported into the programs that designers and printers use.

 

So heres some more tech info about why I believe that .png and .pdf is all you ever need. I’ll start with explaining about some different file types.

.jpg [jay-peg]

Photos are large files. .jpg files compress photos into smaller files by kind of blurring individual pixels together so that the file has to remember fewer colours. If you’ve ever saved a crisp image as a .jpg, you see this when you next open the file (especially if you save it multiple times). The image becomes ‘dirty’ and pixellated – have a look at the ‘before’ of this logo redraw we did:

Before and After: The Battery Guy

Before and After: The Battery Guy

.jpg does not support transparency – your image will always be square, or rectangular so any logos saved as .jpg will have a white background ‘block’ behind them. Images that are purely photo should be saved as .jpg – that is what .jpgs were designed for!

.gif [jif] or [ghif]

These file types are designed for images with large, defined blocks of colour. The gif compresses images by remembering which pixels are the same colour. To reduce a very detailed image (like a photograph), it will decide that some colours are similar enough to each other to be saved as the same – leading to some very ugly looking photos if saved this way!

Incorrectly saving an image as a .gif file

Incorrectly saving an image as a .gif file

Gifs DO support transparency, but only ‘hard’ transparency in one colour – one colour is selected as ‘the transparent colour’ and that colour will show as 100% transparent.

GIF Transparency Example

.gifs also support ANIMATION! All those blinking memes and a lot of adverts are made with .gifs – each frame is just a separate .gif image file. You can make your own .gif animated images with .gif generators free online.

GIF Animation Example

GIF Animation Example*

*Wait! This animated gif is photorealistic, but it says above that .gifs aren’t good for photos! Response: Yes, but black, white and grey colours are greatly reduced in comparison to a normal photo, and you can still save the file as high quality, it will just result in a much larger file.

.png [ping]

.png stands for Portable Network Graphic. It was designed for, you guessed it, use over the Internet. When web design first started out .pngs weren’t used much because the old Internet Explorer browser didn’t display them properly. Now however, they are hands down perfect for MOST images for your website. They do not trade quality for compression, they display blocky graphics crisply AND photo-based graphics accurately AND they support multi-leveled transparency:

PNG transparency example

 

.tif or .tiff [tiff]

.tiff stands for Tagged Image File Format. These files are similar to .pngs in that they support transparency and don’t compromise quality for suppression. They are actually a ‘container’ file in that they can store data that is actually a vector image, or actually a .jpg image etc. The file is then ‘tagged’ with information (in what is called a ‘header’) so that the receiving computer can decide how to use it. Because of this header, they are larger files, so generally it is best to choose which file type is ‘right’ for the image you are saving in the first place.

 

.psf  (photoshop file)

This file type is for Adobe Photoshop and retains the individual ‘layers’ that make up an image. For example a simple logo may have a ‘writing’ layer which overlaps a ‘circle’ layer which overlaps a ‘background’ layer. Without a proper layer-based image manipulation program you won’t be able to use these files.

 

.bmp [bitmap]

This file is nice and simple in that it saves each pixel’s colour separately. It can be quite a large file, and the native program for these files is Microsoft Paint. No layers are saved, no transparency is available, it is a simple basic file. It is not appropriate for the Internet as there are better file types out there, but most modern browsers will still display them properly!

 

Summary of RASTER file formats:

For purely photographic images, save as .jpg

For very simple block-colour images, with up to ONE transparent colour, save as .gif

For simple animations, save as .gif (for larger files use movie files)

For all else, use .png

 

All vector fomats:

If you are not a designer or a printer, there is really no need for you to understand the different file formats. The reason I like .pdf files so much is that you do not have to have a specialist program to properly VIEW the image. .pdf files are viewable to anyone since everyone can download an adobe .pdf viewer. .pdf files are also designed to be printed at a particular size, so if you design the image for A4, it can still be zoomed in without pixellation on the computer, but if you hit ‘print’ it will come out of the printer at the size you designed it.  Many ebooks and documents are .pdf format since they are universally viewable and because of this printing advantage.

 

If you have a graphic or a logo designed, you will be likely to receive 6, 7, 8 or more file types for the same image. In reality you need only 2 – .png and .pdf. All other file types can be converted/saved from these!

Our Privacy Policy

This is the privacy policy for www.kestreldesign.co.uk. All websites that either use cookies or collect information in any way must have a privacy policy by law – this includes any sort of contact form!

What information do we collect?

We collect information from you when you fill out our contact form.

When filling out the form you will be asked to enter your name and e-mail address. You may visit our site anonymously by not filling out the form.

When you become a client we may keep any email, image, document or information you send to us. We keep records of invoices, contact information and notes regarding your customer needs.

At any time, you can contact us to receive details of all information we store about you. This will incur a small administration charge.

What do we use your information for?

To personalise our contact with you – your information helps us to better respond to your individual needs.

The email address you provide may be used to send you information and updates pertaining to your query or to receive occasional company news, updates, related product or service information, or offers.

How do we protect your information?

We do not store your contact details on our server.

We do not share your details with any other company.

Do we use cookies?

We do not use cookies.

Do we disclose any information to outside parties?

We do not sell, trade, or otherwise transfer to outside parties any of your information, unless we believe release is appropriate to comply with the law, or to protect ours or others rights, property or safety.

Third party links

We reserve the right, at our discretion to include or offer third party products or services on our website. These third party sites have separate and independent privacy policies. We therefore have no responsibility or liability for the content and activities of these linked sites. Nevertheless, we seek to protect the integrity of our site and welcome any feedback about these sites.

Online privacy policy only

This online privacy policy applies only to information collected through our website and not to information collected offline.

Your consent

By using our site, you consent to our privacy policy

Changes to our privacy policy

If we decide to change our privacy policy, we will post those changes on this page. This policy was last modified on 14th November 2014.

Responsive, accessible and mobile friendly

I promised in my post titled ‘What kind of website do you need?‘ that I’d explain what the terms responsive, accessible and mobile friendly mean. Here it is in #explainItLikeIm5 terms:

Responsive:

This means when you see the website on a tablet or a mobile phone it looks just as good as it does on a computer. The entire site changes it’s layout to be just as easy to read and navigate on smaller devices.

Accessible:

Are you fully or partially blind? If not you probably don’t care about this. If you are you can still understand the site because I’ve made sure the website is easily read by screen-readers. These are bits of software which read websites out loud. Behind every image in an ‘accessible’ website is a little piece of text which explains what the image is: like ‘Kestrel Design’s logo’ or ‘picture of a cat looking grumpy’.

Mobile Friendly:

As well as being responsive, a website is mobile friendly if it doesn’t need to download a shed load of data to look good. So images are appropriately sized and there’s not huge amounts of wasted data on irrelevant formatting (you get this a lot on build-your-own sites).

 

Thats it!

Superfast Server Speed!

Just a quick note to say we have successfully switched to fibre Internet for super-fast speed. We planned ahead for this by switching to the right company a few months ago, meaning that we were one of the first customers in our area to get it installed. This makes our server extra fast at delivering our clients’ websites to their customers.

Copperspire Website

Copperspire is a company who do electrical work and fire safety consulting. They are family run and very friendly, professional, efficient and hard working. We admire their work ethic and wanted to make sure their website was corporate and professional but good looking too. They previously had a website that had been created for free by a friend – coming to us was the next step to show the world their true colours. You can click on the picture below to see the website in different sized formats, or check out the site itself –

copperspire.co.uk

Copperspire Website Design

We mocked up a quick logo since they hadn’t yet emailed theirs and they ended up changing their logo to our new one too!