Web Design Article Index
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 drodriguez@wpdfd.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.
There are a plethora of Websites out there, each one unique in its design, its content, markup, features, functionality, and in myriad other ways. Yet, despite these differences, there are specific needs that should be met with near consistency, Internet-wide, regardless of the site. Let’s take a look at twelve of these common denominators. Below are the first six. They appear in the order in which I thunk ‘em up.
Having a local development environment is an excellent idea. It is not at all difficult these days to install a xAMP stack. By this I mean an Apache web server, a MySQL database, and PHP/Perl. There is XAMPP for Windows and Mac, LAMP for Linux, and MAMP. My preferred development environment is OS X and MAMP. The MAMP Package You can download this complete, self-enclosed web development environment from the MAMP website.
We're entering an exciting period in the history of the Web. Since the 90's, the Internet has embedded itself in our lives in ways we couldn't have imagined. I'd be hard pressed to find a lad in my school who doesn't have a MySpace , Facebook or Twitter profile, a Flickr account or a blog. Kids younger than me now interact confidently with the Web without fear of being labelled as geeks or nerdy.
We frequently get responses and e-mails from viewers, and I see it requested all the time in user forums and elsewhere around the web: how do you remove the underline from links in your Web page? First Method: Inline Style The first way to do this would be to apply a style attribute to your links containing the CSS property "text-decoration." Like so: <a href="link-to-page-here.html" style="text-decoration: none;">Link text here!</a> This will create a link with no underline, but it will only affect that link, so you'll need to apply the style attribute to each link that you want to appear without an underline.
We get a lot of e-mail from people asking for ways to be a better Web designer. There is no simple way to answer a question like that, but the majority of the time we find that a designer has been exposed to HTML and Web design in such a way that he or she is designing pages and uploading them to the Web, but was never shown some of the essentials of Web design. If you're a new designer or you're already building pages and need to up your game, read on.
Recently, there has been a lot of buzz going around about Internet Explorer 8 and plans to include in it a feature called "version targeting." You can scour the net for blog posts and articles about version targeting, but you'll get a lot of debate and several different views on this topic, and it's difficult to pinpoint just the facts. What is version targeting? Version targeting is a way to tell Internet Explorer how it should render a page.
When my 98 year old grandpa posted a comment on my weblog last fall it hit me in a new way just how much the web is a part of our society. If I open my laptop in a coffee shop and there's no wireless I practically don't know what to do. "What? No internet? I guess I'll play solitaire." The more the web expands its reach the greater the need for those behind the scenes to create usable, sustainable and quality websites.
If there's one thing to be learned from print design, it's the impact of presentation. Unlike on the web, you can precisely control how your design will be presented, down to the exact dimensions, weight, and even sheen of the paper. As web designers, we have to relinquish most of this authority, but not when presenting a proposed design to a client. Take control over the presentation of your design by boarding up your printed design comp.
My sister recently graduated college and moved out to live with my wife and I for a while. This afternoon while I was helping her get moved in we were in my office getting some manilla folders and she tells me, "I need to marry a guy who's organized." ( Say what? The big brother never wants to hear about his little sister's marriage plans.) So I tell her -- not because I was trying to dissuade her from ever dating, but because it's truly easier than she thought it was -- that she could learn to be organized.


