Having the same look and feel to every page on a website is a requirement in today’s website design world. Many years ago, website design was done using programs like FrontPage or even Notepad to type in the coding in there. Now, FrontPage is a thing of the past and Notepad is too tedious. Not to mention – these programs do not allow for dynamic websites that can be changed on the fly or even be updated by the customer that requested the website to be made.
Enter CSS – or Cascading Style Sheets.
Cascading Style Sheets help to provide a website the look and feel that customers want. In a CSS file, you put everything that you want to have in the way of the look a feel of a website; the colors, where a header image should be, the width of any side “panels”, the width of the entire page, whether tables, text, or the entire site is centered, amongst thousands of other possibilities.
CSS style sheets took web design to the next level with the functionality and features. Of course, it is not necessary to have a CSS file – because you can also put the CSS style information directly into the HTML of the page that you are working with. But, that means this would have to be done on every single page of the site – making the page load time longer. That is why you use one CSS file and then call it in the <head> section of the website like this:
<link rel=”stylesheet” href=”PATH-TO-CSS-FILE” type=”text/css” />
Of course, you can also have more than one CSS file on the page. If there are a few pages that need to have additional styles added, you can put them in a different CSS file. Although it is best to have them all in one CSS file to prevent so many files needing downloaded from your web server to render the page. You could have hundreds of CSS entries in a file – but only one of them is used on a site. Of course, this isn’t ideal because you are downloading a large file that slows down the website. Therefore, when you create a CSS file, ensure you only put entries in the file that you are actually using – at least somewhere on one of the pages of the website.