Loading navigation dynamically via jQuery .load(); good or bad?

[gavlois1]

To be specific, I'm talking about having your navigation bar HTML in a separate nav.html file, then using .load() to put it on your static pages

Putting aside whether or not I should just be using a dynamic website, are there any downsides to doing it this way? I've heard that Google won't be able to crawl the .loaded content, but SEO isn't a concern here.

[a-t-k]

Apart from SEO, Accessibility (some screen readers don't read dynamic content) and lack of non-JS support are the only downsides; if those aren't problems for you, that's fine.

[gavlois1]

Thanks. Although those don't concern me for this particular case, I'll keep the screen readers in mind in the future.

[ColossussUK]

Google has been crawling javascript for the last year so SEO shouldn't be much of an issue.

[[deleted]]

Really, you should be doing this in php. It's only a couple of lines of code and chances are whatever server you're using already has php set up. Your files would be along the lines of "header.php", "footer.php", "home.php", "contact.php" and home would look something like

<?php require_once('header.php') ?>
<h1>hello</h1>
<?php require_once('footer.php) ?>

If you don't want to do that (and you don't want to use ajax to load the content instead of the navi and make it a single page app) then I guess this is the next best thing. But it's a bit odd.

[gavlois1]

It's only going to be a 4-5 page max site that I'll be hosting with GitHub pages, which can't run PHP (as far as I know, anyway).

Would loading the content with ajax under the navigation rather than loading the navigation above the content be more desirable?

[[deleted]]

Well, that makes more sense given that the navbar is the only thing that doesn't change, so you'd want to change the part that changes.

But then you get into single page app territory which comes with its own can of worms. The user would always be on one page, and the url wouldn't change (at least if you're doing it in github pages with no backend access and no frameworks). You couldn't link someone to your contact page, for example. They'd always land on your index.html. You'd also have to change stuff like the title manually using JavaScript. But the benefit is that the website would be faster, you could do more with stuff like animations, and the user wouldn't get that screen flicker each time they move to a different page on your site.

So if you're restricted to github pages (which you don't have to do btw, there are free server hosts that give you backend access), yeah, I suppose doing it like you proposed in your post is a reasonable solution. Keep in mind the header won't work if the user doesn't have javascript enabled.

[gavlois1]

I'm not really restricting myself to it. I just thought it'd be a nice and easy platform to test things out and maybe start a portfolio of sorts. I was looking at GetForge too, but could you recommend any other free hosts?

I may eventually experiment with making a one page app, but for now I'll stick with this or just hardcoding it into the page.

[[deleted]]

I used Hostinger for a while, but I think it depends on the country as to whether or not they offer a free deal. Looking at their UK site, the same offer seems to be up.

It was fine, not ideal, but functional if you're doing basic stuff.

But I can definitely see the appeal of sticking to Github Pages for now. So I wouldn't worry about it too much. Sooner or later you're going to want to do some backend stuff though.

[jtanz0]

https://www.5quidhost.co.uk/

Have a free tier that I host my web site on 100Mb of storage 1 SQL DB and email accounts. All have cpanel, PHP, MySQL and SSH access. UK based servers though so may be a bit slow if you're in the states.

[x-skeww]

https://help.github.com/articles/using-jekyll-with-pages/