Conceptric

The Articles Topic.

  1. OK… as I mentioned in my previous article, I’d had a change of heart on the approach for the Northamptonshire Bird Club website.

    Redefining the Architecture.

    I decided to start again by defining the information architecture for the site based on a proper discussion with the Club committee. The first few meetings on this topic just weren’t as well focused as they should have been; mostly my fault for not knowing what I wanted from them; but this time I tried targeting those features that the membership would really value. Each of the features that emerged seemed to fall into logical sections of the information architecture:

    • About the Club — including notices, events and membership contacts.
    • Content on Birding — after all it’s the main focus of the Club.
    • Social groups within the Club divided by specific interest.

    These overall sections were used as containers for the more specific features, and these formed the basis for implementation.

    I’ve tried an online tool called WriteMaps for developing and sharing the architecture of this site. I haven’t decided whether it’s the best way to approach the job yet, but here’s the link to the detailed sitemap.

    Implementing the Design.

    The original site used custom taxonomy — tagging — to enforce the architecture, with multiple sections of the site sharing the same content types. As I mentioned, this made it very confusing for the Club editors, which was reflected in the site presentation.

    Installing new modules.

    I needed to add several new modules to support the new content. There are several ways of doing this; this alone is a substantial topic; but the simplest is to download the module directory containing the code into the modules directory of your Drupal installation.

    Content types.

    For this redesign I decided that each of the features should have a dedicated content type so that users only need select the right one, there’s help text as you can see, and it’ll end up in the right place on the website. No more messing about with tags!

    The new create content menu

    A great tool for this is the Content Construction Kit (CCK) module. It makes implementing new content types very easy; no PHP required; and there are a wide range of modules that provide additional data fields. I’ve used several to provide dates, images and even GoogleMaps, take a look at the full list of compatible modules on the Drupal website.

    Once the CCK module is installed, all the changes you want to make can be managed from the Content types section of Content Management.

    The content type management menu

    Providing access.

    All these new content types need to have access control set–up before you can go any further. This is done in Access control, under User Management in the administration section of Drupal.

    The user management menu

    You should find both create and edit options to set under node module for the new content types.

    The node access control options

    Once these are set the content types should appear on the appropriate create content menus.

    Setting up the paths.

    But you’ll want to set the URLs to reflect the new architecture before deploying.

    I use Pathauto to provide aliases for my content that better reflect the structure of the website and present friendly URLs. You can do this manually, but if you can’t rely on your users to do this consistently I would recommend using Pathauto.

    The Pathauto settings are under Site Configuration, and it’s the Node paths you want to set–up for your new content.

    Overview of the options for the Pathauto module

    These, combined with the individual content types, provide the structure for the website. For example I wanted the bird guide to appear within the birding section of the site architecture with individual entries beneath this, so I set the pattern to birding/birdguide/[title].htm.

    Examples of node path settings

    Time for a View.

    The Views module provides the ability to present node data in a range of different formats. With the module installed your views can be managed from the Administer views section found under Site building.

    Example of the Views administration options

    Here you can define new views for each of the content types and define a URL from which the specific view can be accessed in the browser. In the image above you can seen that I wanted the bird guide list to appear as the default in the bird guide, and gave it the URL birding/birdguide. These views can generate lists, tables and customised sorting, in addition to the more standard web page presentations.

    …And a menu.

    Finally we’re going to want a menu from which all our good work can be accessed. The menus and blocks in Drupal can all be found in the Site building section.

    The sequence is simple, first create a new menu for the features you’ve implemented, under the Menus section, using the URLs of the views;

    Example of the birding section menu

    and then go to the Blocks section and put the new menu where you want it to appear on the website.

    Placing the menus in left sidebar on the website

    That should be it! Your new functionality has been added.

    Conclusions?

    Having established this workflow, I implemented each of the identified features one at a time, ensuring it was working and acceptable before moving on to the next.

    I believe, and feedback suggests my users agree, that this approach to building a Drupal website is far more successful than a taxonomy based one. I still use taxonomy, but it now provides addition information for particular types of content rather than forming the basis for site architecture.

    As for Drupal itself, it’s relatively easy to use, even without significant PHP knowledge, and the large community provides a huge range of contributed modules and support. This makes it a powerful way to develop feature rich, multi–user websites very quickly.

    On the downside, I’ve found providing users with an easy way to upload and insert images very difficult. There are serious problems with using the popular TinyMCE WYSIWYG editor and IMCE file handling together; individually they work OK, but together… I need to look at this again.

    I would definitely recommend trying Drupal out if you need a CMS, for an image rich website; such as a gallery; I’d try Flickr or, for ultimate control, hand coded XHTML.

    Categorised in:

    No comments.

  2. I’ve come up with a brilliant idea to reuse my old Mac mini. I’m going to convert it into a server on my local network for development and hosting our personal web projects.

    OK… not very original, but the key point is that I want to be able to use the wireless networking, stick it anywhere, and not have to worry about peripherals. A very mobile server.

    I already work with remote servers over public networks, and rarely use anything but the command line. For this project I wanted to be able to use the Mac desktop. This seemed the perfect excuse to play with VNC. Additionally, I frequently use SSH and PKI for encryption and authentication respectively, but not VNC.

    The Plan.

    It seemed to me that there were several parts to the problem, with only one of which I’m familiar.

    1. Configure a VNC Client on the local machine.
    2. Configure a VNC Server on the remote machine behind a firewall.
    3. Enable SSH communication through the firewall.
    4. Lock it all up using an SSH tunnel through the firewall so the Server and Client could talk.

    Now to work!

    The Client.

    I settled on Chicken of the VNC (COTVNC), a open source project providing a VNC Client for Mac OS-X. Great, that’s just what I want and it gets good reviews, but I guess most other clients out there would work too.

    Once installed COTVNC takes almost no configuration, that all comes later in the SSH and Server.

    Connection set-up dialogue for Chicken of the VNC

    You might be able to see that I set up two connections; one for an unsecured connection, so that I could see if the security measures locked me out later; and this one for the secured connection, that’s why the host is the local machine.

    The Server.

    First I tried Apple Remote Desktop (ARD), but found it a little slow, but more importantly I couldn’t find a way to close the two ports in the firewall that the service automatically opened. While I’m diligently using SSH tunnelling to avoid compromising the security of my machine, these two ports are sitting there waiting for attack!

    Time to try a different approach. I chose to disable the ARD service, closing the firewall again and installed a third party VNC server. The one I selected was Vine Server from Redstone Software. The reason? Nothing better that I’d read good things about it in blogs and on message boards, it’s available for Mac OS-X, and it’s free.

    What is in the box for Vine Server on Mac OS-X

    For Mac OS-X it downloads as a disk image containing the Server and a Viewer. I just wanted the Server as I’m using COTVNC, so a drag toward the Applications folder and a double click later I’m ready to configure things.

    Vine server can be run in two different modes; as a System Server that starts automatically whenever the Mac starts up; or as a Desktop Server that can be run like any other application. Since I want to run my Mac mini as a remote headless — no keyboard, mouse or monitor — server, I only configured the System Server.

    Settings dialogue for Vine System Server

    Not especially difficult, but the eagle‒eyed out there might have spotted that I didn’t enable the “Require Remote Login” option; in fact I did the first time and bang went any connection. I reasoned that I’m using SSH tunnelling, so the Server won’t realise that the connection IS via SSH and block it.

    Set the System Server running, checking that it starts up again after a restart, and that’s the Server done.

    The Secure Protocol.

    Actually, this was pretty easy. Go to System Preferences > Sharing and enable the Remote Login service.

    Settings to enable the Remote Login service on Mac OS-X

    Make sure that the other services are disabled, unless you have a particular use for them; I’ll be enabling the Web Sharing service later. This should ensure that the firewall is closed on all ports except the one used for SSH — port 22.

    The Tunnel.

    The idea of the SSH tunnel was to forward any communications sent between port 5900 — the default VNC port — on the local machine and the remote machine, through an encrypted SSH connection.

    Now there are lots of utilities to help you manage your SSH world, but I tend to use SSH-Agent and the command line. I primarily use SSH-Agent to manage authentication, but it does have the ability to construct tunnels.

    Set-up dialogue for SSH tunnels in SSH-Agent

    If you’ve got PKI set up, you won’t even need to enter any passwords in order to establish the connection.

    The Result.

    Once your tunnel is connected, you can start up COTVNC, or equivalent, and log‒in!

    An image of the desktop on the remote machine

    Everything appears to work and I find Vine Server much more responsive than the Apple free offering.

    By the way, I tried logging in with the unsecured connection and was kicked out.

    Categorised in:

    No comments.

  3. I don’t feel I’ve got the programming experience I’d like for my future plans. So, I’ve got one of those personal project — the type that you never seem to get round to — in mind to provide me with a good workout.

    Which programming platform to use for the server-side application? Whilst I have to admit that I’m not the greatest fan of PHP, it’s definitely the best option. Why? Because I need to run this application locally on a minimal server and PHP is available wherever you find Apache, and the skills should have some commercial value.

    I’ve recently read a great deal about agile development, TDD and employing software design patterns. As part of this project I’d like to apply some of what I’ve learned.

    A test framework.

    Now I’m going to need a testing framework, and I’ve gone for SimpleTest. This framework not only provides unit testing, but the ability to create tests for web pages. I prefer to run my test suites from the command line, which is relatively easy to arrange with the TextReporter object. I’ve combined the whole thing with Apache Ant to automate most of the tasks in the project, including deployment.

    Unfortunately, it appears that SimpleTest doesn’t play particularly well with PHP5, although they’re in the process of making the transition.

    I’ve encountered the mass of error messages generated as the result of E_STRICT. This is easily solved by using a customised php.ini file as an option at the command prompt when executing the test code. Once this is done you can see the actual test messages!

    A more significant problem is that the Mock object code cannot be called as static class methods in the way the documentation suggests. A little snooping through the code leads me to think that it’s due to PHP4 without the static keyword in the method headers required by PHP5. I don’t have a work-round for this, and I don’t want to have to alter all this code. I hope they address this as the transition to PHP5 continues, but at the moment my code is simple enough for me to write my own mocks.

    When all is said and done, if you know how to use any of the xUnit test frameworks, SimpleTest is very easy to set-up and use.

    Driving with tests.

    Simple the tests may be, but using them to steer the direction of your coding effort takes a different mindset. The hardest part is learning which questions to ask when developing your tests. Asking the right questions about functionality will result in clean, precise code.

    There’s always a temptation add just a little more functionality, but resist it. The point is to remain in control of the code at all times. When it’s not working, it must be because you’ve added new tests describing new functionality. The code should never contain functionality that hasn’t been demanded by a test. Good refactoring can produce beautiful code without breaking the tests — still in control.

    I think I’m getting the hang of it in relatively simple cases, but there’s much more to learn. I’ve found it a very liberating way to develop software, whilst remaining in total control — you are using version control?

    Patterns in the code

    Whilst there are loads of MVC based frameworks out there, I want to know how it works first hand. This topic is worth an article of it’s own, and that’s what I’ll give it.

    There’s a good chance that the core application model will need to implement a facade pattern, but lets not make any assumptions.

    Categorised in:

    No comments.

  4. Recently I’ve been building a website using Cocoon 2.1.9, a Java based publishing framework. I chose this platform largely for the experience with Java and, in a few weeks time, native XML databases.

    I’ve worked with XML before, often in the form of RSS, and have found this way of structuring documents fairly logical. But what about using XML and associated technologies to build an entire website?

    Schema: Defining the data structure.

    This brief really brought home the importance of getting the initial document structure right. Establishing the appropriate schema is as important for XML documents as it is in RDBMSs, after all it determines the flexibility of your data storage and can’t easily be redesigned. I’m hoping that all the time I’ve spent will pay dividends as the web application grows.

    Data storage and handling.

    It also highlighted those things that XML and RDBMS do best.

    Take a document like this one, it’s a hierarchically ordered plain text file which is perfectly suited to XML. In fact if you make it more complex, like a book with chapters for example, it becomes even better suited to XML and harder to implement in a RDBMS. I think, though I must confess I’ve never fully understood, that this is what they refer to as docu-centric data.

    Now take a load of bird sighting data; totally different project; that relates species to locations to dates to weather conditions to… well you get the idea. These are complex many-to-many relationships and this is where RDBMS shine. Coupled to fact that most RDBMS have considerable power for processing complex search queries and they’re the platform of choice for this type of work.

    RDBMS are already heavily used on the Web, but in my opinion, increasing amounts of docu-centric data is going to be made available on the Web and LANs in XML format. Most office applications already support this and many use file formats that are natively XML. Interoperability is going to depend on communicating in XML and the possibilities this presents for new platforms and services is exciting to me… errr just pretend I didn’t say that. Cocoon is interesting because it permits me to use any of these data sources and handle the whole lot as XML streams.

    And the presentation.

    Which brings me to the presentation layer, where Cocoon is primarily focused. So far I’m impressed, the best part has been working with XML and XSL. It’s fantastic using XSLT stylesheet to creat the web page structure and CSS implement the graphic design. It is allowing me to handle documents and construct the website in much cleaner and more adaptable way than I’ve achieved with PHP.

    In addition I can use XSLT stylesheets to manipulate well structured XML documents before passing the result to another for transformation into the final XHTML web page. All this currently takes place on my server, consuming system resources and some might say reducing scalability. The original goal of exploring this technology was for my websites to work natively in XML, whether they have a RDBMS back-end or not. In time I hope to be able to transfer much of the presentation layer processing load to the client using the browser client-side XSLT capability.

    I’ve been experimenting with that too, and it’s impressive what can already be done, as long as you’re not afflicted with Microsoft Internet Explorer 6. Firefox 2, Opera 9 and Safari all work well with basic XML/XSLT and CSS. Web applications could assess the processing capabilities of the clients and send either XML/XSLT/CSS or XHTML/CSS, for example, for desktop or mobile platforms respectively. In addition for saving processing power the first option gives the client more flexibility in handling the data as we’ve already seen with RSS.

    Where next?

    I’m going to finish my Cocoon website, enabling the option for client-side transformations. Then I’m going to design an XSL based Wordpress theme. That might seem a bit pointless since PHP can be viewed as a templating language itself, but as I’ve explained above XML is the future. But most of all I intend to enhance my skills with XML technologies, a step which I think will pay off soon.

    Categorised in:

    No comments.

  5. It’s always been the case and never more so than now. Once the quality of your writing was all that could differentiate you from the competition. Adding images lead to download times certain to lose the interest of even your greatest fans.

    Time and the Web have moved on and broadband makes a full multimedia experience a possibility. But you don’t have to go that route. It’s all a matter of what your trying to say.

    Text isn’t dead

    The quality of the content your writing is still one of the biggest factors for success. Unfortunately, the promise of multimedia has pushed this into obscurity. The power of good copy writing is often underestimated and it is assumed that the content can be added to pad out the design at a later date. This is a big mistake, since the text usually form the backbone of a website.

    I want multimedia

    And you can have it, just remember that the success of the media you use is dependent on how you use it. The days of the flashing gif image and continuous tinny background soundtrack are long, long gone.

    Don’t get me wrong, I’m not knocking imagery. Careful use of images provides the spice that grabs the attention before the ‘back’ button is pressed, and everyone knows how a picture is worth a thousand words. But note the use of the word “careful”, web images need to provide maximum impact on a range of different computer platforms; for example, Windows and Apple; whilst remaining as compact as possible. Large images, or many small images, will result in a slow response, even in these days of broadband, and that is a good way to lose visitors.

    It’s not just images though. Many websites owe their considerable success to media such flash animations, audio and video. If any of these technologies add to the message of your website then why not use them. Always remember the trade-off in website performance. If you think a particular media resource has value but is going to slow things down, don’t force it on the visitor, give them the option.

    Consider your content

    The underlying message is that content isn’t an afterthought, it’s the website! But the choice of media available to convey your message has never been greater. Carefully consider what message your website is trying to pass on and then design the content to meet the goal. Only then are you ready to design the website to present it.

    Examples of multimedia on the Web

    Categorised in:

    No comments.

  6. Data, data everywhere.

    The availability and manipulation of information is a key factor in the development of society. The modern era has seen significant advances, with technologies such as printing, radio and television providing access to ever increasing amounts of data. The mass adoption of the internet has increased the rate at which data can be disseminated. However, the proliferation of information sources has also made separating the wheat from the chaff increasingly difficult. Apart from the obvious trouble with knowing who to trust, huge quantities of data make it much harder to find what you want. We all use search engines and know that finding what you really want is not as easy as might be assumed.

    And the future?

    The future is likely to see even greater levels of information integration using the internet as a robust media. The boundary between desktop and web applications is already blurred and I suspect that this trend will continue. Web applications will become less about presenting information and the desktop itself will become increasingly integrated with the web. The kind of service-oriented architectures (SOA) used on the web today will become increasingly common. Our personal computing may take place on a relatively low powered machine leveraging the services provided on much more powerful distributed servers of the type already common on the internet. These machines may store our data remotely and securely, whilst others provide access to databases around the globe.

    “Results 1 - 10 of about 424,000,000 for whatever you wanted”.

    Unless there are advances in the way we handle all these data, there’ll be a lot of browsing to do. One path is the spread of eXtensible Markup Language (XML) that has so far given us RSS and Atom feeds, without which a blog wouldn’t be a blog. XML is similar to the HyperText Markup Language (HTML) that has been behind websites for years, but it also provides the ability to define custom tags. These can be used to describe the type of data contained between the opening and closing tags. In this manner a single text document can provide information about data and the structure of these data. This is what takes us closer to the goal of having a document that can be read by humans and machines alike. Widespread adoption would give rise to the Semantic Web.

    Great where does that get us?

    Once data can be fully understood be machines as well as us humans, we can delegate the task of filtering all those hits to our machines. Why not? Not only are they far quicker at this sort of thing, but they don’t get bored doing it! Well… not yet they don’t, but what if we have to use artificial intelligence in order to enable these machines to understand the meaning of that for which they are searching? And you thought you argued with your computer now!

    Categorised in:

    No comments.

  7. I’m finding increasing interest in the possibilities raised by mobile communications and devices. A survey by Informa Telecoms and Media estimated that there would be over 3 billion mobile phone subscribers throughout the world by the end of 2007. The fastest growing markets are in India, China, Africa and Latin America where slightly older fashioned phones are extremely popular.

    Old they may be, but being capable of accessing the Internet has been a basic feature of Western mobile phones for sometime, so these older phones should be able to manage it. Lets face it, when I first regularly started surfing the Web I was using a 75MHz Pentium. Almost any phone sports a far higher specification than that venerable machine. Indeed, if you ignore graphics, most modern phones have a performance close to that seen in desktops only a few years ago.

    Even if most of that audience doesn’t subscribe to a package that provides data transfer, and I don’t yet, that’s still a very large potential audience. It started me wondering whether the mobile phone, handheld, smartphone or whatever you want to call the device could become the principle way of accessing the Web in the future.

    The personal computer.

    As I said above, these devices already have the performance edge on what I considered to be my PC a relatively short time ago… albeit in real everyday world terms. They are capable of running a wide range of applications up to and including Microsoft Windows and Office. Combined with some data services available today rivalling the speed provided by mainstream boardband, let alone dial-up networking, and you’ve got a powerful computing tool.

    So why aren’t I using one?

    Because there are a few hurdles to jump first.

    1. The price for data transfer and internet access charged by major networks is far too high, but the indications are that it’s going to fall soon.
    2. User interaction is limited by a couple of features:
      • User input is difficult with a phone keyboard, especially if your old like me.
      • Small screens limit the amount of data that can usefully be displayed.

    Navigation and user interaction can be simplified and using web standards for website design, improving accessibility on a small screen and useless keyboard.

    The download size of mobile websites can be minimised to reduce use of your expensive bandwidth and improve speed. Is this just like the old days of the Web or what?

    Ultimately, I think that the mobile Web will be built on web applications customised for mobile devices. The functionality and presentation of these applications could be optimised for mobile users, but more importantly they will be designed to specific jobs for a mobile audience.

    For example: Ever used Google Maps to get directions before going on a trip? In the future I bet it will integrate with your phone’s GPS function to guide you there whilst finding you the phone number to let them know your on your way.

    Categorised in:

    No comments.