Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Jiaming Zhang
10,170 PointsHow do we decide whether we should include the image in css or the web page?
I saw Nick include the mail/phone/twitter image icon in the css. In what case should we include the image in the css instead of the web page itself? What factor will affect our decision? Thanks.
3 Answers
Jovanny Elias
16,204 PointsIt's always best to include your image using html. The only time I see an advantage to using css is when using images that will display in multiple pages. For example Social icons. Here if in the future you wanted to change the icon all you would need to do is change it once in your css rather than in every single html page that you use.
Jason Anello
Courses Plus Student 94,610 PointsHi Jiaming,
It has to do with whether the image is considered part of the content of your page or whether it's strictly presentational.
If it's part of the content of your page then it should be in an html element. If it's presentational then it should be a css background image.
This is a general rule and not everyone is going to agree on which category a particular image will be in. For instance, some people think your logo should be a background image and others think it should be in the html.
As examples, suppose you're a photographer and you want to have a portfolio page of your images. These images are the main point of the page and make up the content of the page and so they should be in the html.
Your social icons on the other hand are presentational and should be in the css. You could just as well have text links for these and it's not really going to make a difference. The page just won't look as nice.
Jiaming Zhang
10,170 PointsThat makes lot of sense. Thanks Jovanny!