Responsive design with html and css

Community feedback

• 

  Jacky Du•100

  @jacky-uiPosted 17 days ago

  Hey! Looks good to me. With regards to responsiveness, although there's not much change in design from desktop to mobile, I noticed you didn't use media queries. This is very useful for creating websites that looks good on all screen types.

  As the other person mentioned, its good practice to separate html and css. This is known as separation of concern. Why? It keeps our code easier to manage and maintain.

  I liked that you used li tags for the links as this is good for accessibility. It helps assistive technologies and users know that the links are related. One suggestion: I would probably change the buttons used for the links to an anchor <a> instead. When linking to external sites or other pages, the <a> tag is semantically more appropriate and will improve accessibility. Anchors also have the href attribute, which we can define the url.

  Marked as helpful

  0
• 

  frost3dWave•190

  @frost3dWavePosted 18 days ago

  • do not include your css into the html file, it is good practice to have them both separated & it keeps your html clean.
  • use correct tags for the links section, they aren't list elements nor are they mere buttons.
  • use descriptive alt texts for all the images.
  • again the h tags should be in hierarchical order there shouldn't be such as large difference as h1 & the next as h5 as you have now.

  Marked as helpful

  0

  ---

  

  omar kamal•80

  @omarkl95Posted 11 days ago

  @frost3dWave should i use the <a> tag instead of <button> ??

  0

  

  frost3dWave•190

  @frost3dWavePosted 10 days ago

  @omarkl95 hello, yes, a list of a is better here rather than buttons. You can also check out my solution for this, I received tons of feedback on that, which might help you out too!

  Marked as helpful

  0
• 

  Ammar Yasser•40

  @Ammar334Posted 18 days ago

  .

  0