Yes, dear reader, you need a website. Students and businesses especially benefit from websites, but potentially anyone can, depending upon your needs and intentions. The internet is an interesting space for a few reasons. First of all, it’s still young and therefore much of its potential is untapped, so now is a good time to get your head in the game (apologies on the sports reference) to see how your brand and your ideas can grow and spread influence. Also, there is the possibility of connecting with a huge global audience from wherever you currently are. This allows you to easily market your skills and your thoughts through a dynamic and interconnected platform. Lastly, a website is another kind of forum to show not only your mad skills, but also the value you place on those skills. Websites, when well done, are professional and even authoritative.

A couple of weeks ago, I watched the CEO of the company I used to work for speak at O’Reilly Media’s Web 2.0 Expo. No, I wasn’t actually there. But I watched online. And what was so interesting to me was the capacity of the internet to not only connect humans, but create interesting business opportunities for thinkers and entrepreneurs. (I especially loved Jen Beckman’s 20×200 Project, which brings art into the homes of anyone with twenty bucks.)

Ok, that concludes my sales pitch to you. And because a website can be a daunting task even to the initiated, here is a Three Phase Guide to DIY Website-Put-Upping (a term stolen from this human). (Disclaimer 2: This guide isn’t going to teach you code or hold your hand through the process…but it will give you guidance on how you can develop your web presence.)

Phase I // The Free Situation

One of my good friends started a blog recently and asked me for some thoughts before getting everything set up. “Buy a domain name and host,” I told her. And after 45 minutes of discussion, I realized I was completely wrong. The first step in getting a website together is to familiarize yourself with the web, with the dynamic interaction and space of a blog (if that’s the direction you’re going in, which I think you should as many of the trends in web technologies lean towards the interactive end of things). Another reason to use a blog form is that humans are increasingly expecting websites to have fresh and changing content on the home pages of the sites they visit. Think about it. What sites do you visit and why? (Seriously, I’m curious.) Encouraging users to return to your site is an increasing point of marketing leverage (and eventually financial leverage), so one way to facilitate this is to regularly update content. In other words, getting humans (traffic) to click through (page views) and enjoy your site (time spent) gives you the opportunity to eventually make money from your site. And the larger the community, the more interesting you look to others (like employers). So, then, how to do this?

There are several publishing platforms that allow you to set up shop for free and even have some control over the look and feel of how the site is used. Basically, all of these platforms allow you the technology of a blog (publishing/posting content, receiving comments) while also allowing you to post other pages of content, such as portfolio images. All you need to do is sign up for a username and blog with one of the following platforms:

• WordPress – frequent choice for designers
• Typepad – simple layout and notable for user Seth Godin
• Tumblr – increasing in popularity, known for user-friendliness and simple design
• Blogger – popular among more individual blogs, often personal, sometimes awesome/hilarious
• Moveable Type – one of the originals

Make sure, too, to look through the themes in each platform, choosing the one most suited to your needs. Points of consideration are: number of columns, header size, location of sidebar, etc. And remember, as with any of these topics, if you get stuck or have a question, Google the question. It’s more than likely that a discussion forum addresses the issue.

Phase II // Learn Some Code (Seriously.)

While you develop your blog, I recommend learning some simple HTML and CSS code. Code is what websites are made of and is the most basic language of the web. Basically, there is a universal language which web browsers (like Firefox, Safari, and to a lesser extent the cursed Internet Explorer) can read and translate into pretty websites.

HTML stands for HyperText Markup Language. It’s a kind of beautiful, logical language that you can compose into what’s called a text editor (Text Edit on macs, Notepad on PCs, Dreamweaver on both), and as pages of HTML are created and compiled into a folder on your computer, a website is built. Within each page of code, HTML is a series of tags that tell the browser how to read and translate the text. Like if I want to create a link, there is an anchor tag defining text to be linked and where to link it to. To give you a very brief and inconclusive idea of what HTML looks like (color coded, which hopefully helps):

CSS refers to Cascading Style Sheets and basically styles the HTML code throughout the pages of your website. For instance, in this article, you see the headings of each Phase, yes? The size, color, style and weight of the font is determined in the style sheet. If I wanted it green, that could happen. Or magenta, or whatever. This way, the heading is uniform throughout the site and anytime I want to use that specific heading, I can use the tag that I’ve defined in the style sheet. Make sense?

A note on Adobe’s Dreamweaver. Dreamweaver is a software that allows you to create the content (HTML/CSS/Other languages) for your websites in either a visual editor or directly using the code editor. It’s like writing the code v. trusting a machine to write it for you. Don’t use the visual editor. The visual editor often creates sloppy, conflicting code that ultimately causes problems in websites. So, Dreamweaver is an excellent tool, but should not be used as a crutch for web design.

All web content is standardized (to some extent) by the World Wide Web Consortium, and therefore all of the information you need is on their website. However! The site is often very technical and hard to decipher, particularly for the novice. So check them out, but don’t rely on them to walk you through site-build.

Code is beautiful. Is poetry. Don’t be scared of it. In addition to the comprehensive help from Adobe’s tutorials, there are a ton of forums, books and websites to help get you started:

• Books

Learning Web Design: A Beginner’s Guide
Creating a Website: The Missing Manual
HTML5 for Web Designers

• Websites
  A List Apart
  Ellen Lupton’s DIY Web Design – also a book
  Lynda.com – costs money

Also, when Googling your questions, make sure to look for YouTube videos that might help along the way. (Does this article feel like a Zelda note to anyone else?)

Phase III // Putting it All Together

So. Now you understand the blogosphere and you even know some code. It’s time to design your very own [beautiful, mind-blowing, fantastical] website, with a blog. Here are the steps to working on your blog as I see them:

• 1. If you choose WordPress, buy a copy of Scott McNulty’s Building a WordPress Blog People Want to Read (buy the book from his site to give him a kickback; McNulty also has a Typepad version of this)




• 2. Find blogs whose designs and functionality you like and write down why. Seriously, this helps. Sites like Technorati and Google Blogs might help you too. Look at the footer of each site to figure out if the actual blog designer is listed. For example, my blog is powered by WordPress and the design was originally by The Masterplan (Arun Kale) and uses his The Morning After design. I removed a credit for him though, because I changed the design so much. Nonetheless, this was a good starting point for me.




• 3. Draft sketches of what you want the design on your blog to be. I sometimes use Adobe Kuler to help come up with color schemes.




• 4. Buy a domain name and host. A domain name is your URL (uniform resource locator) and allows people to find you by a) Being memorable and b) Increasing your popularity in searches. So, make sure the name is fitting, recognizable and anti-trendy, meaning, you don’t want it to fade out in a year or two or five. Like neon trapper keepers. You can register your domain name with the same company you can buy hosting service from. Hosting is buying space on a server, that allows you to connect with other computers (ie. the Internet). I personally am a happy customer of GoDaddy but have uniformly heard terrible things about their service and support. I’ve heard excellent things about Fat Cow…including that they use 100% wind energy, good things about Just Host and Host Gator too.




• 5. You’ll need an FTP Client, or a program that allows you to upload your files easily from your computer (local) to your host’s server. Host’s often have this functionality on their websites, but it might be more convenient to have the technology on your computer. My favorite is Transmit but it costs about $34, so you can try Cyberduck, which I also use, or Filezilla for free. Make sure you’re using software that works with your platform, Mac or PC.




• 6. Once you’re all set up with these steps, it’s time to download the files of the theme you like. You did choose a theme, right? Basically, you can go to the designer’s site of the theme you like and download a series of files that you will tweak and upload to the server.




• 7. The books and sites mentioned in this article will tell you more about how to edit your code and design your site, but basically, you’ll be working largely with CSS (style sheets) to edit PHP (a complex, dynamic coding language, which blogs use).




• 8. Lastly, set up your social media sites to help promote your work/site/thoughts and earn traffic on your site. Use things like Twitter, Facebook, LinkedIn and Flickr.

Again, this article is meant as a kind of overview of your website rather than a detailed handbook, with the intention of getting your blog/site started. These are the steps I took for my site, and will certainly evolve more over time. Do feel free to share your own insights in the comment space, or email me, with questions, thoughts and more ideas. Mail is excellent.

Some other thoughts:
// Web Design Trends for 2010 (Web Design Ledger).
// Problogger (How To Info for Blogs) – and a book too!
// Stop Procrastinating and Start Your Blog (Jennifer Blanchard on Problogger)
// 9 Critical Tasks Before Launching Your Small Business Blog (even if you’re a student looking to start your portfolio site, you are a small business, friend)
// 51 Steps to Launch a Hot Blog