Smashing Magazine ~ we smash you with the information that will make your life easier. really.
Smashing Magazine we smash you with the information that will make your life easier. really.

Tutorials Round-Up: Ajax, CSS, PHP and More

Advertisement

Coding or designing a page, it’s always nice to have some basic templates you can quickly modify or adapt to your needs. However, at least once you have to know, how to create this “universal” template. In this case tutorials prove to be an ultimate solution, particularly if you just want to get an idea how something works and where to start from. In fact, you don’t have to re-invent the wheel all the time - you can use existing solutions, modify and improve them and publish them as well - just the way other people did it for you.

In this post we’ve covered over 200 Ajax, CSS, Flash, JavaScript, PHP, MySQL, RSS, XML as well as ASP, C++, Perl, Python and Java tutorials. You can also check out our list of Photoshop tutorials we’ve published before.

Update (27.01.2007): LISP and Ruby tutorials were added.

Ajax

CSS

  • Advanced CSS Layouts: Step by Step
    By Rogelio Vizcaino Lizaola and Andy King
  • Beginner’s guide from a seasoned CSS designer
    Cameron Moll - Authentic Boredom
  • CSS Advanced Guide
    The CSS Advanced Guide is for those who want to push CSS to the extreme, highlighting methods that might not be immediately obvious to the intermediate developer.
  • CSS and HTML examples and tutorials by Ove Klykken
    Advanced CSS demos and bug reports
  • CSS Basics.com
    Making Cascading Style Sheets Easy to Understand
  • CSS Beginner’s Guide
    CSS, or ‘Cascading Styles Sheets’ are a way to style HTML. Whereas the HTML is the content, the style sheet is the presentation of that document.
  • CSS Demonstrations and Tutorials
    CSS and HTML examples, demonstrations and tutorials
  • CSS Drop Shadows
    A List Apart Tutorial by Sergio Villarreal
  • CSS Intermediate Guide
    Like the HTML Intermediate Guide, this CSS Intermediate Guide should not be that difficult, but rather build on the basics of the CSS Beginner’s Guide.
  • CSS Layout Techniques: for Fun and Profit
    A resource for web designers and developers who want to learn CSS layout techniques to replace archaic table-based web page layouts.
  • CSS Menu Tutorial
    Horizontal and Vertical CSS Menu Tutorials
  • CSS Tutorial
    CSS Tutorial von w3schools.com
  • CSS TUTORIAL
    The Complete CSS tutorial
  • Floatutorial: Step by step CSS float tutorial
    Floatutorial takes you through the basics of floating elements such as images, drop caps, next and back buttons, image galleries, inline lists and multi-column layouts.
  • Learn CSS Positioning in Ten Steps
    This tutorial examines the different layout properties available in CSS: position:static, position:relative, position:absolute, and float
  • Listutorial: Step by step CSS list tutorial
    Listutorial takes you through the basics of building background image lists, rollover lists, nested lists and horizontal lists
  • Selectutorial - CSS selectors
    Selectors are one of the most important aspects of CSS as they are used to “select” elements on an HTML page so that they can be styled.
    Find out more about selectors including the structure of rules, the document tree, types of selectors and their uses. There is also a step-by-step tutorial showing how selectors are used in the process of building a 3-column layout.
  • Site in an Hour
    by Andrew Krespanis - Making Simple Work of Complex CSS Layouts
  • Stylemaster CSS Tutorial
    hands on css tutorial - This tutorial teaches CSS using both hand-coding and Style Master for Windows.
  • Online tutorials
    The House of Style has several cascading style sheets tutorials, with explanations, excercises and worked examples to get you up and running with style sheets as quickly as possible.
  • Stylesheets
    Cascading style sheets tutorials and style guide
  • Top 10 CSS Tutorials
    There’s a lot of really cool things that can be done using CSS and I’ve found some of the following resources to be very helpful to inspire ideas and learn new techniques…

CSS Techniques

Lightboxes & GreyBoxes

  • Greased Lightbox
    Joe Lencioni’s Greased Lightbox is a Greasemonkey/Creammonkey/Opera user script designed to enhance browsing on websites that link to images such as Google Image Search, Flickr, Wikipedia, Facebook, MySpace, and deviantART.
  • GreyBox
    A pop-up window that doesn’t suck. GreyBox can be used to display websites, images and other content in a beautiful way.
  • GreyBox 3D
  • Greybox Redux
    Completely unobtrusive - no need to embed Javascript into your site.
  • Leightbox
    Simon de Haan · Eight Media
  • Lightbox JS v2.0
    by Lokesh Dhakar
  • Lightbox Gone Wild!
    Particletree - Chris Campbell
  • Lightbox Plus
    takuya otani - Lightbox JS is very cool and useful script to display an image on the page
  • Litebox
    Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving us the basic tools we need to make this work and you the ability to expand.
  • Multifaceted Lightbox
    A script (JavaScript) that allows you to focus the users attention on a particular portion of the screen. It creates the equivalent of a modal dialog box - this means that while the user looks at this focused part of the screen, they can’t interact with the rest of the screen.
  • Slightly ThickerBox 1.7
    Slightly ThickerBox is a modification of Cody Lindley’s Thickbox script
  • Suckerfish HoverLightbox
    Jonathan Christopher
  • ThickBox - One box to rule them all.
    My version of the Lightbox technique includes functionality similar to that of the Greybox technique. That is, ThickBox can show html pages as well as images. The html that is shown inside ThickBox is pulled from the server using AJAX (really AXAH). I would like to think that my twist is bridging the gap between Greybox and Lightbox functionality.
  • WP lightbox JS WordPress plugin
    WP lightbox JS is a WordPress plugin that enable you to use lightbox JS script to overlay images on the current page. This plugin also adds a “Lightbox JS” quicktag to the post window in the WordPress admin section.

Firefox

  • Firefox 2.0 Tutorial: Add New RSS Readers or Change the Default Feed Reader
    How to subscribe to a feed using Bloglines/Google Reader/My Yahoo inside Firefox 2.0 …
  • Firefox Extension Development Tutorial
    This tutorial has been created for individuals wanting to develop full-featured extensions for the Mozilla Firefox browser. The tutorial has been constructed as a step-by-step guide providing many examples, explanations, and external references to help the reader have a full understanding of extension development.
  • Firefox Statusbar Tutorial
    How to add stuff to the statusbar in Firefox/Mozilla
  • Firefox Toolbar Tutorial
    This tutorial explains how to create a toolbar extension for the Firefox web browser (specifically for version 1.5 and later).
  • How to create Firefox extensions
    Basically, this tutorial will show you how to create your first extension from scratch. Since every programmer always learns from the famous Hello, world! example, I figured that would be a good way to introduce you to developing extensions.
  • How to make your own toolbar in Firefox/Mozilla
    In addition to the Mozilla XUL read write local files tutorial - where we created a simple XUL page with a textfield, which text can be saved to your local harddisk. Now we create a simple toolbar for the Firefox browser. This toolbar is installed as regular extension via a XPI installer file.
  • Learn to Create a Firefox Search Plugin in Less Than 2 Minutes
    This tutorial will show you a very simple Firefox hack that allows you to search any blog straight from the Firefox search bar without having to visit the actual blog. And there’s something for IE users as well.
  • Your First Firefox Extension
    Firefox’s extensions add specific functions, things the creators never intended, neatly integrated into the browser. Now you can learn how to make your own.

Flash

  • Flash and ActionScript Tutorials
    Learn how to use Flash to create everything from simple animations to complicated ActionScript projects by following the easy-to-learn tutorials found on this page
  • Flash Kit Tutorials
    An online resource for Macromedia Flash development. Read the latest Flash news and tutorials, and download our free FLAs, SWFs, and sound loops
  • Flash MX Tutorials
    1421 Flash Tutorials
  • Flash Perfection Tutorials
    Enjoy learning Flash with our incredibly diverse collection of Flash tutorials. Flash tutorials are broken into comprehensive and easy to browse categories
  • Flash Tutorial
    In our Flash tutorial you will learn how to start using Flash in your applications.
  • Flash Tutorials
    451 Tutorials
  • Tutorials - ActionScript.org
    The site includes thousands of tutorials, open source movies and scripts, support forums, reviews, scene news, a fully featured Flash jobs and employment section and much more
  • Ultrashock Tutorials
    We are collaborating with some of the top professionals & institutions to bring useful and unique resources to the web. You will find information in this section which you may refer to often to gain an understanding of the concepts and useful techniques behind the tools used.

Forms

HTML

  • Character Sets & Encodings in XHTML, HTML and CSS
    Tutorial on how to markup up XHTML, HTML and CSS pages with information about character encodings, and how to use character escapes.
  • HTML Beginners Guide
    How to make web pages - A good practice guide to HTML and CSS.
  • HTML Intermediate Tutorial
    Whereas the purpose of the HTML Beginner Tutorial was to teach the bare essentials, this guide adds a few nuts and bolts, which shouldn’t be particularly difficult as such, but will add a bit more to our understanding of HTML and enable us to do a few more things.
  • HTML Advanced Tutorial
    The aim of the HTML Advanced Tutorial is to show how to fully exploit the features of HTML and how to optimise it for accessibility.
  • HTML Code Tutorial.
    Our goal is to provide the most helpful and complete guide to creating web pages anywhere
  • HTML TUTORIAL
    The pages are packed with: Easy to understand explanations, massive examples, tips, smart workarounds and useful quick references.
  • HTML Tutorial - Basic & Advanced
    In this HTML tutorial you will learn how to use HTML to create your own Web site.
  • HTMLSource : HTML Tutorials
    HTML tutorials and well-researched links on all aspects of web design, equally suited to beginners and advanced webmasters
  • Starting with HTML + CSS
    W3C: This short tutorial is meant for people who want to start using CSS and have never written a CSS style sheet before. It does not explain much of CSS. It just explains how to create an HTML file, a CSS file and how to make them work together.
  • Tizag Tutorials
    Tizag was designed to teach beginner web programmers how to use HTML and CSS….
  • XHTML Tutorial
    XHTML is a stricter and cleaner version of HTML. In this tutorial you will learn the difference between HTML and XHTML. We will also show you how this Web site was converted to XHTML.

JavaScript

RSS

  • Ajax RSS reader
    Learn how to build an Asynchronous JavaScript and XML (Ajax) Really Simple Syndication (RSS) reader, as well as a Web component that you can place on any Web site to look at the articles in the RSS feeds.
  • PHP and RSS: Getting it together
    This article explains the basics of RSS, some of its many uses, how to use PHP to create an RSS feed from a database, and how to use the XML_RSS module to read an existing RSS feed and translate it into HTML.
  • Pete Freitag - Howto Create an RSS 2.0 Feed
    If you can learn HTML, you can easily learn how to build your own RSS 2.0 feeds. I’ll take you through the steps to creating an RSS feed from scratch.
  • RSS Tutorial
    This tutorial explains the features and benefits of a Web format called RSS, and gives a brief technical overview of it. It also includes information on a similar format called Atom.
  • RSS Tutorial
    There are many resources on the Web for RSS. This tutorial emphasis the benefits of RSS, and how they can be realized. This tutorial refers to other sources for RSS History, Background, and Technical specifications.
  • RSS Tutorial
    Tutorial von w3schools.com
  • RSS Workshop
    In this workshop you’ll learn how to create, validate, parse, publish, and syndicate your own RSS news channel. The emphasis will be the practical application of the two most popular varieties of RSS for dynamic publishing.

Ruby

Programming

ASP

  • ASP.NET 2.0: A Getting Started Guide
    “Are you ready to take off into the wide blue yonder of ASP.NET 2.0? Join Cristian and Zak on this eventful ride: you’ll tame the installation process, sink your teeth into two ASP.NET languages, and conquer .NET programming basics with your bare hands. Finally, you’ll pull server controls, user controls, master pages, and CSS into the beginnings of an application that will see you land safely - and without casualties - at the start of a brilliant career in ASP.NET programming.”
  • ASP.NET 2.0 QuickStart Tutorial
    The ASP.NET QuickStart is a series of ASP.NET samples and supporting commentary designed to quickly acquaint developers with the syntax, architecture, and power of the ASP.NET Web programming framework…
  • ASP.NET 2.0 Tutorial
    The tutorial is designed for college-level classes in Web Development; however, it is available to anyone with an interest in learning ASP.NET 2.0 from the ground up. It is not designed as comprehensive coverage of ASP.NET 2.0. It presents features and techniques to apply this Web development framework to produce applications of a generally useful nature. It is a learning resource moreso than a reference source.
  • ASP Introduction
    Learn how to program Active Server Pages (ASP)
  • ASP Tutorial
    In our ASP tutorial you will learn about ASP, and how to execute scripts on your server.
  • ASP Tutorial
    Active Server Pages tutorial for beginners

C/C++/C#

  • C Tutorial
    Blog on C and C++ - Learn C in 19 Lessons “This website will provide you with lessons and quality material to learn basics of C language programming in just a few days.
  • Sams Teach Yourself C in 24 Hours
    Written in a plain and clear format, this book is designed to help you learn the C programming language as quickly as possible.
  • C++ Language Tutorial
    These tutorials explain the C++ language from its basics up to the newest features of ANSI-C++, including basic concepts such as arrays or classes and advanced concepts such as polymorphism or templates. The tutorial is oriented in a practical way, with working example programs in all sections to start practicing each lesson right away.
  • Teach Yourself C++ in 21 Days
    This book is designed to help you teach yourself how to program with C++. In just 21 days, you’ll learn about such fundamentals as managing I/O, loops and arrays, object-oriented programming, templates, and creating C++ applications–all in well-structured and easy-to-follow lessons.
  • C++ Programming Language Tutorials
    These tutorials were developed as part of a series of courses on C++ I taught at the University of California, Irvine, Washington University, St. Louis, and Vanderbilt University. I’m making these tutorials available on the Web for anyone who is interested in teaching or learning about C++.
  • C++ Programming Tutorials
    Understandable C++ tutorials (covers most of basic C, except i/o). Includes basics, pointers, arrays, classes and structs, recursion, linked lists, encryption, OpenGL graphics, and more.
  • C++ Programming Tutorials - Learn C++
    C++ Tutorials, Pointers and Dynamic Memory Allocation, Debugging, Standard Template Library (STL), Free C++ Compilers, C++ Tips and Tricks
  • C# Practical Learning
    This site offers Lessons, examples, and links on the C# programming language
  • C# Tutorial
    This is a set of lessons suited for beginning to intermediate programmers or anyone who would like to gain familiarity with the C# programming language. These lessons will help you get a quick head-start with C# programming.
  • C# Tutorial
    This tutorial covers Microsoft’s programming language C#. It is aimed at people with some programming experience, although it tries not to assume too much knowledge.

LISP

Java

Perl

  • Beginner’s Introduction to Perl
    The first part in a new series that introduces Perl to people who haven’t programmed before. If you weren’t sure how to get started with Perl, here’s your chance!
  • Introductory Perl Tutorial Course for Windows
    This introductory Perl tutorial course for Windows will introduce you to the beginning concepts of Perl in a familiar Windows environment and show you how to set it up for CGI with Microsoft’s Personal Web Server or Internet Information Server.
  • PERL
    This tutorial will be covering the PERL syntax and should provide you with a very solid foundation of PERL for you to build upon.
  • Perl Programming Tutorial :: Table of Contents
    This tutorial takes only an Introductory look at Perl. Therefore, if you wish to study the Perl Programming Language further, consult the texts mentioned below.
  • Perl Regular Expression Tutorial
    A regular expression is a string of characters which tells the searcher which string (or strings) you are looking for. The following explains the format of regular expressions in detail…
  • Perl Tutorial
    Getting started with Perl CGI scripting
  • Teach Yourself Perl 5 in 21 days
    This book is designed to teach you the Perl programming language in just 21 days. When you finish reading this book, you will have learned why Perl is growing rapidly in popularity…

Python

PHP & MySQL

XML

  • A Beginners Guide to Creating and Displaying Your First XML Document
    This tutorial is divided into two parts. In Part 1, we will explain how to create an XML document and how to assign data types to the values in the XML document. In Part 2, we will create HTML pages that display the data contained in the XML document.
  • A Really, Really, Really Good Introduction to XML [XML, XSLT & Web Services]
    In this chapter, we’ll cover the basics of XML — essentially, most of the information you’ll need to know to get a handle on this exciting technology.
  • Introduction to XSLT
    Transform XML data from one format to another with Extensible Stylesheet Language Transformations (XSLT)
  • New to XML
    Need help getting started with XML? The XML zone on developerWorks contains articles, tutorials, and tips to help developers with XML-based development. For users trying to find their way in a new topic, all of that information can be overwhelming. This page provides an overview for readers who want to learn about XML, but don’t know where to start.
  • XML for Absolute Beginner - A Short Tutorial
    Welcome to the wonderful world of Extensible Markup Language (XML). This short article is an effort to explain what XML is, what are it’s benefits, and briefly describe some of standards evolving around it.
  • XML Tutorial
    Learn the basics of XML
  • XML Tutorial - Basic & Advanced
    XML stands for EXtensible Markup Language. In our XML tutorial you will learn what XML is and the difference between XML and HTML. You will also learn how to start using XML in your applications.
  • XML Tutorials
    Largest Source of XML Examples on the Web (1,069 Tutorials)
Advertisement
  1. 1.

    Seyhan (January 26th, 2007, 10:06 pm)

    Thank you for these resources,you’re doing a great job here.

  2. 2.

    loops (January 26th, 2007, 11:08 pm)

    Great list of resources!

  3. 3.

    Michael Mckee (January 26th, 2007, 11:42 pm)

    Oh my god. Your lists continue to overwhelm and humble me. I haven’t gotten through your 53 CSS Techniques list yet and now you drop this monster. Will I ever sleep?

  4. 4.

    Ryan (January 27th, 2007, 12:09 am)

    Quite a roundup! Nice job.

  5. 5.

    Taoski (January 27th, 2007, 1:02 am)

    I can’t believe that I have found a site where EVERY posting is an “invaluable and must have” delicious link!

    Keep up the good work!

  6. 6.

    Ben (January 27th, 2007, 1:09 am)

    fantastic list you’ve got here. I’m jumping in head first to the PHP, Javascript and AJAX stuff. Thanks for being so generous.

  7. 7.

    Florian (January 27th, 2007, 4:10 am)

    Thanks a lot for these tutorials!. Is there a chance to get a list for Ruby on Rails-Tutorials in the future =)?

    -Florian

  8. 8.

    Marcel (January 27th, 2007, 4:15 am)

    Thanks for this great site! I’d like to add a great Flash resource: Link [www.gotoandlearn.com]

  9. 9.

    Jeff (January 27th, 2007, 4:16 am)

    This site is rapidly replacing a lot of my bookmarks. Thanks.

  10. 10.

    Bill z (January 27th, 2007, 5:32 am)

    where is the Ruby section?

  11. 11.

    John Jurado (January 27th, 2007, 6:20 am)

    Thank you so much. I’m a total web noob, and I so appreciate this.

  12. 12.

    Mike Hunt (January 27th, 2007, 6:28 am)

    Link [www.digitalpropulsion.org] There are some good programming articles here for PHP, MySQL, and Microsoft SQL

  13. 13.

    stelt (January 27th, 2007, 8:56 am)

    You’re missing an SVG section, find some links on Link [svg.startpagina.nl]

  14. 14.

    Praveen (January 27th, 2007, 1:13 pm)

    Hi,

    Thanks for the great list !

    Bangalore, India.

  15. 15.

    Jessica Field (January 27th, 2007, 3:14 pm)

    Nice article
    Thanks

  16. 16.

    Dave (January 27th, 2007, 5:03 pm)

    Great resource. Bookmarked, and linked! I’ll tell all my friends about this. thanks for taking the time to make it.

  17. 17.

    Ace (January 27th, 2007, 8:47 pm)

    This is great help for my software development students and IT.

  18. 18.

    Raja Jee (January 27th, 2007, 10:32 pm)

    A nice effort.

  19. 19.

    Fran Black (January 27th, 2007, 11:09 pm)

    Great list you missed a bunch for RSS though -

    Make RSS Feeds - Link [www.make-rss-feeds.com]

    Converting RSS to HTML - Link [www.feedforall.com]

    RSS Educational Articles - Link [www.rss-specifications.com]

    HTH

  20. 20.

    james (January 29th, 2007, 8:54 am)

    another great collection. thanks…

  21. 21.

    ChrisB (January 29th, 2007, 5:59 pm)

    Such a glut of rich, tasty tibits …I’m starting to feel a bit queasy

  22. 22.

    OverZero.it (January 31st, 2007, 10:06 pm)

    IMPRESSIVE!
    Thank you very much.

  23. 23.

    Game (February 3rd, 2007, 6:34 am)

    Thanx

  24. 24.

    Wes (June 15th, 2007, 2:08 pm)

    Its good to find so many resources in one place.

    Thanks so much.

  25. 25.

    Bean (June 25th, 2007, 5:40 am)

    This site is down and the domain is for sale
    php-for-beginners.co.uk
    Please remove from your excellent list

  26. 26.

    Vitaly Friedman & Sven Lennartz (June 25th, 2007, 3:42 pm)

    deleted. thx bean! ;-)

  27. 27.

    Best PHP Books (November 23rd, 2007, 9:20 am)

    Thanks for the list guys. This is quite helpful list.

  28. 28.

    Mikee (January 9th, 2008, 3:26 am)

    wonderful

  29. 29.

    Obanza (January 12th, 2008, 3:55 am)

    Thank you ! Wonderful ressources

  30. 30.

    Mohi from Web Design Pakistan (March 31st, 2008, 11:54 pm)

    Resources are really great. You people are doing great work. Go on. Just subscribed to the Rss feed.

  31. 31.

    Ajax Tutorials (April 8th, 2008, 3:14 am)

    Link [www.ajaxprojects.com] review on ajaxprojects.com

  32. 32.

    Stavi (April 13th, 2008, 3:23 pm)

    People like you make our world better.People like you reminds me something very important about Internet.A place of freedom and Information.Thank you.

Leave a Reply

Allowed Tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>