If you're looking to collect information from your users, there isn't a much easier or more straightforward method than a Web form. If designed well, Web forms provide valuable information; if not, they may scare users away. With this in mind, here are a few key tenets of Web form design that every designer should know. All the examples in this article were created with CoffeeCup Web Form Builder .
"Simplify, simplify, simplify." It's one of Thoreau's most enduring witticisms, and with good reason. When faced with the ever-increasing barrage of information that is modern life, many people find solace in minimalism. This trend has taken an especially strong hold on the Web. Minimalism and simplification draw attention to important page elements. Using lots and lots of empty space makes content stand out.
Part two of last week's examination of the personality of punctuation. Click here to read Part 1. Em Dash and Hyphen Em dashes and hyphens are sisters, and whenever they go out together, they get stopped by strangers. "Are you twins? You all look so much alike!" At this, they roll their eyes. Sure, they look similar, but it's obvious — to them, at least — that they're each completely unique.
It's easy to resent punctuation. Its purpose is to clarify sentences, so why are the rules governing it so complicated? There are so many exceptions, so many exceptions to exceptions — it's enough to make you want forego punctuation altogether. Well, back when it was alive and kicking, the Latin language did just that — and it didn't stop there. Written Latin also omitted spaces between words or lowercase letters.
The Web has grown into a real jungle, and finding cool new sites nowadays isn't always the easiest thing in the world. If you have a Website yourself, you're dealing with the other end of this issue. How do you get noticed online, and is there anything you can do to increase your popularity? There certainly is! Here are the top five ways you can strengthen your site and increase your online visibility.
American English grammar is fraught with peril, filled with constructions, conventions, and exceptions seemingly designed to trip you up. Is it who or whom, further or farther, lie or lay? Should you use which or that, however or while, i.e. or e.g.? And let's not forget about more intimidating mistakes, the ones that sound like Spanish Inquisition-era torture devices (split infinitive, comma splice) or gross bodily functions (dangling participle, double copula).
For the third-largest minority group in the United States — more than 40 million people — the vast majority of Websites are partially or completely inaccessible. The idea of a Website that excludes African-Americans or Latinos is all but unthinkable, yet Americans with disabilities are constantly faced with Websites that don't take their needs into account. Fortunately, many of the world's most popular Websites — among them Yahoo!
Hold on tight, people: I'm about to take you way, way back. Think back to a time before the Internet, before computers, before typewriters, back when the word “America” was still fresh on the lips of European colonists and people were still getting used to that newfangled Gregorian calendar. I'm talking about the 1600s, the Renaissance, perhaps the highest pinnacle of European art and creativity.
In these shaky economic and political times, it's important to put aside our conservative-versus-liberal differences, to shun petty political squabbling and come together in perfect bipartisan agreement about an important issue facing this election: Web design. I don't care who you are, whether you're a staunch conservative or a hardcore liberal, a Republican, a Democrat, or an Independent — we can all agree that Barack Obama's Website is freaking gorgeous.
As a designer, do you know where your work really fits in the process of design? We all love Web design. Looking at a blank white box on a computer screen and using only your mind's eye, a mouse, and a keyboard to transform it into a living, breathing Website is no minor feat, and there is undoubtedly a creative rush when it comes to doing something like this. Web design can be a strong artistic outlet and it inevitably brings with it the joy that comes with looking at your finished work and presenting it to others.
I get anxious in certain environments. The reasons for this can vary from general disorganization, to bad lighting or clashing colors, but the biggest culprit is usually clutter. Clutter is the stuff that has no "place," doesn't belong with its surroundings, and serves little to no purpose. It's not that I'm a clean-freak, it's that I'm a designer, and I have a heightened sensitivity to things that are out of place or irrelevant.
What are Web safe fonts? Practically every personal computer has a set of fonts installed. These fonts are usually put there by the computer manufacturer or are the default sets of fonts for the operating system that computer is using. It's possible to install additional fonts on your own. However, not all font sets are created equal. Different computers can have very different sets of fonts installed, and most casual computer users never know the difference.
One of the greatest aspects about the Web is that it's such an open platform, especially for design. The accessibility and freedom of the Web allows designers to do some very nice-looking things, and it allows for experimentation and interpretation. Unfortunately, it also allows for some very bland-looking things, too. Let's take a look at some bland designs and some grand designs, and take a peek at what makes them that way.
They've been around for a while now: reset style sheets. They're becoming more commonplace among web designers, and even Yahoo is using a reset stylesheet of their own in their development. There are a few different viewpoints and opinions on the use of reset stylesheets, though. Do you reset? What are reset stylesheets? For those that don't know, a default reset stylesheet is a .css file that you use in your HTML documents.
Do you have a good Web design? I'd love to see it. As part of an upcoming article for WPDFD, I'm going to showcase and discuss some good-looking, functional, and well-coded designs. If your design can match any of these three primary descriptors, a screenshot of your design and a link to your site might make it into the article. Just drop me a line at email@example.com with links to any of your designs that you think should make it.
As the practice of Web design ages, some common rules and "best practices" inevitably embed themselves in the craft. Among these are the processes for using specific types of semantics when coding your site, like using divs as hooks in your X/HTML for your CSS, and making your page beautiful and functional that way. Another is to ensure readability of your site by choosing a proper number of fonts (generally, no more than three or four, and for the minimalist, one or two).
Typography is an important part of Web design. Just like in the print world, your content needs to be readable to your viewers for it to be of any use. As a general rule, you want to make sure your Web site provides as little resistance as possible to the user, and the easier your site is to read, the better. CSS provides three very useful properties to enhance the readability of your site: font , line-height , and letter-spacing .
Recently, I took up a project. A co-worker of mine created a fully standards-compliant XHTML website from the ground up titled HTML for Beginners, which will be released sometime soon. His code was hand-written and it's elegant and functional. On the homepage of the site, he used a three-column layout with a header and footer, and on the interior pages of the site he used a two-column layout. Here are screenshots (the look of the final site may change, hence no direct HTML links): Original design; strict, valid XHTML; top-level page: Original design; strict, valid XHTML; interior page: My project was to take four programs: CoffeeCup Visual Site Designer, Microsoft Expression Web, Adobe Dreamweaver, and Microsoft Frontpage 2003 and attempt to recreate the two designs above.
HTML is hot again. Some time ago the HTML5 promo machine got up to speed, causing a little mini-fuss. In a parallel universe, others are still putting a lot of time and effort into the development of xHTML2. This (public) renewal of interest in HTML caused plenty of discussion, revealing several blank spots in the general knowledge of HTML. This article will hopefully plug one of the most notorious holes shut.
In the first installment, Twelve Things Most Sites Need - Part I , I offered a six-pack of must-haves. Specifically I suggested sites should have a proper navigation menu , a meaningful, well-formed title , a method of contact , a site map , passive accessibility , and standardized markup . Now, as I offered the last six, in the order in which I thunk ‘em up, here is the balance. 7.