Web Design Articles

This section of Impressive Webs features articles covering front-end technologies like HTML, CSS, and JavaScript. Some of these posts are opinion pieces and others are more research-based discussions of standards and best practices, with occasional roundups.

IDs Will Not Make Your Documents More Semantic

Stack of BooksBefore I get into the meat of this post, I’ll just provide some context. Last week, Harry Roberts posted a fantastic article discussing his view of bad CSS. In that article, as he’s done before, he disourages the use of IDs as selectors.

In response, Jeffrey Zeldman tried to defend the use of ID selectors. I posted a few comments in response to Jeffrey and another commenter, explaining why their views were wrong.

CSS Things That Don’t Occupy Space

on | 7 Comments

CSS Things That Don't Occupy SpaceIn most cases, when you place an element on the page in your markup, if you don’t specify any special styles, it will occupy exactly the same space that it appears to occupy visually.

In other words, if you place a box sized at 200px by 200px on your page, anything you place after it in the source order, with no further styles added, will occupy the space below or beside the green box, outside of those set boundaries.

But not everything on an HTML page occupies space that is honored by other elements. I thought it would be interesting to list and describe all the things in CSS that don’t occupy this kind of physical space in an HTML document.

Custom Zenburn Theme for Sublime Text 2

Zenburn Theme for Sublime Text 2For a while now, I’ve been using Notepad++ with a customized version of the Zenburn theme, which was originally created for Vim.

This week I finally started fiddling around with Sublime Text 2, and I like what I’ve seen. Although I like the default Monakai theme, I prefer my old customized version of Zenburn from Notepad++. So I forked the Zenburn repo and made my alterations.

Dropping -ms- Vendor Prefixes for IE10

on | 8 Comments

Dropping -ms- Vendor Prefixes for IE10The upcoming IE10 will continue to have strong support for a number of CSS3 features and HTML5 APIs.

But if you haven’t yet heard, many of these features will be supported in IE10 unprefixed. These include gradients, animations, transitions, and more.

The Truth About IE10

The Truth About IE10There’s been a lot of talk about IE10, and what it supports, and the great improvements it’s made.

Taking all the latest news into consideration, I summarize my thoughts on this subject in this post.

Defining the Click Area

Defining the Click AreaWhen you code a button or other clickable element, you need to also define a comfortable click area. Depending on the context and the design, this can sometimes be a challenge. Let’s look at a few examples in a short case study, so we can see the various ways this can be done.

Some navigation bars that I’ve seen are quite paradoxical in the click area they define. Look at the screen shot below showing the main nav bar for WebProNews.

Should a Project’s Cost Depend on How Much it’s Worth to the Client?

CashI think for most freelancers, the rate we end up charging for any design or development project generally depends on, and is focused on, the work we do (i.e. we have an hourly rate, or a fixed price for a certain type of job).

True, we might change our prices in certain cases. For example, if we know we’re dealing with a high maintenance client, or we’re developing something for a non-profit.

Another Redesign for Impressive Webs

Another Redesign for Impressive WebsI don’t know how many times I’ve redesigned this site over the past 4 years, but here’s another one, just launched this morning.

Layout-wise, there’s nothing really all that different. It’s more of a different skin than anything, and (out of sheer laziness) the comments and footer area have pretty much remained the same. Basically, I got tired of the dull looking header/sidebar in the previous design and wanted something cleaner and with a little more color.

What Advice Would You Give to a CSS Beginner?

ChalkboardRecently, a friend who used to do some web design years ago approached me with some questions about getting back into front-end coding. She doesn’t have a programming background and, from what I understand, her experience in coding is limited to old-style HTML using tables and very little CSS.

She says she finds all the stuff associated with front-end development to be quite overwhelming. Well, she’s not the only one. I think we all feel frustrated at the amount of reading and research that’s needed to keep up with things in the industry.