Tribute page: The Volunteer Tribute

Here is my super basic cut and dry tribute page.

I was not interested in writing about anyone in particular, but to learn about the actual HTML that was needed to write the page.

I think I wrote it pretty sloppily. Almost all of it is done with HTML. If anyone has any comments or feedback, I would really appreciate them.

Thank you very much for checking out my tribute page!


edit: I am just now seeing after I posted that when I resize the window horizontally, my text gets really messed up. I must have flubbed it up with the padding stuff. Time to figure out another way to do it.

edit: I think i fixed the centering problem >.<

edit: After looking through many other camper’s tribute pages, I’ve noticed that I probably should have attempted to be a little more creative and not just copy the sample tribute page pixel by pixel.

Super basic cut and dry is right. I see you are not really using any of the bootstrap framework. In your CSS you define class “Center” to center your text when you could just use “class=text-center” which is already defined in Bootstrap. You can find alignment classed here. You also style your html tags independently when you could put it all in the CSS.
Lastly, you could use <blockquote> for your quote and nest <footer><cite> to credit the person who said it. Bootstrap Documentation for <blockquote> is here.

I would suggest taking some time to get familiar with Bootstrap and perhaps see what changes you can make to your page to make it a little more stream-lined.


As merlin2181 said, I would remove the style attribute (inline styles) from the HTML. You can place these styles into classes or IDs, depending on what suits your needs. The reason I recommend doing this is that it’s a best practice to keep your styles separate from your HTML. This allows you to easily update the appearance of a webpage without having to worry about what’s hiding in the HTML

You can also make the text responsive. There are many ways to do this. For example, you can use vw units instead of pixels as well as @media queries. If you want more information on either of these, W3 Schools has awesome tutorials IMO.

I wouldn’t worry about making the most beautiful thing ever just yet. Focus on understanding the concepts and applying them, and then, when you have a super awesome design idea, go back and implement it. Well, that’s what I do anyway.