Hello, @js-goose
I hope you are well and enjoying the holidays!
First of all, is there room for improvement? Yes (and quite plenty I am afraid), but for someone who is not a designer and never has any training in it, this is brilliant! I am pretty sure that if you ever have training in design, you will pass with flying colours and make a fantastic web designer without a doubt.
I have been reviewing everything in your layout and made notes of what can be improved. But rather than writing very long feedback (which could get overwhelming). I will break it down and give you feedback for one section at the time to discuss before going to the next one. I will first discuss what is working well, then discuss improvements/suggestions in general and the home page section.
What is working
The colour choices in your colour palette work nicely. Not only all the colours work well together in harmony, but it reflects the branding of the company very well. Just beautiful!
Font choices are good. However, the rule o thumb is to try to stick to maximum three (ideally, it is two) font choices as well. I am not sure if you have a different font or they are the same but contain different styles.
Suggestions/ What could be improved
General
When I went through your layout, I have noticed it has lacked style structure/rules, which the relationship between certain elements on each section doesn’t feel connected. I will give you one example of what I mean. In every section, there is usually an h2-level heading. The design rule for that could be:
- It must be a [font-name] font
- It must be bolded
- Its top and bottom padding must have 30px
- It can have a minor change of colour, because every section’s background colour may differ (see below).
Sometimes, the structure/rule can be slightly broken, and that would be the case of using a different colour for the heading due to background colour. Or, add more padding due to a composition of a particular element in a section. But, these would be only minor changes.
When we start designing, we need to set structures/rules for each element, but every layout as well. We also need to think that these elements are they unique or are there more than one same element? Such as heading text for every section are not unique because they share the same purpose of what they are meant to do. So, for every element, we need to set rules on:
- Colours
- Typography (if necessary), also including styles and where do they fit on heading or text level?
- Whitespace (padding and margin)
- Imagery style (if necessary)
Also, I would suggest using a column grid to align your elements in an equal and balanced way, especially when you have more than one element that looks almost the same.
Home-page section
This may not be relevant, but does the layout have a logo or the company/client’s name? (It may only become relevant if it is to be included in the future, and it could affect the whole layout itself).
-
The padding of this transparent box should be equal on both left and right. The left white box is too closed to the rounded (bottom left) corner, and they sort of clash to the eye.
-
Suggestion: the two white boxes would look better if they were aligned to the right instead of being “justify” aligned. This is because the left margin of the left box is not equal to the margins of both the text heading and body text, making the left margin look slightly unbalanced. Plus, the space between the two white boxes looks too spaced out.
-
The text (both body and heading) and the arrow content within the transparent box is aligned to the right. It would be much better if it were aligned to the left. Based on user experience, this is because our eyes are used to read from left to right (especially in the western world).
-
The padding between the text content and the white box should have equal left and right padding. It also needs more padding as the text on the left side to too closed to the edge, but only by a slight rather than major.
Sorry, if this is too long, but I hope this will give you some ideas about what could be done.
I hope this helps!