Introduction
If you are just diving into the world of web design/development, it is important to get started in the right direction by building a foundation of knowledge that you can grow from. This is a guide geared toward those that like to learn on their own and appreciates quality material when they find it.
I have been a webmaster for over 20 years and the tools and widgets used has changed over the years as well. For example, back in the days before broadband, it was common practice to cut a image into pieces(squares) so that the webpage would load faster, you would see the image forming in the web browser square by square. Adobe Photoshop 6.0 had a separate tools to do just that, or you could use a GIFSlicing utility from TuCows. Now-a-days, with broadband, those kind of tools are no longer used……. But,
The one constant when building websites is the power of plain text. Working in plain text directly with HTML Markup, CSS Style Properties, and/or PHPCode allows for freedom that WYSIWYG editor do not. Just to be clear, I have seen great websites built with WYSIWYG editors and in certain situations it is just easier when dealing with a simple one or two page website. Yet, a true WebMaster Ninja will harness the power of plaintext editing.
My number one, top of the list suggestion for anyone just learning how to build websites and looking for a good place to start. Give yourself 30min to an hour and go thru the tutorial listed below and start your journey to becoming a WebMaster Ninja. I also use a few other tools, I will list them below as well.
WebMaster ToolBox for Beginners
Starting with HTML + CSS Tutorial:
- URL = http://www.w3.org/Style/Examples/011/firstcss.en.html
- DESCRIPTION: Excellent, easy to understand, solid tutorial you can actually build up from within 10min — 45min.
- RECOMMENDATION: I consider this tutorial to be hands down the number one tutorial for anyone starting out in building websites. I would consider this tutorial to be the definitive guide for anyone just starting out. Directly from the W3C led by Web inventor Tim Berners-Lee and CEO Jeffrey Jaffe, If this tutorial is good enough for the inventor of HTML then I think it is a worthy place to start. It will guide you step by step, laying the foundation you will build on for years to come. It is a must read for webmaster at all levels. Install RapidPHP and following along with this tutorial and start your journey.
RapidPHP Software:
- URL = http://www.rapidphpeditor.com/
- DESCRIPTION: Professionally written software, very intuitive and loaded with features. it is not free, but well worth the money if your just starting out, will use it for years to come.
- RECOMMENDATION: With the need to see your code quickly without having to install a full blown Apache+MySQL+PHP (AMP), also known as WAMP, W=Windows=WAMP Webserver on your own computer. RapidPHP can be install on your desktop or laptop and you can see your css, html, and php code as it would appear on a webserver using the built in preview panel. It is also very lightwieght, quick to open, snappy controls, and UI feedback. I highly recommend using RapidPHP and following along with above tutorial. Give yourself a good hour to go thru the above tutorial and you will actually be up to speed and building a pretty good website. Lastly, you will be able to move right into php smoothly dispite the name, RapidPHP is design to work smoothly with all three HTML + CSS + PHP.
- SPECIAL NOTE: To work with php will need to install php locally. RapidPHP has done all the heavy lifting and provides all the details HERE. It is a easy download and install.
- To enable the built-in web server:
- On the Options menu, click Preferences.
- Under Preview – Mappings uncheck Use mappings;
- Under Preview – Script Preview check the option Use built-in web server;
- Click Web Server Settings and specify the path to php-cgi.exe file. If you do not have the PHP interpreter on your computer, you must download and install it. Click here to download a self-installing PHP package.
After completing these steps, your computer should be set up and ready to preview the PHP (or eRuby) files using the built-in web server.
- To enable the built-in web server:
Good Luck!
