Web Complexity

Every time I attend a developers meetup in Charlottetown I am inspired by their efforts to manipulate machines and wrought by headaches at how complex creating simple websites seems to have become; at least compared to the days when I got started. These meetups often give you the opportunity to view source, the key means by which most of us used to use to learn. It reminds me again of the essay by Frank Chimero, Everything Easy Is Hard Again:

Illegibility comes from complexity without clarity. I believe that the legibility of the source is one of the most important properties of the web. It’s the main thing that keeps the door open to independent, unmediated contributions to the network. If you can write markup, you don’t need Medium or Twitter or Instagram (though they’re nice to have). And the best way to help someone write markup is to make sure they can read markup.

I’m not insinuating that the developers at these events write inelegant code, but that all the complexity they are knee deep in used to be the purview of people writing code to manipulate data, not display mark-up.

This blog, thanks to WordPress gobbly-gook, and my own laziness suffers from code complexity, as do far too many local websites I’ve seen created by the multitude of marketing agencies here on PEI. You would have to have an almost religious conviction to abandon the ease of WordPress, all its repugnant plugins and themes, to create simple lightweight websites.

My good friend Chientai and I used to be believers, but I left the faith to focus completely on user experience. He now has a mountain farm and promotes permaculture.

I have a number of web projects on the horizon and I hope I have the time and patience to develop it with code readability in mind – it shouldn’t be that difficult to create a simple, responsive layout with nicely set text.

Learn to do it yourself

I’m taking a break from what I consider hell … trying to massage a WordPress theme to fit my humble needs. The ftp client crashed taking all my tracked changes with it and now the website won’t load.

It’s a lesson and a longing for a return to my former self when I had time to labor over a non-client project, building everything myself. I have so much respect for product designers who, like the web designers of lore, can create the whole stack, and make it look and work great.

This is one of the reasons why I started learning programming in earnest. To have more control over what I wanted to create. Self-reliance. And it’s why I plan on spending time in late summer, hopefully much sooner, brushing off my web development skills so that I can stop this WordPress bloat that has appeared in many of my web projects these past number of years.

I miss MoveableType, it’s flat files and mark-up language, and of course it’s speed. I made my own themes then and didn’t add every possible feature, javascript framework, or plugin that makes decoding and paring down each and every WordPress website a bloody nightmare.

Making it hard

As someone who has decades of experience on the web, I hate to compare myself to the tortoise, but hey, if it fits, it fits. Let’s be more like that tortoise: diligent, direct, and purposeful. The web needs pockets of slowness and thoughtfulness as its reach and power continues to increase. What we depend upon must be properly built and intelligently formed. We need to create space for complexity’s important sibling: nuance. Spaces without nuance tend to gravitate towards stupidity. And as an American, I can tell you, there are no limits to the amount of damage that can be inflicted by that dangerous cocktail of fast-moving-stupid.

The web also needs diligent people so that the idea of what the web is and what it does remains legible to everyone. This applies to being able to read the systems and social environments the web creates so we know what’s real and what’s not, but the call for legibility should also humbly apply to writing legible code and designs systems that are easy for nearly anyone to interpret thanks to their elegance. That important work has a place, too.
Everything is Hard Again, by Frank Chimero

I got my start 22 years ago crafting together websites using simple bites of mark-up language, dollops of drop shadowed graphics, and later simple interactions, readable typography, and fluid layouts.

Welcome to my corner of the WWW

I’ve spent the last number of years far more focused on software, in roles more akin to user research than design, and as I plan a return to designing for the web sometime this summer, I am surprised at the complexity that confronts me. The similarities to developing for iOS are too striking. It feels like the days when I alone could deploy a website without the help of an engineer are gone. Or at least without the talents of said engineer. The consummate web designer must be rarer professional today than in the past (does the title even exist any more?). I thought a self initiated project would suffice to bring me up to speed, with maybe time for a short course on PHP, but to my surprise I may need to devote serious effort to just creating what I thought would be far more straight forward by now. To manage this complexity I’ll likely follow a path similar to Frank Chimero and forget the dazzle dazzle and just focus on clean simple communication.

Businessweek ad placement

Great ad placement Businessweek! Thankfully I can still see the printer friendly page, which is mislabeled. It should be labeled reader friendly. I can understand the need to display ads – I display some adsense ads which cover my hosting costs – but must they be so reader hostile?
One thing that is missing from this screenshot is a fly over ad which covered even more of the viewable area. Do these tactics really work in the long run?
As appears in Firefox and safari.

The Mother of All Footers

For ages we have ignored the bottom or footer section of our screen designs. We bought into and never lost the notion that the only part of the screen that had any value was the first view and that anything below the fold was seldom read. For the most part that has been disproved but old habits die hard – just look at the footer section of this webblog as evidence.
In the last year or two I have seen a increasing number of sites using this part of the screen to in corporate all kinds of different data. But this example must certainly be the most “bottom heavy” or have the greatest density of data I have seen on any site to date. At approximately 950px in height it certainly is visually impressive. Outside of the obviously performance penalties, and this particular site tends to be on the slow side, I wonder what the positive or negatives of this kind of approach could be (this same wayfinding footer is on every page)? Looks like a good candidate for some testing.
Found at Forumosa.com

Web Design Guidelines (old)

I have been reviewing old documentation lately and came across this old guideline that I created in 1999. Six years feels like an eternity. These guidelines were for a large corporate web site redesign, the largest I had been involved with up to that point. I think there is some things to be proud of with the work we did on the site and the documentation. We set-up a weblog (unfortunately the content has been lost), which in 1999 wasn’t a mainstream idea, and we were granted a certain amount of liberty with the visual design of the documentation; liberty which I would never take now nor be granted. We managed to produce (there were two of us) this documentation in print and the web in both Mandarin and English. Unfortunately the mark-up is an entirely awful by-product of Dreamweaver or GoLive – I can’t remember which tool I was using then. There are some good tidbits in there even now and it’s a good exercise for me to see where I was thinking way back then.
Read: Web Design Guidelines.

Offshore design

“Web designers are everywhere, and web hosting is cheap. It is just much cheaper in India. So, 30 gbp paid via PayPal.com to templatekingdom.com got me a website design, an hour of the designer’s time for changes, and a year’s hosting for good measure. In 24 hours, and for less than the price of a few rounds in a pub, I had a new, uniquely designed website up and running. For small businesses needing a home page, why spend hundreds of pounds on a domestic designer, when something just as good can be commissioned from designers in India or Bangladesh?”
Guardian Unlimited | Online | Ben Hammersley: Swift and offshore

Introduction to CSS + HTML

“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. After that, you can read any of a number of other tutorials to add more features to the HTML and CSS files. Or you can switch to using a dedicated HTML or CSS editor, that helps you set up complex sites.”
Good tutorial but interestingly it has huge display problems in Mac Firefox.
Read Starting with HTML + CSS.

Thunderbird email

Everyone is asleep and I am taking an evening off so I decided to check out the release version of Mozilla’s Thunderbird e-mail client. Certainly not an exciting evening but I have always been game to try new software. Off to the Thunderbird product page I go to download this Apple Mail competitor. The only problem is there is no download link on their product page. Nowhere is the keyword “download” to be found. We have Thunderbird FAQ and help, knowledge base, support and development forums, get extensions, get themes rounding out many of the other possible tasks visitors to this page might have. No download link though.
Not sure how the most obvious of tasks could have been omitted from the most viewed page on their site.
I have the feeling that I am babbling on about nothing (I know I am) and the download link was removed on purpose. Likely it will reappear shortly.

A decade of good website design

The web looks very different today than it did 10 years ago.
Back in 1994, Yahoo had only just launched, most websites were text-based and Amazon, Google and eBay had yet to appear.
But, says usability guru Dr Jakob Nielsen, some things have stayed constant in that decade, namely the principles of what makes a site easy to use.
Dr Nielsen has looked back at a decade of work on usability and considered whether the 34 core guidelines drawn up back then are relevant to the web of today.
“Roughly 80% of the things we found 10 years ago are still an issue today,” he said.
“Some have gone away because users have changed and 10% have changed because technology has changed.”
Read the article

Chientai – Time to Know Semantic Web

Chientai is forming some thoughts on the semantic web. Some great thinking here which I will post in there entirety, unless he complains after which I will remove, just in case the company server he runs his blog on disappears forever.

“The bane of my existence is doing things that I know the computer could do for me.” — Dan Connolly, “The XML Revolution”
I do not 100% agree with his opinion. For example, the computer can record my anniversary and then order and send flowers to my wife on the very time. But I don’t think it will be a bane of my life to send the flowers by my own.
Even though that, it still tells something true. It is unreasonable to create a useful tool and you still do the jobs the tool can do for you.
If we human being want to make any progress, just like Sir Isaac Newton said, it is necessary to stand on giants’ shoulder. I think the Web is one of the giants. And what does the “stand on” mean, I think that means using, combining, integrating and recreating.
More than 10 years’ developing, the Web has gathered enormous information. People and variant systems had been cooperating to create every kind of content. It is time to think how to reuse and integrate them.
I belief that Semantic is one the easiest way to fulfill this idea. Can you imagine that internet has formed a giant tower and you want build something on it. Would you go downstairs to collect the materials you need? No, it is impossible. So you have set down some kind of mechanism to let machines (or agents) to do that for you. You have to make those materials the paths known by those machines.
To make the Web known by agents and machine-process able is “Semantic”.

@itri:::8:30~18:00:::: Time to Know Semantic Web

Choosing a website design (Stuff)

Rather interesting analogy – though a bit far removed for those of us living in the greyness of urban Aisa.
“The relationship between design and information is similar to that of landscaping and gardening – you are essentially working with the same material but are applying established principles to deliver a superior result.
The challenges presented in transforming a plain enclosure into a delightful garden, similarly, are not unlike those of turning images and information into an online experience.
While not wanting to belabour the analogy, landscaped gardens and immersible websites share another important characteristic – they are planned to be experiences, not simply places to display plants or information.”
Read the article

Eyetrack III (how average web users view web pages)

Poynter’s latest eye tracking study revealed an interesting observation that runs counter to much current practice and commonly held belief’s.
“Dominant headlines most often draw the eye first upon entering the page — especially when they are in the upper left, and most often (but not always) when in the upper right. Photographs, contrary to what you might expect (and contrary to findings of 1990 Poynter eyetracking research on print newspapers), aren’t typically the entry point to a homepage. Text rules on the PC screen — both in order viewed and in overall time spent looking at it.“(emphasis mine).
Read:Eyetrack III – What You Most Need to Know

Web development mistakes

A great article at Berea Street on some of the most common mistakes that experienced web professionals tend to make. A couple on this list really hit home with me which I will echo here:
(too much) Visual thinking
Treating the web as WYSIWYG – starting off by focusing on how things look instead of thinking about structure first, and presentation later.
Lack of semantics
Non-semantic markup. Basing the choice of which HTML element to use on the way most graphical browsers render it by default, instead of on which meaning the element has.
Read: Web development mistakes: 456 Berea Street

About pages

I have always found writing an about page an extremely painful process on any personal project I have been involved in. ‘Asterisk*’ has a good article providing guidleines for developing these pages, guidelines which I should really follow on my personal and should take into consideration for my professional works.
“Many Web sites, especially content driven sites, should have some kind of about page. In this post I explain why you might need one and give some quick tips on what makes a good about page.”
Read: A Good About Page