Feedback for beginner projects :D

Feedback for beginner projects :D
0

#1

Point of order, just getting code made, not worried so much about content.

Tribute Page: Here

Portfolio Page: Here

Thanks!
Matt Risk


Build a Tribute Page Questions, Discussion, and Resources (October 2017 Cohort)
Build a Portfolio Page Questions, Discussion, and Resources (October 2017 Cohort)
#2

It’s a good start.

I’d reccomend making it look prettier by experimenting with new fonts and colors.

Check out Google Fonts and try using a nicer looking font : https://fonts.google.com/

Sites like these are good places to find color combinations that work well:


Look into learning about more advanced CSS properties like padding, margin, line-height, font-weight, etc… so you can make your site nicer to read.


#3

Thanks for the info! My wife is a UI/UX designer and she scoffed at the design elements as well. I am more focused towards the Javascript/Java and backend side of things. I focused on the functionality and responsiveness of the site. I will make my portfolio site look better before it comes to job search time.

Matt


#4

I guess its a nice start. Way better looking than mine xD
link

I gues we both are more focused on the actual code rather than the design. :smiley:


#5

Yep! I teach Comp. Sci. at the HS level and am ready to quit teaching. I’m just working on getting the portfolio done (I have some android apps done as well) and some certificates and then start looking for work.

Matt


#6

I dig it man.

I think functionally the portfolio is working great.
I can tell with the help of jQuery you wrote a lot of the JS yourself which is cool.

I think the only constructive feedback I could give is to be intentional with naming classes, id’s, and functions.

Down the road, and I have no doubt you know this, you could be building sites that have hundreds, if not thousands of lines of code. It can become very easy to get lost in all the code. When writing functions that you want reuse later it’s a good practice to name them something that is logical and will be easy to remember later.

I’m definitely not a front-end developer myself haha so please don’t get the impression that I think I know everything. Just an observation I made while going through your sites code.

Aside from that I think they look great and they do exactly what you want which is great!

On a side note I actually really enjoyed your social media link buttons at the bottom.
Very cool effect!


#7

Hello fellow campers. Here’s the link to the original thread for my tribute page -

Please take a look and provide your feedback. TIA


#8

Good work @Slayermordi.:+1::+1:

I’ve just one suggestion. Add an img-responsive class to the image to make the image responsive.


#9

Thanks for that, yeah naming conventions are my weak point when I’m not trying.

Matt


#10

Thanks for the advice @debu2code :slight_smile:

I originally had img-reponsive, but removed it because on my mobile it made the image stretch in a weird way.
Re-added it now and added a max-height/max-width css tag. Seems to have fixed it :smiley:


#11

@Mdrisk Great work on your Tribute page!

You’re using inline styles in your HTML like <b>, <em>, and style="font-size: 25px; padding-top: 40px". Some say that this is not the best practice as it’s ideal to separate the function (HTML) and design (CSS). Here’s a good resource for learning more about that. Also, here’s some info on using the <i> and <b> elements in HTML5 in case you want to continue using them.

I notice you use a .main class. Did you know that there’s a <main> native HTML5 element? If not or if you’re curious, here’s a link about other HTML5 semantic elements.

Even though you’re planning to focus more on the JavaScript and functionality side of things, knowing how to write clean, valid, and readable HTML5 markup is still important. I find that watching this screencast showed me how HTML markup is really important to the overall project. It also shows the HTML5 semantic elements in action.

I don’t see anything else that stands out. :slight_smile: