How to Design a Website from Scratch

First, you will need a text editor such as TextMate for Mac, Notepad or PHP Web Designer 2007 for PC. There are also two things you must learn after you read up on how to design a website. Those are:

1. Learn XHTML.
2. Learn CSS.

These two components are essential to building a solid website. If you build a large business website without knowing XHTML and CSS, you will be banging your head on the desk from troubles with cross-browser compatibility, search engine optimization, maintainability and more later down the road. If you need help learning XHTML and CSS, you can visit W3Schools or search for tutorials on Google. They aren’t very hard to pick up, and I can show you what your starting XHTML/CSS code will look like if you visit this test page.

That is the core part of any webpage. None of it should be left out, however you can always use a separate file for styling called a style sheet so the top of your webpage doesn’t have a bunch of styling in the header. Most of the what you will be editing will be inside the body tags, such as adding layered divs, images, text and hyperlinks.

After you are somewhat familiar with XHTML and CSS, you can find XHTML/CSS layouts so you don’t have to re-invent the wheel. There are some that are better than others and just make sure that the layouts you find use layered divs instead of tables. Layered divs may be harder to learn, but they save a lot of time down the road. You can use the layouts as a starting point to building your webpage. Some things to remember while building your first web pages are:

• Use heading tags (h1, h2, h3). Search engines place more weight on keywords in these tags. Make sure not to overload your pages with keyword phrases, however.
• XHTML is only more cross-browser friendly if you close all of your tags. If you comply with this standard you will have an overall better website.
• Try to substitute text for images when possible. Less images means less loading time and more content for visitors and search engines.

After you create your new XHTML/CSS webpage using my tutorial on how to design a website, you can validate them at validator.w3.org to make sure they are compliant with XHTML transitional.

In order to create dynamic, interactive pages you need to learn a programming language such as PHP. PHP is used in conjunction with a MySQL database if you need one to provide more functionality such as an online store, blog, or just for capturing visitor information. I use a PHP framework called CodeIgniter that takes care of the basics when it comes to building websites such as session handling, database connetion and data retrieval, and also provides you more organization when building websites. If you want to learn more about CodeIgniter, read my article about building your first PHP web2.0 app.