Submitted 5 months ago

Short and Sweet Programming

Matthew•40

@gmatt20

Preview site View code

This is a solution for...Social links profile

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

This is my personal record! I have successfully made this simple project in under 2 hours. I am extremely proud of myself for this accomplishment. I used barely any help and references. I was able to be in a constant flow state which had greatly enriched my coding experience.

A major thing I learned in CSS is target very specific elements by using the > key. What I would do differently next time is plan the layout and deeply analyze before actually writing code. For example, I can draw sketches.

What challenges did you encounter, and how did you overcome them?

The only challenges were jogging my memory on pseudo-classes. Other than that, it went smoothly.

What specific areas of your project would you like help with?

I need to learn better responsive web design. For example, I need to understand the pixel size differences between a computer, phone, and other technologies. I need my project designs to be consistent with every platform. I also want to delve deeper into how I can make my websites accessible. Generally, I shall improve my craft of HTML and CSS before moving onto JS.

Community feedback

Oshu•630
@oshudevPosted 5 months ago
Hello there 👋. Good job on completing the challenge!

You should proper HTML semantic. Instead of using span for name, location, and description, you could've use h1 or p tags. You can learn more about HTML semantics here Semantics - MDN Web Docs Glossary: Definitions of Web-related terms | MDN.

Instead of using flex to center text content, try using text-align: center.

It seems that you forgot to add a basic CSS reset. You can learn more about it here A Modern CSS Reset.

About responsive web design, there are plenty of strategies that you can use to achieve responsiveness, you can learn more here Responsive design - Learn web development | MDN.

I hope you find it useful! 😄

Happy coding!
Marked as helpful
0
Matthew•40
@gmatt20Posted 5 months ago
Hello @oshudev, glad to see you! I was thinking about doing the proper HTML semantics, too many spans may not be ideal for accessibility. Using text-align: center for the text content also makes sense. I have not encountered what CSS Resets are so I will be learning them, thank you for providing me the resources for it. Thanks again for the resources, especially the responsive web design.
0
Xqgoji•120
@JhinDanzoPosted 5 months ago
nice job!
0
Matthew•40
@gmatt20Posted 5 months ago
I appreciate it @JhinDanzo!
0

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord