Tribute Page - Can anyone offer some feedback? I'm new!

This is my first FCC project and my first time posting. :blush: I started freecodecamp yesterday and plowed through all of the sections of Responsive Web cert up to the projects, then worked on my first project today. I have some general experience with html and css, and got most of it done, and will finish with some more formatting (making the timeline better, etc.) tomorrow, hopefully. I’ve only viewed it in codepen and on my phone. Any feedback? Tips for making it look and function better?

https://codepen.io/pie9/full/mdbaMMK

Thanks in advance! I’m looking forward to continuing my coding journey and learning from you.

4 Likes

Hello Pie1011!

Things we have in common : I’m also new to FFC!

Things we don’t have common : I didn’t plow through all sections of Responsive Web AND make my first project in just one day. :slight_smile:

I took a look at your project.
(I don’t like the design (I’m a design-kinda-guy) but that’s a personal thing. :slight_smile: )
I do like how you set up the page!

I’m going to keep an eye on this.
I wanne know what the pro’s have to say about this :slight_smile:

Best of luck, at the speed you’re working on now, you’ll be a full-stack developer in no-time :wink:

Hi @Bulbusaur! I’m not really a fan of my design, either. It seems really dated or something, like something you’d see years ago. I was having fun playing around, though. I didn’t go into it with any idea of what I wanted it to look like, other than the basic structure, so brainstorming visual appearance firstmight have helped. The brianmay.com uses red so I went with that.

Thanks for your feedback! I’m sure I only did the first part so fast because it was familiar… I’m sure it’s going to get really difficult and complicated for me from here on! Best of luck to you, too!

Wow! You’re saying you did this in ONE day??
This is the fastest, most outstanding project I’ve ever seen for a first-time user!!

You have a true talent in the art of coding!
The font you picked is really nice.

1 Like

Thank you, @ConnerOw1115!! I mentioned I have some prior knowledge, but that’s the first time I’ve done an html/css page from scratch in a years (decades?)… I’ve tweaked some WordPress templates here and there.

I basically say on the couch with my laptop for two days, haha. I spent a lot of time trying to use flex and gave up and went to grid, which was also very confusing, but it finally came together. I’d like to get more comfortable with flexbox.

Flex and Grid are stuff I don’t really use. I just use the others. Flex and grid are usually meant for making things responsive. but I just use the % css command to do it.

Skeleton of your website or design? Great!!

The different color? I’m not a big fan…(That is personal)

Also checking your code, about your ID SELECTOR (nav-link) it can be used only one time in your page.
This is the big difference between an ID and a classID can be used to identify one element.
You used it more than one. Codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of the HTML section and then click on the respective ‘Analyze’ lin to see what i am talking about.
image

Also you can make your website responsive if you want it to display properly in a screen size a phone.

image

After that everything look good to me! Keep coding! You are moving forward!

1 Like

@birkhoff thank you for the feedback! To be honest, I’m not a big fan of the color either, or the gradients, etc. I guess I was just trying to use some of the things taught in the lessons and I was getting burned out doing so much in one day so I stopped messing with everything. :wink: Good catch about the nav-link ID! I changed it to a class, rather than creating another ID. Is that the best approach? I wasn’t aware of the analyze features in codepen (my first time using it). Thanks for the tip!! I’ll also review how to make typography more responsive again. :slight_smile:

P.S. Off topic, the forum keeps popping up with a message that I might have code that’s not formatted in my posts/comments… How do I fix that? Should some of the things I’ve typed be formatted as code (with the ` things)?

There’s no issue changed it to a class. It is perfectly fine. If ever you can make it more responsive, it will be perfect to my eyes of course!

About the pop up, i saw this the first time i visited your page but didn’t pay attention. Now it didn’t happen. I am sure that was a problem related to CodePen website not in your page. It doesn’t appear anyone when i am now open it. Think things got fixed.

@birkhoff Yep, I fixed the class issue. For the popup, it’s when I try to post or reply to someone on this FCC forum, even when I don’t think I have code in my messages that needs to be formatted. I’m not sure what the error refers to… I’m not too worried about it. Anyway, thanks again!

Page looks good. I liked it. I hope it passes all the test.

1 Like

Can you screenshot and send him so i can have a glue about what it is?

@birkhoff I’ll try to catch it with a screenshot if it happens again!

Nice to see your enthusiasm. Remember one thing, changing your career path from one to other is not a problem. It is a good chance that you made in your professional life, and better than the problems you may face if you didn’t do it. As I, established my WordPress Development Company , with no previous experience of running any startup, but due my dignity and confidence, I managed to make it one of the leading designing company in Dubai.

would love to but if i click the link…

The owner of this Pen needs to verify their email address to enable Full Page View.

@KittyKora I’m sorry about that! I recently switched my email on the account. It should work now, I hope?

@pie1011 awesome task you delivered ever as first project. You just can work to handle extra space above of header title and under footer copyright.

Best Of luck! :smile:

2 Likes

@pie1011 Amazing you did this in a day

1 Like

Ok cool! Do as you said!