Please need feedback for my completed first project - https://codepen.io/leonelamatos/pen/JwzvVa

Code Feedback
1

Hello all FCCampers, here is the link for my first project, any feedback would be appreciated.

NOTE - Have to place the link on the title, don’t have that ability yet.

Thank so much in advance for you feedback.

1 Like
2

Hi, i can’t see any link.

3

I see it now, is nice, i like it very much. Please check around 1990 you have some overlap text.

4

I like the Time-line theme but I would suggest that the bottom part that says ‘As of 2018’ wasn’t so far down on the page I think maybe just a little gap should be fine.
Also a gray background with gray words is hard to see consider changing the words to black or the background to something easier to see I would say the same about the header that say’s ‘Harrison Ford’. Otherwise it looks good, Good job!

5

I agree with previous comment that gray background with gray words is not easily readable especially with small font size.
Cool Idea with the timeline :slight_smile:

6

Thank you so much for your feedback, I fixed all the suggestion you have made, if you others suggestions please let me know.

BTW - codepen change my font family I used is not displaying on the page. If you know what is causing this please let me know.
I add the google font link on the setting for codepen.

7

Do you have a different link? Because i’m still seeing the same thing.

8

Sorry I didn’t notice that codepen made another pen. I updated the title with the correct pen.

9

@leonelamatos I’m not sure if you ever fixed your fonts but here is what I can say about it.

  1. To use different fonts from specifically Google you should link it in your HTML like this…
    <link src=“google-fonts-link-url”
    as I can see in your code you know how to get the url to the specific fonts but after linking it you can use CSS to target it like any other font like…
    font-family: ‘google-font’, sans-serif;

  2. Part of the reason why you might have had a hard time with using the fonts is also because I think you might not be used to using HTML tags since in your code you use a lot of divs you don’t have to go back and change them unless you want to since this isn’t a super important project, and it works. But it is very very important that you start using specific HTML tags for different purposes it keeps your code clean, you can target specific elements, and it is best practice to do so. Tags like
    <h1 <h2 <body <head <footer so on and so forth.

HTML tags are useful and necessary without them I couldn’t link these words to your project! From now on you should use them.
Link to @leonelamatos project

Link to @leonelamatos updated project

10

Thank you all for your feedback.

@Myles2 - Yes I fixed the issue with the fonts, I imported them on my CSS. I don’t know if you took a closer look to my code, i am using others html tags, I know is not semantically web structured, thanks for you feedback, really appreciated it.

11

Great page :slight_smile: I really liked the timeline, just did my first page.

12

@leonelamatos I saw I just didn’t know which fonts were which, I say about the HTML tags because later you will run into problems if you don’t use them more and I saw you use some but you also use a lot of divs. Maybe more divs than none divs so that is something to consider also you should almost always use the <head><body> <footer> there’s really no reason not to use them and by putting all the code into those tags you can target the little things like font-size, color, exc… with CSS on the whole thing rather than 1 by 1.