This category features articles on general design principles, Web design, typography, user interface design and related topics. It also presents design showcases and practical pieces on the business side of design.
Popular tags in this category: Web design, Typography, Design Legacy, Navigation, Forms, Mobile, Techniques, Showcases, UI Design.
Last week we have presented first findings of our web forms survey. The main objective of the survey was to provide designers and developers with some intuition of how effective web forms are designed; we also presented some guidelines of how an effective and user-friendly web form can be achieved.
We have focused on sign-up forms as we wanted to consider further crucial forms (e.g. checkout forms) separately. Afterwards we've gone through each and every one sign-up form of the selected sites and analyzed the design approaches implemented in these forms. Below we present the second part of our findings — the results of our survey among web-forms of 100 popular web-sites where web-forms (should) matter.
Please notice that this post is not about checkout forms — that's a topic for another discussion, we may consider them separately in one of the upcoming posts. We would like to thank Wufoo for providing us with a framework to conduct our survey.
Read more...We continue to review text and source editors for designers and web-developers. After a thorough consideration of WYSIWIG- and source code editors now it's time to take a closer look at applications for advanced CSS-coding. Reason: while numerous HTML-editors offer more or less advanced CSS-support there are also allround-CSS-editors which offer a sophisticated integrated development environment for CSS-coding.
Of course, real CSS ninjas accept nothing but a minimalistic Notepad or some sophisticated source code-editor. In fact, CSS-editors are often considered to be unnecessary and superflous — after all, you can do the same in your favourite text editor. And sometimes this is true — while there are some really bad HTML-editors there are also some even worse CSS-editors. Particularly code autocompletion tools are extremely good at bloating the code to extremes, making the resulting stylesheet unnecessary complex and hard to maintain. Why would someone purchase a CSS-editor to raise the maintenance costs afterwards?
Yet CSS-editors can be helpful; furthermore, you can effectively use them in different settings by developers with different skills. Web professionals can use a CSS-editor to improve workflow and get all useful CSS-tools provided by one single application. Newbies can easier learn CSS by analzying stylesheets and using live-editing to understand how the design is built up and what is actually going on behind the scenes. In either case you should make sure you know what you are doing and not end up producing quick'n'dirty stylesheet.
This post presents an overview of 15 established or rather unknown CSS-editors; you’ll probably find “usual suspects” — your favourite editor or the editor you’ve once been working with. But you’ll also find some rather unknown alternatives which are definitely worth considering when choosing an optimal source code editor.
Read more...Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.
This month we are glad to present you the updated Anivers, Gentium family and Fresco Semi Bold. Please read the license agreements carefully — they can change from time to time.
Quotes are used to emphasize excerpts of text. Since users almost never read but scan we need to provide them with some focus anchors to fix their attention to the most important parts of our articles. Furthermore, quotes are always used for testimonials and sometimes for blog comments. They can be styled using graphics, CSS and a little bit of JavaScript. Sometimes, creative dynamic solutions can be applied as well.
This post presents creative examples and best practices for design of pull quotes. We’ve tried to identify some common solutions and interesting approaches you may want to use or develop further in your projects.
You may also want to take a look at the posts
Effective web design doesn't have to be pretty and colorful — it has to be clear and intuitive; in fact, we have analyzed the principles of effective design in our previous posts. However, how can you achieve a clear and intuitive design solution? Well, there are a number of options — for instance, you can use grids, you can prefer the simplest solutions or you can focus on usability. However, in each of these cases you need to make sure your visitors have some natural sense of order, harmony, balance and comfort. And this is exactly where the so-called Divine proportion becomes important.
This article explains what is the Divine proportion and what is the Rule of Thirds and describes how you can apply both of them effectively to your designs. Of course, there are many possibilities. Hopefully, this post will help you to find your way to more effective and beautiful web designs or at least provide some good starting points you can build upon or develop further.
Read more...Podcasting is an engaging medium that is available in both audio and video formats. Podcasts often refer to audiocasts, but now with iPods and other media players being able to play video, videocasts are just as popular. A handful of web design podcasters deliver both audio and video formats. Some do so through the same subscription, others separate the two.
Audio podcasts are a great way to stay informed about web design news, learn about emerging technologies, listen to discussions, and continuously learn about the ever-changing landscape of web design — on your way to work or before you go to bed. Videocasts are great at showing step by step tutorials, or delivering visually rich presentations. Many of the long running successful podcasts have communities built around the show. Forums and detailed show notes are usual for a podcast that regularly serves its community. The time span of how long a podcast exists often indicates its level of quality and professionalism.
We've amassed a collection of podcasts that are either directly about web design, or would be helpful to a web designer. If you're interested in more podcasts try searching through Odeo or iTunes. There are quite a few web development podcasts, and a few niche topic web design podcasts, not covered in this roundup. Following is a list of useful podcasts for web design professionals.
You may want to take a look at the article
Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.
This month we are glad to present you Freebooter Script, Cora Basic Regular, Walkway and Karabine. Please read the license agreements carefully — they can change from time to time.
To edit HTML- and CSS-code you only need a simple plaintext-editor — the rest depends on your skills and your creativity. However, to make your life a little bit easier, you can use some more comfortable source-code editors with advanced editing features. These features can effectively support you during coding, debugging and testing. Powerful modern editors provide developers with syntax highlighting, diff, macros, plugins, code-snippets, preview-option and an integrated FTP-management tool. Some editors go even further and offer a complete integrated development environment with numerous features and functions.
In the list below we present an overview of 35 established or rather unknown — but useful source code-editors; you'll probably find "usual suspects" — your favourite editor or the editor you've once been working with. But you'll also find some rather unknown alternatives which are definitely worth considering when choosing an optimal source code editor.
Some of the "ancient" text-editors such as EMacs or Vi are still alive and have achieved a remarkable level of quality over years. We've presented them below proving that sometimes it is really better to consider preferring a rather old editor to a "fresh" one. The position of the editors in the list is rather random and doesn't necessarily correspond to our personal evaluation of the editors. Please notice: even although this overview presents quite many editors, it doesn't mention all of them.
Yesterday we've published a review of 25 WYSIWYG-editors. Now, what about useful source code editors? What is your favourite?
Read more...When it comes to coding editors, it's damn hard to a get a clear overview of all the benefits and functionalities different editors have to offer. However, in the end everybody needs one, so it's important to know which editor is best tailored to your personal needs.
WYSIWYG-editors are often criticized by real coding ninjas for bloated, dirty and not standards-complaint source code they've been producing over the last years. However, WYSIWYG-editors have become much better recently. Some of them even produce valid and elegant code.
Sometimes you need to provide your clients with some simple tools to edit or update their web-sites. And this is where the utility of WYSIWYG-editors comes in. As a web-professional you need to provide your clients with some sophisticated advice and offer a simple yet effective tool — e.g. a WYSIWYG-editor. In this article we've tried to give you an overview of both useful and deprecated WYSIWYG-editors.
Read more...
Opportunity: WellnessFX, a fast-growing health 2.0 company based in The Mission District in San Francisco, is looking for an engineer with skills in front-end…
YAGER is currently seeking a talented and experienced Game Systems Designer to join our pre-production team of yet unannounced title. Join us in shaping the direction…
With a commitment to quality content for the design community.
Smashing Media Made in Germany. 2006-2013. Impressum