Abhay Prajapati

Posted on Apr 9, 2022

I create my portfolio today, I want your reviews.

#beginners #productivity #discuss #career

I have recently created my portfolio today, I want your views regarding aspects of

 design,
 UI,
 favicon,
 theming
 features and alot.

here it is have a look HomePage

`Background Color`

#000000 for background color Main theme color.
#111111 for background color secondary theme color.

`Font/ Text Family:`

Actullay, I haven't sorted any font, but I am using Inter from Google Fonts

`Font Text Color`

Here are list of colors I have used for text:
Text main color: - #ffffff
Text secondary color: - #999999
Text for Links/Buttons: - #52a9ff

Do tell me about the way I have present it, also how's the tagline.

tagline: 19,who keeps think... creator of Open Source Apple Store API

does any things feels incomplete or missing? regarding my portfolio? share below.

Have a look a Favicon animating in your browser.

some thing like this...

Reach me any where.

Twitter: @Abhayprajapati_
Github: @Abhayprajapati

thank you for reading

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

Top comments (3)

JoelBonetR 🥇 • Apr 9 '22 • Edited

I'll try to check kinda deeply and point you the mistakes, regarding

Technical + QA + Accessibility + Design issues Review.

When you jump from the homepage to a different view, the navbar becomes smaller, which is weird and makes me think that you didn't re-use your navbar component.
The navbar isn't shown in blogs nor in about.
Blogs are shown in this home but not in blogs.
You've a little description that is shown in the home but not in the /about section.
You are not using next/Image to load your images, which leads to non-optimised images which does not have explicit width and height attributes.
Top left image should be in .webp format (better quality and compression than the current jpeg)
<ul> tags does contain tags other than <li> (which deals to invalid HTML), i.e. top right menu is an <ul> tag with <button> tags inside.
I'll add your name next to the photo as it's hard to find out that clicking there you can go back to this "home" view.
Links are made with <span> tags for any reason I can't figure out, remember that you can use next/Link with passhref and it's child should be an <a> tag
The cards should be clickable as well (not only the link), this makes it easier to browse, specially in smartphones.
The cards container should have a bit of padding. In mobile, cards don't seem cards as they are sticked to both left and right.
Using a color code such #f5f5f5 and #212121 as max/min color value, instead pure white/black reduces the visual fatigue while reading a site.
Github and Twitter icons are not an <a> tag (all links should be an <a> tag so crawlers (for SEO) and text readers (for accessibility) can identify them properly
I'll rather avoid the underline in links as the visual hint is enough with this blue color and the hover effect.
If you plan to render all the content in the home (which will probably be a good idea) I'll suggest to avoid adding menu items or convert them into anchor links instead.
This "XX hours ago" text is too dark (not enough contrast ratio)
<html> element does not have a [lang] attribute
Meta description is not present in the document.

See Lighthouse Report as well for insights on Core Web Vitals.

Hope it helps :)

Abhay Prajapati • Apr 10 '22

Thanks for so deep review, for today these are my task and goals, I finish them and let you know.

Your points are guidelines.
🥰

Ben Halpern • Apr 9 '22

Love the color scheme. Blues and blacks and grays are distinct and palatable. Seems like the margins are a little funky in places. Too tight in some places and wide in others.

Eliminate Context Switching and Maximize Productivity

Pieces Copilot is your personalized workflow assistant, working alongside your favorite apps. Ask questions about entire repositories, generate contextualized code, save and reuse useful snippets, and streamline your development process.

Learn more

DEV Community