Page Structure

**Jerry Stuckle** · May 10 '06, 12:45 PM

Re: Page Structure

Garry Jones wrote:[color=blue]
> I have recently constructed a website using a lot of php script (self
> taught). I now wonder if I should have construted the site in a different
> way.
>
> The page contains a header (a.php) and left column (b.php) that remain
> constant. Depending upon which heading is clicked in a menu row the user
> gets different information up in the main site area (three different
> versions of "c"). And a footer (d.php).
>
> What I think I have done is loading in the entire site again for each
> different menu heading. I load a variable according to which the contents of
> (c) is called.
>
> This is the blueprint of the structure I have used.
>
> indexc1.php does the following
> Load a.php (header code)
> Load b.php (left column info)
> Load m.php (menu bar)
> sets $var to "elephants"
> Load c1.php (specific text)
> (if $var is "elephants" include elephanttext.ph p)
> (if $var is "lions" include liontext.php)
> (if $var is "tigers" include liontext.php)
> Load d.php (footer info)
>
> indexc2.php does the following
> Load a.php (header code)
> Load b.php (left column info)
> Load m.php (menu bar)
> sets $var to "lions"
> Load c2.php (specific text)
> (if $var is "elephants" include elephanttext.ph p)
> (if $var is "lions" include liontext.php)
> (if $var is "tigers" include liontext.php)
> Load d.php (footer info)
>
> indexc3.php does the following
> Load a.php (header code)
> Load b.php (left column info)
> Load m.php (menu bar)
> sets $var to "tigers"
> Load c3.php (specific text)
> (if $var is "elephants" include elephanttext.ph p)
> (if $var is "lions" include liontext.php)
> (if $var is "tigers" include liontext.php)
> Load d.php (footer info)
>
> So the only difference with each index file is the value of $var.
>
> In the menu (m.php) the user can click the buttons marked "lions", "tigers",
> or "elephants" . (which loads in indexc1.php, indexc2.php or indexc3.php).
> The problem with doing things the way I have is that the page is redrawn
> everytime the user clicks on another heading in the menu.
>
> I guess that I should be calling in a.php, b.php, m.php d.php just once and
> then that the menu should just be changing the text displayed in the main
> text area without redrawing the entire site. (Similar to a target tag in
> frames).
>
> How is this effect created with php?
>
> Any help appreciated
>
> Garry Jones
> Sweden
>
>
>
>
>
>[/color]

Garry,

You can't do it in just PHP without using frames. The browser doesn't have the
option of only loading part of a page otherwise.

Your other choice would be to do it with some client-side language such as
javascript.

--
=============== ===
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex@attgl obal.net
=============== ===

**Rik** · May 10 '06, 01:15 PM

Re: Page Structure

Garry Jones wrote:[color=blue]
> In the menu (m.php) the user can click the buttons marked "lions",
> "tigers", or "elephants" . (which loads in indexc1.php, indexc2.php or
> indexc3.php). The problem with doing things the way I have is that
> the page is redrawn everytime the user clicks on another heading in
> the menu.[/color]

Because all those pages are almost the same, why not use a GET request?
index.php?var=l ions etc.
[color=blue]
> I guess that I should be calling in a.php, b.php, m.php d.php just
> once and then that the menu should just be changing the text
> displayed in the main text area without redrawing the entire site.
> (Similar to a target tag in frames).
>
> How is this effect created with php?[/color]

Not, as already pointed out. AJAX can help you out on the client side. It
relies on javascript, and some visitors may have disabled that.
If the header/menu/etc. are decently written, and existing images are
cached, it should be hardly noticable though.

Grtz,
--
Rik Wasmus

**Garry Jones** · May 10 '06, 01:45 PM

Re: Page Structure

"Rik" <luiheidsgoeroe @hotmail.com> skrev i meddelandet
news:e3soru$4lm $1@netlx020.civ .utwente.nl...
[color=blue]
> If the header/menu/etc. are decently written, and existing images are
> cached, it should be hardly noticable though.[/color]

See for yourself.

http://www.vasatrampet.se/

For each click on a menu heading the page is redrawn in msie and flashes.
However, its much smoother in firefox for some reason.

Comments appreciated

Garry Jones
Sweden

**Jerry Stuckle** · May 10 '06, 05:45 PM

Re: Page Structure

Garry Jones wrote:[color=blue]
> "Rik" <luiheidsgoeroe @hotmail.com> skrev i meddelandet
> news:e3soru$4lm $1@netlx020.civ .utwente.nl...
>
>[color=green]
>>If the header/menu/etc. are decently written, and existing images are
>>cached, it should be hardly noticable though.[/color]
>
>
> See for yourself.
>
> http://www.vasatrampet.se/
>
> For each click on a menu heading the page is redrawn in msie and flashes.
> However, its much smoother in firefox for some reason.
>
> Comments appreciated
>
> Garry Jones
> Sweden
>
>[/color]

Garry,

That's only because IE is clearing the window before it starts parsing the page
for display. Firefox is doing it more efficiently. Not much you can do about
that end.

However, looking at your code, there are a lot of things you can do. I didn't
look at it in detail, but is all that JS necessary? And you are duplicating a
lot of styles inline. The result is your main page comes out to over 17K - you
could probably cut that in half with the proper use of style sheets.

Additionally, your images are over 180K. mak_205_160.jpg itself is 103K. You
should try to cut the sizes down. For instance, changing the jpeg quality of
this one file from 79% (your value) to 50% resulted in a file that was only
46.5K in size with no noticeable loss of quality.

You should be able to get the entire page size easily down to 70-80K, resulting
in faster loading time and less of a delay. You can get more hints on how to
optimize your pages in alt.html.

--
=============== ===
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex@attgl obal.net
=============== ===