Dasmoto's Arts and Crafts project link

I have completed my Dasmoto’s Arts & Crafts projects. Check it out at my codepen link.
If you have some critique for it, I will appreciate it.


Hi there Tom! Just a disclaimer, I’m just as new to this as it seems you are. But I compared our two solutions and compared as best I could.

I noted you set a nav and footer in your HTML. Thats good! It shows you were prepared for more. I also saw you used header to define the h1 element. I don’t know if that was necessary where h1 was the only element in the header, but as above, it showed your preparation.

As for any critiques, please, Please, PLEASE, take everything I say with a tiny grain of salt. I’m really just trying to be an active member of the community, and everything I say is only my opinion, not necessarily the right answer:

  1. You used both the section and div tags back to back. It’s my understanding that they are really similar elements. Section works the same as if div was already defined with a class. It feels a little redundant to use them both, rather, just comment out the sections. Then you could just css all h2 to bold, white, 32px. Furthermore, then you wouldn’t need to edit the font-size of the .products. (unless that was simply a personal preference. The default would’ve set those to 16px.

  2. I’m not sure whether you had a head element or not, perhaps it’s not viewable to me. (This seems likely because you have your css and html files linked) Anyhow, make sure you have your metadata in there.

  3. The only other thing I could say is currently your css has .product span{…}. If you had any other spans in the products that would change them too. Wouldn’t you rather set the span with a class=“cost” or something along those lines. That way, you only edit what you intend.

All in all mate, your website looks just as good as mine, plus you were prepared for more. Hopefully this helped! It’s honestly helped me a little reviewing other code. I’ll be posting mine here pretty quick, so feel free to critique me back. Learn and grow together right?

-Tata for now,

1 Like

Right brother, it’s all about learning and growing together. thank you for your feedback Jaden @jpratty

  1. Yes, you are right but I decided to build my habits of writing more semantic html, you know as a best practice practice haha… that’s the reason I put the section element… it’s not necessary but from my understading, it tells Search Engines to rank the webpage higher somehow, right? So I left the section tags, however, you made me realize something… my previous ids for those sections were “section1”, “section2”, and “section3” which I recently learned aren’t good names for ids or classes. They need to be something descriptive of the content inside so I renamed them to “brushes”, “frames”, “paint”.

  2. Oh that’s true. by default codepen doesn’t allow you to add a head to the html… by the way, any clue as to what stuff I should put in the meta tag?

  3. Yes you are right my friend. I went back and tidied it up now :+1:t3:

From your English style, I’m guessing you’re from the UK, am I right? :yum:

Cheers mate!

Hey Tom @tomjmartinez! Thought I’d check in on ya and follow up.
Meta data would be the relevant links to other documents and files. If you ever design somewhere that the meta isn’t preloaded, you would have to link your stylesheets manually. Here’s one of my head tags; the links link (no pun intended) me to my css stylesheets and to google font families. I honestly have no idea what the charset is, or what some of the other things are. Visual Studio Code adds the skeleton, I just filled it in as needed.

<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./resources/css/reset.css" />
<link rel="stylesheet" href="./resources/css/style.css" />
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Rubik:wght@300;400&display=swap" rel="stylesheet"/>
<title>Colmar Academy</title>

Haha, and no, I’m actually based here in Idaho, USA. I just have funny mannerisms from time to time.

Talk later,
Jaden P.
Mechanical Engineering and Biology Student

1 Like