Upload your logo

A company logo is among the most recognizable elements of company marketing, and it is indispensable to have your logo on your website. We have created website designs that show logos in the most visible place, but you also need to ensure a remarkable view. Let's learn how to achieve it.

Usually, logos are made by graphic designers in a vector format. These are images made up of vectors (a kind of mathematical lines). When in vector format, it makes the logos scalable without losing its quality. Vector logos are built-in graphic design programs, such as Adobe Illustrator. Most common filename extensions are .ai or .eps, and these files can't be uploaded on your website.

Other types of image files are those made in programs like Photoshop, which are based on pixels. These images are not scalable, meaning they lose their quality when you try to resize them. Pixel-based image formats have the filename extensions .tiff, .eps, .psd, .jpg, .png or .gif. 

Let's use the following logo as a source image.

The best choice for logos used on the web is transparent PNG. A transparent PNG is an image file that has one color assigned to be "transparent" so that the assigned color will be replaced by the browser's background color, whatever it may be. The logo is saved with a transparent background. PNG is great when you are uploading your logo on a colorful background on a website. Using a software (see below for recommendations) we can remove the background and make our source logo transparent.

Often logos come with a tag line (slogan) that does not look nice when the logo size is reduced. The tag line is hard to read and unnecessary when the logo is small. So let's remove the slogan and make our logo simpler and easier to read.

Another common problem is that the logo is not with the correct form and proportions. For example, it may be square shape while on your website, it will best fit if rectangular shape. So you may need to change its layout.

Finally, this is the logo that will fit best on your website:

Based on the colors used for your website template, you may even need to change the color of the logo. For example, make it white, so it blends nicely within the header of your website.

See how the source logo and two improved logos fit in a sample website header.

Remember! 500 px (width) x 100 px (height) are the optimal logo dimensions for your website. In terms of file size, be sure to keep your logo image size smaller than 200KB, best if it were under 100KB. As soon as you upload your logo, our system will advise you on its dimensions and file size.

Usually, your designer should have provided you with a transparent or vector logo file with the correct dimensions and filesize. If you do not have the right logo and need to edit it, so it perfectly fits your website, you have several options:

• use Photoshop or a similar image editor;

• the easiest way to remove a background color and make the logo transparent is using Remove.bg

• use some free online image editing tool such as Pixlr

• use logo creator services to create your logo LogoShuffle and  FLD

• commission a designer (or us)