Would you guys mind giving me your opinion on my site? https://adamsparks.me/

Overall it's a great site, however there are some things that make it just a bit better :) Try changing the font or color of the text in the header, make it pop out a bit more.

Also try looking a bit into the grammar of some sentences.

Definitely not trying to make it condescending, just trying to give constructive critisicm. It really is a great site as it is now :)

Thanks! I was afraid I'd made it too flashy, I'll make some adjustments from your recommendations this evening

Really nice.
Also that logo... I first thought the skin under the mustache is supposed to be the mustache 😅

Those bars are really annoying me. At school we also had to make it but really you dont know how much you know unless you know what there is to know. So when I said my knowledge was about 50ish for the things I knew my classmates had 90% in most skills. But I was the one with the most knowledge and experience in my class (teachers included)

Its better to day you have experience with it and not express it in those bars.

Also there is some issues with capitalization of words

@Codex404 also could be for the other direction

Weird alignment things in the first section.

@hubiruchi I dont get what you mean, care to explain?

Button is awkwardly close to the footer

This section seemed really weird to me, took me a while to realize it where projects and you could toggle between them.

Oh Im absolutely trying to be condescending btw, because that way you get the best reactions and its up to you to decide what to do with it.

@Codex404 you can think you know nothing and then get out of and understand you actually know something

That's amazing.
Which tools you used?

@hubiruchi I have never seen it ithat way because when you think you have almost no experience with something then you probably have no experience with it

1) enable gzip compression on the server.

2) add browser cache expire headers.

3) use optimised images (compression).

4) add the alt tags for images.

5) add image dimensions (except for CSS background images).

6) try to combine Javascripts.

7) specify document language (English).

8) use proper heading hierarchy - you have h3 headings, but h1 and h2 are missing.

9) use proper contrast - 8e61b0 on 262626 has 3.2:1, but should have at least 4.5:1.

10) enable the user to resize the website (see viewport).

11) validate the HTML - a portfolio page with HTML errors sends the (hopefully) wrong message.

Wow, thanks for all the feedback! much more than I expected

@Fast-Nop how do you get to the numbers at 9?

And for validation use the W3 validator

@Floydian we need a tester!

(I completely forgot to mention you for test work,, Im sorry)

@aarfa react, redux, node, webpack, typescript and it runs on Nodejs

and the api for the blog / quotes is handled by the alpha version of strapi

I built it using a yo generator I've been planning on releasing but haven't had a chance to document yet.

the source is here https://gitlab.com/Omarzion/...

@Codex404 That section took me almost a full two days to do and I don't really like the result either, but I haven't figured out how I want that section to look yet

@Codex404 I'm using https://wave.webaim.org/ for such tests on live websites. During dev, the tool https://webaim.org/resources/... is great.

For checking the server side stuff, I like https://gtmetrix.com/ a lot.

@Omarzion which section? I think. Commented about each section :D

But I like the overall look

@Fast-Nop those tools are amazing, @Floydian add them to your link thingy repo.

@Fast-Nop

1. thanks for catching that, I am compressing the page but missed the js and css

2. the cache is handled by a web worker, should I also add those?

5. These are determined by the url, I'll go ahead and add those too

6. other than react and google CDN links its all in main.js?

9. How do you find the contrast ratios like that?

10. you mean user-scalable=yes?

11. What html errors are you seeing? I'm not seeing any on my side

@Codex404 Haha sorry, the section with the floating cards. Weather, calc, etc

@Omarzion

2) I'd add them so that the client side browser knows it can cache them, and check with https://gtmetrix.com

5) the idea is that with specified img dimensions, the browser can build up the correct layout and add the images once they are loaded, without moving things around. Especially on mobile with network delay.

6) makes sense, yeah.

9) https://wave.webaim.org/

10) scaling should be possible anyway unless inhibited, so maybe something like "width=device-width,initial-scale=1.0"

11) see https://validator.w3.org/ - besides the alt tags, it's also one div as child element of a button that is not allowed.

I don't want to be rude or offensive, but the percentage part is really a bullshit.
I mean, what does it mean that you are "80% backend"?
You are good at tge 80% of it? If so, what does that mean?

They are really nice to see, but they are so senseless that putting them in you resume is a self-punch on the face.

If you want to show your competences, just write them with a SMALL description, but avoid percentages.
I'll slap the shit out of my colleagues if they would ever say "I'm good at 80% in C".

On the graphic side, I'm not a designer, but it looks nice to me.
It is just weird that when I load it, the first image (the galaxy) isn't on full screen.. and the animation looks like something taken from a word document of a 11yo student.
Beside that, looks good.

Not sure if I’m the first to say this, but that about me text looks like you took a thesaurus and just picked synonyms to every work. I would be turned off if I was going to potentially hire you.

The only other thing is the percentages. I have no idea what that means.