Blogs and various content sites have proliferated all over the world wide web, giving the average user an wide range of articles, blog posts and content to read and enjoy. But even with the proliferation of content on the internet there is one glaring error that most of these sites commit – enabling their content to become more internet friendly and usable.
One of the biggest culprits when developing content for web sites and blogs is not making your content scannable. What does this mean? The tendency of web site readers is to scan to the left, where more information is located. In fact, the common movement of the eye is F-shaped. By employing a weak title, the first two to three words in the title won’t contain any kind of information or keywords that will compel the reader to click on the link. Even though scannability is something that is also important with the body text, it is of greater significance when thinking of a title for your post. Titles should always be within context.
Consider the title as microcontent – small bits of information that already give users a general idea of what the article or blog post will be. By treating your titles like this, users won’t have a problem determining what the article is about and won’t hesitate to click on the link to read it further. Treating titles like microcontent also has another use – it gives you a better representation when the links appear in search engines, RSS feeds and other venues that are link-generated
How many times have you come across a new weblog discussing a specific niche sporting a fairly too common WordPress theme? Probably more often than we’d all want to see. A large number of new weblogs these days are launched with default themes and styling that it’s now becoming hard to identify sites based solely on design and visual identity.
The WordPress Phenomenon
In 2005, default blog templates were fairly “simple,” to put it nicely, until Blogger went through a design refresh with spankin’ new designs to boot. The free theme craze took on a larger scale when WordPress introduced a flexible theme system less than a year after, allowing web designers to apply XHTML/CSS–based designs in a more manageable way. This opened an opportunity for designers to showcase their skills to attract more work, but inadvertently opened a can of worms as the theme distribution system was compromised and used for unethical link building by spam sites masquerading as “sponsors.”
Yet still, the availability of free self–publishing solutions and the growth of the problogging industry resulted in an increasing rate at which new weblogs are launched, a good number of which can be considered “commercial problogs” and a good percentage also run by prominent individuals discussing specific expertise and topics. However, a good majority make do with a free WordPress theme, sometimes even a sponsored one, not knowing how it affects their branding and identity. This goes for company weblogs and well–known individuals, as well as all sorts of self–published “problogs.”
Content is King
It has been a web design adage — content is king — and it continues to hold true up to now. Your weblog and the rest of your site will only be as good as your content. But with today’s crowded blogosphere discussing the same topics, no matter how good a writer you are, there will always be blogs that are just as good (or even better) in your field.
Readers are struggling hard coping with various sources, and some will simply discard feed subscriptions based on design and presentation. Assuming that you write just as well as your peers, or competitors if you look at them that way, what will differentiate you will be your presentation of content and overall design style.
Your Identity, Your Design
Don’t expect your new blog to be taken seriously if you don’t have good content, but don’t expect it to stand out with only good content without a decent design. Everyone these days have the basic SEO, online marketing, and social networking skills to push our sites to various channels. Basically, it doesn’t take as much as it used to for a newcomer to get some web 2.0 mileage. But when you get that attention, make sure you make a good impression, not only with your content but also with your kickass design. Make users remember your site describing both content and design.
It doesn’t cost much to get a good designer to work on a personalized design and online identity, the benefits will be worth every dollar spent anyway. Just make sure you hire someone who groks web design 2.0 and doesn’t fall into these common pitfalls.
Written by Markku Seguerra, rebelpixel.com.
When you design a website for your online business you are going to want to be able to draw people to your website. There are ways to do that. The best way is to use SEO to bring them to you. If you use SEO the search engines will pull your website up so people can find it. SEO is usually done through written articles and blogs which have specific keywords that will bring people to you. Search engine optimization is the key to your online business. Even customers that you have now may sometimes have trouble finding you again. Repeat business is very important to a successful business. Remember to use SEO to bring them back to you.
Once you get your new customers to your website you want to keep them there. Make sure you have a website that will keep them interested. There are so many online businesses that you are competing with. You want to make sure your website is the one potential customers want to visit. By designing your website in an interesting way, you will be assured of having interested people looking at your website. Some online businesses use website designers to help them get the perfect website. If you are unsure how to create an interesting web page this is the way to go.
Remember to use search engine optimization to draw customers to your web store and get a web designer to make your web page interesting and worth visiting. It won’t be long before your website is drawing and keeping plenty of business.
Having lived in several different countries and towns, public transport always has been a constant in my life and so have subway/tube maps. First time I arrived in London I was surprised how easy it was to navigate the London Underground Map, which in this form first was released in 1933.
(click for full size image)
The London Tube Map is a design classic and worldwide recognized as a symbol for London. When Harry Beck designed the map in it’s new format, he changed the until then standard geographical concept and decided only to implement the railway topology and not the geographical situation of London. Geographically correct the map would look like this. At the same time every non-underground clutter was removed and London had become a symmetrical pattern of straight and 45 degrees lines.
Although there are minor geographical distortions in the official London Tube Map, it’s beauty lays in the symmetry, the usage of equally spaced out distance between stations, the 45 degree angles and the usage of adequate whitespace. Even though the map features many subway stations (275) it is perfectly readable, even at smaller pocket sizes.
Becks’s style has often been imitated, been adapted by many other companies/towns, but never has anyone reached the same level of popularity with a tube map as Becks has with his London map. Both Amsterdam (NL), who even credit the London Transprt Museum on their map, and Tokyo have the same concept and perfectly manage it to ruin a great principle with clutter. Other towns, such as Paris, make their map unreadable with too much of text and too little contrast or add visual noise to an otherwise outstanding map such as Moscow.
Maybe I’ve lived too long in the UK, but the London Tube Map is one of the most brilliant designs I’ve ever seen and used.
Recipe sites have this tendency to cram so much stuff on their pages that instead of being helpful, they get in the way of finding the perfect dish for that meal you’re planning. These sites, however, are redefining the culinary experience by providing beautifully-designed and user-friendly experiences on the web, and hopefully in your kitchen.
Gojee is all about personalization: you have to be signed up to their website to take advantage of its features. Enter the ingredients you “crave”, “have”, and “dislike” to get a list of handpicked recommended recipes, whose photos are displayed in full. You can browse back and forth using the arrows on either side of the page, or the arrows in your keyboard—the up and down arrows toggle recipe details at the bottom right. The use of translucency and large imagery gives a stylish, high-end feel to the site.
Recipe Finder takes the Google approach to finding recipes through a minimal search engine interface with an almost playful look between its cartoon logo, polka dots, and stripes. You have the option to view recipe results as text or images, and narrow them down with advanced filters. Meta information such as calories, servings, and preparation time are also listed.
Recipefy is built on the contributions of its community and other social aspects, like inviting friends and following fellow users. You can explore recipes with the color-coded tabs on the left side, and the icons to the right of the page heading, then like or add them to your own cookbook. The woodgrain background and warm color palette definitely gives the site a homey vibe.
Websites are built almost solely on its communities. In the case of blogs, the communities hang out in the comments section. That’s where all the socialization and exchange of ideas take place. But writing a thoughtful comment alone is difficult enough. Don’t make it any harder for your readers.
This is one of the most horrifying comment areas out there:
Now that’s a long scroll. This isn’t from a product landing page or a shopping site with pages upon pages of “special” offers. This is a blog, for crying out loud!
Let’s assume for a second that only the top box (which is the actual comment form) exists and focus on that. It’s just too busy! My eyes were all over the place with the sprawling combination of boxes and text.
I know it takes effort to align form elements. (Or not, since this particular site uses tables to do that.) But it would be much easier on the eye if all the input fields appeared in a linear fashion, one after the other, to minimize the confusion.
Linear is not always necessary, but always keep forms as simple as possible, if you can help it. Take a cue from Smileycat’s comment form design showcase and note how functional and uncluttered those forms are.
Okay, so you get through the ordeal of leaving a comment, but this blog says you’re not done yet! It continues to nag you with the “Blog this at your site” and the “Tell a friend” sections. It doesn’t help that the lack of comments subconsciously discourages the reader from actually commenting. Even if there are any comments, those two extra panels have already separated the reader from the “leave a comment zone” since the comment box is now too far away.
Since the comment form above belongs to a blog in a blog network, many more readers will be turned off and confused by this comment form on several different blogs. It’s not too difficult to elminate this usability problem: Don’t complicate the process. Don’t ask too many questions. Don’t look desperate. Just let them comment.
In the left corner: Tyler Tate’s 1KB CSS Grid, a lean framework sporting 14 classes and the familiar conventions for enforcing a visual grid via CSS.
In the right corner: Vladimir Carrer’s 1-line CSS Grid, an experimental framework sporting a single class to cut nested column widths in half. The solution is mindblowingly brilliant, but does it work? Design tends to work in thirds, not halves. You decide.
Whether or not it’s a coincidence I chanced upon these two extremely simple CSS grid frameworks just days apart, news of these two solutions makes the CSS framework “scene” a lot more interesting. And accessible. I can imagine many front-end developers shying away from heavyweight frameworks because there are too many features, most of which won’t be utilized, and there are too many conventions, most of which aren’t easy to remember.
I’m not even going to get into how using these frameworks leads to unsemantic, presentational class names and lots of
<div> soup reminiscent of
<table>-based layouts. Let’s just be glad people are streamlining the application of design principles for the Web, namely grid layouts. When a better way comes out—maybe it’ll be
display:table, maybe it won’t—we’ll adjust then.
Actually, since list-style blog posts on design trends and other pretty things have been popular for a few years now, I’m sure the backlash has been happening for a while.
Now, it does make sense to organize your a complex article into easily digestible chunks, especially in a not exactly 100% comfortable to read environment such as the Web. It’s good to keep tabs on great new typefaces and graphics in your arsenal.
However, list articles have gained a bad reputation for other reasons because quality is put on the backburner. And there are a number parties responsible:
- The marketers: It’s easy to thank SEO for this phenomenon. A significant portion of internet marketing involves social media, and high-traffic sites like Digg just love the list format. It’s killer linkbait.
- The readers: The problem is lists don’t always contain what people need to truly learn. A lot of these people don’t know any better, and the explosion of lists distracts them from laying the foundations first.
- The internet: Why? There are great lists out there; people will need to separate the wheat from the chaff. But maybe, it’s the very nature of the Web that mutates the need to find the good stuff into the need to find as much stuff as possible or the quickest, easiest solution to a problem.
Whether experienced first-hand or heard of in cautionary tales, everybody is familiar with the horror of not being compensated for one’s work and not being able to do anything about it. Enter a possible solution: a remote kill switch, which gives web designers a back door into a client website via PHP, AJAX or CSS to disable it in case something goes wrong, i.e., one doesn’t get paid.
Avoiding the technical details and instead focusing on the general idea of a remote kill switch, let me say this:
It’s a sad, sad reality that people have to resort to these methods, but it’s just a symptom of a bigger problem. I also see it as designers and developers defending themselves with tools they are familiar with, rather than legalese that could only throw them for a loop and might not even work. Which isn’t to say they should abandon the usual way of going into a project altogether; the kill switch can just be an additional safety net.
Is it unethical? There is no reason to use a kill switch underhandedly, or consider it as a sign of distrust or respect. It’s not about having the upper hand or treating clients unfairly, it’s about protecting one’s business. But to earn your keep you need to stay professional, not paranoid. Integrating a kill switch into a contract, where the client is fully aware of the consequences should it be breached, sounds fair and should achieve those two things. One must remember, however, that once both parties complete their respective deliverables, the kill switch must also be killed.
I wonder what percentage and type of web professionals incorporate this into their business process. This is a controversial issue for sure, but I think people can avoid the unnecessary drama if their intentions are sincere. What do you think? Apart from a contract and this kill switch, are there any other ways to protect web professionals from clients running off with their work?
Jeffrey Zeldman’s article, The vanishing personal site, brings to light what many of us have been wondering about in the back of our heads for a while now. Social networks that provide features often found in a personal website captured our fancies and stretched our virtual personas in all directions. That goes for both the knowledgeable and not so knowledgeable in web development.
It’s not really a bad thing, which Zeldman also stresses. The question is, now that you’ve scattered yourself all over the place, how are you going to put yourself back together?
Not that you need to; I’m sure not everyone would be interested in painstakingly picking up the pieces one by one and gluing them together. That’s why FriendFeed became an instant hit. But if you ask me, using another social network to put them all together does not feel good. Not one bit. I’d consider it another convenient (even organic) way to spread my own content. But that’s it. I still dream of the day I manage to tastefully put my stuff together in one place. Like these websites: