Here I will describe some of the technologies I have been studying for the last couple years. Of course, this list is not exhaustive by any means.
I will start with the basics here, and hopefully write about some of the programming and database technologies I use soon.
Basic Website Technologies
HTML (Hypertext Markup Language)/XHTML (Extensible Hypertext Markup Language)
The main infrastructure of web technology is HTML. When I started building websites, I was amazed to find out that so much can be done in Notepad or any other text-editor! You can write all the HTML in a text document, change the file extension to .htm or .html and then open the file in a browser. It works!
There are plenty of WSYWIG (What You See Is What You Get) editors out there. I personally like to write my own HTML code rather than use WSYSWIG so that I have full control over the website design. When my website does not work in a certain browser, I have the control to tinker and eliminate problems. Also, when something does not work, I can take full responsibility rather than blame a piece of software because I trusted it to do what I wanted.
For the best place to get started learning HTML (as well as several other technologies), I highly recommend w3schools.com. They do a great job setting a solid foundation from which to build, and they have several resources and when you need to find out what a tag does, or what your options are.
As good practice, I used HTML strictly to set the structure of my website and add content. Separating presentation and content is very helpful as I will explain with CSS below.
CSS (Cascading Style Sheets)
Before CSS was created, all aspects of presentation (fonts, colors, sizes, alignments, and other formatting) were listed inside the HTML tags using attributes. When building a themed website, each page would have to be created in a similar way. If the background color were to be changed from red to blue, this would mean every single page would individually need to be edited.
CSS is glorious! Now HTML can be used to contain mostly the HTML tags and the content of the web pages. A single CSS file can contain all the formatting necessary for an entire website and each HTML page simply needs to have a link to the CSS file.
Alternatively, several style sheets may be used for a website. I like to have one style sheet describe positioning, sizes, and fonts and I have other style sheet describe different color schemes. This allows me to easily change “themes” for different parts of a website while maintaining a consistent infrastructure. As another option, different style sheets can be used for different types of browsers, such as a desktop/laptop, a mobile browser, or a printer.
There are several browsers out there. The main ones I have installed on my machine are Chrome, FireFox (FF), Internet Explorer (IE), Opera, and Safari. I love using the Google Chrome. It is simple and fast, which I really enjoy.
I started using Opera a little when dinking around. I really like how fast and smooth it works. I was really impressed with my first impressions. Since I was already using Chrome, I did not see a strong advantage to switching, but I would have if I had not met Chrome first.
FireFox is pretty neat. FF is definitely better than IE. Their FireBug plugin is a definite must-have for any web designer or developer. FireBug lets you look at the different elements of the rendered webpage and see what tags and styling were used. This tool has helped me in many, many instances where I could not figure out why parts of my site looked the way they did.
Internet Explorer is burly and sluggish. I tend to only use it when I need to access SharePoint or other sites that were built to work with IE. Also I use it just to see what 40-50% of the people out there will see since IE is still pretty popular.
I have not worked with Safari much.
Later I hope to do some summaries of the more advanced technologies I have been using, such as client-side and server-side programming languages and databases, which I really enjoy working with.