Sunday, February 17, 2008

Some tips and tricks to web design

I have being doing this for awhile already and now decided to share it with the world.

To built a website I use about 5-6 PHP pages to make up one PHP page. Since PHP is a web developing code, I would talk a little bit about it.

Before I get into the tricks or tips I would say a few of the features that PHP has... It can INCLUDE files into other files and STORE values into variables and you can call on them multiple times making it easy to change multiple stuff that are the same throughout the site... such as the web master's email.

Here is how you INCLUDE files into other files...


<?php include_once('filename.php'); ?>

The file could be any web file type... not only PHP, but it could be HTM, HTML, CSS, PERL, etc. etc.

Here is how you STORE values into variables...

<?php
$webmaster_email = 'my_email@my_site.com';
$site_title = 'site_title';
?>


And below is how you CALL on them...


<?php echo $webmaster_email; ?>


I store values into variables in one file and name that file as "site_config.php", than I put everything starting from "<html>" to "<body>" into another PHP file which I like to call "header1.php". Then I store the logo into another file and I like to call that file as "header2.php". And than I store the footer with the ending tags (</body> </html>) into another file and I like to call that file as "footer.php".

Than I include those files into "index.php" and type in the content where the main content would be... a sample of one of my main pages is shown below...


<?php include_once('includes/header1.php'); ?>
<div id="wrap">
<?php include_once('includes/header2.php'); ?>
<?php include_once('includes/leftContent.php'); ?>
<div id="rightContent">
<div class="content"><p>Main Content</p></div>
<div class="mainContent">
<p>My Main Content</p>
</div>
<div class="spacer6"></div>
<div class="content"><p>Updates/Important News</p></div>
<div class="mainContent">
<p>Important News</p>
</div>
<?php include_once('includes/footer.php'); ?>


It's an easy trick that may be hard to explain.

Correct way to Web Design

Many web designers have built there web site using CSS (Cascading Style Sheet) and that is the best way and more correct way to built a site. CSS is the major way on how to make a site valid, unless you want to make a plain white unorganized site, than... it's your choice.

CSS makes your site a little more flexible in both views... web designers and the visitors. Visitors don't get a lot of code that could lag up their computers and web designers could only change one thing, and that one change could change one thing on all of the pages.

It is best to save the CSS as an external document... something like design.css and link that as a stylesheet to your web site (<link rel="stylesheet" href="Scripts/design.css" />). That would make it easier to change the CSS once, instead of going from page to page until you finish... a site could be a thousand pages long, and not only that, it can grow.