Technical Documentation Page Styling Feedback

Hi everyone! I finally finished my Technical Documentation Page:

Any feedback would be great, I decided to give it some pop and color. There isn’t any technical “code” in the documentation, I got into it way too far before I realized it required some elements.

2 Likes

Pop and color are good in documentation to highlight areas and important topics.

But sometimes, “less is more”…

since a picture is worth a thousand words, my feedback will be in the form of a screenshot. :slight_smile:

Your original:

1 Like

That looks great!! Thank you for taking the time to create that and show it to me.

You make a great point about less is more. With the white background some of those colors I had stand out way to much don’t they? haha

I also really like the way you set up the navigation, especially with the non-active text being slightly lighter in shade than what is selected. Mind if I take some of these ideas and run with them?

Definitely. You are welcome to use these ideas.

Yeah, in web design (frontend work, css, etc) , the smallest detail/subtlety is as important as the big picture. The smallest details like the particular shade of color, lightness, or radius… or how much padding and margin to use, font-size, font style, etc.

Some coders may poo-poo CSS and styling, but I love it, and enjoy crafting a good looking and functional page as much as coding the business logic/database models behind the scenes.

Think of it this way… The look, design and style of a website is the first thing the viewing public will see! Not the hidden code behind the scenes. People will judge a website/app based on it’s look, their first impressions.

1 Like

You make a great point. First impressions are everything :slight_smile:

I’ll admit that I really enjoy styling as well. It’s one of the reasons I am enjoying web development, you get to be logical and technical in the background but also creative out front.

https://codepen.io/AsherSaleh1/full/NBqKVm/

This is mine. Feedback please.

You’ve got a nice page there. It’s got some amazing colors.

1 Like

I loved your page, nice subject, nice colors and very neat overall. Great work!

1 Like

Hi Alexander,

You website is nice and clean. Also the font size and family are a good choice. Reads nice.

There only 1 think I noticed. It looks like the side bar does not have overflow. When I shrink the browser window horizontally, the lower part of the side bar cannot be accessed anymore. It disappears in the bottom. Maybe you can take a look?

Pascal.

P.s. If you have the time, can you also give a feedback on my Product Landing Page? Thanks in advance :slight_smile:

1 Like

Thank you very much!

Looks great! One thing I noticed is when you try it on a mobile device, the top navigation bar will run over the content when you click a link.

I had this problem on a previous site myself, and I used a hack to insert an “invisible” placeholder that then allows you to navigate down the page without covering your content.

Check out my product landing page as an example. Maybe you can figure it out from my code (look for class=“ctn”):