Technological Fantasy is designed to address a number of shortcomings in the older theme. The most important and obvious change is the switch from a white background to an olive green one. The site has become more of an image gallery than a blog, and the glaringly white backdrop was a rather distracting choice (not to mention the big, full colour image on every page). That’s to say that the textual aspects of the site are unimportant. Indeed, the text colour has been carefully chosen to provide ample contrast in line with WC3 accessibility guidelines.

The second problem with the old site was hard coding. In order to achieve it’s unusual site structure required a lot of exceptions that made adding new categories a pain. By going back to a more conventional blog structure the site can be easily expanded whenever I need or want it to.

Finally data I received showed that most users visiting the site would only read one page and leave, without looking around the site for other related pages. With the ‘related posts’ section in the sidebar of single posts added, I hope more users will take the time to explore further.

Because of it’s construction, I won’t provide Utraclean as an alternate theme, although I may use it’s predecessor, ‘Adam’s Blog’, in that role.

There are a number of database management systems (DBMS) suitable for web applications. MySQL is possibly the most ubiquitous, but other DBMS may be better suited for specific applications

MySQL is, as mentioned above, extremely common. It is suitable for most applications because it provides many different ways of storing information. One format may be faster, another may allow for more users at once.

An alternative DBMS is PostgreSQL. PostgreSQL offers more flexibility, and as such has significantly more complexity. It can recognize several different languages for retrieving data, rather than just SQL, and has many object orientated features, such as tables being able to inherit properties of ‘parent’ tables.

I, personally, am only familiar with MySQL, and in the rest of this article I’ll discuss how MySQL works with PHP.

Connecting to and accessing a database

In PHP, there are five steps to accessing a database. The first is actually connecting to the host where the database is found. For MySQL the method of connecting follows the form mysql_connect(DB_HOST, DB_USER, DB_PASSWORD). DB_HOST being the address where the database is found, DB_USER and DB_PASSWORD being the username and password used in MySQL.

The second part is selecting the database to be used. A particular copy of MySQL can, and probably will be hosting several databases. mysql_select_db(DB_NAME) is how to choose a particular MySQL database, where DB_NAME is the name of the database in question.

The third part is to create a SQL query. SQL, or Structured Query Language is an almost universal way of accessing data from databases. Most types of database use this language, including MySQL, Microsoft Access and many others. The results of the query are usually stored in a variable for later access. $linkresult = mysql_query("SELECT * FROM `links` WHERE `category` = 'games'"); is an example of a SQL query being used to access a MySQL database in PHP.

The fourth stage is reading and displaying the results from the query. The following snippet reads off the results and displays them as an HTML list of links with images:

if (mysql_num_rows($linkresult) > 0) {
while($row = mysql_fetch_object($linkresult)){
echo "<li><a href=\"".$row->url."\" title=\"".$row->linkname."\" ><img src=\"img/".$row->id.".gif\" alt=\"".$row->linkname."\" /></a></li>";
}
}

This is a fairly complicated example, but there are many different ways to display the query results.

Finally, after using the database’s data, one should clean up after oneself, to free up system resources, and to prevent clashes should you need to run other database queries in the same script. mysql_free_result($linkresult); empties the variable holding the query results.

To summarize, the steps in connecting to and accessing a database are:

1. Connecting to the database host
2. Selecting the database
3. Querying the database
4. Displaying query results
5. Cleaning up

• Five simple steps to better typography. Covers such things as line length and word spacing.
• How to avoid activation of Active-X in IE. Due to recent changes, flash (and other things) have to be clicked before they work in IE. This is a workaround.
• How to correctly insert a Flash into XHTML. A functional, valid way of inserting flash into a web page.
• Architecting CSS. Techniques for organising CSS.
• Gabbly. An interesting way to get chat on a website.

And a comic, too.

I is for Internet Explorer

Internet Explorer is the web browser used by the vast majority of internet users. It does not support web standards as well as the latest versions of Mozilla Firefox and Opera, and has a whole raft of CSS hacks written to try to allow you to get the damn thing to do what you want. Of course, the Greater Standardista would frown at the use of something as inelegant as a hack, and simply assert that if Internet Explorer doesn’t render according to specification, that’s hardly their fault. The latest version, IE7, is believed to be a significant improvement.

A Standardista’s Alphabet is a light-hearted look at Web Standards Evangelism. It’s part of the September issue of A List Apart, and well worth a read.

G’day

Look, I know you people in the IT department don’t like to be disturbed , but the MD seems to think that you’re pretty well-informed. We’re going to need another web-developer in a months time for the Humanet 2.0 project, so I thought I’d pop this question your direction.

I’m quite familiar with HTML from my experience on the Humanet project, but oneof our web developers keeps insisting on us using XHTML rather than HTML. He’s new on the job and so I don’t want to make a big decision based on a new recruit’s insistence.

Is XHTML a new language? How does it relate to HTML and why should we use it? And what is the Document Object Model (DOM) that the newby keeps referring to? And finally, how do you keep up with your tech-information? I don’t have much time, but I want to be able to keep up with developments in the industry, especially new web-standards.

As I said, I do want to look into these things myself, but am quite busy at the moment. It would be extremely helpful if you could answer my questions and provides links so I can find out more over the weekend.

Thanks in advance,
Gary
Project Manager – Humanet
KorTech Pty. Ltd.

XHTML is not really a new language. It is basically a simplified version version of HTML that has been modified to follow XML conventions.

• Many tags that are now superfluous with the use of CSS have been removed in XHTML
• XHTML has a more consistent syntax than HTML.
  • All tags must be closed, such as <p></p>. If a tag is empty (would have nothing between the opening and closing tags) such as an image tag, it has a closing slash, for example: <img src=”example.jpg” />
  • Tag attributes always follow the attribute=”value” syntax. Some attributes that could be written in a shorthand fashion in HTML cannot in XHTML. For example, what used to be written as <textarea disabled> must be written as <textarea disabled=”disabled”> in XHTML.
  • Tags and their attributes must be written in lower-case in XHTML. HTML allows these to be written in whatever case you like.
• In theory, XHTML should be sent to the browser as an XML application. In practice this is almost never done.

XHTML is a newer standard, it’s simpler to write and maintain than HTML and the code written for XHTML tends to be cleaner and lighter. Well written XHTML will be usable on a greater number of devices, as XHTML’s consist ant syntax means that it can interpreted by less powerful devices, such as mobile phones, which have difficulty getting HTML right.

That said, strict HTML is still a perfectly usable standard to write to, and some purists say it’s better to use HTML as XHTML should be treated as XML rather than text, and most users (read: those that use Internet Explorer) can’t use XML pages.

Using XHTML is widely regarded as the better option. Because it’s cleaner and more consistent it’s easier to write for and faster for computers to render. Because it’s based on XML it will be usable well into the future as, well, XML is in almost everything.

HTML vs XHTML Links

• Differences Between XHTML And HTML
• HTML Versus XHTML
• HTML vs. XHTML on standards compliant websites

The DOM (Document Object Model) is a way of referring to any part of a document, such as a web page. ‘DOM Scripting’ is basically using JavaScript, although some of the techniques have changed in recent years. It uses the ‘dot syntax’: to refer to the element with the ID ‘foo’ I would use the code documet.getElementByID(’foo’), for example.

DOM Links

• Document Object Model
• Discovering DOM scripting

To keep up with new developments in the industry I follow a wide range of blogs written by high-profile web professionals. Using an ‘aggregator’ or RSS reader, ether a web-based one such as Bloglines or a small program on the computer, one can subscribe to a large number of these sites and see if there are any updates, or even read the posts without having to visit the sites individually.

Aggregator Links

• Bloglines
• Tracking the web with Single Page Aggregators

Informative Web Design Sites

• 456 Berea Street
• A List Apart
• Jeffrey Zeldman Presents
• Max Design
• Vitamin

In XHTML there are a number of tags which have been dubbed ‘bad’ for being purely presentational. For a person that’s only beginning to learn the right way of writing HTML it’s a useful simplification to call these tags out of bounds. However, in most cases these tags do have legitimate use.

<i> and <b>

The tags with the least legitimate use, bold and italic are used where convention dictates there should be bolded or italicised text, but only if there is not another tag that covers this instance. An example of where one might use <i> is when writing the name of a ship. The ship’s name would conventionally be italicised, such as the HMS Hobart, but there is no tag for it.

There are tags for strong text (<strong>), emphasised text (<em>), quotes (<q> and <blockquote>), citations (<cite>), editorial insertions (<ins>), abbreviations and acronyms (<abbr> and <acronym>), sample output (<samp>), definitions (<def>), variables (<var>), text to be typed in by the user (<kbd>) and addresses (<address>) and probably a few others beside.

There aren’t many situations where <i> or <b> should be used, and they should be only considered where you are sure there isn’t a better option.

<br/>

The line break tag should only be used when line breaks are part of the actual information being presented. Examples include command-line output, street addresses and poetry.

If a ‘goblin (hob) waylays you,<br/>
Slice him up before he slays you.<br/>
Nothing makes you look a slob<br/>
Like running from a hob’lin (gob).<br/>

<hr/>

The <hr/> tag stands for ‘horizontal rule’, however, it’s meaning is a separator in text. If you’ve read a novel where the author switches between multiple story threads you’ve probably seen these. Maybe as a single star, maybe as a row thereof, maybe even as a horizontal rule. All of these would be <hr/>s in HTML.

The <hr/>’s use is to show where there is a clear change in the focus of the text. Such as where there is a change from the point-of-view from one person to another.

The name of the tag is a bad one, which is why in XHTML 2 it’s being changed to separator. Hell, if a page is being written in a top-to-bottom direction the ‘horizontal rule’ tag will be a vertical separator.

• Ronin MUD

This site is for the online game Ronin MUD, I haven’t played the game, however I found the site to be very impressive. It has a very striking red and black colour scheme, using irregular lines and a large image to good effect. The text is mostly readable, the parts that overlap the main image are less so. (With IE7 coming, I can think of at least one interesting way to keep this overlap but maintain readability)

It is, unfortunately a table-based layout, but everything I saw on the pages could have been achieved with CSS, and using CSS could fix some of the rough spots of the design.

I’m interested to hear what other people think of this design. If you have an opinion about it, comment away.

• Rachel Cunliffe Wordpress Tutorial

This is because both XAMP and MAMP put a temporary web server on your computer while, allowing you to run .php files from your computer. It also runs MySQL for the more advanced php/database work.

• MAMP
• XAMP

• useit.com : Screen Resolution and Page Layout