CODEWITHSUNDEEP
htmlcssmodularity
Chet
Chet

Reputation: 1269

Good coding practice / modular HTML structuring

I am making a webpage with two levels. The first contains things like home, music, engineering, etc. Each level has a sublevel. Engineering would have circuits, programming, etc for example. I have a tab system set up for navigation that looks really nice. I am new to html, but intuitively, I would like to make this modular like a Java program would be. So I am not sure what the best way to do this is. Here are some of my thoughts. I will try and simplify it as much as possible for the purposes of discussion.

One main page with a space for a textbox, title, and image. By clicking on the navigation bar, the image, title, and textbox change to the content for that page. Ex* by clicking engineering->circuits the image changes to a picture of a circuit and the textbox talks about current. The reference to the picture and text is stored in an external file (engineering/circuits.html perhaps).

Alternatively,

Several pages, each containing similar code (including a copy/pasted version of the navigation menu). Each page contains it's own content.

I prefer the first for simplicity and modularity. The goal is to have neat readable code, of course. I hate having the same thing coded in multiple places (as I am sure most good programmers do). Any feedback is greatly appreciated along with info on how to include content from other files. Thank you!

Chet

Upvotes: 3

Views: 1824

Answers (1)

user866503
user866503

Reputation:

I would use PHP includes to be able to include your header and nav without having to cut and paste like you're talking about. You can include whatever you want. I think PHP is useful for that. You can also add a couple of variables like the page title and echo it in your page head. You put html in your includes but save it with a PHP extension. 

<?php

 include 'includes/header.php';

?>

Upvotes: 1

Related Questions