Step-by-Step Tutorial on SharePoint Site Creation

Note, the entire tutorial from start to finish will be available as a single zip file when it is complete, it will include all source html, css, PSD/Images etc.

First and foremost – Everything mentioned herein you may not agree with, you may not even think it’s right. These methods are my own and are based on real-world experiences that I have had in creating SharePoint sites over the last 6 months or so. As with most things there are often several ways of doing things, this one is mine…

All “SharePoint” customization will be using FrontPage 2003.

This entry will likely span into a 4-5 part tutorial on creating a SharePoint site that looks like a “real” website.

I’ll try and take things step-by-step in creating a “real website” and then converting it into a SharePoint site. I will keep it as simple as possibe so that it’s relatively easy to follow.

For anyone that just wants to follow along and get their feet wet I will include everything I’ve used for the site creation, HTML/Graphics/CSS etc.

This will be a fairly long post(s) but hopefully if there are a few people out there experiencing the SharePoint (Learning Pains) this should help you.

I’m going to be fairly in-depth about the entire process of the site creation, covering everything from; brainstorming, what make’s sense/what doesn’t, sketching, creating the graphics, creating the site, styling the site and finally converting everything to a fully content-managed and dynamically driven SharePoint Site.

On that note let’s jump right in …

In case you are wondering if this entry is for you, I’ll quickly describe most of what I will be talking about.

First of all I think it’s important to take things from the beginning of the site creation. I will assume you are fairly well versed with HTML/CSS/Site Creation in general.

If you are already a seasoned designer/developer you will probably want to skip the first several sections and dig right into the SharePoint Conversion section.

What to expect:

Overview:
Step-by-Step guide on creating a SharePoint website that looks like a “real website”.

Things to Cover:

Why SharePoint? – Benefits of creating a site based on SharePoint
Brainstorming – What’s the purpose of the site.
Planning – Creating a site that works for both the end-user, and the owner.
Sketches – Laying the groundwork
Graphical UI – Bring your sketches to life
Initial Site Creation – Setting the stage w/ SharePoint in mind.
Creating a WSS “SharePoint Site” – The “basic” SharePoint site
Setting up the dynamic elements – Lists, Libraries and all that fun stuff!
SharePoint Conversion – Turning your site into a SharePoint Site.
Programming (withouta) a Programmer! – Let’s bring in those dynamic elements and create some nifty data-views.
Styling the site (CSS) – Styling the data-views and other elements to be visually appealing.
Styling the admin pages using “themes” – Step-by-Step on theme setup and customization.
Backing up your work – Using FrontPage 2003 to backup your work.
The Final Result!
– See, that wasn’t so hard now was it!

Stay tuned for Part 1

You may also like...

7 Responses

  1. M Danish says:

    its very helpful to new user i appreciate u

  2. M Danish says:

    its very helpfull to anyone

  1. May 17, 2005

    New Xbox 360 Skin

    Thanks to Shane for my kickin new Xbox 360 skin. I knew it wouldn’t take him long to start rolling with the SharePoint posts….

  2. May 23, 2005

    Shane’s tutorial: Sharepoint-based customer web site step=by-step

  3. May 23, 2005

    Shane’s tutorial: Sharepoint-based custom web site step=by-step

  4. May 23, 2005

    Shane’s tutorial: Sharepoint-based custom web site step-by-step

  5. May 24, 2005

    Step-by-Step Tutorial on SharePoint Site Creation by Shane

I would love to hear from you.

%d bloggers like this: