Web design articles, tutorials, and more.
To make the web impressive.
Web Design Articles
CSS Font Shorthand Property Cheat Sheet
By Louis Lazaris on March 17th, 2010
Categories: Markup & Style, Web Design Articles | 9 Comments >
In the past I’ve displayed some serious animosity towards the CSS font shorthand property, so I feel I should make up for it. After all, the font shorthand property was just minding its own business, trying to save developers some lines of code, and I come along and declare it an outcast. So, although I still don’t agree with ever using font shorthand, I do think it’s important that CSS developers understand how it works.
So to make up for my former font shorthand hostilities, I’ve prepared a printable cheat sheet that you can download and hang next to your computer, which will come in handy in case you decide to use this property yourself, or are forced use it in a stylesheet from an inherited project. Enjoy!
How to Get 100+ Comments on a non-Contest Blog Post
By Louis Lazaris on March 8th, 2010
Categories: Web Design Articles | 7 Comments >
I had to qualify that title, because by far the easiest way to get hundreds of comments on any blog post is to give something away to a randomly chosen commenter. But as bloggers we’re always in search of ways to create a little bit of buzz to increase page views and overall reader participation through re-tweets or comments.
As a web design writer, I do feel that it’s not only necessary to educate and get people thinking, but I feel I have an obligation to entertain my readers in the process of said education. Sometimes, however, entertainment and education are not enough, and it’s necessary to cause a little bit of controversy to get readers thinking, commenting, and in some cases, downright angry.
In this post, I’ll briefly outline 4 ways that are almost guaranteed to elicit at least 100 comments, and get the community buzzing.
Getting Buggy CSS Selectors to Work Cross-Browser via jQuery
By Louis Lazaris on March 1st, 2010
Categories: Scripting, Web Design Articles | 7 Comments >
Although the lack of cross-browser CSS selector support has caused a number of useful CSS selectors to go almost unnoticed, developers can still manipulate styles on their pages using some of these little-used selectors through jQuery.
Below I’ve prepared a simple table that describes a number of CSS selectors that are not cross-browser compatible, along with the jQuery syntax for each. The syntaxes are exactly the same as they would be in CSS, save for the jQuery wrapper (just remove $() and the quotes to get the CSS syntax), so using these selectors in jQuery will provide somewhat of a practice ground to prepare you for when they’re fully supported by all commonly-used browsers.
CSS3 Click Chart
By Louis Lazaris on February 3rd, 2010
Categories: Markup & Style, Web Design Articles | 15 Comments >
Since my knowledge of CSS3 is fairly shoddy, I decided to create and release a CSS3 “click chart” or “help chart” (for lack of a better term) that displays examples of some of the newest features in CSS.
The initial release only has 8 examples, with more to be added in the future. Each example visually displays the CSS3 feature, with a clickable heading that opens a box at the bottom of the page for information on that particular feature.
The box that opens gives a description along with browser support, an external link (usually W3C info), and some example syntax taken from the CSS of the page itself.
New Website Launch: Interviews by Design
By Louis Lazaris on January 26th, 2010
Categories: Web Design Articles | 4 Comments >
Today I’m happy to announce the launch of a new project I’ve been working on since late December. It’s a simple website called Interviews by Design that will be a repository of 5-question interviews conducted with designers from around the world.
The name has a two-fold meaning: (1) The interviews are conducted with designers; (2) Each interview asks the same five questions, thus they are in that format “by design” (meaning done intentionally).
And I should probably give credit to Chris Coyier of CSS-Tricks for popularizing the 5-question format in the design niche (although he may have borrowed the idea from another blogger or Craig Kilborn, I’m not sure).
Response to “In Defense of Vertical Navigation”
By Louis Lazaris on January 12th, 2010
Categories: Graphic Design & Layout, Web Design Articles | 7 Comments >
It’s been quite a start to this week since the publication of my article on Smashing Magazine called The Case Against Vertical Navigation. I really didn’t expect this type of response. I assumed that what I was stating was a fairly commonly held view among designers.
Since there have been a lot of criticisms of Smashing Magazine over the past year (mainly because of endless “list” posts), Vitaly Friedman was more than happy to publish an opinion piece on a specific aspect of design. So, if you haven’t read the original article yet, please do. And please read Kyle Meyer’s response to my article, which I will be responding to here.
I’m glad Kyle posted his response; as Jacob Gube mentioned in both SM’s comments and on Kyle’s site, this type of discussion is good, regardless of who is right and wrong.
Impressive Webs Redesign
By Louis Lazaris on November 30th, 2009
Categories: Graphic Design & Layout, Web Design Articles | 8 Comments >
Over the weekend I rolled out a new “skin” for Impressive Webs, which I think improves the site’s design quite a bit. There’s more contrast, which creates a more distinct experience. And I finally have a logo that I’m satisfied with.
The layout of the site remains virtually the same, so, like I said, it’s not as much of a redesign as a “skinning”. I did change the height of the top navigation bar, and added some new graphics.
Audio Comments on Blogs — Now That’s a Great Idea!
By Louis Lazaris on November 7th, 2009
Categories: Web Design Articles | 10 Comments >
I was reading an interesting article on Boagworld called The biggest ecommerce lies and how to avoid them and I noticed that the author posted an audio comment to respond to some of the other comments that had been posted.
Will EOT Become the Standard for Font Embedding?
By Louis Lazaris on October 21st, 2009
Categories: Graphic Design & Layout, Web Standards & Best Practices | 5 Comments >
If you’re at all familiar with the various methods in use today to embed custom fonts in web pages (sIFR, Cufon, @font-face, etc), then you also may have heard of a font format called EOT. Well, if Microsoft has it their way, EOT will become the standard, allowing web developers — with permission from font vendors — to be free to use virtually any font in a text-friendly manner in their web pages.
So what is EOT, and how has Microsoft pushed to standardize this method? Embedded OpenType fonts are compact OpenType fonts designed by Microsoft for use as embedded web fonts. They are recognizable by their “.eot” file extension. By means of data compression and removal of superfluous data, EOT files are made small in size and include features that protect the fonts themselves from being copied and used in unauthorized ways.
Take the Pedals Off Your Bicycle and Become a Better Web Developer
By Louis Lazaris on September 27th, 2009
Categories: Freelancing, Web Design Articles | 10 Comments >
Over the weekend, my wife and I had the privilege of taking care of two of our friends’ children, while their parents had a night out at a local show. When the kids’ mom was showing us a few things around their apartment, we noticed that their daughter’s bicycle had no pedals on it. That was a little peculiar, so we inquired about it.
Her mother said she wanted her daughter (who is about 5 years old) to have her feet on the ground as she learned to ride her bicycle. This would allow her to remove her feet from the ground only for short amounts of time, thus practicing her balance without pedals or training wheels. In this way, she could focus purely on balancing herself, and not worry about trying to do more than one thing at a time.
I’m not really sure where her mom got this idea from, or even if it is any good for learning to ride a bike, but it reminded me of what I personally prefer when it comes to learning new skills in web design or development.
