Cheapest Bastards Guide to Building Websites

Build your website the right way, and they will come!

Wait, Who is this guide for?

- Those looking to have a website built or looking for more information on the process.
- Those looking to build websites as a hobby or wanting to start a career building websites.
- Ninjas.

Who is this guide NOT for?

- Those already skilled in the art of developing websites.
- Those who are easily intimidated by nerdy lingo.
- Zombies.

Welcome! Thanks for visiting the "Cheapest Bastards Guide to Building Websites!" Created for those wanting to jump into developing websites, and also as a source for those who don't fully understand what goes into creating a successful website. Also, for those I run into on Craigslist and other "classifieds" sites that would like me to work for peanuts.

It's often perceived, advertised and written about how easy it is to build a website. It's true! It is easy to make a website for your personal enjoyment. Just like it's easy to make a sandwich. Two slices of bread, ham, cheese, slap some mayo on it; It's a sandwich!

Although, if you expect to compete with the foot-long sandwich shops of the world, there's a whole lot more to it than that. This guide will give you a basic, behind the scenes understanding of what's involved in website building.

So buckle in, it might be a little bumpy!

What You'll Find Here!

"A monkey can do it!"

(A monkey with a brain, lots of patience and time to devote to learning the ropes, but still a monkey!)

So you're starting your own business; Building your own company; Doing your own thing. Working for "The Man" is for the birds and you have something for the world to see, to experience, to buy into, etc.

One of the things you decide you need is a website. Why? Well, because over 1.5 billion people around the world use the internet for everything from shopping, expressing themselves, making friends, or searching for the world's best cheese.

Looking at the budget outline in the business plan you've hacked together; You're wondering how far the $12 that you devoted to your website will stretch in hiring someone to build it for you. It's just a few words, pictures, and a "wicked cool" blinky thing that you think is "neat-o" and will surely make your site visitors happy. How hard can it be?

So you place an ad on Craigslist, or some other bulletin board that goes something like this...

---------------------------------------------------------------------------------------------------

BRAND NEW START-UP SEEKING EXPERIENCED WEB MASTER!

We're looking for a special individual to build our website from the ground up. We're going to be huge in our industry.

We have limited funds, so pay will be minimal if anything at all. We may be able to pay you in the "future" (whenever that happens). This is an awesome opportunity for you to expand your portfolio!

E-mail Us Now!"

---------------------------------------------------------------------------------------------------

(...virtually shaking my head at you.)

Not to say this can't work for you, but I bet more often than not that you're setting yourself up for failure. Asking an individual to "work for free" or for "low pay" more often than not means a slow project time line, and possibly being dropped when your new volunteer finds a paying gig. In the end, receiving a completed/uncompleted site that is of poor quality; that you may or may not be satisfied with. Enjoy tea with your headaches?

A website is often the first place a user will go to inquire about a service or business, and often one first impression is all you will get. Do you really want to trust that user experience to someone who had very little incentive to make it the best it can be?

My advice if you are hunting for a web specialist is to find the funds to hire someone or some company with a portfolio of work that you admire and let them work with you on creating the user experience that you want for your site visitors. If the budget is just not there and you're giving it a go at doing it yourself; Use this guide, find the time and have the patience to learn the "ins" and "outs" of building a website. You will learn lot's of new and exciting things about how the web works, and be much happier you did in the long run.

Web Hosting

What's hosting and how do I get some?

If your website is like a car; You take your car to a parking garage. You pay a fee to park there. That's web hosting! Pretty simple, huh?

Well, it's not that easy. Want low cost? We need free or near free hosting. Most free hosting comes at a price. Usually with advertisements that appear all throughout your site. Not very friendly when you're trying to get your site visitors to tune into what your message is. However, sites like 000webhosting.com offer no advertisements or banners with there hosting plan.

Some other set backs to free hosting are storage space and monthly traffic limitations, among others. Which may be fine when starting out; However, if you plan on your visitor base growing, eventually you'll need to actually pay for hosting.

The good thing about hosting is it's fairly cheap to begin with! (Unless you already have a large visitor base established or reach the status of Facebook or Twitter or a site to that notoriety, which isn't necessarily a bad problem to have.)

Worth while hosting may cost you as little as $6-$12 a month, which will usually provide you with extra hosting features, less limitations, no advertisements, and if there's a problem - customer support is more likely to get on top of that problem, versus trying to get customer support as a free hosting user.

Some good and fairly low cost hosting services:
Webfaction.com - Best Hosting Around! <-- The Best Around!

Free hosting:

Domain Name

sillysallyspoodledoodlesstore.com isn't going to cut it...

While "Silly Sally's Poodle Doodles" may be the name of your company. It doesn't make a good domain name.

Think of a domain name (also known as a URL, or a web address) as an online "phone number" for your website. Phone numbers are limited to a certain amount of digits making them short and sweet. It's a good idea to make your website's domain name be of the same shortness and sweetness, as well as trying to make it memorable. It will be displayed in all of your marketing material, on the back of vehicles, along with advertised around the web. The URL "sillysallyspoodledoodlesstore.com" is not only hard to read but hard to remember. Something such as "sillydoodles.com" is much more readable and memorable.

More often than not, the good domain names are already taken or they're for sale at higher prices than normal; However, if you don't want to pay the higher prices, and you play around with the domain name enough, you can come up with an effective URL.

The web hosting provider you choose will usually also have options to purchase a domain name as well. Usually less than $10 for the year; However, you can secure a domain name just by itself through sites like GoDaddy.com or Domain.com, and then have them point to anywhere your website is hosted; once you have chosen a hosting provider.

Can you get a domain name for free? Sure, but it usually looks like this:

"sillysallyspoodledoodlesstore.freedomainsbyus.com"

Not worth saving that less than $1 per month.

Website Design & Development

Let the fun begin...

If you are excited about this part of the process and your level of design experience is picking out the clothes on your back or rearranging the furniture in your living room. Please! I implore you to do one of the following:

Hire a Graphic Designer who specializes in Web Design.

Re-think number 1

Re-think number 2

FINE! I warned you... You're going to have to learn some new languages.

Consider starting off with a template.

Dive head first into Web Design.

If you decided to hire a Web Designer, Hooray for you! You can skip to the hire someone section, or you can keep reading and have a good understanding of what is involved in putting a good website together.

If you've chosen an option that is greater than or equal to 5, re-think the first 3 and if you must, read on.

Programming Languages & You! a.k.a. Code

"AHH! He said CODE!"

You're going to need to know it. Whether you're working with a template or starting from scratch there's one, and a recommended two programming languages you need to learn. HTML and CSS.

HTML (which stands for Hyper Text Markup Language) is a must. There's no getting around it. Luckily, It's one of the easiest to learn to get you going. You want to make text bold:

<strong>"I'm big bold text!"</strong> looks like "I'm big bold text!"

Though all of learning HTML isn't as simple as that, it's fairly easy to get the hang of once you work with it enough.

While CSS (which stands for Cascading Style Sheets) isn't a necessity, It will help you; In that you'll be able to do more with the structure and layout of your pages. CSS will also save you a lot less coding time once you get the general hang of it.

Some great HTML & CSS resources and gurus online are:

w3schools - Online references for HTML, CSS amongst other coding languages.

Eric Meyer - CSS Guru

CSS Zen Garden - Examples of the power of CSS based design.

The Mother Load of CSS Resources

However, having a book to snuggle up to is not a bad thing to have...

Sams Teach Yourself HTML and CSS in 24 Hours (7th Edition)

Head First HTML with CSS & XHTML

HTML and XHTML Pocket Reference (Pocket Reference (O'Reilly))

CSS Pocket Reference: Visual Presentation for the Web (Pocket Reference (O'Reilly))

Sams Teach Yourself HTML and CSS in 24 Hours (7th Edition)

HTML and XHTML Pocket Reference (Pocket Reference (O'Reilly))

CSS Pocket Reference: Visual Presentation for the Web (Pocket Reference (O'Reilly))

There are coding languages that can help you create a more dynamic website such as Javascript, PHP, MySQL, Ruby on Rails, Python, French, amongst a whole host of others. Though none of these are required to make a working website, it's not a bad idea to make yourself familiar with some or all of these if you're going to start building websites on a regular basis.

"Je plaisante, apprendre le français n'est pas nécessaire."

The Template Approach

The template approach is not a bad option at all if you just want to start dabbling in creating websites or to get your website up and running as quick as possible. With a template you're able to have a base to work from and then you can choose to change and shape the template to your liking.

The problem with templates is your site could look like other websites. When I say "other", it could equal thousands of others. If you're okay with that then that's just super!

Another problem with templates, especially for those new to the inner workings of websites, is that after choosing a template you could end up with a template that has archaic code/structure, is hard to manage, and overall just a big headache. It's important to make sure that whomever you purchase the template from they are up to current web standards, and clean out or update some of there older templates every so often.

Some recommended websites to grab a template and get started with:

The Do It Yourself - Web Design Approach

"Oh Boy!"

There is so much information and opinions out there on best practices of web design that I could go on forever about it, but who has that kind of time. What I can do is tell you the basics of what you'll need to know and point you in the right directions.

Web Standards

"Pay attention now!"

Long, long ago in a millennium, far, far away in our past, websites were created by webmasters who had no blueprint for designing websites. Each developed their own best practices, and those practices where passed on overtime. As the web evolved and more, and more businesses understood the importance of having their place on the world wide web; Websites became clunker, bulkier, and harder to maintain to keep up with the changing practices of the still evolving web.

(Fast forwarding)

A day came along someone said, "This is ridiculous!" and then "Web Standards" was born.

To sum up web standards; It's the practice of developing sites that are accessible to everyone including those with special needs. Websites that are also easily developed and maintained through standards compliant code that works across all web browsers, and easily adapted to new and advancing technologies.

It's a discussion far to great for this forum, so some good places to start learning about what it involves are The World Wide Web Consortium (W3C) and Web Standards Project

UI Design

"Huh? What's a UI"

UI stands for User Interface, and UI Design (or Usability Design) focuses on the user experience/interaction with your website. Sounds rather elementary, but all too often people who are new to web design forget this very important key to a successful website.

Usually, after we create something we expect people to know how to use it; However, that's just not the case and you don't want your website making one of the lists here. UI Design is one of the most important parts of creating websites and can make or break your success online.

Resources & Gurus:

A List Apart - User Science Section

40+ Helpful Resources On User Interface Design Patterns

Current Issues in Web Usability

Some reading materials. If you only buy one, the first one is a must.

Don't Make Me Think: A Common Sense Approach to Web Usability, 2nd Edition

Designing Web Navigation: Optimizing the User Experience

Head First Web Design

Don't Make Me Think: A Common Sense Approach to Web Usability, 2nd Edition

Designing Web Navigation: Optimizing the User Experience

Paper Prototyping

Paper prototyping is a process of testing your website before going through all the trouble of developing it. It involves a basic outline/rough draft on paper of your websites user interface. Giving testers a task to do, you are able to see how effectively those testers are able to navigate your website and preform the task successfully.

Though paper prototyping may carry some small upfront cost in time or paying for testers, it can be a cost saving measure in the long wrong. This is especially true for larger websites as it can prevent re-development costs when pitfalls are caught before the initial development process.

To learn more check out these resources and books below.

Paper Prototyping: Getting User Data Before You Code

An article on Paper Prototyping

Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces (Interactive Technologies)

Graphics

Now that you've got the coding and site layout plan all rip roaring and ready to go; Who's going to paint all the pretty pictures?

You, of course.

The first thing you're going to need is some type of desktop application to make and manipulate graphics. The mother of all graphic manipulation in the industry is Adobe Photoshop. It's not for those trying to save a buck however, so you may only want to consider purchasing it if you want to take on web design as a hobby or if you are taking on web design as a part or full time career.

For the "penny-pinchers", you can use the widely popular GIMP which is free; However, like I mentioned before, if you're going to be working on developing more than one website over time, Photoshop is the recommended choice.

In case you're not really in need of manipulating your own graphics and just want to add a few elements; There's also a plethora of websites like Envato's Graphic River or iStockPhoto that offer everything from background images, website icons, unique graphics, etc.

Graphic River -

SEO / Findability

From Wikipedia

-----------------------------------------------------------------
Search engine optimization (SEO) is the process of improving the volume or quality of traffic to a web site from search engines via "natural" ("organic" or "algorithmic") search results. Typically, the earlier (or higher) a site appears in the search results list, the more visitors it will receive from the search engine. SEO may target different kinds of search, including image search, local search, and industry-specific vertical search engines. This gives a web site web presence.

As an Internet marketing strategy, SEO considers how search engines work and what people search for. Optimizing a website primarily involves editing its content and HTML and associated coding to both increase its relevance to specific keywords and to remove barriers to the indexing activities of search engines.
-----------------------------------------------------------------

In layman's terms:

Let's say your website is a place to buy pizzas. Well, you'll want to attract people who are looking on the web for places that sell pizzas. Usually, they start looking by entering in keywords into a search engine. Except you're not the only person on the web selling pizzas; Therefore, others are probably targeting those same keywords. Just like the real world, you're competing with the pizza place down the street. So how do you appear at the top of those search engine results?

Nobody knows the exact answer. Those who are behind the search engines aren't sharing the specifics.

However, there's plenty of opinions from gurus that have some great ideas as to how to get at or near the top of the search listings. Which includes adding keywords into your content and having a bunch of friends/outsiders linking back to you.

Search engines aren't the only way to get found on the web. I'm of the belief that "Content is King!" Meaning, if your content is good enough to entertain or inform those who come across it and you work on the basics of optimizing for search engines, which includes keywords and search friendly code; Your web pages will be found. People will talk about them on the various social networks and message boards. They'll link back to your site and you will improve the rankings of your web pages and your search listing position. Focus on the content and the search engines will focus on you!

Some great resources and gurus online:

Google on Search Engine Optimization (SEO)

seomoz.org - Beginner's Guide to SEO

Great List of Additional SEO Resources

Matt Cutts Blog

A great read to get you started:

Building Findable Websites: Web Standards SEO and Beyond

Building Findable Websites: Web Standards SEO and Beyond

Wrap Up & Hiring Help

All too often, with the numerous amount of competitors in the online world, you get one chance to make a good impression on site visitors. If your website isn't easy for users to navigate, or your content is lacking, or there is some other draw back that you may not be aware of, they will move on to the next one; until they find one that works for them.

As you can see just by glancing at the topics above, creating a successful website is more than just text and images on your screen. There's a process and intricate parts to making it a success. The individuals who make it a career, and whom are good at it, not only spend countless hours learning the existing practices, but they spend countless more keeping up with emerging new technologies, programming languages, design theory, etc.

If you choose to hire someone who specializes in all or some of the topics above, look at their portfolio of work. Discuss the topics above with them and ask how they are going to use these practices in developing your website. Understand that it is a process and making a website that is a great user experience for your site visitors is important. Throwing it together and pushing it out to the public as quickly as possible is the wrong answer.

I'm sure someone once told you that you get what you pay for, and that's so true when hiring someone to develop a website for you. If you come to the table with $12, and promises of possible future payments, or a beautiful addition to their portfolio; In my opinion, you're setting yourself up for failure. Good web designers understand the type of clients they want and the type of clients they'll stay away from. Set a budget in your business plan that will help you get everything you want out of a website and set yourself up for success.

If you're just getting your feet wet, and hoping to make it a career; It's an exciting time. Many believe the world wide web is still in it's infancy. Where it will be one day down the road only the future holds. Now is as good as time as ever to be apart of shaping it's development and being apart of it's history.

Help Cheap Bastards on Craigslist Find This!

Please Rate My Lens!

Let's Hear It!

submit

Reply

Kapalbility Kapalbility Nov 27, 2009 @ 11:26 am

This lens deserves more attention. Really.

Reply

luckykind luckykind Oct 3, 2009 @ 10:57 pm | in reply to Pukeko

It does take some practice... but it can be done :)

...when having trouble... eat more bananas.

the potassium is good for the brain...

Reply

luckykind luckykind Oct 3, 2009 @ 10:55 pm | in reply to ChapelHillFiddler

Starting from a template is great! I have no problem with people choosing the D.I.Y. route... and if this lens can help direct them to improve their sites, then I'm happy to help. Glad you liked my style... Now, if I could only convince my wife of them same thing... :)

Reply

ChapelHillFiddler ChapelHillFiddler Oct 3, 2009 @ 9:57 pm

I like your style! Followed you here from the forum. I design most of my websites by starting with a template that's in the ballpark and then modifying it till it suits me.