How to Design Beautiful Website?


How to Design Beautiful Website?






Hello guys!

I have seen lots of websites which has great effects to impress anyone when we first watch it; but I have also seen such websites which you don't like it all after just loading their first page.

So in short what this tell you is importance of good website design which can help your business grow using your website which has been developed with good design.

So let's see what are the important factors that every website should have when we consider good design for website.

Color Theory

  • Very first thing is Color Theory.
    • Here is a example of worst design :- 

    • Here in above example we will see that what kind of colors are used for text and other things they are not representing what is that text about and also it is not uniform throughout the website.
    • Deciding what thing should have what colour is very important while designing our website or its contents.
    • Below I have given another example of how colour would be used in a beautiful way without having too much colors.




    • In above example you will see that website is design in such a way that its content colors describe the website content in a uniform way and its look damn beautiful.
    • It looked consistent with actual message.
    • It is very important before picking colours you has to be aware of the mood of the colour palette.




    • Moods of your color pallet is something important thing while deciding colors for contents on your website.
    • So Predominant colour that is going to be in your design really tells its story and it conveys a message to the user.
    • For example red colour conveys love, energy, intensity of the contents.
    • Where as yellow colour is more about joy, intellect and attention of the contents you have on your website.
    • Yellow colour grabs the attention of most of the viewers.
    • So whenever you are creating a logo or when you are creating some sort of headline then yellow is a great colour.
    • Another important colour is green.
    • Green colour is about freshness, growth and safety.You will see this kind of color on most of the food website or website which sells something. It tell we have something fresh for you 🙂.
    • Another important colour is Blue colour.Blue colour is about stability, trust and serenity.Most of the financial companies use this colour for their websites to represent that how much they are trustworthy.
    • At last Purple color is something you can use when you wanted to signify royalty, wealth, femininity. You can see this color on Websites of loan companies.
    • So after knowing this all important things you have to choose colour wisely from a colour palette for your website.
    • Don't just go for your favourite colour if you wanted to have a good design for your website. you should consider colour theory before deciding which content it will have which colour as per what message I want to convey from our website.
    • You can combine more than two colours for your website and this is scientific part of colour theory.






    • When you combine two relevant colors it is known as analogous colours.






    • In above image I have shown how we can create a triadic colour palette.
    • If you want you can head over to a website called Adobe colours which lets you mess around with all of these different colour combinations.
    • You can also use website called colorhunt.co.  This is a website where professionals designers have created some of their favourite colour palettes.You can get the hex code from this website for any colour you want or you like from given color palette.


Understanding Typography and how to choose a Font.


  • This is second important thing In this article I'm gonna tell you about to have a good design for your website.
  • Selection of font for our website contents is very important.







  • There are two large family that is mostly used and everybody should know.
  • One is the Serif family .
    • This typeface have many subfamilies like old style, transitional, modern and so on.
    • If you see Vogue magazine you will see how modern serif typeface is used and understand difference between serif and modern serif.
    • You can use Serif family when you wanted to consider Titles or headings.
  • Second important family which is mostly used is sans-serif typeface.This font family is used for writing the body of any paragraph and it differs from Serif family.


User interface design


  • Now next most important thing I am going to tell you that is how to create good user interface design.
  • When we create contents on website we have to organise them in hierarchical  fashion.
  • It represents to user that which thing should get observe first by him.
  • You can see below example for knowing the difference between hierarchical fashion and general way.




  • In this example you could see the difference between left hand side website and right hand side website. 
  • It is not that clear to understand whose birthday is and when it's going to happen in a first look.
  • Whereas in right side design you will see that it is beautifully arranged in a hierarchical fashion.Which lets user know whose birthday it is at first glance and where it is going to happen in a second.
  • We can establish hierarchy in a number of ways:-
  1. Colour.
    • Colour of the content in a design tends the user to look at content of website and therefore it is very important aspect when we are designing in hierarchical fashion.
     2. Layout:-
    • In addition to establishing hierarchy in terms of user interface you should think about the layout of your website.
    • Think about where to put content and how should be the length of it.
     3. Alignment:-
    • This is about how you position each of the elements on the screen relative to each other.
     4. White space:-
    • White space refers to the empty space that's around text or around your elements.
    • White space is very important when we are doing some kind of website designing.
    • For example if there are multiple cars placed in showroom very closely to each other It will not look that great because it is not making stand out to a specific car, instead user is able to see bunch of cars one after one which doesn't look that great.
    • Customer won't go there if he see such mess where as if he search for a showroom which have cars showcased individually captures the attention of the user because that car is having lot of space between other cars and user is able to focus on specific one.
    • Same scenario is applicable when we design our website.
    • Content should get appropriate whitespace to make it look better.
   5. Audience:-
    • Audience is very important part of website design.


    • In above example left one looks like funeral invitation for audience like childrens will not like to see it, whereas in right side picture it's really look like design for children.
    • Children's will definitely like to looked at it as an invitation.

User Experience Design



  • The main difference between design and user experience is that design is like what we think looks good and enforcing that on the user.
  • Whereas user experience is meant to be invisible.
  • It lets you do what you feel good to do as everything is easy and effortless.
  • In order to achieve user experience we need to know few things.
         1. Simplicity
    • Keeping things simple is always better than making it more complex or more cluttered.
    • Ex:- 






    • In the image above you will see so many content on website it's totally crowded difficult to understand it.
    • When we talk about simplicity website design should keep it less crowded and much simpler as possible to keep it readable.





    • Like in above image which has less content and easy to view the content and understand its message.

        2. Consistency

    • Consistency important factor to achieve user experience.
    • It Is all about keeping website content consistent throughout the pages of website.
    • Example:- 
    • Your navigation bar is different on one page and different on another page shows how much inconsistent your website is.If the position of search tool is different in different pages on your website then that is example of inconsistent website.
    • Whereas if you are keeping your website contents uniform or consistent throughout various web pages of your website then it will be definitely a good website design and it will achieve consistency required for better user experience.

       3. All Platform Design

    • In today's days website is not mean to use for desktop only. It is mostly used on mobile phone or on Android mostly nowadays.
    • Therefore when you design your website you also need to think about mobile platform and its users.
    • Your website should be responsive so it should get fit to phone otherwise mobile user face lots of issue while working on your website.

This is all it for now guys!
These important points will definitely help you build a beautiful website with amazing design.

if you wanted explore some other resources or articles on different topic you can visit our other articles.

Comments

Popular Posts