@Ahmed-Elbald
Posted
Alright,
I just want you to know one thing: Before you try to implement the design, consider the markup. Before you write your HTML, think about what each element represents.
In my opinion, the whole design consists of two things: Information about my storage and some buttons to import and export this data. Thus you should consider the following when writing your markup:
-
In your
.controls-box
, you can't usediv
s where you must usebutton
s. Why? because they are controls, they have functionality:// THIS IS WRONG <div class="document"> <img src="images/icon-document.svg" alt="" aria-hidden="true"> </div> // DO THIS <button type="button"> <img src="images/icon-document.svg" alt="Save your data"> </button>
-
It would be great if you could present storage information using a description list (
dl
). I know It would be hard to match that with the design. But I would do that under any cost using the.visually-hidden
class and thearia-hidden
attribute.
Marked as helpful
@aazs-edu
Posted
@Ahmed-Elbald, Hello again, my friend Ahmed.
Firstly, I want to congratulate you on reaching 1000 points!
You are right. Actually, it's 2:40 am now, and what woke me up at this time is that I realized I had to change it to a button 😁.
Then, I noticed that your comment also supports the same idea.
Thank you again.
@Ahmed-Elbald
Posted
@aazs-edu
Thank you very much. I hope you reach your first 1000 very soon. I really like your passion and believe in what you are doing.
Good luck 🥰
Marked as helpful