@huyphan2210
Posted
Hi, @nodegreecode
I checked out your solution and I have some thoughts:
- Your current HTML structure is definitely more semantic compared to just using
div
,p
,h2
, anda
for building a blog card. That said, I don't think using those elements alone is necessarily wrong. I’m curious about the news you mentioned—what was it that led you to think this approach was invalid? - You pointed out that "the wrong embedded svg graphic, which didn't let my component change fluently with the viewport size." (I assume you meant responsiveness). SVGs are designed to be scalable by nature. Could you explain what specific issue you encountered with it.
- Nice work using
clamp
instead of media queries, but I’d suggest applying it to specific elements rather than globally on thebody
. Since your HTML includes elements likeh2
andp
, they should have individualfont-size
values rather than being uniformly sized. - I think you could push your HTML's semantics further. However, ask yourself first: why do we aim for more semantic HTML? What purpose does it serve? While external sources like the news you mentioned can be informative, developing your own reasoning will make you a stronger developer.
Hope this helps!
Marked as helpful
@nodegreecode
Posted
Hi, @huyphan2210
- Unfortunately I cannot load a screenshot of that feed, which I mentioned, but basically it was build with article, header, p and a. This fact forced me to study resources about how to structure the typical blog card with HTML. And I found out that the blog card should be built like I built it at the end.
- Yes, this is actually embarrassingly, but I just pasted the content of the svg file in the HTML directly, wrapping it just with a div. That's why the whole layout didn't change itself while resizing.
- This was my first thought as well, but however I followed the DRY principal, what probably not applicable here. Thank you for empowering me, I already adjusted CSS file.