Web Design Articles

A New Book on HTML5 and CSS3

By Louis Lazaris / May 18, 2011 / 7 Comments

Over the winter and spring I’ve been pretty busy researching and putting the final touches on four chapters of a new book published by SitePoint.

The book is called HTML5 & CSS3 for the Real World and was officially launched on SitePoint this morning (North American time).

Two other authors took part in this exciting new project: Estelle Weyl — who probably doesn’t need much of an introduction if you’re familiar with many conference speakers in the web standards world — and Alexis Goldstein, a well-rounded programmer from Brooklyn.

The Browser Performance Pickle

By Louis Lazaris / May 11, 2011 / 14 Comments

If you’re starting to incorporate some HTML5 and CSS3 into your pages, then you’ve probably also looked into the possibility of polyfilling those features for older versions of IE.

Of course, you could instead opt for “progressive enrichment” and leave IE in the lurch while prettying things up for the newer browsers. That’s the method that Andy Clarke recommends, and it’s certainly a valid option.

But if for whatever reason (usually something political or the fact that the client demands it) you have to give IE a similar experience, then you face a very bizarre circumstance.

Why Developers Should Be Studying HTML5’s Design Principles

By Louis Lazaris / April 1, 2011 / 6 Comments

This is not going to be a long article, but just a quick note about something that all front-end developers should be paying attention to.

If you don’t already know, the W3C has formulated a fairly brief, yet valuable document called HTML Design Principles that outlines exactly what principles have guided and continue to guide the creation and evolution of HTML5 and its related APIs and other technologies.

Targeting HTML5’s Semantic Elements with CSS

By Louis Lazaris / March 29, 2011 / 15 Comments

It would seem that with the introduction of HTML5’s semantic elements, styling those new elements should be an easier task. But as I’ve started to use HTML5 more, I’ve realized that it takes quite a bit of forethought to create maintainable CSS that targets the new semantic elements in a future-proof way.

In some cases, it could be fairly straightforward, but in others it’s a little disheartening because targeting the new elements actually creates more verbose markup.

Let’s consider a few examples. If you had a page that used the <header> element to hold the logo, nav, etc, and the <footer> element to hold the website’s footer, then your CSS would look something like this:

Benefit From Flame Wars in the Web Design Community

By Louis Lazaris / March 4, 2011 / 3 Comments

Alright, that title might be a bit exaggerated. Flame wars are bad for the community, and I don’t condone them. I think differences of opinion can be expressed in respectful ways that don’t involve unrelated personal attacks. I guess what I really mean to say here is that you can benefit from “heated discussions” that sometimes escalate into flame wars.

But nearly every super-heated discussion (whether in the web design community or elsewhere) has a common denominator: Two opposing sides with valid points of view. It’s unfortunate that sometimes these discussions turn a bit ugly and the actual pros and cons being discussed can go somewhat unnoticed and often forgotten.

Browser Support for CSS3: What’s the Current Status?

By Louis Lazaris / March 1, 2011 / 39 Comments

Creating a website with HTML5 and CSS3 without having to worry about using techniques like progressive enrichment and polyfills is the ultimate dream for modern-day front-end developers.

But unfortunately, mainly because of the widespread use of IE6-8, that is still just a distant dream. But it is getting closer.

Where Do You Send Users When They Log In to Your App?

By Louis Lazaris / February 2, 2011 / 14 Comments

Here’s a nice lesson for web app designers and developers, to help streamline the user’s progress when interacting with your application.

In many cases, it’s enough to log users in and then redirect them to the main screen of the app, where they can then choose what they want to do. It’s also good practice to send them back to whatever screen they were on before they logged in, instead of just sending them to the main screen.

But here’s a way to handle a user log-in when the user has not yet interacted with your pages, as shown below from PayPal:

Your iPhone App is Waaaaay Too Expensive!

By Louis Lazaris / January 26, 2011 / 24 Comments

What?? $3.99 for an iPhone app? Are you crazy? The nerve of some people. Lunatics.

How can you expect me to pay $3.99 for this? Every single iPhone app I’ve ever downloaded is either free or costs 99 cents. Now, you expect me to pay $3.99, and all I’m able to judge it by is a couple of screenshots, a brief description and a few shill-sounding reviews.

[insert new technology here] is the New [insert old technology here]

By Louis Lazaris / January 23, 2011 / 0 comments

I wanted to tweet this, but it was too long for Twitter so I thought I’d just post it as a short piece for the weekend.

For those who haven’t seen the news announcing changes to the HTML5 spec on the WHATWG blog, be sure to read that and some of the comments.

But the funniest and most brutally honest comment belongs to someone posting under the name “Hamranhansenhansen”.

What is “Good Design”?

By Louis Lazaris / January 20, 2011 / 14 Comments

Aesthetics, organization, structure, compatibility, mobile-friendliness, best practices, minimalism, typography, color choice, drop shadows, rounded corners, responsiveness, usability, user experience, CSS3, HTML5, jQuery — none of those things is integral to what ultimately falls into the category of “good design”.

What matters the most — that is, what truly puts anything in the category of “good design” — is whether or not the thing you’ve designed achieves the end result you desire.