Quality content for website, print, and advertising is a scarce resource. Content is often created as an afterthought, with little regard for quality. Many avoid it, even fear it, because they don’t consider themselves good at grammar. But what if I were to tell you that good content could be created without a dictionary, and without being able to identify a past participle? (Actually, a past participle is defined as job security for English teachers!).

Writing is as simple as putting a complete thought down on paper. People informally communicate all day long, verbally and in writing(email, notes, etc). But when it comes to writing a “formal” tutorial, or product description, or a proposal, we tend to get writer’s block. The fact to remember is that we are still trying to accomplish the exact same thing as always: communicate a complete thought.

I would propose that formal writing is percieved as more difficult, not because it actually is more difficult, but rather because we are more worried about what others will think.

Addressing Writer’s Block

In my experience, you will never have writer’s block, if you have something to say. Now, before you roll your eyes at such a seemingly obvious statement, hear me out! When we have something to say, something that we know and need to communicate, you don’t have a problem getting it out. But when you’re trying to write an article/paper to fill a space requirement, or fill a commitment, writing’s as fun as a heart attack, right? For some, beginning a paper is the most difficult part. Simple solution: Make a list of points you want to cover, write about those points, and save the introduction for later. Many times your intro will sound better that way.

Writing’s greatest advantage is also it’s greatest disadvantage. You get/have to plan what you’re going to say. For many, taking the time to plan their words is a foreign concept, and thus makes writing seem slow and tedious. But if you embrace the discipline of planning your content, you will find the reward of accomplishment in the resulting quality paper.

Defining Quality Writing

So if an English degree isn’t the key to good writing, then what is? Quality writing exhibits 3 unique characteristics: Concise, Clear, Comprehensive. Let’s look at these individually.

Concise

Most English classes from grade school on up to collegiate classes make a significant mistake when teaching good writing skills. Teachers typically give writing assignments that are length based, rather than content based. The result is that many writers considered good, are actually just writers who know how to fill space. What a waste! The whole point of writing is to communicate an idea or process, and if you can fully explain that idea in one sentence, then why write a whole book about it? All you accomplish by adding “fluff” to your writing is to hide, or water down, the idea you’re trying to convey. Don’t make your readers wade through a tome to get that tidbit of info.

Does your content seem a little confusing, or a little dry? Find a way to cut back on the number of words. It’s amazing how much clearer it will become.

Clear

Very much related to concise content is clear content. Do I need a Phd to understand your paper? If you’re writing to Phd’s then you’ve succeeded, but if you’re trying to write a general product description, then you have failed miserably. Know who you’re writing to, and take great care to make sure they can understand what you’re saying. Note: talking down to your audience is just as bad as intimidating them with foreign lingo.

Comprehensive

Alright, you’ve made great efforts to keep your writing clear and concise. Congratulations! Now the last thing to consider is this: Have you left anything important out? Sometimes you can leave out information simply because you forget that your audience may not be familiar with your profession’s terms and lingo. This is something that I see happen all the time. Read your content with the perspective of your audience, continually asking yourself if anything is missing in that section.

As you can see these three characteristics overlap quite a bit. Making sure that you strike a good balance between the three will create far better content than you can imagine.

1. Virtual Office
   Your website provides your potential customers with a first impression of your business, similar to them actually coming to your place of business for the first time. It offers 24/7/365 availability, and customer support. A website for many people is a low pressure, time-efficient way of gathering pertinent information about your business, such as business hours, directions, contact method, and general product/service information.
2. Expanded Services
   With a professional site, you have the ability to offer your customers a whole range of additional services for their convenience, and ultimately your profit. Whether they be basic features like directions, and contact forms or more custom features such as application forms, progress reports, order tracking, weekly ads/coupons, client discounts, or weekly newsletters, these features provide for many small companies a whole new level of professionalism for a relatively low cost.
3. Enhanced Marketing
   Promotional websites offer a unique opportunity in marketing. A product or service can be fully expounded upon on a website much more than practically any other form of marketing. It is for this reason that websites are increasingly the intermediate goal for many other marketing campaigns. Many tv, newspaper, mail, and radio ads are referring their customers to their websites for more information. This tends to work better long term for sales, due to the inherently low pressure, information rich nature of the web.
4. Efficient Services
   Web based services can bring a critical element of efficiency to many small businesses. Communications can be simplified, and everyone is kept in the loop so much easier than with traditional memos, and time consuming conference meetings. You and your employees are then free to do what you’re there for – to make money. Online applications and forms for clients and prospective employees can reduce the time from request to implementation, further making your company look good.

“The plans of the diligent surely lead to profit; and everyone who is hasty surely rushes to poverty.”
Proverbs 21:5 (WEB)

Planning is the key to any successful venture, and e-commerce is no exception. This article will look at some of the key areas to plan for when getting into e-commerce. These areas include marketing, maintenance, shipping, and payment gateways. Naturally, this is not a comprehensive planning guide; just some ideas, and questions to get you started towards a good digital business plan.

Marketing

Products and services don’t sell themselves. Keep in mind that when you go online, you are then competing with every online retailer in the world! Welcome to the global economy. Sound depressing? Don’t worry, it’s not all that bad. Advertising on search engines are a good place to start. This gives you immediate visibility to people looking for your category of products.

Setting aside a certain amount every month for paid search advertising should be the first stage of any online marketing budget. As sales start to come in, it is advisable to start putting a percentage back into marketing. This contributes to the desired upward spiral in sales.

Putting links to your new site in your email signature, on your business cards, letterheads, and any print advertising you may do are all great ways to get the word out about your site. Never underestimate the value of local advertsing or word of mouth in driving business to your site.

Maintenance

Just like a local business, online businesses can take a lot of maintenance. Someone has to answer the phone, process and ship orders, add new products, remove discontinued products, deal with vendors, handle customer complaints, update sales, and manage advertising campaigns. Consider whether you have the time to do this yourself, or the funds to hire someone to handle it. Taking into account the time needed for even a small site, can prevent burning out or providing poor service to your customers when the workload becomes too heavy.

As most entreprenurs will anticipate, during the start-up stage, you will have a disproportionate amount of work compared to the level of sales. Many business experts recommend that you have the funds to maintain the business for one year, before you begin. Obviously, this is not always possible, but it is a good rule of thumb when it is possible. Many small businesses are lucky to break even the first year, and show a small profit the following year.

Shipping

“Many find it simpler to just offer free shipping on all, or most, of their products.”

How will you calculate your shipping costs? Your choices depend on your product lines, and your e-commerce software. Should shipping be calculated based on weight, dimensions, or price? What carriers should you offer, UPS, USPS, FEDex? What options for each carrier should be offered, Ground, Next Day? Do you ship orders internationally?

Many find it simpler to just offer free shipping on all, or most, of their products. This provides an added marketing bonus, since studies show that free shipping is extremely popular with customers. The key is to calculate what your average shipping cost will be for each product, and then increase the cost accordingly.

Regardless of your choices, no one shipping choice will be perfect in every situation. Shipping calculators don’t always calculate correctly, and adding a little to compensate for free shipping doesn’t always quite cover the true cost. The trick is to find the solution in which the cost averages out correctly over time.

Payment Gateways

How will you accept payment? Will you process credit cards manually? Will you accept C.O.D. or money orders. Will you use popular payment gateways like Paypal, or Google Checkout for your customers convenience? Choosing your payment gateway and understanding the charges with each is important when you’re trying to maximize your profits.

Debunking the Myths of Online Stores

Myth #1: “It’s easy”

Starting an online business is no different than starting a typical brick and mortar business. It takes planning, investment, time, and a viable product line. This is true even if you already have a brick and mortar business. In fact, if you do already have a local business or franchise, you should consider an online store to be exactly the same as opening another business location.

Myth #2: “It’s cheaper than opening a local store”

Nope. Unless you are prepared to build your own site, and do all the maintenance on it, you will have the expenses of hiring a competent developer to do all the work on it. If you will be doing all the work on it yourself, you have to consider the value of your time, as well as your opportunity cost. Either way, there can be significant cost involved in going online.

Myth #3: “You can just build it and leave it”

Perhaps this one needs some explanation. Many people think that if they can just get a good site built for them, then it will keep making them money without any more maintenance, updates, or expenses. This doesn’t work any better online than it does at brick and mortar store. Any good businessperson knows that any store that’s not improving what it’s offering, updating product information, keeping their store clean, fixed up, and fresh, offering sales, and adding new product lines, will eventually die off. A business that’s not growing and improving is bound to fail.

Myth #4: “If my site ranks high on major search engines, it will be successful”

If only this were true! The reality is that search engines are a very small part of a successful site. Even if someone finds you via search engines, it doesn’t mean they will buy from you. Factors such as poor site design, difficulty finding a specific product, bad splleing, and lack of good information/pictures, all make your site look like that run-down gas station down the road (the one you would never go into!).

“…and never discount the power of word of mouth, and small beginnings.”

You should also take into consideration that just because you have a good site, doesn’t mean it will rank high on the search engines. Every major search engines goes to great lengths to make sure that sites(even good sites) can’t manipulate their way into first place. Therefore, you must realize that your site will be competing against every other site in the world that is selling similar products. Your best marketing tactic, just like a local business, is to advertise in as many different ways as possible, and never discount the power of word of mouth, and small beginnings.

The point that I’m trying to drive home is that a website business is functionally identical to a brick and mortar store. The website itself is much like the building, and obviously a building does not a business make. A website is just the “container” for your business, and creating it without a solid business plan, or perhaps with unrealistic expectations, is a recipe for disaster. Good planning with some common sense is the best road to having a successful online business.

1. Consultation We’ll set up a meeting to discuss the scope of your new/re-designed site.Items to cover include:
   • a. Site purpose(What’s it for? Who is the target market?).
   • b. Site theme(Corporate, Modern, Nature, Grunge, generally defined by the site’s purpose).
   • c. Budget(including site creation, maintenance, and any marketing costs).
   • d. Site Content(who’s creating it, what’s needed: copy, pictures, logos, video, etc).

   Once the scope of the project is established, a general timeline to completion is established, and I will give a bid estimate, and define the deposit necessary to begin the project. I also give you a list of the content needed from you to complete the site.

2. Design Mock-up and Approval Within a couple of days of the project beginning, I will present a design mock-up for your review. Once any revisions are made, I re-submit the design for your final approval.
3. Client Content Submission This step should run concurrently with phase 2. During this phase you, the client, collect all the content requested, and deliver them to me.
4. Site Creation on Test Server Once 100% of the content is provided and the design is approved, then everything is ready to begin building the actual site. From this point the average site can be finished within 7 business days. Obviously this can vary based on workload, or site scope. Naturally, I can present a more accurate, project specific timeframe during the consultation phase.
5. Final Approval The site is completed and ready for you to review, and approve. Changes are minimal at this point, since all the content and design have already been approved.
6. Final Payment Now that the site is finished, we explore the favorite color of every designer: green!
7. Site Goes Live! The site is moved from the testing server to a production server, and the project is completed to the satisfaction of everyone involved.

It is important when looking at the value of a website, to not equate the size of the site with it’s value. The intended audience, number of features, and degree of maintainability are just a few of the variables that affect a site’s value. Let’s look more in depth at a few of the most important site attributes.

No two websites are the same.

Much like a house or a car, a websites quality can be measured on several different levels. A house with a nice looking design, interior and exterior, tells you nothing about the foundation, plumbing, wiring, and overall integrity of the house. You could impress your friends and family with such a house, and end up spending a fortune repairing it’s most important, yet hidden, functions. In the same way, a website that looks cool, or trendy, or exciting, tells you very little about the overall stability and quality of that site. You will enjoy it until it starts crashing under moderate loads. Or you might be forced to redo whole sections(or even the whole site), in order to add new features in the future as your business grows. The ability to expand your site in the future, is an oft overlooked consideration in building a professional site.

Good impression from start to finish.

“…your guests aren’t coming to see your site’s incredible design, they’re coming to find information…”

So what does a good site look like? A good site not only provides a good visual first impression to your (potential) clients, but leaves them informed and pleased when they leave as well. Good first impressions count for little if one can’t follow through to the end. What does this mean for a site? 1. Clean, easy to use site layout. 2. Fast loading site. 3. Simple navigation. 4. Consistent layout throughout the site. Factors such as these play an overwhelming part of your guests overall experience. It is important to remember that your guests aren’t coming to see your site’s incredible design, they’re coming to find information, or to contact you to begin a business relationship.

Building a strong foundation.

With a professionally produced site, you are getting a site with an excellent foundation on which you can expand. One of the measurements of a good site is whether or not it follows the code standards set up by an organization called the W3C. Essentially a site that meets these standards is most likely to display correctly across different browsers, operating systems, and most importantly, future browsers and operating systems, and other internet enabled devices such as mobile phones.

Investing in a long-term solution.

When a website can be built by an amateur with a minimal investment in time, a professionally built site might not seem like a good investment. But considering the amount of time that can be saved in maintaining an enterprise level website, not to mention the potential increase in business inquiries/transactions, your investment in a good site can pay off tenfold.

The Challenge:

The site initially lacked significant branding, or cohesive design. The existing site design consisted of a highly compressed logo as the header, and a number of disjointed text and background colors. The navigation on the left consisted of 50+ categories. The number of links combined with the standard underlines, closely spaced links, and serif fonts combined to render the menu largely unusable from the perspective of user convenience.

Modifying an existing, high traffic site without experiencing any disruption of service also presented it’s own significant technical challenges.

The Solution:

The site was modified slowly over time to avoid any site down time, and to allay any potential customer concerns that might stem from an overnight overhaul. Constant major changes to an existing e-commerce site does not present an image of stability, or professionalism to it’s customer base.

Due to the high server load that a site like this can experience, it was important to keep the overall size of each page to a minimum. The average page size was reduced by 1/3, without removing any information.

Tackling first the menu sidebar, a range of subtle changes significantly increased the usability of the menu. These changes included changing the font to sans-serif font like Arial, removing the underlines that show on links by default. By adjusting the font size, color and vertical spacing, we were able to transform a rather unwieldy menu into a usable, albeit still long, menu. Then we re-organized the menu into a 3 level drop down menu with 10 main categories. This allows customers to get to any product on the site in as few as 2 clicks from any other page on the site. It also allows people to quickly find the appropriate category without needing to read all 120+ categories and sub-categories.

The header was addressed next. A Header is often one of the primary features in a site that can be used to enhance brand recognition throughout every page of the site. A site such as an e-commerce site does not usually have the luxury of having the majority of its visitors enter through the front page. Typically customers arrive via search, or ads, which almost always send them directly to the product page of their interest. Therefore it is imperative to set a ‘visually compelling’ header that will be your minimum first impression, regardless of where they are on your site. For Grower’s, the header was slowly modified over the course of two months to become a more significant focal point on the site, while keeping a familiar feel to the site. Additionally, the new header also boasts a search bar, to allow for instant searching throughout the entire site.

Before

After

Thirdly, the home page content was addressed. The existing content served primarily as a search engine ranking content, and provided minimal value in promoting sales. To enhance the functionality of the home page, the content was removed, and a dynamic list of best-selling products was placed as a sort of suggestion box, thus providing a more functional service to the visitors.

Tables

First we’ll look at tables. Tables are created using a combination of four different tags: <table>, <tr>(table row), <th>(Title/heading cell), and <td>(normal table cell). Let’s take this in 3 steps.

Step 1

<table>
  <tr> </tr>
  <tr> </tr>
  <tr> </tr>
</table>

Figure 1.

First we define a table area by using the table tag(<table> </table>). Naturally, everything related to the table is put inside these two tags.

Step 2

Then within this tag we define the rows in our table(See Figure 1). As you can see, we just added three rows to our table.

Step 3

<table>
  <tr>
    <th>1</th>
    <th>2</th>
    <th>3</th>
  </tr>
  <tr>
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
  <tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
  </tr>
</table>

Figure 2.

Add the cells within each row(for the example we add three cells to each row). In our first row, we want these cells to show up as headers for each column, so we use the <th> tag. Then in each of the remaining two rows, we’ll use regular table cells(<td>). For the sake of the example I’ve thrown in some numbers as sample content. Figure 2 shows the code, and Figure 3 shows the resulting table.

Lists

Lists can come in two primary different styles: Ordered Lists, and Unordered Lists. Unordered Lists tend to be more popular, and put a bullet in front of each list item. Ordered Lists place a number in front of each list item.

<ol>
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
</ol>

<ul>
  <li>List Item 4</li>
  <li>List Item 5</li>
  <li>List Item 6</li>
</ul>

Figure 4.

The tags used for these lists are <ol>(Ordered Lists), <ul>(Unordered Lists), and <li>(List Item). The <li> tag is used within both list types.

Similar to the table tag, the <ol>, or <ul> tags are used to define a list area, and nested inside them is a group of <li> tags which define each item in the list. Figure 4 shows the code for the lists shown in Figure 5.

Atrributes

As we saw with images and anchor links, sometimes additional information can be included within a tag. These are called attributes and always contain two pieces of information, the name and a value associated with it. They are formatted like this: name=”value” . You can find references online that detail what attributes can be used for any given tag. We will look at one commonly used one, that works with most tags. This will bring you up-to-date on the three most common attributes(src, href, and class).

<p>
  Paragraph 1
</p>
<p class="president">
  Paragraph 2
</p>
<p>
  Paragraph 3
</p>

Figure 6

The class attribute. This one is widely used for design and styling purposes. It can contain any alphanumeric value, with no spaces. Using a class variable assigns an area in your HTML page that a web designer can use CSS(future tutorial!) to apply styles such as colors, text styles, and backgrounds selectively.

Take a look at Figure 6. You will see three paragraphs with some random text in them. The middle paragraph has been randomly assigned a class of president. Now a knowledgeable web developer can style that paragraph differently from the rest. Let’s say he adds a dark background to it and changes the text color to red. The final result would then look something like Figure 7.

Paragraph 1

Paragraph 2

Paragraph 3

Figure7

Summary

Hopefully, this brief tutorial helped you grasp some of the concepts surrounding HTML. Looking at a long page full of HTML markup can seem very intimidating, but it’s important to look at the page not as a whole, but rather as a collection of extremely simple parts. This makes things so much simpler, and easy to understand. Find it slow and painful to create HTML? Slow down! That’s right, sometimes the best way to speed up a slow task is to slow down, develop some good habits, and don’t waste time looking for the shortcuts.

P.S. I’m no hypocrite, this set of articles was coded by hand(and rather quickly to, I might add).

Additional Resources:

Here are few links to a few quality resources on the web to helpfully shove you on your merry way towards HTML nirvana.

• HTML Tags Cheat Sheet
• In depth HTML tutorials
• HTML and attributes reference

The basics

<p> </p>
<b> </b>
<i> </i>

Figure 1. Tag Pairs

HTML, as mentioned earlier, is all about defining different areas of content, such as paragraphs, so that your browser knows how to lay out the web page. In order to define these areas, we make use of “building blocks” called tags. With few exceptions(which we’ll discuss later), every tag is actually a pair of tags. One is placed at the beginning of the content area, and a matching tag is placed at the end of the area. Some example tag pairs are shown in Figure 1.

As you can see, tags are defined by <, and >, with the name of the tag being included within those symbols. You will also notice that the name of the closing tag begins with a forward slash (/). Other information can be included within a tag, besides just it’s name, which we will cover later, once we look at some of the most used tags.

<img />
<br />

Figure 2. Unique Tags

Just like everything in life, there are exceptions to the general rule of tag pairs. These tags define their own content, or effect(such as an image or forcing a new line). These tags without a closing tag will have the forward slash at the end of the tag info. Examples are shown in Figure 2.

Now let’s look at some of the most used tags for defining content.

Popular Tags (A.K.A. The Rockstars of HTML)

These tags cover probably 70% of the HTML you will need to know to create/edit your own content. Many, many more exist, and can be found in various references online, as needed.

Notably missing from this list is tables, and lists, to be discussed in Part 2.