Recipe Page

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

One of the primary goals of this project was to use semantic HTML for all elements. I did use <b> for some bolded text, since it seemed more appropriate than using <strong>, which has a specific semantic meaning which was not appropriate in this case. I could have also used <span> instead, but that would provide even less semantic value.

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

Styling the lists was somewhat challenging. The bullet points are normally placed outside the left margin of the <ul> or <ol> element. Setting the list-style-position property to inside would solve this problem, except this causes multi-line text to wrap around the bullet. I decided to add some left-side padding instead.

Regarding the top image, I considered leaving the alt text blank, but it's unclear if this image should be considered purely decorative, and after some slight html layout changes it wouldn't benefit from the paragraph description of the recipe. (Although, it's possible that the h1 heading still provides enough information to the user to justify removing the alt text.) Ultimately, I decided to include the alt text to be safe.