Thursday, November 27, 2014

Design Patterns In Web Design

Web design often involves a number of different languages.  A possible combination would be:

HTML
PHP
Javascript
CSS

There are many ways to combine them and to me those ways would be called Design Patterns.   Once I was trying to create a CMS.  I wanted to be able to create Template as a single page to which I could insert the content.

I eventually decided to create this single page template as a single php function.   I don't remember why I used a single function but it made sense at the time.  

function page(){
?>
<head></head>
<body>
 <div id="header"><?=$header?></div>
<div id="content"><?=$content?></div>
<div id="footer"> <?=$footer?></div>
</body>
}

I guess this allowed me to make different php files and just add this function to them.  I could have an about.php a home.php instead of having to do this:

index.php?page=about

instead of that I could just have
domain.com/about.php

which to me seemed simple at the time.  A separate page for each page.  I guess though if you have a really complex site you might want to do something else.  Some sites have 10,000 pages.   To me though these are different types of design patterns.  They are more practical Design Patterns.  Maybe I just don't see how they correspond to the traditional design patterns.   I've looked at other  peoples web design patterns and everyone seems to have a different method. 
Which is better?  I don't know but probably there are better criteria for choosing a design than a pretty address.    Which leads to an important point.  Any discussion of Design Patterns should include a discussion of the benefits and drawbacks of each.   Perhaps a list of benefits and drawbacks would be a good place to start.

Address Bar (which we have already mentioned) 
Speed
Complexity/Simplicity
Implimentability
Extensibility
Effort Required to Implement.

Address Bar patterns would be things like Restful API.  In Restful I think the address bar calls functions like this :

domain.com/add/4/5

which is changed using htaccess into:

domain.com?function=add&x=4&y=5

Restful is more than just pretty address bar stuff I guess but like I said I don't feel it's the most important thing. 

Speed.   For speed you could use the php code inline which is the most common way for instance


here is add.php:
<?php
$z = $x + $y;
?>


<?php
$x = 4;
$y = 5;
include("add.php");
echo $z
?>

This might be the fastest way to do things but it's not very clean.  

Complexity/Symplicity:
Using Objects would be cleaner and simpler OOP objects can be done in many different ways.  For each way of implementing objects I would consider that a different Design Pattern.   Perhaps you can identify the patterns created.   different patterns probably would do different things.

One way of simplifying things is to use the Model View Controller.   There are many ways of implementing the Model View Controller.  To me though there seems that a website is already broken into separate parts which are these:

HTML : Viewport
Javascript  : Controller
PHP /Template
CSS /Template
MySQL/ Model Controller
Database Data: Model.
Images: Model/Templatedata

Things are already separated into concerns.   To separate thins more is to actually add complexity.  What happens is that people will Divide one of these languages into a Model View Controller and the other languages will merely supplement the application.




No comments:

Post a Comment