Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Thomas Nilsen
14,957 Points3rd times hopefully the charm
First of all I just wanna point out that this is such a great community. I'm learning so much!
Now, after my two previous posts, I got a great deal of tips as to what to improve on, how, and useful links.
I have once more done a re-design. This is pretty much all I've done for the past 12 hours or so (because it's fun and interesting). Starting out with the design, thinking carefully about my color choices, layout, fonts, and so on.
So, once again, I'd love your input. Suggestions, things that could be done better or differently.
Thanks again.
3 Answers
Chase Lee
29,275 PointsJust one thing. Your contact button is cut off...I don't know if this is intentional or even if you knew about it. But other than that it looks great! You just keep making it better and better!
Jonathan Musso
3,760 PointsThomas, good evening. You've been at it all day long eh mate? Good work, you are definitely progressing here. Here's some suggestions starting with your navigation.
You should complete your anchor pseudo classes, it's great for accessibility. Perhaps change the button background color while hovered or give it some sort of simple animation.
I love what you did with the introduction and how the keywords stay bright while hovered and the rest of the words fade. Before the user gets to the point of hovering over your introduction, it might be visually pleasing to change the colour of select words, i.e. your name, location, etc.
Let's take a look at the tools you have used. The icons feel a tad too large compared to the text. Consider changing the color of your heading for, "Tools used". It's white just like your introduction and does not attract the intended attention.
Your portfolio looks good. Justifying the text to the left might look better and with a crisper font, imo.
For your footer if you use social media it might be an idea to add links to your accounts down there, i.e. facebook, twitter, etc.
Great work Thomas! Take a look at what you started with and where you are now, awesome progress, man.
Thomas Nilsen
14,957 PointsHi Jonathan. Once again, thank you so much for such detailed replay. Lot's of valid points I will pursue! :) When speaking about fonts. I have a couple of special fonts. I use google fonts, and when I ran my site on a windows computer in chrome, It didn't pick up on any of the special fonts. I'm not sure why that is.
Jonathan Musso
3,760 PointsThomas, no prob. Check your version of Chrome and the support it requires, perhaps some workarounds if they aren't showing.
Thomas Nilsen
14,957 PointsHi again Jonathan. I've done some slight modifications. to the site. One question though. That is regarding my code.
In my footer, I've used absolute position to place it at the bottom of my page. And that work's fairly well, but when I try to resize the window, and I make it small enough. the footer is sort of pushed upward.
I'd really appreciate it if you could have a quick look! :)
Jonathan Musso
3,760 PointsThomas, I would suggest removing your footer from the main container. This way the footer will be after all the content. Set the width to 100% of the page, since you want it to span from browser edge to edge. Set your margins and paddings accordingly. Right now your content blocks are being smushed together while resizing.
Have a look at floats, clearing and overflow. Review the Treehouse videos and take a look at this good read, http://alistapart.com/article/css-floats-101
Thomas Nilsen
14,957 PointsI removed the footer from my main container, change the position from absolute to relative and added width:100%. When i resize it down to 1024px it's fine. at 768px it's acting weird. There is probably a very good explanation, but I don't see it. Tried also to set margin and padding =0, just to make sure it wasn't empty spacing that made it happen.
Thomas Nilsen
14,957 PointsNever mind. I figured it out! :)
Jonathan Musso
3,760 PointsHey Thomas, I was at work longer than expected. Glad you figured it out.
Thomas Nilsen
14,957 PointsThomas Nilsen
14,957 PointsI just realised that now acutally. I was working on a macbook pro 15. It wasn't before I ran i on my windows i spotted it. Thanks for your feedback anyway! :)