Ankush Saha - Free Learning | Graphics & Web Designing

Importance Of Favicon? How Do I Design One For FREE? [2019]

October 11, 2019 by Ankush Saha

Importance Of Favicons? How Do I Design One For FREE? [2019]

What is a favicon? Is it a logo? Importance of favicon? Etc., etc., etc… 🥴

Are you confused about favicons? 🥺

You have come to the right place then. I have explained each and everything in detail with examples and also mentioned the steps to create a favicon for your website (FREE). 😍

What is a Favicon?

Favicon is basically a tiny graphic icon having a different size around (48px x 48px, 17px x 17px, and so on), but google re-scales your favicon to their size for more your can go through google guidelines.

You can quickly notice it on the left side of your chrome or any other browser tab, and that small icon is known as a favicon.

Trust me, that tiny graphic icon helps enormously when you use multiple tabs at once, just like me. In simple words, it helps you to find the right tab you need very quickly so that you get what you are searching for without wasting your time in opening every other tab.

But after google’s recent update, they have started showing favicons of every website in mobile search results (one extreme left of a website link). Also, they are testing the same on desktop too.

Favicons are also called bookmark icons, tab icons, website icons, and URLs icon. It is a fact that the human brain responds better to visual compared to text.

Quick Tip: Try to design your favicon completely unique so that it should be easily recognizable as a brand.

What is the importance of favicon?

Let me explain it to you all through an example.

I have searched in google “best hair dryer,” and first I visited the amazon website then on another tab I searched the same and visited flip kart website and now in the below image, you can see both sites have the same title but the only thing which makes a huge difference in their FAVICONS.

Here just for an example, I visited two websites, but when you visit or open multiple tabs websites at that time, it’s even more helpful, and we realize the importance of favicon. [EASY TO IDENTIFY]

Also, most of the users like me have a habit of bookmarking various useful blogs at that time again, FAVICONS wins the game.

Importance of favicon in SEO?

Well, the importance of favicon had just become much more prominent when google started to show the favicons on mobile search results and might be soon they going to show it on desktop too.

I see most of the newbies asking this question “Adding a favicon will rank my blog or blog post?” so the answer is ‘no’ favicons won’t make your page rank higher in google search results directly.

BUT,

It might increase your CTR, as it shows just next to your main website URL. So my suggestion to all my dear readers is to not just only focus on favicon you should also look into your overall website’s performance as google has multiple ranking factors.

If you are not adding a favicon for your website that is in your website’s root folder with the name of “favicon.ico” then the files will automatically respond as an empty file with ‘404 error,’ and we all know that errors can harm our website.

Searching For A Graphic Designer To Design A Favicon Like Amazon, Flipkart, Myntra or completely unique? Contact us via email 😀

How do I design a FREE favicon for my website?

If you are new in this field and don’t have much budget to hire a professional graphic designer to design your website’s favicon, then you don’t have to worry any further I got you covered.

Here I will show you how you can easily design a favicon for your blog in just a few very simple steps. So let us get started…

Step 1 (Go to google & search for canva.com)

Just go to any browser and search for canva.com and sign up over there with your email or facebook. Trouble signing up in canva.com? check out my post design free logo for website here I have shown step by step to sign up in canva

Step 2 (Select your favicon size)

After completing your signing up process and setting up all, then go ahead by selecting your favicon size on the top right and simply add the size in px, and you are good to go.

Step 3 (Design according to your requirement)

After selecting the size, you can start to design your favicon as per your needs. The first start with choosing the background color then goes with the text, icons, or any other graphic. Canva has tons of options available on their left panel; you just have to show your uniqueness and creativity.

Step 4 (Save & download the favicon)

After doing it all on the top right corner with the help of the ‘download’ button, download your favicon file in any format you want .png, .jpeg, PDF, or other.

But let me be very honest with my reader. If you are looking to design something like amazon, Flipkart, or google favicons, then it’s not possible to create it in the free version of canva.

You can design a simple favicon for your website with the help of a free version of canva website. OR there are many free favicon generator websites available out there you can design it from there too.

Things to consider before designing a favicon?

Make it stand out of the competition/unique
Do not add too many details in your favicon (let it be just a simple icon)
Using the right color is the most important thing while designing a favicon. You should always keep in mind that your favicon should not have the same color as the browser tab, or else it will not appear clearly.
Try to match your favicon with your website and logo. (you can have a look at amazon and flip kart for example) All in all, it should look as brand your logo, website, favicon all should recognizable at once.

Conclusion

Here you have seen the importance of favicon and along with that how to design one. You should always add a favicon whenever you create a new website; it just takes a few minutes but plays a huge role.

If you are having a limited budget to hire a graphic designer to design a favicon like a google, flip kart, Amazon, then you can check our graphic design services OR contact me via Email.

I hope this article will help you to understand the importance of favicon, and if “yes,” then do not forget to share this article with your friends and family and let them know these benefits too.

How To Create Infographics For Free? (Step By Step Guide)

May 4, 2019May 4, 2019 by Ankush Saha

Your visitors are not loving your content? Do your users bounce back quickly? Then you need to create infographics as it gives context to the content and makes it easier for users to read, implement and understand it.

[ss_click_to_tweet tweet=”Do you know? Our human brains process visual better than long format boring text.” content=”Do you know? Our human brains process visual better than long format boring text.” style=”default”]

If you are working hard to build your content with more and more text. I really appreciate you. But let me tell you most of the people don’t like a long-form article, nor they have time to read those lengthy texts.

Infographics help users to understand your content visually in the form of graphics and text in an image. Who Don’t Love Images?

As this visual infographics keep users engaged and creates interest among them to read your full article. It will make complex concepts much easier for your readers.

Infographics are better than tons of text as because it is easy to share on any social media platforms as it is shareable, we can link it to any internal or external source as it is easily linkable, and if your infographic is very much better and adding value for your visitors then it can get viral in social media.

As from my childhood, I have heard “text” is too boring and no doubt it’s true. Our textbooks and notebooks were filled only and only with text no images at all. So just from the beginning, we were bored by just seeing those text and it doesn’t matter if those stories were interesting.

You can try by yourself let me give you an example. Give a child to read alphabets from below given two images from Image 1 and 2 and see their interests in those images as I have just added some vector animal illustrations in image 1 and there is nothing rather than text in image 2.

So I am damn sure that image 1 will create more interest than image 2.

Benefits Of Infographics

Looks Attractive
Boost in Traffic
Brand Awareness
Best for SEO
Eye-Catching

Tips To Create Infographics

Keep You Infographic Very Simple
Try To Show Everything Visually
Make It Easy To View
Think Of An Attractive Headline
Make a Proper Flow
Share It As Much As Possible
Focus On Color Combinations
Add Something New Which Is Not Mentioned In Your Article

7 Steps To Create Infographics For Free

So whenever I design an infographic for my website or any other projects I personally use piktochart and canva as because they are best among the rest, these websites are easy to use and consume very less time so that we can create a professional design in free of cost & also in short period of time.

Any person can use these websites to design infographics for themselves by just learning some of the basics of these tools.

So today we will use piktochart to design our infographic.

So to start designing with piktochart you just have to paste this link piktochart.com in your browser and you will be redirected to the homepage.

So to explain to you all I have made an infographic with the help of this website.

I will explain to you all in a step by step process that how I have made this with the help of piktochart.

Step 1 (Sign Up & Overview)

So very first you have to paste the link of the piktochart in any browser. Then you will be redirected to the main home page of the website.

To use these tool for free you just need to sign up and work done. So on the top right corner, there is a sign-up option from there you can sign up easily.

Let me tell you one more thing that this website has been featured and used by many top brands like Forbes, Techcrunch, Moz, etc.

You can easily signup with facebook, google or with your email. (Signing up with Google is a little easy)

After completing the signup process you will be redirected to the main dashboard of piktochart which will be looking like this…

On the left vertical panel, you will get options to select infographic, presentation & printable from the mid-left you can create your own folder to save your all designs.

Also, there is an additional option available on the top right corner “Create A Design” this will also help you to select between infographics, presentation & printable stuff.

As we are creating an infographic so we will go with the first option which is just below the dashboard.

After selecting you will be redirected to the template area and piktochart will be offering you some of the free as well as paid template but we have to select the free template.

To make this above infographic I haven’t selected any of the ready-made templates. I have just started from scratch.

After selecting any of the templates you will be taken to the main designing dashboard of an infographic. Here I have selected the blank template.

On the left side, you will find graphics, uploads, background, text, color scheme, and tools options to create your infographic.

In my previous articles of thumbnail and logo, I have explained these type of options in very much detail. If you haven’t checked those article you can check it now in my blog section.

Step 2 (Background & Header)

So here I am in the designing dashboard of an infographic with the white page. You will get a watermark of “WOWEE” in your infographic so you can remove it by just clicking on it and hit “DEL” button.

You can resize your infographic size according to you with the help of its resizing tool at the end of it.

To make my design very first I have selected the background color from the left side “background” option and chosen a solid blue color. But you can select textures, gradients, and hex codes too.

After selecting the background. I have searched “study” in graphics option and added a study table in the header and written my headline text line with the help of “text tool”.

You can resize your graphics with the help of four resizing options which will be available at the four corners of the object also if you used this shortcut keys “SHIFT + ALT” then your object will not squash as it will be resized in its accurate size.

Step 3 (Vector Banner & Text)

To add this vector banner you have to go to graphics option and write “banner” you will get many banner options. So I have selected this orange banner.

Then I have simply added these texts from “text tool” and selected text color and font which is available at the top section of the dashboard.

You can change color, text, size of text also you can increase or decrease its opacity and also shift the text backward and forward, align the object and text to center, mid and left, underline the text and much more…

Step 4 (Vector Boy & Sticky Notes)

So here we are on step 4, I have added a cartoon boy who is holding a book and pen from the same graphics option by just writing a similar keyword “study” and got many options of cartoon characters. Then again on the same search bar, I have searched for the keyword “notes” (I think without “graphics option” piktochart is incomplete).

Then as same as above step 3, I have added the text and placed it in the center of the note paper and tilted it little to look like it’s written on notepaper.

Step 5 (Mid Section)

So to make this entire section very first I have added a square and expanded its width as same as infographic width and changed its color.

Then I have added a banner by following step 3 but for this, I have selected differ banner with red color and add text in it.

To add all this vector art I have just searched its main keyword like “focus”, “brain”, “book” and “time” in the search bar of “graphics option” and then placed it in the proper position and added text to define it with the help of “text option”.

Step 6 (Graphics & Text)

So we are almost completed here I have followed the same step 3 to add banner and text. Then I have added the cartoon schoolboy with a bag and book with the help of graphics option.

I have just written “study” in the search bar of graphics and it showed me tons of results. Then again I have searched for keyword “star” in the same search bar and added 4 stars as a checklist.

Finally added text in just in front of the stars to give it a look like a complete checklist.

Step 7 (Download & Save)

We have completed our infographic successfully so now you have to save your infographic to edit it in the future and download it easily with the help of the download button and you can preview it too. Don’t forget to share your infographic in social media.

Final Word’s

Infographics are not dead they are totally alive and they work incredibly to generate tons of traffic to your blog. You just have to be very much unique and creative while making your infographics.

I know you can make much better infographics. Just follow these steps, tips and show some creativity. BOOOM!

So this was all about “How you can create infographics for free”. If you loved this article or found it helpful then please don’t forget to comment below and share this with your friends, family, relatives or anyone♥.

7 Easy Steps To Create a Thumbnail (FREE)

May 16, 2019April 18, 2019 by Ankush Saha

Thumbnail. It is the small image description which represents your main content. It is as important as your main title. So it is an essential part to create a thumbnail for your content.

If you are not focusing on creating an attractive and unique thumbnail then my friend you are losing a large number of visitors…

You might be thinking that “why thumbnails are given such importance?” Let me give you a perfect example.

You might have seen the book covers of small kids. Their book covers are always designed with attractive cartoons so that it creates an interest among them to read the book. Below I have given an example.

So any child would love to open this first book by looking at its main cover photo.

On another hand, if you give your child a normal looking cover book which only has the name on it, then it won’t be creating any interest among them they will be forced to open it by there parents.

So “which book you will like to open first”?

The same thing happens with thumbnail. If you don’t create an engaging thumbnail which attracts the audience, then you will be ignored.

Do you know? Most of the best performing videos on youtube have a custom attractive thumbnail.

Let me tell you my story.

Some weeks ago I promoted one of website article on facebook which was having great content, but it was not getting enough visitors/clicks.

I was very confused and started researching. Then I have found that my article thumbnail was only having the text and standard background.

Then I designed my thumbnail in a very attractive way with images, stickers, emojis, text and promoted again on facebook and I got this result in just 12 days.

It’s never too late to correct our mistakes.

I have written this ultimate guide on “Create a Thumbnail For Free.” Which will help you in creating an attractive and unique thumbnail without paying any $$ to graphic designers.

By following these steps, you can create thumbnails not only for youtube videos but also for your website/blog, Facebook, Instagram, and many other platforms.

Tips To Get More Clicks

You can use close up of your main subject.
Include your title or main keyword.
Use big, bold text.
Use expressive faces.
Contrasting overlays can help your text make it more attractive.

Simple Steps To Create A Thumbnail

So in this guide, we don’t require any software to download. We will be creating our thumbnail from a free website called Picmaker. This website allows you to create a thumbnail with tons of features in free of cost.

So let’s get started.

Step 1 (Sign Up Process)

Open any browser in your pc and paste this link https://www.picmaker.com/. If you scroll down, you can read all about its features, reviews, and more details.

On the top right corner, you will get a sign-up button, from there you have to sign up first with your name, email, and password or you can directly signup from google or facebook.

Step 2 (Dashboard)

After signing up, you will be redirected to the main dashboard of Picmaker. You will get various options like youtube thumbnail, channel art, IGTV thumbnail.

If you are making a thumbnail for a youtube video, then you can select “Youtube Thumbnail” but if not then select the last option “Start From Scratch” this will help you to choose your own size.

Step 3 (Overview & Selected Format)

First, let me give you a short overview of the main designing dashboard of Picmaker.

Prebuilt: It will show you some of the awesome ready-made thumbnails of all categories like business, fashion, health, fitness, food, miscellaneous, personal, technology, travel, and 60s-90s. So you can choose any of them and design it by yourself.

Properties: You can call it the “heart” of this website and one of my favorite ♥ because you can add free stickers, icons, frames, photos, charts, shapes, illustrations, patterns, and characters. I will say that without this option our thumbnail will be incomplete.

Backgrounds: Change your background color according to your choice. There are tons of color combinations and gradients available to design your impressive background. Choosing the correct background is key for your thumbnail.

Texts: This is a very common option that everyone knows. Add text to your thumbnail with creative text style and background.

Uploads: Upload your own created or downloaded images easily from this option. I will suggest you add high-quality photos only as it will help your thumbnail to look very much professional.

On top right corner there are three option available preview, download and save. On the bottom, you will get the option from zoom in and out for your design.

So to explain to you all I am designing a thumbnail for youtube. I have selected the given option “Youtube Thumbnail” and Picmaker will automatically redirect me to its designing dashboard.

I have already designed this thumbnail to explain to you all in a step by step process.

Step 4 (Selected Background Color)

So very first I have selected background color for my thumbnail. You can do that by background → change color.

You can also set your background color as a gradient that can look even more better.

Just below all colors, there is an option of “Custom Color” from there you can add your own color shades and hexadecimal value color codes too…

Step 5 (Converted Image Into Sticker)

After setting the background color. I have added the image of a girl which was available readymade in “pre-built” option. Then I have given it a sticker look.

I have selected the object then a new pop up came up in that I have chosen the small emoji option which helps to give an object a sticker effect.

Then select the color and stroke size according to you. You can also add an inner stroke.

Now you might be thinking that “How we can add or upload our image and convert it into a sticker?” DON’T WORRY I will explain to you all

To create your sticker first you have to upload the image and click on that, and then you will see a popup.

Then you have to select the background removal option.

Then it will ask you that “If you want auto background removal?” then you have to select the option “Yes, Proceed.”

I will suggest you to use an image which doesn’t have any background. You can get it on many free websites like freepik, pixabay, pexels, and many more… If you haven’t found any image then you can use this method.

It will remove the background automatically but not too accurate. For that, we have to do little hard work

If there will be any patches left, you can fill or remove those patches by these two brush option in green and red color. Red color Brush will help you to remove patches, and Green color patches will help you to add patches.

You can also set the brush size to remove or add the patches.

Zoom in and zoom out option will help you to be more accurate and hand option on the top corner will help to move around images while editing and there is a crop image option beside hand.

After you finish click on “Done.” Then you can easily convert it into sticker as I have shown it in the very beginning of step 5.

Step 6 (Added Text & Changed Its Background)

I have selected “Text” option and applied this “Desserts made in 10 minutes” font which was having the background with it.

Then I have simply selected the background and changed its color. But you can add much more creative and attractive stickers, illustrations, patterns, shapes frames and make your thumbnail very much awesome.

Step 7 (Added Characters)

I have added 2 stickers from properties → food section and placed it at that position where it will be looking good.

I have added a character of “chef” from properties → characters → chef and included in my thumbnail. You can also get all the positions of the character you select.

After completing your thumbnail design, you can preview, save and download it from top right corner easily.

DONE…

So this is how I have made this thumbnail without downloading any software or paying someone. It is very much simple you just have to be very much CREATIVE…

You can take thumbnail ideas from your competitors and make a better version than them. SIMPLE

It took very hard work to create this tutorial for you guys. So don’t forget to share this article with your friends & family.

If you loved this tutorial on “7 Easy Steps To Create a Thumbnail”, then let me know in the comments♥

How To Make A Logo For Website? {10 Simple Steps}

April 18, 2019April 11, 2019 by Ankush Saha

I have seen many people having this same question that “How to make a logo for websites, banners, billboards, social media, etc., etc., etc…”. So I thought to make it simple and easy for you all❤.

Most of the people don’t care about the logo while they are making a website. They are just investing their time and money in building the main content (the content the audience looks at), then publishing it and done WORK FINISHED…

Benefits Of Logo

Do you know? A logo represents you as well as your company; it is an essential part of a company’s brand identity. It is just a small graphic mark, symbol or emblem which plays a very very important role.

Let me give you an example of the “Apple” brand. We all know that Apple is known for its super high-quality electronics gadgets. But the “Apple” brand is mostly recognized by many people through its logo that is “a bitten apple.”

There are many designers out there to whom you can hire, but everyone will charge you some $$ because no one will do it for free. And if you are a student then its little tough to hire a professional designer.

So pat on your back if you are curious to know “How to make a logo for website.” You have come to the right place.

By showing interest to read this article, you have proved that you are serious about designing and working hard to learn the methods of it.

So this article is going to show you the exact direction to create a unique and creative logo for your website in very simple steps. SO LET’S GET STARTED…

10 Steps To Make A Logo For Website

So now you may be thinking that there will be any software to download and install it in your desktop for designing.

But the answer is “NO.” You don’t have to download any software to design any primary logo. You can create it from the online website easily without any efforts. The name of that website is CANVA.COM.

Homepage Of Canva Website

Step 1

The very first thing you have to do is to open any browser in your PC (I will suggest chrome). Then paste this link https://www.canva.com/.

Then comes the signup process. You can sign up with your name, email, password or you can directly sign up with Google.

Step 2

After signing up, canva.com will show you some of the designs like infographic, poster, presentation, Instagram post, logo, etc., etc., etc.

But we have to select the logo section which is in yellow.

Step 3

After selecting a logo, you will be redirected to the main designing dashboard which will look like this.

But before that let me give you a quick overview of the homepage. On the top left corner, there is a HOME button by clicking on that you will be redirected to the homepage.

After signing up, you will get to see this type of homepage given below. So on the top left corner, there is an option of “Create a design” from there you can select on which design you want to work.

There comes the “Home” section. Here you will get all the options like your folders, designs, trash bin, also you can start tutorial from design school, create a team or brand a kit.

If you want to access their premium features, then you go to “UPGRADE” option. Later in the center, we get a search bar to search what all designs we want to make, or you can scroll down to get more ideas.

So now we will again go to the logo dashboard by following these steps “Create a design” —> “Marketing” Section —> Select “Logo” and then you will be again redirected to same logo dashboard.

Step 4

So now here comes the main part. You have to plan the logo structure related to your website. Like what all the illustrations you want, fonts styles, character, shapes, photos, etc.… It is essential to plan its structure while you make a logo for website because it will represent your brand.

Here to explain to you all I have taken a demo example name “Bright Led Lights.” So here I have decided to make a “led light” company logo which I have already designed for you and explained all the steps in details.

I have taken 500px x 500px logo size but you can select according to your website or any size by “Homepage” —> “Create a design” —> “Custom Dimensions” (On top right corner) —> “Enter size” as you want.

Step 5

So now I have chosen the topic of “ bright led lights.” But before that let me give you a quick tour guide of features available to make designs in canva.

Templates: You can get various template ideas in different categories. If you are making a logo, then there are many templates available such as home furnishing, law, games, DJ, restaurant, brand, education, computer, etc… You can take help of those templates to get an idea.

Elements: Logo is incomplete without any elements or objects such as shapes, photos, vector illustrations, etc. So elements will help you to add shapes, photos, illustrations, graphs, charts, lines, icons, etc. To design anything elements can help you a lot as it has amazing stuff.

Text: This will help you to add text in your design with added many options to make the text creative such as its fonts, size, color, alignment, size and so on.

Background: If you want to change your canvas background then you can easily change it through this option. Just select the background option, and it will automatically show you tons of suggestions. This will help you a lot while uploading logo in your website

Uploads: You can upload any photos from an external source which you have downloaded. Just go to this option and upload it from your PC.

Folders: This will help you to make a normal folder for your photos.

More: You can embed videos, photos, online media, presentation, emoji & Connect Facebook, Instagram, Dropbox and much more.

First, in this blank white background, I will add a circle. Which you will get from the left side horizontal panel in “Elements” —> Shapes —> Circle or you can simply search the shape name or anything you want to add in canvas.

You can resize the circle as per your requirement as soon as it appears in the white canvas. You will get the resizing option on the corners of the object when you click on it.

Step 6

Then its time to change the color of the circle. To change color first, you have to set the circle (object) in the perfect position. After that when you will click on that circle again at the top margin you will get a color box from there you can select the color according to your choice.

Whenever you select any color to make a logo for website, then there should be any reason to use that specific color.

So here I have selected an orange color.

You can select any color, or you can add any hexadecimal value of the color. #00080 – Navy Blue, #808000 – Olive Green, etc. If you want me to make a tutorial article on the “hexadecimal color codes (HTML color codes)” then drop the comment below.

Step 7

Then I have added a small glowing bulb from the elements section.

First, you have to select “elements” then you can search on top search bar as per your requirement, or you can go through the entire elements section.

After that, I have resized it by its resizing option which is available on its four corners.

Step 8

Then I have “searched” for stars and selected it. After that on top right corner, there is a “position” option available which will help you to set your object backward and forward of any other objects.

So I have selected the stars and moved it backward of the bulb and reduced its visibility from transparency option which is thereafter “position.”

Step 9

After that, I have selected “text” section and added a heading with the name “Bright” and changed its font, size, and color from the top menu. The text is very much important because it will show your brand name. So it should be very clear and readable.

Quick Tips

The spacing option will help you to add extra spacing between lines and text,
You can set proper alignment, bold the text and make it italic too.
Also, you can add bullet points.
If you want to make a copy of anything then just select that object and click on copy. (a new copy will be created)
You can lock any object from the lock button and unlock it with the same.
If there is any unnecessary object, then you can delete it with the delete option.

Step 10

I have added an object below the “bright” text with a light orange color and adjusted it properly. Then repeating step 9 I have added the text “LED LIGHTS” and gave it a dark grey color.

So finally our logo is completed.

Now you can save it from DOWNLOAD option which is available at the top right corner. You can save it in PNG, JPEG, and PDF formats.

Quick Hack
Before uploading the logo on your website change the logo background in canva to the same color of your website background. Example if your website background color is grey then change your logo background to grey. Then it will only show the exact logo not the background in your website OR you can buy canva premium.

I have made a simple logo for better understanding. But you can make your logo very much creative by taking your own time and using all its features. By these steps, you can not only create a logo for a website, but also you can create a logo for youtube, Instagram, or any other companies too.

There are many online tools available out there, but after completing your logo design, they will ask you for some amount of $$. But not here, you can create designs for free of cost.

So this was all about “How to make a logo for website.” I hope you have got all these ten steps to make a logo for your website with all its features. If you have any query, then do not hesitate to ask. You can comment below, and I will be happy to answer your questions♥.

If you found this helpful and knowledgeable, then don’t forget to share this tutorial with your friends. Let them learn too♥.

Share your knowledge. Its a way to achive immortality – Dalia Lama