23 February 2009

Chapter 1. Content Management Systems and an Introduction to Joomla!

In This Chapter

In today's fast-paced world of the Internet, if you have a website that doesn't have rich functionality or fresh content, you will find yourself at a disadvantage to those that do. The idea of powering websites with Content Management Systems (CMS) has been around for some time, but it is only recently, with the advent of high-quality open source CMS scripts like Joomla, that you and I can now use these powerful CMS tools.

In this chapter, I explain in detail the difference between a "traditional" website and one using a CMS. I also provide a look back into the history of Joomla and give an overview of some of its features. Here are some of the topics this chapter covers:

  • What is a Content Management System (CMS), and how is it different from a "normal" website?

  • What is Joomla, and where did it come from?

  • What can Joomla do?

  • What are the basic elements of a Joomla web page?

What Is a Content Management System?

What exactly is a Content Management System? To better understand this, let's briefly look at your common, everyday web page. We will have to talk a little about some of the technology of web pages, but it's worth it to understand the power of a CMS.

To start, let's take a look at the historical development of web pages. Conceptually, there are two aspects to a web page: Its content and the presentation of that content. Over the last decade, there has been an evolution of how these two pieces interact:

  • Static web pages— The content and presentation are in the same file.

  • Cascading Style Sheet web pages— Content and presentation are separated.

  • Dynamic web pages— Content and presentation are separated from the web page itself.

Static Web Pages

A web page is made up of a set of instructions—eXtensible Hypertext Markup Language (XHTML)—that tells your browser how to present the content of a web page. For example, the code might say, "Take this title 'This is a web page,' make it large, and make it bold." The results will look something like Figure 1.1.

Figure 1.1. Results of code on a web page


This way of creating a web page is outdated, but it's astonishing how many designers still create sites using this outdated method. It has two main drawbacks:

  • All of the content shown on the page ("This is a web page") and the presentation (big and bold) are tied together. If you want to change the color of all your titles, you have to go through all the pages in your site to do so.

  • The pages have large file sizes. Because each bit of content is individually styled, the pages are big, which means it takes forever to load. Most experts agree that this also penalizes your search engine optimization efforts as large pages are harder for search engines to index.

Cascading Style Sheet Web Pages

The next step toward understanding content management is a recent (recent meaning in the last four or five years) development of web standards, a common set of "rules" that a web browser like Internet Explorer or Firefox uses to output a web page onto your screen. One of these standards involves using Cascading Style Sheets (CSS) to control the visual presentation of your web page. CSS is a simple mechanism for adding style (for example, fonts, colors, spacing, and so on) to web documents. All of this presentation information is contained in separate files from the content.

Now the web page generated might look something like Figure 1.2.

Figure 1.2. Modern web page using CSS


Now the file containing the content is much smaller because it does not contain presentation or style information. All the styling has been placed in a separate file that the browser reads and "layers" over the content to produce the final result.

Using CSS to control the presentation of the content has big advantages:

  • Maintaining and revising the page is much easier. If you need to change all the title colors, you can just change one line in the CSS file.

  • Both files are much smaller, which allows the data to load much more quickly than without using CSS.

  • The CSS file has the additional advantage that it will be cached (saved) on a viewer's local computer so that it won't need to be downloaded from the Web each time the viewer visits a page.

Note


An example of this can be seen at www.csszengarden.com. Every page on this classic CSS site has identical content but has different CSS applied to each. You can browse through the designs and see the same content styled in hundreds of different ways.


The Least You Need to Know


Modern websites separate content from presentation using a technology known as Cascading Style Sheets (CSS).


Dynamic Web Pages

Dynamic web pages are what are created by a CMS.

A CMS does for content what CSS does for presentation.

Read that sentence again carefully. Where CSS separated presentation from content, a CMS separates the content from the page. This might seem like that leaves nothing, but in reality what is left can be thought of as "placeholders." This can be represented as what's shown in Figure 1.3.

Figure 1.3. Structure of a CMS web page


The "put some content here" instruction tells the CMS to take some content from a database, the "pure content," and place it in a designated place on the page.

You might be thinking, "So what's so useful about that trick?" It's actually very powerful.

It separates out the responsibilities of developing a website. The web designer can concern himself with the presentation/design and the "placeholders." This means that non-technical people can be responsible for the content—the words and pictures of a website. Most CMSs have built-in tools to manage the publication of the content.

With this in mind, it's possible to imagine a workflow for content management that involves both designers and content authors (see Figure 1.4).

Figure 1.4. The CMS manages content publication


A CMS makes the pages dynamic: They don't really exist until you follow a link to view them. This means that they can be updated/customized based on the viewer's interactions with the page. For example, if you place an item in a shopping cart, that item now shows up on the shopping cart page. It got stored in a database and now gets put into the "shopping cart placeholder." Many complex web applications are in fact mini CMSs (by this definition), like forums, shopping carts, and guest books, to name a few.

Another good example of CMSs are blogs. They have a "template" that presents all the content (or posts, in this case), and blogs are easy to edit and publish. The growth in the use of CMSs for powering websites is probably due in part to the huge rise in popularity of blogging tools such as Blogger and Wordpress.

The Least You Need to Know


A CMS totally separates the content of the pages from their graphical design. This makes it easy to keep the site-wide design coherent and easy to change. It also makes adding content easy for non-technical people.


The range of available CMSs is extensive—from enterprise scale versions that cost $300,000 to open source versions, such as Joomla, that are free. Modern CMSs are usually defined by their capability to manage and publish content. They typically have workflow processes that start at content creation and move to publishing. Most do far more: They have the capability to add on a wide range of extensions or add-ons to give the site more functionality. From forums to newsletters, Joomla has over 2000 pluggable extensions available, many of which are free and are created by volunteer developers around the world. The official repository is at extensions.joomla.org and a repository specializing in commercial extensions can be found at www.extensionprofessionals.com. Both have a rating and review system (which is itself an extension!).

Note


The Joomla Extensions site and extensionprofessionals.com both have a rating and review system. It's worth being careful with how to use the ratings. The highest rated extensions are shown at the top level of the site. This means that they get more traffic and so tend to get rated more. There are often great extensions that are hidden away in the categories. It's worth taking an hour or two to browse all of them to find ones that might be of use to you.

The quality of the extensions also varies widely. If you are using the extension on an important site, do the due diligence to check out the developer and visit his/her site.


There is one large drawback to using a CMS. They can be extremely complex, containing thousands of files and scripts that work together in concert with databases to present a website. Normally, this means that a CMS site will be designed and created by technical staff and managed and run by non-technical users. Joomla is probably the easiest to setup among currently available CMSs, allowing users of modest technical skill to harness its power. That's specifically the purpose of this book, to guide a non-technical user step-by-step in learning how to create and manage a website powered by Joomla.

This concept of "hard to set up but easy to grow" can be summed up in Table 1.1.

Table 1.1. Comparison of Static Websites and CMSs
Static Website Content Management System
Easy to create initial web pages. To create initial pages is time-consuming as a large script must be installed, databases set up, and templates created.
Content is static; changing it requires technical expertise. Content is dynamic; it can be changed with no technical knowledge.
Difficult to add new functions, often needs custom code. Most CMSs have many extensions that "plug in" easily.


Content Management Systems have been around for a while, but there is another factor that has contributed to their rise in popularity and ease of use: The growth of the open source software movement.

Open Source

In 1998, Netscape bucked the universal wisdom of how to release code by making its release of its browser, Netscape, freely available to anyone and everyone. This milestone was key in creating a philosophical movement among code developers where software would be created by large communities of developers and released openly to the world.

As the Web has grown explosively, we have seen open source software grow and mature to power the Web. The most significant has been four that are collectively referred to as "LAMP": Linux, Apache, MySQL, and PHP.

  • Linux— An operating system

  • Apache— Software to run a web server

  • MySQL— Powerful database software

  • PHP— A programming language used to write complex scripts that create interactive functionality with databases

LAMP has allowed developers to create powerful applications using the PHP programming language. One specific area of growth has been the development of CMSs that are written in PHP such asXoops, Post-Nuke, Wordpress, Mambo, Drupal, and Joomla.

The Least You Need to Know


Joomla is an example of open source software. It's created by a world-wide community of developers and distributed at no charge.

No comments:

Post a Comment

~silahkan berkomentar~