Hello everyone, here’s the portfolio I made today. I know it’s pretty simple, I want to add some more functionality to it, but for now hope you enjoy it, if there are any tips or things you think I could do better please let me know.
Very elegant!
I would say summarize the introduction a bit and give more details about the skills and tools you can use.
@Yiosh Great work! I like that you’re hosting the site on GitHub Pages, that you only used native HTML and CSS, your HTML structure is valid, and you’re using HTML5 semantic elements. I also like your font choice. Here are some thoughts for improvements:
-
Looks like you accidentally left in some Git merge conflict text on lines 137 and 141. That’s probably a common mistake (I can see myself making that mistake more than once in the near future), however it shows that you’re using and understanding version control.
-
I see that you have two
<h1>
heading elements within the same section. Generally, it’s best to only have on<h1>
per page (Source):-
Heading information may be used by user agents, for example, to construct a table of contents for a document automatically.
-
Do not use lower levels to decrease heading font size: use the CSS
font-size
property instead. -
Avoid skipping heading levels: always start from
<h1>
, next use<h2>
and so on. -
You should consider avoiding using
<h1>
more than once on a page. See “Defining sections” in Using HTML sections and outlines for more information.
-
-
You may want to add the following script just before your
</body>
tag in order to see how the page does with the FCC Beta test for this project:<script type="text/javascript" src="https://gitcdn.link/repo/freeCodeCamp/testable-projects-fcc/master/build/bundle.js"></script>
-
As @Diego_Perez correctly points out, there’s a vulnerability visitors are open to when using
target="_blank"
and a relatively easy fix:
You’re using relatively complex CSS selectors, so that shows you have a strong understanding of CSS. I learned from them. I also learned about <meta http-equiv="X-UA-Compatible" content="IE=edge">
. Thanks for sharing!
EDIT: I noticed some of your CSS uses a naming convention that’s also used by BEM. Is that intentional or coincidental? I don’t know anything about BEM, but I’m curious to know if that’s the CSS methodology you’re using.