xBlog: The visual thinking weblog
5th September 2008

Typechart

“Typechart lets you flip through, preview and compare web typography while retrieving the CSS.

  • Browse typographic styles. (See “anatomy of a style” below)
  • Download CSS
  • Compare Windows (ClearType) rendering with Apple font rendering
  • Each style corresponds with a “style ID”, which allows you to annotate prototypes and retrieve the css while coding.”

posted in CSS, Typography, Web design | Permalink | Comments Off

4th September 2008

40 Creative Design Layouts: Getting Out Of The Box

“Over the last months we have seen a strong trend towards more individual web designs. These designs use realistic motifs from our regular life, such as hand-drawn elements, script fonts, pins, paper clips, organic textures and scrapbooks… apart from visual design elements one can also get creative with the layout of the site – its structure and the way the information is presented and communicated. To provide you with some ideas of how exactly it can be done, we have been collecting examples of creative design layouts.”

posted in Web design | Permalink | Comments Off

29th July 2008

A List Apart: Articles: The Survey, 2008

“Calling all designers, developers, information architects, project managers, writers, editors, marketers, and everyone else who makes websites. It is time once again to pool our information so as to begin sketching a true picture of the way our profession is practiced worldwide.”

posted in Business of design, Information architecture, Web design, Web development | Permalink | Comments Off

25th July 2008

Web Design Dashboard

“The definitive resource list for anyone designing, developing, marketing or maintaining websites.”

posted in CSS, HTML/DHTML/XHTML, Web design, Web development, Web graphics | Permalink | Comments Off

23rd July 2008

Scrnshots

“Scrnshots.com is a community for designers to share screenshots of interesting and beautiful design.” (Thanks Jon!)

posted in Graphic design, Interface design, Learning, Web design, Web graphics | Permalink | Comments Off

14th May 2008

Follow the Rainbow: 101 Color Resources for Web Designers

“Do you freak out if someone asks you to match print colors to Web colors? Or, maybe you just can’t decide whether the orange would work better with the blue or the green. Either way, many designers may not realize how easy it is to choose a palette for that new Web design. Additionally, many designers might be surprised to learn that they can stay on top of color trends with a few visits to fashion design Web sites. All those tips and more are listed below in this list of 101 color resources for Web designers.”

posted in Color, Web design | Permalink | Comments Off

13th May 2008

Footers Design Showcase

“Footers can be much more than an afterthought containing the fine print of a web site. With the right design they can reinforce brand awareness and drive internal traffic. Footers can also be a place where a designer can let his creative juices flow a little more freely.”

posted in Web design | Permalink | Comments Off

8th May 2008

99 Flickr Groups for Design Inspiration

“Web designers and graphic designers are always looking for new sources of design inspiration. Of course, many of us turn to CSS galleries, and there are even more sources of offline inspiration. Personally, I find the work in many Flickr groups to be another excellent source of inspiration. Aside from the billions of photos on Flickr, there are also some groups that have been established to showcase the work of designers. Here is a look at 99 of them according to category (about half of them are general graphic design groups). Below the link to each group you’ll see the number of members and the number of items (pictures, graphics, screenshots, etc.) that have been submitted to the group, plus I have included part of the group description as listed by the moderator.”

posted in Creativity, Graphic design, Illustration, Web design | Permalink | Comments Off

5th May 2008

One pixel notched corners as used by Google Analytics

“I use Google Analytics, and I noticed that their left nav has an interesting characteristic: instead of each option being boxed in a clickable rectangle, there is a one pixel notch in each corner. It’s not necessarily a curved corner, but it is a little softer than a normal box. I would’ve naturally thought that if someone is going to use background images to create a capsule effect, they would have used anti-aliased images. But upon closer inspection, no background images were used at all.”

posted in CSS, Web design, Web graphics | Permalink | Comments Off

29th April 2008

Criticism: Myths and Childishness

“Regular readers of my articles know that I have no qualms or fear of offering criticism. Criticism is a vital component in what we do and in how we learn. In fact, critical evaluation is mandatory in design work. Without approaching, or at least finishing, every step of our work with a critical eye the results are likely worthless. And we’ve much to learn from what design criticism can teach us. Yet the more articles and criticism responses I read, the more I’m led to believe that too many designers misunderstand criticism.”

posted in Business of design, Graphic design, Web design | Permalink | Comments Off

29th April 2008

Web Standards Design + Development

The purpose of the Web Standards Design + Development group is to form a strong network of individuals who have taken the initiative to become craftsmen of their trade. Today it is a list of names, tomorrow it will be a force for good…

posted in Web design, Web development | Permalink | Comments Off

16th April 2008

Luxury Type

“I’d like to encourage designers to open their mind and consider using some of the other typefaces that are often pre-installed on computers these days. There really are some great choices that are being completely ignored. Granted, not every user is going to have them, but those who do will get an enhanced experience, and those who don’t will be just fine, so long as you specify appropriate alternates (as in MOSe).

Let us compile a list of useable typefaces that we can count on being installed at least some of the time — as well as good alternates for them that are more reliable. Here’s a few I came up with. I think you’ll notice that there are not only some great faces here, but even some that are considered classics or essentials.”

posted in Security/Privacy, Typography, Web design | Permalink | Comments Off

14th April 2008

Monocle: design notes

“Visually, we wanted to make something that didn’t ape current design tropes - the boring, over-used and essentially art-less ‘web 2.0 look’ of bright palletes, gradient fills and rounded corners - but had a more classical view, as befitting something a little more grown up. Richard Spencer Powell said the magazine design draws from modernism, of course (especially North and Mittel European heritage) but also looks further back into the early 20thC, and beyond the simple serifs and vogue for ornamentation, but look at the engravings, section headers, cartographic styles etc.”

posted in Web design | Permalink | Comments Off

14th April 2008

GridFox - The Grid Layout Firefox Extension

“Grid-based layouts have become really popular among web designers over the last year… However, I ran into a problem when coding grid-based layouts. How can I be sure my grid is maintained from the original mockup to the final coded version? When I coded my first grid-based layout, I found myself regularly taking screenshots of the site and comparing them with my original grid in Photoshop. There had to be an easier way.

Enter GridFox. GridFox is a Firefox extension that overlays a grid on any website. If you can open it in Firefox, you can put a grid on top of it. It’s easy to customize, allowing you to create the exact grid you designed your layout around.”

posted in Software/Hardware, Web design | Permalink | Comments Off

1st April 2008

Top 12 CSS Frameworks and How to Understand Them | Speckyboy - Wordpress and Design

“Most designers would have heard of the term ‘CSS Frameworks’, for those who don’t know or aren’t sure, here is a brief description from: Wikipedia:

A CSS framework is a library that is meant to allow for easier, more standards-compliant styling of a webpage using the Cascading Style Sheets language. Just like programming and scripting language libraries, CSS frameworks package a number of ready-made options for designing and outlaying a webpage.

Sounds great doesn’t it, something that is going to make designing and developing a website that little bit easier. It will take away the repeating of the same old boring stuff and if you write your framework correctly you will be guaranteed your code will meet W3C recommendations. That will leave you plenty of time to design your site, the fun side of the job!”

posted in CSS, Web design, Web development | Permalink | Comments Off