Put these technologies to work for you.
There are many technologies available today to create web sites, with
new ones appearing each year. While some tools (such as Microsoft FrontPage
and Macromedia Dreamweaver) can free the web designer from writing HTML code,
there are tasks which require the skills of a software developer. Web sites
are no longer written solely in HTML; many incorporate technologies such as
Cascading Style Sheets, Javascript, PHP and SQL databases.
Here is a brief introduction to some of the technologies, explaining how
they can benefit your web site.
HTML
HTML stands for Hypertext Markup Language. This is the language that tells
the visitor's browser (e.g. Explorer, Navigator, Safari, or Firefox) what to
display. A "markup language" controls text positioning, font appearance,
layouts of tables, etcetera. "Hypertext" refers to the ability of pages to
connect to each other using links.
We handcode our websites, to ensure that the pages are clean, download
quickly, and work across all browsers. We have found this to be
an essential step in the creation of a reliable web site.
In the early days of the web, each browser company came up with their own
special features for the HTML language, which only their browser
understood. There is now an organization devoted to standardizing HTML:
the WorldWide Web Consortium (W3C).
We code every page of your site to meet W3C standards, and use W3C validation
software to check it.
CSS
CSS stands for Cascading Style Sheets. A style sheet is a computer file
which contain descriptions of various styles. For example, you might
have one style for the headings of your text and another for the body of
the text. A style might include the font, its size, its colour and its
alignment (left-justified, right-justified or centered). It might also
include margin specifications and position of the text.
Each style is given a name in the style sheet. Once a style has been
described in a style sheet, every web page on your site can make use of
it, with code that says something like "display this text in the style
called MyHeading".
Style can be controlled using HTML, but it is preferable to use style
sheets. Using style sheets allows you to change the style of your whole
site by changing a single file; that change is then reflected in every web
page that uses that style sheet. HTML code is also cleaner and easier
for the developer to maintain when style sheets are used.
Server Side Includes
Server Side Includes are useful when a design element is reused across
multiple pages within your site. That design element might be a page header, a
copyright notice, or a menu.
The design element is described in a single file which is located on
your web site host computer. Multiple web pages can refer to that file.
When a visitor goes to one of those web pages, the host computer pulls the
design element from that file into the web page before sending the web page
off to the visitor's computer. When a change is made to the file containing
the design element, it is immediately reflected in all the web pages that
refer to that file.
Pages that use server side includes have names that end in .shtml, like
this one.
PHP
PHP originally stood for Personal Home Page. However, it has been
renamed to Hypertext Pre-Processor. PHP is a general purpose scripting
language, similar to the programming language "C".
With PHP, your web site can include pages which are created automatically
(dynamically) when a visitor arrives at them, usually using information available in a
mySQL database. The computer that hosts your site runs the PHP code, which
creates HTML for the page. The resulting HTML file is then passed on to
the visitor's computer to be displayed by their browser.
For example, shopping carts often use PHP and a mySQL database containing all the information about
the products being sold: the product name, a description, the price, and a photograph.
Then the site visitor can search for all the products under a certain price,
which are displayed in a dynamically created web page.
When you need a dynamically created web page, we use PHP to create it. If the
content of that page is tabular in nature, you can maintain the content on your office
computer using an Excel spreadsheet, and upload the spreadsheet into a database on your host
computer using the instructions we provide in our manual. (We also provide training and support.)
If the data is not tabular in nature, or you prefer not to use Excel, we can create custom,
password-protected, web pages which you can use to enter the contents of your web site.
This combination of technologies allows you to maintain your own web site without having
to know web development technologies. We can create a dynamic web site from scratch, but
often it is most cost effective to use products such as Joomla!, WordPress, and CubeCart,
which are described below. These products are frameworks, coded using PHP and mySQL, which
give us a headstart on your project and lots of free features.
Here are examples of some pages we have created from scratch using the PHP/MySQL technology.
Joomla!
Joomla! is a "content management system". This is software which allows clients
to maintain the contents of their own web sites without having to know programming
technologies such as HTML, CSS, Javascript and PHP. It is based on the PHP and
mySQL technologies described above. Joomla! is a free open-source product, supported
by volunteers in the international programming community.
With Joomla!, you have two options for editting a web page. You can log in right on the live
web page itself (the "front end"), and visit the page you want to edit and click the "Edit" button.
You then use a "what you see is what you get" (WYSIWYG) editor, similar to the one you might
use to create email, to change the contents. Then click the "Save" button and log out and you're
done. For more complicated edits (or if you prefer not to allow logins from the front end) you
can log in to a separate administrative web page (the "back end"). From this page there are many
menu options which allow you to edit pages, add/remove pages, reorganize the site menu, and
install special software, such as event calendars or photo galleries.
Templates are used to control the appearance of a Joomla! web site. We are available to help you
find a template, to install and customize the template, and to find, install and customize Joomla!
components, such as event calendars and photo galleries. We can also create a unique template for
you, if required. Customizing templates requires knowledge of HTML, CSS, templating technology
and PHP, so an experienced developer is needed for this stage in the project. However, after the
site is customized to your requirements, you can maintain it yourself, using the comprehensive
site-specific documentation we provide.
Here are examples of some sites we have created using Joomla!
Both these sites were created with the same template (Serene), so you can see how much customization is possible within a single template.
Shopping Carts/eCommerce/CubeCart
You might think that setting up your own online shopping site would be
prohibitively expensive; however, several organizations have devoted themselves
to creating customizable shopping cart solutions and selling them at low
one-time costs. We investigated several of these products and chose CubeCart
as our shopping cart of choice, because it had the most user-friendly "back end"
for updating the web site and receiving/fulfilling orders.
CubeCart sells for $140 US (or $180 US if you want to remove the discrete CubeCart
link at the bottom of each page of the shopping cart). Like Joomla!, it is based
on PHP, mySQL and templating technologies. With shopping carts, templates are referred
to by the name "skins". The same developer skills are required to customize CubeCart
skins as Joomla! templates, and once the customization is complete you can maintain
your own web site and fulfull orders without knowing programming technologies.
We have developed a clean two-column shopping cart skin, which you can see in
action at the sites below. Starting with this skin allows us to customize your site
more cheaply than using a third-party skin, which is typically more complex and takes
more time to customize. We plan to develop a three-column skin in the near future.
Of course, we can work with any CubeCart skin your choose.
The stores for the Sunshine Coast Botanical Garden Society and Poppins Quilt Parlour were added to those
sites after the sites had been online for some time. You can see how the CubeCart stores have been
customized to blend seamlessly with the rest of the site.
JavaScript
Javascript is a programming language that can be incorporated into an
HTML file. Javascript code is run by the visitor's browser when they visit
a web page that includes such code (unless they have disabled
Javascript in their browser for security reasons). This differs from PHP,
which is run by the host computer instead of on the visitor's computer.
Javascript is used to create interactive effects on web pages (such as menus
which expand when you mouse over a menu item).
There are online sources of thousands of Javascript code snippets, including
scripts for calculators, calendars, drop-down menus, games and forms. To
keep costs down, we make use of these when this is efficient, reviewing and
editting code as necessary to make sure it is robust. However, we typically
write our own Javascript. Most third-party Joomla! templates and shopping carts make
some use of Javascript.
DHTML
DHTML stands for Dynamic HTML. This is not a technology in itself, as much
as it is a collaboration of other technologies:
- HTML
- CSS
- JavaScript
- Document Object Model (DOM)
DOM is a technology for labelling elements of code in a web page so
that Javascript code can access those elements by name.
DHTML allows us to make more sophisticated interactive web pages than
would be possible with Javascript and HTML alone.
|
