Making a 'template' based website? Confusion

[ZeratulsAvenger]

Well I just recently got the urge to look into making websites, yet again, and am looking for an answer to a question I have always wondered.

On many sites(such as the PCMech main page) they have the nifty bars(side and top-See attachment for a better idea if you don't know what I am talking about) and I am just wondering how they are made.

Is it all made in a program like PhotoShop and then spliced into separate images for each heading(BIOS, Operatigng Systems, etc[from attached example of PCMech main site]) or is it just a site width image that has text displayed over each corresponding image. If it is the latter, how is the text centered so well over the image? The links only work when clicking on the text, so I assume it isn't just an image with "BIOS" written on it, as then the whole image would act as the link, right?

I just viewed the source for the site, and it mentions Java being used; is javascript taken as any part of the process or is that unrelated to the organization of the site? I have minor experience in HTML, and just yesterday read about CSS(as I was completely clueless as to how you used it), but have not once read about Java/Javascript(is there a difference between the two?).

Thanks for any and all help. If I need to elaborate on any point, then feel free to ask. I am told how I think a little awkwardly, or at least I often place my points burried within thoughts and other thoughts, so it can occasionally be a little tedious and tiresome to get through my jabberings and find my questions.

EDIT: Wow, the picture is really pixelated. Sorry bout that. You get the idea though, right?

[james8547]

I'm not sure about PCMech's site. But, I've worked with osCommerce. It's basically a PHP based online shopping cart with templates.

Most template websites that I've seen are built by having an index page call on different modules. The actual codes are not written on the index page. The coding on the index page are basically a call function to other modules, which is where the actual codes are written.

If you want hands-on experience, you can download osCommerce and play around with it. It is open source code and fairly easy to mod, assuming that you have some programming background. They have a support forum and software documentation to guide you through. All you need is a PHP enabled server with MySQL support.

[kram 2.0]

It depends from website to website - the website template on the left side of the PC Mech homepage is basically a table, with greyish background and text over it, hyperlinked. The top navigation is entirely an image linked to other places - Photoshoped probably. With the top navigation bar, I believe an imagemap is used - in other words, only a certain portion of the image will link to a location. You'd probably be best off having a program doing that since doing it in a scripting language (ie. JavaScript) is a pain to do by hand, IMHO.

I just viewed the source for the site, and it mentions Java being used; is javascript taken as any part of the process or is that unrelated to the organization of the site? I have minor experience in HTML, and just yesterday read about CSS(as I was completely clueless as to how you used it), but have not once read about Java/Javascript(is there a difference between the two?).

First and foremost, do not relate JavaScript to Java. Java is a standalone programming language develped by Sun Microsystems while JavaScript is a scripting language developed by Netscape. Java can be used in a website in a form of an applet - in other words, it's like an entirely new program running within the browser window - like Flash.

CSS is like a key - it's like with defining variables in simple algebra. If "A" corresponds to a certain code, then whenever "A" is called in the actual website, the text or image or whatever will follow parameteres defined in "A". So if you define H1 in CSS (for example, Times New Roman, font size 4), everytime you surround a text using H1, it will look like this.

Let me know if this sounds unclear to you.

kram

[ZeratulsAvenger]

Thanks for the reply's. I'll be back later with more probably

[kram 2.0]

Originally Posted by kram8806 It depends from website to website - the website template on the left side of the PC Mech homepage is basically a table, with greyish background and text over it, hyperlinked. The top navigation is entirely an image linked to other places - Photoshoped probably. With the top navigation bar, I believe an imagemap is used - in other words, only a certain portion of the image will link to a location. You'd probably be best off having a program doing that since doing it in a scripting language (ie. JavaScript) is a pain to do by hand, IMHO.

I correct myself on that - the top navigation bar looks like it's just a normal hyperlink. Tables are used and the backgrounds of the tables are the images of the tabs - and on each cell, there's text that's hyperlinked.

kram