Since these threads pop up almost on a daily basis, I thought I'd post a sticky thread for advice for beginning (and not-so-beginning) web designers. Feel free to post suggested changes and links at liberty and I may add them to these two posts.
Understanding the Web as a Medium
Television is a medium. Print is a medium. Radio is a medium.
The web is also a medium. As an interactive information medium, the beauty of the web is it can do this instantaneously, globally, and to a variety of devices (a.k.a. user agents) like web browsers, iPhones, Nintendo Wiis, as well as assistive technology for the disabled such as screen readers.
What Makes a Web Page?
There are three standards at work on any given web page.
- HTML (Hyper-Text Markup Language)
HTML is a markup language (it's right in the name). To "mark something up" is to give it semantic and structural meaning. Markup is used to show relationships between items of content and describe that content.
When writing HTML don't think about "what do I want this to look like" - think about "what does this mean." This is what people mean by "semantics."
- CSS (Cascading Style Sheets)
CSS is a presentational language. It is used to alter the visual (and aural and printed) appearance of a web page. Fonts, colors, borders, padding, margins, layout, positioning - these are all handled by CSS.
People used to use HTML tables to lay out web pages. This practice is out of date and frowned upon by the professional web development community. CSS was introduced in 1996 to provide web designers a way to make their websites look attractive.
Due to browser limitations, it wasn't until the first years of the 21st century when we were able to use it more-or-less as it was intended! In other words, there has been no excuse to use a table-based layout for at least 5 years.
- DOM (Document Object Model)
If you can imagine an HTML document as a nested tree, then you have an understanding of the DOM. Don't worry too much about it until you understand the first two.