Aspects of website design

Introduction

As I am not experienced in website designing I researched on the internet, books and looked at some websites to learn more on how to make a good website. This operation was necessary since the design and functionalities of a website are what make people stay on a certain platform. This document will regroup what I found and my ideas on the matter.

Colors

Colors are a big aspect of designing a website, I don’t want to end up with a plane and boring site but also not to end up with some ugly flashy combination that will disgust users. Every color has different feeling or emotions attached to it. When people see some color they will feel some kind of way. So to choose what colors I will do the following steps:

Choosing a dominant color as the brand color
Choosing 1 to 2 accent colors to create a color scheme for the website
Choosing a background color to complete the design

To complete the first requirement, let’s look on how people feel for each color:

Green represents wealth, health, tranquility and nature; it’s the easiest color for the eye to process, so it has relaxation effects.

Yellow represents youthfulness, optimism and cheerfulness; often used to grab the attention of the audience, it’s a strong color so it must be used in little doze.

Orange represents friendliness, enthusiasm and creativity; it’s the color or impulse shoppers.

Red represents passion, energy, urgency and danger; it’s effective to trigger strong emotional reaction also it stimulate appetite.

Pink represents feminin, sweetness, innocence and romance; used to attract women.

Purple represents royalty, wealth, success and wisdom; it has a soothing and calming effect.

Blue represents trust, security and peace; used in businesses and banks to create a sense of security and trust.

Also in the commercial effect, some color will affect your activity.

By looking at all the possibilities, I feel like teal or blue must be our main color. As accent colors, we should go with some yellow and/or pink.

For the background we should stick with white to let the focus on the projects or going with shadings of our dominant color (as many buisness websites do).

Navigation is one of the most important part of a website, indeed when we look through a website we want to see what we can do and how easy it is the find it. The sidebar is the key of an easy way to search for those options. The sidebar must be well seen by the users but not by using a flashy color (such as fluo pink). We can tell that the sidebar is the main menu bar (I say main since there are other type of menu such as “mega menus” or “sticky navigation”). We will need to add a fat footer. Generally this space is reserved for privacy, legal links and displaying the security icons and methods of payment. This way the user will feel more at ease and a better reliance on our platform. Finally, it will look very good since it will close the site’s layout and give a clean aspect.

Card Design

“With the rise of Pinterest, designers and marketers alike have become fascinated with cards. Individual cards help distribute information in a visual way so the visitors can easily consume bite-sized pieces of content without being overwhelmed.”(1) This in my opinion could be a good addition, indeed if we look at the repository list we can see just a simple table with some information about it. What if we put the logo of the project and align them, then the user will just click on the image and it will get him/her to the project’s description and/or repository. Because in the end if we think about the potential projects we can suppose that there will be more information and graphs to illustrate the project’s advancements. Here’s an exemple of a card design:

Alignment

When we talk about alignment we talk about the overall website structure. In fact we should follow the eye tracking. But what’s that all about? Well according to some scientific research, depending on the color scheme, the text and image position, people tend to stay on a structured website with a certain view pattern. For our website the adequate pattern must be the figure D of (2).

Mobile Friendly

Even if this part will be short I think it’s worth mentioning that: all websites today should be built for mobile viewing as well as the traditional desktop view. If I were the leader of the project, I would want to check the activity of my repository anywhere on my phone. Or if I were a financier, I would want to see at any time how the money I give is used.

Documentation

(1)https://blog.hubspot.com/marketing/elements-of-modern-web-design-list

https://www.lyfemarketing.com/blog/effective-website-design/

https://pennerwebdesign.com/blog/the-most-important-aspects-of-website-design/

(2)https://www.techrepublic.com/blog/web-designer/effective-design-principles-for-web-designers-alignment/