Part 1 – Preparation
(1) Discuss the requirement with client
(2) Submit a design document to the client for them to fill out.
(3) On your PC create the file structure for the new site. (see Photo)
(3) Based on discussions and the returned Web design document, create the fluid “Site Design Document”. This is a design document detailing all information concerning the site. It acts as the top document and is issues and updated as required through out the development of the site.

(4) Using Adobe Fireworks design a mockup of the home page and submit it to the client for approval.
(5) Once approved Edit the Fireworks design to reflect the accurate final mockup. Attention to slicing, positioning, colours and text must be given such that its components (slices) can be utilised in the final site. Slicing must be appropite for final site assets (make sure images are named and optimised. (see Photo)

(6) Export individual slices to the sites image folder ready for use in Dreamweaver.
(7) Sketch a layout diagram of layout slices and text areas.  Note the areas sizes.  This will help when you start creating the layout Div’s in Dreamweaver.

You now have the web design layout designed and approved. The graphic elements have been sliced up and imported in to the sites image file ready for uploading.

This tutorial assumes you have already created a web page with navigation.
- Open the Page Panel and right click on your page. Then select “Set as Master Page”.
- Click on each nav button in turn and set the link in the Properties pane (index.html)
- Right click on the Master Page in the pages panel and select Duplicat. Then name it.
- Repeat for all pages.
- Export as “HTML and Images” set the following properties. Unselect : “current page only”, Select : “images in subfolder”, “include areas without slices”
- You now have a working site with working navigation.
- Go back into Fireworks and edit each page to your likeing

The Firefox web browser can be a superb tool for web designers.  A number of add ons are available to allow sites to be analaysed and coding techniques tested.  No good web designer should be without it.  Here is a list of must have add ons :

Firebug : Link
FireFTP : Link
YSlow : Link
ColorZilla : Link
Abduction : Link
Webdeveloper : Link

A step by step tutorial, to install and configure a Post Nuke content management system website (CMS). This article includes installing postnuke customisations.

Preparations
1. Create the domain on your host server with php support. Preferably in the root directory.
2. Create the mysql database on your host and note the name, user and password.
3. Using an FTP program connect to the site and up load all the postnuke files to the domains root directory

Installation
1. Navigate to your domain (install.php)
2. Follow the on screen installation notes. Do not tick the box “create database”
3. At the login screen edit the information for your required login details
4. Remember to delete the install directories and files as instructed.

Installing forums
1. Upload the PNPHPBB2 files to the /modules/ directory
2. In postnuke go to admin/modules/ Hit “regenerate” and then find the pnphpbb2 entry and Initiate it
3. To add “forums” to the postnuke menu, go to admin/blocks/main menu. Add the forums entry to the menu configuration. The link entry will be http://faction.cellxgaming.com/index.php?name=PNPHPBB2

Adding a theme
1. Download the runtime client for AT-Lite (postnuke) from www.spidean.com. Upload it to the postnuke directory as its install notes.
2. Initiate it in the admin/modules section. Regenerate if you cant see it in the list
3. Upload your new theme into the /theme/ directory and set its permissions as instructed.
4. In the postnuke setup menu select the theme.
5. If the theme includes install files to theme the forums as well, then install them.

Shout box
1. Create a new block in the postnuke admin area core/html
2. Name it as “shout box”
3. Add to its contents the html shout box code as supplied by the shoutbox hosting site.

Picture blocks
1. Goto postnuke admin/blocks/new block and select core/html
2. Paste your picture html code into it

Search box
1. Goto admin/blocks/newblock
2. Select core/search box

Post calendar
1. download the post calendar files
2. Upload post calendar to the /modules/ directory
2. Install as its instructions
3. Go to blocks/main menu and add an entry in the menu configuration form for postcalendar. Entry will be [postcalendar]

Member list
1. Activate the members _list module
2. Go to blocks/main menu and add an entry in the menu configuration form for the members list. Entry will be [Members_List]

Other customisations
• Deactivate search box
• Remove from the navigation menu [downloads] and [reviews]
• Position “incoming” block to the top left
• Rename “Sections” nav to “information”
• Set up email notification on news articles
• Add information
• Do tags
• Categories and topics

This article attempts to describe the workings of Postnuke so that admins and users can go about organising and using postnuke.

FAQ Section
This allows members to post questions, and for admins to give answers. The results show up under the FAQ section. Each question can be assigned a category and sub category to allow categorisation of FAQ’s. Admin can design the Faq layout and categories, under administration/content/faq.
The FAQ Nav button must be setup in the administration/system/blocks/main menu area [FAQ].

Topics Section
Topics are used to sectionalise “News Articles” and “Stories”. A Nav menu button allows access to sectionalised news articles. Topics are set up in administration/content/topic. Icons can also be setup for each topic category. The Topic category is assigned to “Submit_News” and “Add Story”

Submit News
Users are able to submit news stories to admin for approval and publishing. “Topic” and “Category” can be assigned to them for sorting and displaying via “Topic” and “Category” Nav buttons. Once published they appear on the home page as a new article. They can also be accessed via the “News”, “Category” and “Topic” nav buttons. Options for setting up email notifications are in administration/content/submit_news.

Storey’s
These are News articles, but directly submitted by Admins. See “Submit News” above for explanations.

Sections (Articles)
These are fixed articles which can be divided up into sections much like a book. They can appear in the Nav menu using the [sections] command. admin/content/sections

Comments
Users can comment on “Stories” and submitted news which has been published.

Links
User can submit web links to admin for publishing. The can be sectionalised

Downloads
Very much like weblinks

Notes
Users can comment on stories
Articles for admin approval appears in an “Incomin” box which appears top left

META Tags can be used for excluding content from search engine crawlers. It is also used when you cannot upload a robots.txt file. Its purpose is to keep content out of search engine indexes.  They should be added between the HEAD section of your page(s) in question:

(no)index determines whether the crawler should index this page.
Possible values: “noindex” or “index”

(no)follow determines whether the crawler should follow links on this page and crawl them. Possible values: “nofollow” and “follow.”

Here are a few examples:
1) This disallows both indexing and following of links by a crawler on that specific page:
<meta name=”robots” content=”noindex,nofollow” />

2) This disallows indexing of the page, but lets the crawler go on and follow/crawl links contained within it:
<meta name=”robots” content=”noindex,follow” />

3) This allows indexing of the page, but instructs the crawler to not crawl links contained within it:
<meta name=”robots” content=”index,nofollow” />

4) Finally, there is a shorthand way of declaring 1) above (don’t index nor follow links on page):
<meta name=”robots” content=”none”>

If this meta tag is missing, or if there is no content, or the robot terms are not specified, then the robot terms will be assumed to be “index, follow” (e.g. “all”). If the keyword all is found in the robots terms list it overrides all other values. That is, a robots terms that is “nofollow, all, noindex, nofollow”, would effectively be “all”.

This articel tells you how to Redirect a website or webpage to another domain location or page :

Purpose for use :
• You are using optimising the index.html page for search engines
• A web page no longer exists so you are redirecting it to a new page.
• Directing a .co.uk domain to a .com (multiple domains to one)
• Passing search engine rankings from old site to new one

You just created a new web site but want to pass on the search engine rankings of the old one to the new one. What is the most effective and spider/visitor friendly method? You should use a 301 redirect.

301 redirect ?
It is used when you want to redirect your web site or web pages. The code “301″ is interpreted as “moved permanently”. After the code, the URL of the missing or renamed page is noted, followed by a space, and then followed by the new location or file name.
When a search engine spider requests a web page, your web server will check for an .htaccess file. The .htaccess file contains specific directions that are processed then sent
back to the browser. In the .htaccess file create a line of code that reads like this:
Redirect /index.php http://blog.saltalamacchia.co.uk/index.php
The first “/” indicates that everything from the top level of the site down should be redirected. All current links within the search engine results from the old site will redirect to the top level of your new site. Save the .htaccess file to your root directory on your server.
A useful site is :
http://www.htaccesseditor.com/en.shtml for creating .htaccess files

Redirecting a Web Page
The above example shows how to redirect a whole web site. What if you want to just redirect a web page that you have changed but want to keep the rankings of the old page? Follow the same steps as above but write the code like this:
redirect 301 /old/old.htm http://www.you.com/new.htm
Note:

It may take several weeks or months for the old rankings to be passed on to the new site. Therefore don’t remove your old domain name, web site or web pages just yet.

Auto-Redirecting Methods

The “Meta Refresh Tag” method
This method search engines can detect. It is also the one method that the engines are perfectly happy with as long as there is a reasonable delay between landing on a page and being redirected from it. At least 5 seconds is recommended. The code for it must be in the section of the page, and looks like this:-

META http-equiv = “refresh” content = “0; URL = anydomain.com/destination.html”

Don’t forget to include the “http” protocol which has been omitted.

The “content” parameter contains two parts, separated by a semi-colon. The first part is the delay, in seconds, before the redirection occurs. The second part is the URL to redirect to which, like any hyperlink, can be a relative URL (as above) or an absolute URL.

For search engine optimization purposes, a delay in the auto-redirection is not usually desirable. Using the Meta Refresh Tag with a delay of 0 (zero) seconds is not recommended, because search engines can read HTML, Meta tags are HTML, and people have had penalties from redirecting that way. For an immeditate redirect, one of the other auto-redirecting methods is much better.

The “Javascript” methodJavascript auto-redirects cannot be automatically detected by the search engines because they don’t yet parse Javascript. The script can be placed anywhere on the page, but it is best to place it in the <head> section so that it runs as soon as the page begins to load. This is a typical example:-

<head>
<script language=”javascript”><!–
location.replace(”pagename.html”)
//–>
</script>
…other head section stuff (Title, Description,etc.)…
</head>

“pagename.html” can be any relative or absolute URL, just like a hyperlink URL.

The use of Javascript’s “replace” function causes the new page to replace the current page in the browser’s Back button’s History list. If a visitor then clicks the Back button to go back to where s/he came from, s/he doesn’t go back to the page with the auto-redirect but, instead, goes to the page before that. It avoids the annoying occurence of the Back button taking a person back the auto-redirecting page, which immediately takes him/her forward again.

Using a Index.html page to redirect
Use the following code in your index.html to forward to another page or site.  Locate this file in your domain root.

<head>
<meta http-equiv=”refresh” content=”5;url=http://blog.saltalamacchia.co.uk/index.php”>
</head>

Hiding a redirect to a sub domain
If you put your side within a sub directory of your domain, you can hide the sud directory displaying in google.  To do this :-

• Create site in www.mydomain.com/subdirect
• Create an index.html file in the domain root
• Within the index file add only
  <?php include(”subdirect/index.html”); ?>
  or in the htaccess file add :
  RewriteEngine on
  RewriteRule ^index\.html$ subdirect/index.html

Note
When using wordpress in a sub domain the wordpress .htaccess file is in the subdomain root and the redirect is in the from page root