Unstyled Markup
Unstyled Markup
π¨βπΌ A fresh new project βΒ this is exciting!
Our starting point
π¨βπΌ We've got a mini-headstart, thanks to your co-worker Kellie (π§ββοΈ hello there π)!
π§ββοΈ That's right! I went ahead and created a new React + π Vite app to get you started. It's already π wired up with Tailwind CSS, so you're ready to start building.
π§ββοΈ You'll be doing most your work in the
file.
π§ββοΈ I have also exported a series of logos from
, to help you create the tiles.
Focusing on content
π¨βπΌ Look at the Figma file and try to ignore the design for a moment. Isolate the content, and try imagine how you would organise this information in a Word document, in plain text.
π¦ Reasoning about a website's content as an unstyled document is good practice, and a great way to make sure it makes sense to screen readers and search engines.
π¨βπΌ When you're ready, go ahead and write the markup in
.