I'm sure you have heard of Web Design before, but I would like to take you so much deeper than just covering the basics of the subject.   

"Web Design" is best described as having a variety of skills and disciplines in the creation and maintenance of websites. 

There are many different areas associated with web design. 

Some of these include interface design, web graphic design; authoring, which includes standardized code and proprietary software; user experience design; and we cannot forget about search engine optimization. 

Designing a website takes a lot of work. Oftentimes there is a team of people working on different aspects of the design process.

There are still those who choose to do it all on their own.  

If this is you, then more power to you! 

The term "web design" is usually used when describing the design process which is being related to the front-end (client side) design of a website containing writing markup. 

Web design is known to partly overlap web engineering in the broader spectrum of web development. 

Those web designers who decide to make a career out of creating websites must have an awareness of usability.

If their job happens to involve creating markup, then they should be up-to-date with the web accessibility guidelines as well. 

TRENDY

TRENDY: adj. "very fashionable or up to date in style or influence"

As a designer, one thing you do not want to do is fall behind on all of the latest trends. 

You might even end up creating a brand new trend who others will want to try. 

Why not "GET TRENDY WITH IT!?"

Web design takes skill. Both creative and technical skills are needed.  

Using some of the latest trends will keep your users interested and wanting more of your content.    

Do you notice how the picture at the bottom of Rino & Pelle starts zooming out as you keep scrolling down and introduces you to some more pictures?  

This is something that is really eye-catching.  

Mooi let's you interact. When you click enter on their homepage, they lead you into a room. 

Here, you are able to click on the home decor you would like to take a further look at. 

The designer that has created that specific piece can be found on this page.  

By scrolling either up or down, you will be lead into another room once you go back into the room you viewed the object from. There are quite a few rooms that you will be able to take a look at.  

There are quite a few rooms that you will be able to take a look at.  

If your goal is to keep your user on the edge of their seat, this is a great way to do that.

Keep an "OPEN MIND" at all times. Try things that others might not consider. Experiment. Practice. Explore. Research.   

"Great things never came from comfort zones."

Implementing your own ideas as well as those of others into your design will turn it into a success. 

You might just end up surprising yourself! 

COLOR

Color in web design is more important than you may think. 

This shouldn't come as a surprise to you at all. 

Did you know that colors speak emotion? 

Yes, I said it, they speak. It may sound extreme, but colors do have a way of making us feel a certain way.  

Take the color "black" for example, "black" to some people may make them feel sad. There are others that look at the color "black" and it makes them feel empowered or sophisticated. 

Now take the color "pink" for an example, "pink"  appears bright and vibrant. It has a way of uplifting your spirit.   

Colors have a way of speaking to people in many different ways. 

They may even bring up certain memories in people's lives. 

It will be different for every individual of course.   

When designing a website, make sure you take note of who your audience is. 

Why is this important?

For starters, your audience will always require your full attention, no matter what area of web design you end up working in.  

This is why you are designing in the first place, right? 

You want to have all eyes on your website! 

Let's take a deeper look into color......

In our modern world, artform now has the opportunity to open itself up to quite a few new commercial and business applications, starting off in advertising, and now reaching web design. 

Possessing an almost limitless depth, this color usage skill will be able to keep improving and redefining endlessly. 

Now we will start exploring the fundamentals of color theory as well as color scheme. 

After this, we will take a further look into the emotional effects of some more colors. 

If we were to talk about every detail that goes into the topic of color, we would probably end up filling an entire book on its own. 

Instead of going into every single detail, we will put our focus on what is relevant to UI design. 

We will be able to take color theory and break it down into 3 parts regarding web UI design.  

CONTRAST 

Every shade of color is known to have a set opposite - an "arch-nemesis" whose contrast is going to be far steeper than any of the other colors.

Using the color wheel below, go ahead and locate each specific color's opposite.

You will be able to do this by simply locating the color on the other side of the circle. 

COMPLEMENTATION

Don't get me wrong, colors are not always against each other: complementary colors accentuate one another by bringing out their best feature, which is the complete opposite of contrast. 

Complementary colors are opposite of each other on the color wheel. Here's an example: purple compliments green.  

VIBRANCY

Each color has the power to evoke a specific mood: brighter colors (orange, yellow, red) tend to energize users and keep them alert. 

Darker cool shades (green, purple, blue) bring on a more relaxing and tranquil vibe. 

When using color theory in web design, remember this, it is so much more than a visual garnish, it has the capability of changing your business. 

Have a hard time believing this?

TYPOGRAPHY

TYPOGRAPHY: n. "the art and technique of arranging type to make written language legible, readable, and appealing when displayed"

This art and technique is at the center of each designer's skillset.  

It is so much more than simply making words legible. 

Whatever typeface you happen to choose and how it will work with your specific layout, color scheme, grid, and etc. will very well determine the difference between good, bad, and great designs.  

The field of typography covers everything from correct names for your letterforms, to terms used when arranging them in a design. 

Font Selection, Size, Leading, Tracking, Kerning, Measure, Hierarchy, and Scale are all very important attributes in typography. 

#1. FONT SELECTION

Don't get me wrong, font design is most definitely a long and involved process. 

There are craftspeople who have created typefaces over a great period of time, using the talent that they have developed over the years. 

Those professionally, perceived fonts, come with a variety of different weights and styles which form a complete family, along with kerning pairs, multi-language support containing international characters, and expressive alternate glyphs that work to bring character as well as variety to typesetting.     

Free fonts will always be available for you to use, but you will need to make sure that the one you choose includes all of the options you will need if you are wanting to create a great design. 

It can seem quite overwhelming when considering the paid-options. There are so many choices you can choose from.  

Sticking to the classics may be tempting, but I recommend branching out and trying something new.  

Inspiration is out there! It is your job to go find it. 

#2. SIZE

Not every typeface is created equal. 

Some may be bigger and wider, while others are much thinner and narrower. 

So of course, words that have been set in different typefaces will end up taking up different amounts of space on pages.  

Each of the character's height is known as its 'x-height' (this is because it is based on the 'x' character). If you are going to pair different typefaces, it is wisest to use those that have a similar x-height.  

The width of each character is best known as the 'set width'. this simply spans the letter's body as well as the space that plays the role of a buffer located between one letterform and the next. 

One of the most common methods used to measure type is known as the 'point system'. This method goes all the way back to the 18th century. 

1/72 inch is equal to one point. One pica makes 12 points, which is best known as a unit that is used to measure the width of the columns.  

Sizes of type can be measured in millimeters, inches, or pixels. 

#3. LEADING

Leading is best described as the vertical space between every line of type.  

You may wonder why it has been given such a name. 

The fact is, back in the days of metal typesetting, strips of lead were being used as ways to separate those lines of type.  

If you are wanting legible body text that will be easy for you to read, follow this general rule: your leading value should fall between 1.25 times greater than your font size. 

#4. TRACKING & KERNING 

The process of adjusting the space located between the characters in or for you to be able to create a harmonious pairing is known as 'kerning'.  

Let me give you an example: if an uppercase 'A' were to meet an uppercase 'V', their diagonal strokes will usually be kerned. This allows the top of the 'V' to sit above the bottom right of the 'A'. 

Tracking is similar to kerning, but they are not at all the same. Tracking is best described as being the process of adjusting all the the character's spacing in a word, being applied evenly. 

#5. MEASURE 

The width of a text block is known as 'measure'. 

Wanting to achieve the best reading experience possible? 

Well then, focusing on 'measure' is something that needs to be considered. 

Lines that are too long can easily get your reader lost. Lines that are too short on the other hand, end up breaking your readers experience unnecessarily. 

There are a number of theories out there that have been used to define what the ideal measure of your typography should be. 

Here is one rule: lines should be at least 2-3 alphabets in length (52-78 characters, includes spaces). 

#6. HIERARCHY & SCALE

What if the type contained in a layout all looked the same?  

This would make it very difficult to identify which information is of most importance. 

Typographers create hierarchy and provide guidance to their readers by putting an emphasis on size. 

Large headings, smaller sub-headings, and an even smaller body type are used. 

Hierarchy is not only defined through size, but also through color, weight, and spacing.  

GRAPHICS

Graphics are visual representations that are used on websites intended to enhance or enable representations of ideas or feelings, the goal being, to reach the user. 

Entertaining, educating, or emotionally impacting users are some other intentions of graphics. 

Graphics are crucial to strengthen branding, understanding illustration, and easing use for interfaces. 

Here are some examples of graphics: photographs, family trees, bar charts and pie charts, maps, design and patterns, diagrams, typography, line art, schematics, flowcharts, architectural or engineering blueprints, etc.  

So what are graphics used for? 

Enhancing a web page's appearance and serving as the presentation along with acting as a user interaction layer for those full-fledged Web Applications are some ways in which graphics are used.