1

I am working on a site where I want to have a header and footer on each page, so I thought about using server side includes for this. I have not used them before so I am a little bit unsure about best practices when it comes to styling my site. I am currently including the styles and scripts in the file for the header, and when it is included the rest of the site is styled, and it seems to be working, but I was wondering if there are best practices I should be aware of when it comes to this.

  • These days, most people use Content Management Systems (CMS) which allow far more than just headers and footers. There is a lot of open source CMS software, such as Wordpress. – paj28 Jan 10 '15 at 21:24
  • 1
    It is a very small website, using a CMS seems like a bit of overkill for something with 4-5 pages total. – Travis Jan 10 '15 at 22:16
  • It's probably easier to install a CMS rather than figure out server-side includes – paj28 Jan 11 '15 at 11:43
  • I've already figured out how to include what I required, that was simple and easy enough. I am concerned about whether including scripts and links to stylesheets in the header can cause a problem, and what the proper approach would be. – Travis Jan 12 '15 at 2:10
  • Including scripts and stylesheets in the header is no problem. My comments were regarding the "best practices" part of your question. – paj28 Jan 12 '15 at 9:45
1

If the webiste is small as you clained in the comments just create stylesheet with all general styles and use some more specific styles to override the defaults when necessary.

Something like:

file1

<section class="home">
<h1>Home</h1>
</section>

file2

<section class="breakingNews">
<h1>Very important title</h1>
</section>

styles

h1 {
    font-weight: bold;
}

.breakingNews h1 {
    color: red;
}

I did find the trello css guide quite useful but maybe it's a bit of an overkill if the project is so small. Worthy read anyway: https://gist.github.com/bobbygrace/9e961e8982f42eb91b80

As for js files I'll still keep to one file and detecting content, again, if you are building something very simple.

Something like:

//code you'll want to run always
$(function(){
    alert("welcome to my awesome site");
});

//code only if some elements are present on the site
$(function(){
    if($('.breakingNews').size()){
        alert("OMG those news are so breaking");
    }
});

This advice may not be a good idea on big websites

0

Well the most usual way to do that is to declare each stylesheet and js to its own file and make them abstract to use.

But if you declare all styles and js of your website in single files and include them, they can conflict with each other or with code you write later on and destroy the layout.

-1

Probably its good to use frames in html.While creating your html page.what should be done is just split the page into 3 frames.one frame for header and the last one for your footer.It is possible to split according to your choice i.e,you can specify the split percentage.

  • 1
    Frames have several problems, one of them is that a page is hard to bookmark or otherwise link to, because it will link to a frame and not the frameset. I suggest frames be left in 1990s, along with <marquee> and <blink>. – 9000 Jan 7 '16 at 17:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.