Archive for the ‘Build Your Own Website’ Category

Just Get It Moving!

Saturday, October 25th, 2008

The hardest part about a do-it-yourself Web design process is often just getting started. It’s easy to be intimidated by the code you’ll need to learn, and the whole process can certainly look like a BIG job when you’re staring at that blank HTML document.

But the fact is, Website creation is not hard at all. And like many creative processes once you start moving forward things just begin to fall right into place.

So the best way to get started when you want to build your own site is to just jump right in. Don’t worry about having all your details in order; just open up your favorite HTML editor and start plugging away.

You can always use reference material to guide you as you work. The most critical step in the process is typing that first line of code because unless you do that, nothing else is going to get done!

If you’ve been thinking about building your own site for a while but haven’t taken action yet, set your start date right now and stick with it. The sooner you get started, the sooner you’ll have your first site and that’s a very cool feeling.

If you need a great instructional resource download your copy of my Website design course for beginners. Or by all means check out the new Gold Member Program and get access to our in-depth video tutorials on Web design and online marketing.

Build a Web Page Using Modules

Sunday, October 5th, 2008

In the same way modular homes are easily assembled using a set of independent sections, or modules, the Web design process can be made much simpler using pre-built elements.

The idea is to create a set of modules that you can pull together for any future design projects. You might use only a few modules per project, or you might use all of them at some point on every page you build.

The basic list of modules you might create are:

- Head

- Body/Table

- External Stylesheet

- Standard Includes

- Menu Blank

Begin by populating your document head with the relevant data, and then save your progress. Then go back and strip away the unique attributes, leaving only the raw tags.

For instance, delete the text between your title tags, and remove the info in your META tags, leaving only the HTML tags in place. Now save this document as head.html; it will look something like this:

< head >
< title > < / title >
< META NAME=”Description” CONTENT=”" >
< META NAME=”Keywords” CONTENT=”" >
< / head >

You have just created a head module you can use as the base for all future templates. And since you saved your initial document you can simply open it back up and continue working.

Use this modulation for any specific parts of a page you think you’ll be using often. As we’ve already indicate above you should set up modules for your page body, including at least one type of table module.

Also you should have a base CSS stylesheet that you can open and begin adding data to for any design project you start. If you use server side includes to parse your menus and Adsense blocks you should also have a baseline code for your includes commands as well.

And of course you should have multiple blank menu modules that you can copy and paste into a new design scheme as you go. This will save you loads of time and allow you to just plug in the custom fields such as button title, page URL, etc.

By having half a dozen or so modules available to you, any design project can be launched quickly and easily. You just open up your selected module files, begin copying and pasting, and soon you’ll have your base template document ready for custom coding.

I have found this simple technique can shave off at least an hour of any Web design project and sometimes much more. And by arming your employees or outsource agents with your module suite you will be able to get more bang for your buck in terms of hired labor.

You can even use the module formula for add-on elements like ad blocks, banner rotators, email forms, hover pops, audio players, and more. In fact the more pre-built modules you have for these elements the more likely you are to use them freely on your Web pages.

It’s easy to get lazy after a couple of hours of coding and decide to skip a few special features. But if all you need to do is open the audio module to get most of the legwork done odds are you’ll follow through with it.

The modulation approach can also be sued with WordPress blogs. You can and should have an “installation notes” document that has your entire ping list, specific plugin settings, Technorati Faves code, and any other standard elements you include with most blogs. This can make the process of setting up new blogs quick and easy, even without the use of expensive management software.

Put these simple ideas to sue in your own design work today and enjoy the immediate spike in productivity they are sure to create.

We would love to help you learn Web design with our comprehensive Web Design Course. We now offer video training as well through our special Gold Member program - Click Here Now to get full details on our video Web design training!

Build a Web Page One Piece at a Time

Saturday, September 27th, 2008

The best tip for beginning Website developers is to take things one step at a time. It’s easy to become overwhelmed by the thought building an entire Website, so just look at each task in the process as individual projects.

Every HTML document consists of two parts, the head and the body. The head contains your HTML title, META tags, and other relevant data. The body area contains the part of your Web page that will be publicly visible. These two distinct parts of your document represent two separate steps in the building process.

You can break things down further by itemizing each major piece in the head and coding these step-by-step. For instance, you’ll enter your title tag details, style sheet reference, and the META tags you have chosen to use.

Do the same with your body. Create your main table or div elements, and then slowly work your way inward.

Save your progress after each tag or attribute you enter. This will allow you to avoid the chaos of having to start over in the event your work is interrupted by a power surge.

Also, you can leave hard return spaces between lines of code in your HTML editor. These won’t show up as extra spaces on your public HTML page, and they make it easy for you to find specific areas when you need to make changes or updates.

And you can use the comment tag to make notes to yourself that will only be visible when viewing the raw code. This is helpful for breaking the document up into more manageable sections.

Through practice you will begin to see the overall document clearly. The initial sense of anxiety and confusion that comes from opening a piece of raw code and trying to find your way around will pass.

Quickly and easily learn Web design with the author’s amazing online course. You’ll be an ace Webmaster in no time with this full-blown Web design course at your disposal.