Tutorials:I have only included links to two websites for the sake of simplicity. Joe Brown of HTML Goodies is good at explaining things in plain English, rather than using a bunch of geek-speak, while w3schools goes into more detail, delves more into web standards, and is always up-to-date, which is very important if you are serious about building a good website.
Start with the proper <!DOCTYPE>w3schools.comThere are many different versions of many different browsers out there, and they will all display a web page differently from the next. Using the correct (and complete) doctype will decrease those differences, and can greatly affect how your code will function.
HTML:HTML Goodies -
HTML Goodiesw3schoolsHTML is the foundation of every web page. Your web browser (Internet Explorer, Mozilla FireFox, etc) reads the HTML, then translates it into the pages that we see when we are surfing the web.
Note: I don't recommend putting my tags in ALL CAPS. Follow w3schools' example and use all lower-case instead.
CSS:HTML Goodiesw3schoolsCSS's (Cascading Style Sheet) function is to "style" a web page. Rather than defining and redefining how things should appear over and over again on every single page, you can put all of your style definitions in one file and link to that file from every web page.
Want to change your website's entire look? If make good use of CSS while building it originally, redesigning it can be as easy as changing the one CSS style sheet, rather than re-coding each and every page individually.
Use CSS instead of tables for layout! Not only is it best for the reason above, but it also speeds up loading time and prevents other problems.
JavaScript:HTML Goodiesw3schoolsDo not confuse JavaScript with Java, which is something else entirely.
You can do many nifty tricks with JavaScript, but don't ever rely on it for functionality. People can easily disable JavaScript in their browser, so always make sure to account for those users.
Want your link buttons to change when you hover over them? You can use JavaScript, but I recommend using CSS instead.
JavaScript is a
client side language, which means that the user's web browser translates the code to present us with the pages we see.
Website Accessibility:HTML GoodiesMake your website accessible even to the vision-impaired.
Search Engine Optimization:SEOptimism.comGoogle Search -
WikiPedia: Search Engine OptimizationWant people to find you on search engines like Google? Over-optimizing can actually hurt you, but make sure your site is "Search Engine
Friendly."
Tips: Don't use frames, iframes, or too many tables. Always put "alt" attributes on your images. Write good, relevant content that includes keywords that people might search for when they are looking for something your page offers.
DHTML (Dynamic HTML):HTML Goodiesw3schools -
w3schools -
w3schools -
WikiPedia: Dynamic HTMLDHTML combines CSS and JavaScript, and you can do a lot of interesting things with it. But again, don't ever rely on it for functionality.
PHP:w3schoolsHTML GoodiesTired of adding a link to all of your pages every time you add a new page? With each new page, this job becomes more and more tedious. But with PHP, you can put all your navigation links in one file, then 'include' that file on every page.
With PHP, you can even create your own guestbooks, email forms, or a search engine for your site, among many other things. Many message boards are also written in PHP, but I wouldn't suggest tackling one of those until you've had a few years of experience with PHP and security.
You can also do a lot of things with PHP that you can do with JavaScript, so when possible, use PHP instead.
PHP is a
server side language. This means that your web host's server translates the php code into html before sending it to the user's computer, where the user's browser translates that html into the pages we see. Since it is "parsed" or translated by the server, users cannot disable it like they can disable JavaScript.
MySQL Database:PHP/MySQL Tutorial @ freewebmasterhelp.com
Any use you can think of for a database, MySQL can do it.
.htaccessClockwatchers.comMake custom error pages, redirect people (and search engine spiders) from a page that is no longer there, set a different default page for your website, protect your site from bandwidth theft via hotlinking images, and more.
robots.txtSearch Engine WorldGoogle Search -
Google Search -
The Web Robots Pages -
JavaScript KitWant to block specific search engine (or other) bots from crawling your pages? robots.txt is the first place they'll look. If they don't find one, then any page they can access is fair game.