Considering an (x)HTML5 Methodology

Aug 29
TAGS

On Friday, I opened up my mailbox and was pretty stoked to find that my copy of HTML5 for Web Designers by Jeremy Keith had finally arrived, just over two weeks after having ordered it (pretty good coming from the U.S. to Canada). I immediately sat down and started reading it, and finished it up yesterday. There’s a lot of really great material packed into those few short pages and I’m not going to try to dissect it all here.

Instead, I want to consider just one important aspect of this new HTML5 technology: the form of the code.

Prior to HTML5, the evolution of markup for the web had started taking its lead from XML (extensible markup language), which, though it is infinitely extensible through user defined tags, is also extremely and rigidly structured. So, after HTML 4.01, we had XHTML 1.0 which was identical to HTML 4.01 in terms of the tags that it supported, but which instituted an XML syntax, attempting to remove some of the looseness that tended to permeate different documents across the web.

Now, for XHTML to be considered valid, the tags all had to be in lower case, all tags had to be closed (according to the order in which they were opened) and all attributes value had to be contained in proper quotation marks. From my perspective, the benefits of this were several:

continue reading

Posted by Matt Ward | permalink | 10 Responses »

Metaformation

Categories: Articles

Tags: , ,

10 Responses »

Posted: 10:56 AM on Aug 29, 2010

Further Thoughts on CSS, Experiments and Icons

Aug 21
TAGS

Last week, I published an article entitled “Are We Taking CSS Too Far?” in which I looked at the concept of using icons generated entirely with CSS rules. My suggestion was that, while this might be a cool experiment, it really isn’t all that practical in a real world, production environment. To my surprise, the article really took off, and in the span of just one week, it quickly became the most viewed article on this blog (and by a significant margin).

It also seems to have caused a fair amount of discussion (at least for one of my articles). There were an extensive number of comments on the post itself, as well as on Reedit and a site called Hacker News. Jad Limcaco even started a thread over on the Design Informer InForums. As such, there has been a lot of discussion and, while I don’t normally write follow up articles, there are a few things that I wanted to address, based on the comments that came up.

So, if you haven’t read the original article, I’d suggest going out and having a look at that first.

To start, I would like to clarify that I wasn’t really trying to attack anyone with my article. Quite the opposite actually. I was trying to make a point that I thought was important and valid, and in order to do so, I did need to show examples of the types of icons that I was talking about. I tried to do this as respectfully as possible, though, and if it came as anything other than that, I do apologize!

continue reading

Posted by Matt Ward | permalink | 8 Responses »

Metaformation

Categories: Articles

Tags: , ,

8 Responses »

Posted: 2:03 PM on Aug 21, 2010

Designing Like a Writer

Aug 18
TAGS

I don’t think it’s any secret that I enjoy writing. That’s part of the reason that I love running and working on this blog so much (and why I write for other design blogs, too). It gives me a chance to do something that I really enjoy. Moreover, it also provides me the opportunity to combine my love of writing with my passion for design. It’s probably also part of the reason that some of the articles here get a little long sometimes!

Regular readers will also know that my educational background is in English literature, and that I am frequently thinking about the connection between language and design. Well, dear readers, I’ve been doing it again. More specifically, I’ve been thinking about the whole issue of the craft and the process and found myself wondering what it would be like to envision my writing process as a design process.

Designing Like a Writer

Designing Like a Writer

So, that’s what I want to consider in this article.

More specifically, and more personally, I would like to formulate a theoretical design process based on the way that I actually approach most writing substantive projects, such as longer articles, essays and (though I haven’t published one yet) even books.  I will probably focus mostly on essay writing, however, since that’s where I really honed the process down to a fine art back in university.

continue reading

Posted by Matt Ward | permalink | 4 Responses »

Metaformation

Categories: Articles

Tags: , ,

4 Responses »

Posted: 9:10 PM on Aug 18, 2010

Are We Taking CSS Too Far?

Aug 14
TAGS

CSS is a remarkable technology, capable of doing things that I wouldn’t have even dreamed of when I was first introduced to it. And, with added support for rounded corners, box shadows, text shadows, rotation and a wide range of other possibilities, web designers and developers can accomplish all sorts of amazing things when it comes to applying a design to a website.

But are we starting to take things too far?

The design community is awash with all kinds of different “CSS experiments” where people attempt to do some pretty incredible stuff (and quite often succeed). In an article I wrote for Six Revisions a couple months ago, I listed five of the experiments that I found really interesting:

Each of these experiments takes a different approach. Some, like the line graph, have some practical applications in the real world, while others like the CSS fail whale are completely and entirely impractical. It’s certainly interesting to know that it can be done, but that doesn’t necessarily mean that it should be done.

continue reading

Posted by Matt Ward | permalink | 75 Responses »

Metaformation

Categories: Articles

Tags: , , ,

75 Responses »

Posted: 10:32 AM on Aug 14, 2010

Getting to Know Clipping Masks and Layer Masks in Photoshop

Aug 12
TAGS

Today, we are going to look at two of Photoshop’s primary masking techniques – layer masks and clipping masks. We’ll be comparing the two by looking at how they work on a practical level, the basic similarities and the much more significant differences. Finally, we’ll look at how we can actually get the two different types of masks to work together in a design.

I know that a lot of people find the clipping mask to be something of a mindscrew, but I’m going to try to make this as simple and as painless as possible. So let’s get to it.

About Masks

First, let’s establish a working definition of what a mask is. Basically, a mask is an entity which controls the behaviour of a collection of pixels. Generally speaking, this control centres around the relative transparency or opacity of a given layer or group of layers. Wherever a mask is active or “on”, a pixel becomes transparent. Where a mask is inactive or “off”, a pixel remains opaque. Moreover, a mask can be either active or inactive to varying degrees, allowing for a wide range of transparencies.

When combined with Photoshop’s ability to stack different layers, masks become an incredibly powerful tool, which helps grant a designer or digital artist with extremely precise control over the interaction between the different layers. For example, let’s take this beautiful image that I picked up at Dreamstime.

Here is the original image

Here is the original image

continue reading

Posted by Matt Ward | permalink | 6 Responses »

Metaformation

Categories: Tutorial

Tags: , ,

6 Responses »

Posted: 12:52 PM on Aug 12, 2010

Reinventing Yourself as a Designer: Will it be Necessary?

Aug 10
TAGS

The other day, a co-worker and I were talking about a concert that she had attended, which featured a bunch of acts from the era of 80′s hair bands. You’d never catch me at such a show, and I didn’t even recognize any of the band names when she told me, but she did seem to have enjoyed herself. The one thing that amazed her, however, was how many of those in attendance (and on the stage) actually seemed to be stuck in the 80′s.

Reinventing Yourself as a Designer: Will it be Necessary? (image from ShutterStock)

Reinventing Yourself as a Designer: Will it be Necessary? (image from ShutterStock)

Apparently at this show big, bleached yellow hair was still as rocking as it was back when I was all of five years old.

As the conversation continued, I asked her to offer tell me who she considered to be “hair bands”, and she started naming of some of them, most of which I already forget. But then she named Bon Jovi, and that gave me pause. I’m no Bon Jovi fan, but I always thought of him as more of a contemporary adult rock. He might have a bit more flair than some of the others, but I still always placed him as a part of that genre.

Wanting to get to the truth of this matter myself, I looked him up on Wikipedia, where I found this really interesting passage:

continue reading

Posted by Matt Ward | permalink | 17 Responses »

Metaformation

Categories: Articles

Tags: , ,

17 Responses »

Posted: 8:01 PM on Aug 10, 2010

10 Of My Favorite Online Tools for Design and Development

Aug 7
TAGS

As a designer, writer, husband and father (among other things), my life is pretty full and I absolutely love pretty much anything that can save me time. This is especially true when doing my work as a designer. Over the years, I’ve come across a number of awesome little websites and web apps, created by brilliantly helpful people to make my life easier – and yours too.

So, in this article, I’ve decided to share some of my favorite online resources. This isn’t to say that they are necessarily the best or the most powerful. They’re just the ones that I like to use. Some of them are generators of sorts, while others offer customizable and downloadable content that you can use in your own work.

Grids

I like using grids when I build websites, and the one I use most often is probably the 960 grid system, which I wrote about in one of my first posts on this blog. Not only does the grid allow me to create a beautiful, proportionate structure for my designs, it also provides an excellent and consistent framework. This, in turn, means that I can build concepts and prototypes faster than I could if I was coding the entire thing from scratch.

I’ve found this to be especially useful in my last few projects, in which I did a lot more of the design work in the browser itself, rather than mocking it all up in Photoshop.

Anyhow, while the plain-jane 960 grid worked well enough for me for my first few grid-based sites, I’ve been finding more and more that I want to tweak the basic parameters of the grid. For instance, I may want to increase the size of the gutter between columns, or change the number of columns from the standard 12, 16 or 24. Well, there are some awesome grid generator tools out there that I’ve used to do this.

continue reading

Posted by Matt Ward | permalink | 25 Responses »

Metaformation

Categories: Roundups

Tags: , , , ,

25 Responses »

Posted: 9:43 AM on Aug 7, 2010

Driving Online Traffic Offline

Aug 5
TAGS

We talk a lot about the various intricacies of designing and building websites here on the Echo Enduring Blog, but today I would like to look at a somewhat different topic – the concept of actually getting people to visit your website(s). After all, we put a lot of work into creating beautiful, intelligent and usable designs, but it doesn’t really accomplish all that much if nobody ever visits the site right?

Driving Online Traffic Offline

Driving Online Traffic Offline

Of course, we frequently read about the benefits of search engine optimization (SEO) and search engine marketing (SEM), and there’s no doubt that if you can hit it big with the right keywords on Google, you’ll see a ton of traffic coming in. But, unless you are specifically crafting your content to appeal to Google rather than your readers (not something I really recommend), it can also take a good amount of time to really get the search engine juices flowing.

I’ve been blogging her for over a year now, and it’s only recently that I’ve started to see a bit of a rise in search engine traffic. I’m still not anywhere close to where I’d like to be either. Granted, some people have done it quicker than I, but it’s still a difficult and competitive process.

continue reading

Posted by Matt Ward | permalink | 12 Responses »

Metaformation

Categories: Articles

Tags: , , ,

12 Responses »

Posted: 4:42 PM on Aug 5, 2010