I'll echo the positives that others have mentioned - it's clean, well designed, professional, and incredibly fast. Like, fast enough that I opened the console to see if there was any funky...
I'll echo the positives that others have mentioned - it's clean, well designed, professional, and incredibly fast. Like, fast enough that I opened the console to see if there was any funky pre-caching going on. Nice job on that! The buy you a coffee line made me smile, too.
Two nitpicks, the latter of which is almost laughably minor:
On mobile, the menu doesn't close after clicking on an item, and there's no visible change because it covers the screen. You could add a "selected" state, but I'd strongly suggest just having it close automatically when you click on an item.
If it were me, I'd use the accents on "Résumé" because I think it shows good attention to detail and is (arguably!) the best kind of correct - but the internet at large seems split on the matter, and honestly it comes down to personal choice.
Small detail I noticed: On https://www.dougmellon.com/ the page name shows up as "dougmellon.com/", but on https://www.dougmellon.com/journal/ it shows up as "Doug Mellon :) - Blog".
My only criticism is the logo on the upper left (which is a signature I now realize) which is a bit of a smudge more than anything AND, granted I'm old etc etc, but I can't really see what it is....
My only criticism is the logo on the upper left (which is a signature I now realize) which is a bit of a smudge more than anything AND, granted I'm old etc etc, but I can't really see what it is.
(If you need help with logos or similar: holler. I would be glad to help a tilderinoo out)
Its a very nice and professional looking portfoliopage
@spit-evil-olive-tips, @vivian, @Wulfsta (since they were the users who commented in your resume topic) I really like the site BTW. It's very clean and professional looking. Also love the " chat...
I really like the site BTW. It's very clean and professional looking. Also love the "buy you a coffee chat from a distance" line. :P
The only critique I can come up with is that the grey bar at the top initially confused me a bit, since it gave the illusion of the main body being overtop of something else, and so I thought hovered over it might do something (which it didn't). Maybe making it a touch wider (or even narrower) might prevent that?
And your signature could probably do with being a touch darker, IMO. But both of those are pretty minor issues, and mostly come down the aesthetic choices, so they're not a huge deal or anything.
A few more comments that others haven't mentioned already: Fonts: Playfair Display is good for headers, but not for body text. The letters are very thin at points, which makes them harder to read...
A few more comments that others haven't mentioned already:
Fonts: Playfair Display is good for headers, but not for body text. The letters are very thin at points, which makes them harder to read at smaller sizes. I notice you use Lato elsewhere, which is a fine font to use. I'd just say...try using that for everything that's not a header. (Tip: If a font has "Display" in the name, they want you to use it at large sizes only!)
External Links: As @mat mentioned, use target="_blank". I'd also include the rel="noopener noreferrer" attribute for reasons.
Accessibility: The homepage line about your internship search is hard to read for some people. Check it yourself with the Accessible Colors checker.
Navigation: It's a little weird to have both text links and icons in the same navigation block. You can switch those over to text, or you can put all your social links in a footer.
On Hamburger Menu icon vs. "Menu": I think either is fine for accessibility. You can use whichever you prefer. On social locations: You only have a couple, so if it was me, I'd just turn them into...
On Hamburger Menu icon vs. "Menu": I think either is fine for accessibility. You can use whichever you prefer.
On social locations: You only have a couple, so if it was me, I'd just turn them into "GitHub" and "LinkedIn" and keep them in the header. If you had more, say 4+, I'd put them all in the footer. Then again, six links borders on the most I'd put in a portfolio site's navigation. You could just combine the GitHub/LinkedIn links with your résumé. Use that to highlight the projects/accomplishments you're most proud of, and provide links to GitHub/LinkedIn from there as proof.
A good practice. The next version of Chrome will automatically infer noopener, thankfully. Hopefully other browsers do the same. https://blog.chromium.org/2020/12/chrome-88-digital-goods-lighting.html
I'd also include the rel="noopener noreferrer" attribute for reasons.
A good practice. The next version of Chrome will automatically infer noopener, thankfully. Hopefully other browsers do the same.
So, this is all super nitpicky but here are some thoughts: Heading styling is a bit inconsistent. Headings are lighter on readings (personally, headings should be heavier than the text they're...
So, this is all super nitpicky but here are some thoughts:
Heading styling is a bit inconsistent. Headings are lighter on readings (personally, headings should be heavier than the text they're breaking up but that's just me), bigger on blog and I would say a little small and tightly spaced on resume. Also you use horizontal rules in some places not others.
Font size. Resume looks a little odd because it's smaller and tighter spaced than other pages.
I'd maybe put a little background colour or a bottom border or something on the top bar, just to help draw people's eyes up to where the menu options are and to help your logo feel a bit less 'floaty'. If not that, perhaps right align the logo so it's not sitting all on it's own.
Some slightly stronger hover styling on the links might be nice, it's a little unclear they're active right now.
I'd consider putting target=_blank on the external links. One click on those two and I'm off your site and elsewhere. Keep visitors looking at you.
Perhaps put a 'contact' link up in the nav too: if I've just read your resume and think "yeah, this dude sounds good", I have to click back to the home page to get to you, but you want to reduce the barriers to people reaching you as much as possible.
Like I said, they are very minor points, as it stands it's perfectly good. The important bit is that the information I need about you is all there, cleanly presented and easily navigated. There's minimal fluff but it still feels personal rather than faceless, which isn't an easy balance to strike. I like the use of a serif font. I've never got the hang of using serifs.
I'll echo the positives that others have mentioned - it's clean, well designed, professional, and incredibly fast. Like, fast enough that I opened the console to see if there was any funky pre-caching going on. Nice job on that! The
buy you a coffeeline made me smile, too.Two nitpicks, the latter of which is almost laughably minor:
On mobile, the menu doesn't close after clicking on an item, and there's no visible change because it covers the screen. You could add a "selected" state, but I'd strongly suggest just having it close automatically when you click on an item.
If it were me, I'd use the accents on "Résumé" because I think it shows good attention to detail and is (arguably!) the best kind of correct - but the internet at large seems split on the matter, and honestly it comes down to personal choice.
Even as it stands, though, I'm impressed.
Small detail I noticed: On https://www.dougmellon.com/ the page name shows up as "dougmellon.com/", but on https://www.dougmellon.com/journal/ it shows up as "Doug Mellon :) - Blog".
extra bullet point on the readings page for me as well :)
My only criticism is the logo on the upper left (which is a signature I now realize) which is a bit of a smudge more than anything AND, granted I'm old etc etc, but I can't really see what it is.
(If you need help with logos or similar: holler. I would be glad to help a tilderinoo out)
Its a very nice and professional looking portfoliopage
make it black like rest of the header.
Well holler if you wanna chat about a redesign of it (jens at ohyran.se)
@spit-evil-olive-tips, @vivian, @Wulfsta (since they were the users who commented in your resume topic)
I really like the site BTW. It's very clean and professional looking. Also love the "
buy you a coffeechat from a distance" line. :PThe only critique I can come up with is that the grey bar at the top initially confused me a bit, since it gave the illusion of the main body being overtop of something else, and so I thought hovered over it might do something (which it didn't). Maybe making it a touch wider (or even narrower) might prevent that?
And your signature could probably do with being a touch darker, IMO. But both of those are pretty minor issues, and mostly come down the aesthetic choices, so they're not a huge deal or anything.
A few more comments that others haven't mentioned already:
target="_blank"
. I'd also include therel="noopener noreferrer"
attribute for reasons.A good practice. The next version of Chrome will automatically infer noopener, thankfully. Hopefully other browsers do the same.
https://blog.chromium.org/2020/12/chrome-88-digital-goods-lighting.html
So, this is all super nitpicky but here are some thoughts:
Heading styling is a bit inconsistent. Headings are lighter on readings (personally, headings should be heavier than the text they're breaking up but that's just me), bigger on blog and I would say a little small and tightly spaced on resume. Also you use horizontal rules in some places not others.
Font size. Resume looks a little odd because it's smaller and tighter spaced than other pages.
I'd maybe put a little background colour or a bottom border or something on the top bar, just to help draw people's eyes up to where the menu options are and to help your logo feel a bit less 'floaty'. If not that, perhaps right align the logo so it's not sitting all on it's own.
Some slightly stronger hover styling on the links might be nice, it's a little unclear they're active right now.
I'd consider putting target=_blank on the external links. One click on those two and I'm off your site and elsewhere. Keep visitors looking at you.
Perhaps put a 'contact' link up in the nav too: if I've just read your resume and think "yeah, this dude sounds good", I have to click back to the home page to get to you, but you want to reduce the barriers to people reaching you as much as possible.
Like I said, they are very minor points, as it stands it's perfectly good. The important bit is that the information I need about you is all there, cleanly presented and easily navigated. There's minimal fluff but it still feels personal rather than faceless, which isn't an easy balance to strike. I like the use of a serif font. I've never got the hang of using serifs.
Just noticed a simple typo.