Now that I have been at the freelance web-design business for the last several years, I have had some experience with a variety different programs. Some of them are very expensive, others are free. Here I have tried to make it easy for you and compiled a list with links to their respective locations:

Design & Image Editing:

Adobe Photoshop – $649 or $999 for the extended version

Photoshop is the most expensive program you need- but you will want this piece of software. There are a lot of different image editing tool but this is the industry standard. Sometimes you can get a student discount, or even get your company to buy it for you.

Text/Code Editing:

Mac

TextWrangler – Free: This is a great piece of software for writing your code if you don’t want to spend any money.
Read More »

People – especially people of business – want websites. If you asked them why, most would say that they want to “Attract more clients”, “Generate customers”, or “Show off my business”.

Imagine that you are an architect. Someone asks you to build them an office. You ask, well, what do you want in an office? The equivalent answer to “Attract more clients” is: “I want to be able to put my employees there so they can work.”

As you can see, this is not a helpful answer. How many employees do you have? What kind of resources do they need? What kind of environment should they be provided?

The same goes for a website. The following are some basic steps to designing a better and more focused website that will accomplish the goal of your client.

Step One: Define a specific goal.

Some good example … Read More »

Everybody is looking for lightweight code with a maximum effect. JavaScript rollovers just don’t cut it anymore- they take too long to load, they’re kinky the first time you rollover, etc. etc. and CSS using multiple images can be kinky if you aren’t using an image pre-load. The solution? CSS image rollovers using only a single background image.

If you don’t have a solid understanding of using lists for navigation, then you may want to review that concept before tackling the single-background-image rollover.

Download the example to follow along.

The concept

You have, for instance, a navigation bar (vertical or horizontal, it doesn’t matter). Very simple. There are only four buttons but you can obviously change and edit this concept to fit your own site.

How is it done?

Well this is what the HTML in the example … Read More »

One of the most revolutionizing things I ever learned about building websites with HTML and CSS was the concept of using lists for my navigation. I was flabbergasted! Using lists for navigation? Why, that would look horrible! But then my eyes were opened to the real power that you have to control the way your navigation looks and behaves, as well as the very SEO friendly navigation the list will provide.

The HTML

If you are following along with me in your own document, you will need to make a list, much like the one below (depending on your file structure):

<ul id=”nav”>
<li><a href=”index.html” >Home</a></li>
<li><a href=”about.html” >About</a></li>
<li><a href=”contact.html” >Contact</a></li>
</ul>

And that is your basic list for navigation. It looks kind of ugly in the browser right now, but that’s alright because we’re going to fix that in a minute.

Now there are two ways to … Read More »

CSS is pretty much my favorite thing about the web. What is CSS? It styles the HTML that contains the structure and content. With CSS you can move, position, color, and change almost every aspect of almost every HTML tag that there is.

What are the benefits of CSS?

The benefits of CSS are phenomenal and I could never possibly list them all here. The main reason that CSS is so great is because of the power it gives you to control the entire site with one document (to be elaborated on).

Three ways to implement CSS

There are three ways to make the CSS communicate with the HTML: inline, embedded, and external. The best, most powerful way is external, for several reasons- you only have one fileto edit CSS. If you have all your CSS inline and embedded, you are almost defeating the … Read More »

So you want to make a website. That’s all cheese and crackers, but do you really know what you’re getting into?

If you don’t know any HTML, I suggest you go do some research before this article will be of help to you. If you know the basic idea of HTML and the tags then read on!

First things first- semantic code. The concept is simple, and the results benefit not only you but also anybody who will inherit your site should it ever be passed on.

What is semantic code?

Semantic code sounds easy to write, but so many people pass it by. Suppose you’re writing a simple web page. What does the code look like to begin with? Well something like this:

<body>
<h1>Heading 1</h1>
<p>Some paragraph content.</p>
<h2>Heading 2</h2>
<p>Some sub-paragraph content</p>
</body>

See how it’s in order? The h1 tag comes first, and then some content, followed … Read More »