To the beginner, designing for the web seems rather daunting. The process can get complicated, but it is not really that hard. There are some things that should be ingrained as soon as possible, however, so that they become habit, or muscle memory.
- File and Folder (Directory) naming
- The most common mistake is including spaces. Just don't. Operating systems generally do not care, but web servers do. If you want a space, use the underscore character instead, as
this_file.html. Case, or capitalization also matters, so use all lowercase (it's easier). And option to the underscore is called camel-coding, as
thisFile.html. This is very common.
- Web also requires the use of file extensions. Operating systems hide this by default, but they can be turned on: Most of the software we use will either automatically choose the correct extension, or will allow you to set it.
- Work Efficiently
- Working efficiently, first and foremost, means staying organized. Only documents and images that are to appear on your site should be in the
Sitesfolder. The local
Sitesfolder needs to precisely mirror the remote one.
- Use the software. Often clicking a button and filling in the blanks is more efficient (and always more accurate) than simply typing. Learn keyboard commands. Hitting ⌘-s is way faster than using the mouse to select from a pull-down menu. Autofill can be your friend, even if it does get a little annoying at times.
- Working with the web, you are often switching between several applications. Use the Application Switcher (⌘-tab). That way, you can leave windows opens where they are, and switch around easily.
- Check and Double-Check
- Writing code is not a singular process. It is a flow of write-test-correct-write-test. As soon as you create and save an HTML document, open it in a browser (and leave it open). As you make changes to the document, save it, and test it in the browser (reload the page : ⌘-r). If something doesn't look right, look at the code first. Syntax coloring (different colors for different parts) might help. Run a syntax checker. Use the web development tool in the browser. Fix the problem then, and move on.