Hi, This my tribute page to alan turing

I noticed a couple of inline styles here and there. You might want to put all of them in the CSS section.

<h2 class='text-center'><em>The man who cracked the Enigma</em></h2>

The <em> element shouldn’t be used just to make text italic. It’s intended to be used on text that you say differently to emphasize it (like in “I told you to push the green button, not the blue one!”). Italicize with CSS instead.

        <div class='thumbnail'>
          <img src='https://upload.wikimedia.org/wikipedia/commons/a/a1/Alan_Turing_Aged_16.jpg' alt='Alan Turing Aged 16' class='mx-auto d-block'>
          <div class='caption text-center'>Alan Turing Aged 16</div>
        </div>

Try using the <figure> element for the outer <div>, and <figcaption> for the inner one. The appearance won’t change, but the semantic value will increase.

<li><strong>1926</strong> Continued education at Sherbone School.</li>

Same reasoning with the <em> element above. <strong> is for putting strong emphasis on text (like in “Warning!”). Here <b> is more appropriate, since the boldness is just a stylistic offset.

<p class='text-center' style='font-size:17px'>To read more about this man, click <a href='https://en.wikipedia.org/wiki/Alan_Turing' target='_blank'>here</a></p>.

The period at the end should be inside between </a> and </p>. You can actually see the misplaced dot at the bottom left corner of the well.

Also note that in HTML it’s conventional to use double quotes rather than single quotes for the attribute values.

1 Like