Completed Challenge: Tribute Page to Henry David Thoreau

Completed Challenge: Tribute Page to Henry David Thoreau
0.0 0

#1

Completed my first webpage! Please, take a look. I kept it simple, so I can move on to the profile project, but I am happy with the finished product. :slight_smile:

Thank you,
Megan


#2

There is alot of extra stuff that you could clean to make it better when it comes to the css. Just at a glance I found these.

Ex.1 css for classes you never use

img.displayed2 {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

Ex.2a classes with same css

div.container5 {
  text-align : left;
  font-family: Times;
  font-size  : 18pt;
  color      : rgb(45, 180, 200);
}
div.container7 {
  text-align : left;
  font-family: Times;
  font-size  : 18pt;
  color      : rgb(45, 180, 200);
}

Ex.2b classes with same css

div.container6 {
text-align : left;
font-family: Arial;
font-size : 12pt;
color : rgb(0, 0, 0);
}
div.container8 {
text-align : left;
font-family: Arial;
color : rgb(0, 0, 0);
font-size : 12pt;
}

Ex.2c classes with same css

div.container11 {
border : 5px solid #665544;
overflow: auto;
width : 100%;
}

div.container12 {
border : 5px solid #665544;
overflow: auto;
width : 100%;
}


#3

I think you might have gone overboard with the borders. You have too many. Use them sparingly. Whenever you start having border on containers which contain other containers with borders and change the border size, it just does not look great. You are also using hr elements which are kind of a borders/separators themselves. I would ditch the hr elements. Also, I would ditch the outer double line border and maybe stick with each main container having the same border but definitely add padding on the containers, so the sections do not touch each other like how some of the images are touching borders in certain sections. I think you might consider using a different background color for each section, but make sure they are all compliments to each other.

In general, keep it simple and elegant. This will also greatly simplify your CSS classes which as @marzdor pointed out, you have many duplicates. Try to always keep your code DRY (Do Not Repeat Yourself) as possible.

Also, get in the habit of always surrounding your html element’s attribute values with either double or single quotes. For example you should always write class=“class1” instead of class=class1. If you wanted to apply more than one class to an element, you would have to use the quotes anyway, so it is a best practice to just use them.

One more thing I recommend is give your CSS class names which describe the section they pertain to. It makes your code more readable and easier to find code to make changes. Container1, Container2, etc… does not describe where they belong.


#4

Thank you, marzdor and randelldawson for taking time to provide feedback. I appreciate the time you took to respond, and I do agree with your criticism. Thank you for giving me tips to improve. :pray::raised_hands:. Will make some changes and repost. :slightly_smiling_face:


#5

I have made serious changes to tribute page from first try.
Please, take a look to review my clean up and additions.

Feeling more confident, so moving on to the portfolio challenge. Thanks again for the great initial feedback!

Megan