Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

social links profile challenge resolution

@RomuloLB28

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I am very happy to have completed the project alone, without help from others, and on the same day. In my first project, it took me almost a week to reach the same result. What would you do differently?Additionally, I could add more functions to enhance the program's functionality beyond the requested features.

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

The biggest difficulty was getting some details right, which I achieved through trial and error.

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

implementation of functionalities

Community feedback

@R3ygoski

Posted

Olá Romulo, primeiramente, parabéns pela conclusão do seu projeto, ele ficou muito bom, e quase próximo do design proposto.

Sobre implementação de funcionalidades, ao que você se refere? Eu vou supor que seja relacionado a navegação de páginas. Para isso você pode usar uma outra tag, a tag <a>, ela é uma tag que serve para criar links entre página, então basta você fazer algo assim: <a href="https://www.google.com/" target="_blank">Google</a>, dessa forma você cria um link para ir para o google, você para a URL do site para o href, e o target="_blank" serve para abrir uma nova aba no seu navegador.

E gostaria de te dar algumas dicas relacionadas a semântica do seu HTML, essa parte semântica é extremamente importante, devido a ajudar na acessibilidade das páginas, alguns trechos que você poderia deixar mais semântico:

  • <div class="card"> essa div poderia ser trocada por <main>, isso porque ela é o conteúdo principal da sua página.
  • <div class="card-container"> essa div poderia ser trocada por <article>, isso porque ela é autoexplicativa e independente do resto do site.
  • <div class="linhas"> essa div poderia ser trocada por uma <ul> e na parte interna colocar <li>, porque essa div está juntando items que são semelhantes entre si, que compartilham funções entre si, então o mais correto seria colocar como lista.

E novamente parabéns pelo seu projeto e por ter conseguido concluir ele em menos tempo do que foi com o primeiro, isso demonstra que você está evoluindo, parabéns e continue assim. Se ficar alguma duvida, por favor, pergunte abaixo que tentarei ajudar da melhor maneira possível.

Marked as helpful

0

@RomuloLB28

Posted

@R3ygoski bom dia. Sim, a implementação que eu me referia era a respeito de navegação de páginas. Sobre o html semântico eu admito que não tenho muito conhecimento, então essas dicas foram de extrema ajuda, irei me basear muito isso nos próximos projetos. Muito obrigado pelas dicas, vou seguir-las e implementar nos meus projetos projetos.

1

Please log in to post a comment

Log in with GitHub
Discord logo

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