About

Tuesday, September 20, 2011

Question and Answer with Stefania

Good content is only part of the challenge in getting your blog noticed. The look of your blog is crucial, too, because design matters in ways you may not even realize. But how to even begin thinking about giving your blog both the style and function that it needs? For this, I've turned to Stefania Patrizio, a Phlladelphia-based web-designer who's worked with ad agencies, TV networks and restaurants - as well as bloggers - to assure they're putting their best face forward toward the world wide web. She offers a number of valuable insights on the craft of web design worth reading on this Q&A, which she has in turn designed for us using an blogger.com page as an example. For more information, check out her own website http://www.stefaniapatrizio.com/ when you're done.

Hi Stefania, thanks so much for taking a moment speak with the class about what goes into good web design. You’re obviously an accomplished design pro, having studied graphic arts at University of Delaware and worked as a designer for the Red Tettemer agency with clients ranging from Pub & Kitchen to Green Aisle Grocery, Sprout PBS Network and the Spy Museum. Obviously, you know design matters for businesses trying to craft a brand. Why is it important for beginning bloggers, too, to think about design?  

Hey Craig! It’s an honor to be working with you. Thanks for having me. I enjoy talking about my two Great Loves, design and food. So you’ve come to the right place.

Design is everywhere. It’s on the label of the shampoo you use in the morning, the billboards you see on your way to work, book covers, road signs, TV ads, window displays and of course, on your computer screen, spending countless hours surfing the web.

We live in a microwave society. Especially on the world wide web. Design whizzes past people’s heads without them realizing it. It’s part of the experience. The key is to be memorable, but more importantly, functional.

Everything is immediate and you have to grab attention quickly. You must have easy access to important information and simple navigation. A company will spend millions of dollars studying the way the average joe navigates through their site. Every eye movement and click matters. Certain colors can make people feel safe or in the case of a food blog, make them feel hungry.

Design may be something beginner bloggers have never thought about, because they’ve never had to think about it before. But design matters.

How many times have you refused to sign up for something simply because it didn’t seem trust worthy? What about the design made you feel that way? How many times have you threw up your hands in surrender and immediately left a website because it was too confusing? Every glitch in the architecture of the site could keep your audience from coming back.

Designing for the web is like playing with a 3 year old, they’re whiney and have a lot of opinions, and if you don’t keep their attention, they lose interest fast. 


We’ve been talking about all the elements that go into building the world of a complete blog– a well-defined concept and theme, good writing, photography and multimedia. Where should design fall as a priority, in terms of crafting a blog’s identity? What are the first easy things people should think about in terms of design?


Design should be just as important as your content. You could have all the content that has the potential for a successful blog, but if you don’t have the right execution, you could lose readers. Marrying content and design is the killer combination.

As far as the design of your blog, think of it this way: 

You think about what you are going to wear in the morning, and how you want to present yourself. It also depends where you’re going. Are you going out for a fancy dinner? Are you chilling at a pub with your friends? Are you meeting the parents of your new girlfriend? With all of these outfits, you want to portray yourself differently. You wouldn’t just slap on sweatpants to an interview at a new job. 

The same goes for your blog.
How do you want to present yourself to your audience? Who is your audience? Is your blog about you or your product? What attitude are you going for? Warm and friendly? Sassy and sophisticated? What do you want people to take away from it? What is your goal? 

It all comes down to treating your blog like a brand. 




What aspects of design can simply help make a blog site work better?


Good Hierarchy. 
Who is the hero of your blog? The photography? The content? You? Pick a design that makes the hero shine most.

High Functionality. 
Are things easy to get to? Is the navigation easy to use? Are there too many different link colors? Have some friends click through your blog and see how they navigate. Then, get their honest opinion afterwards.

Personality. 
What do you want people to take away from their experience? Ultimately people will be reading for your content, but what about your blog makes it different?




On a technical point, can you explain the difference between blog sites that are built from the ground up (often by hired consultants like yourself), and the free blogging platforms that most beginners start with – mass-distributed platforms like Blogger, WordPress and Tumblr?


Here is the low down and simple explanation on each of the platforms:

Blogger:            
Positives: It’s a really great platform if you’re just starting to blog. Setting it up is really fast and easy to understand. It’s Google-owned, so if you’re a Google-for-everything person like myself, it’s nice to have everything together. You can have your Gmail, Google Reader, Calendar, and Blog all in one spot.

Negatives: If you want to be taken seriously in the blog world, building a brand for yourself is important. Blogger, for the most part, all looks the same and there isn’t much control for uniqueness. And in my personal opinion, I just really hate the word ‘blogspot.’

A good example of blogger being used effectively: What Katie Ate


Tumblr:
Positives: It’s a wonderful platform for personal use and it’s easy to manage because of it’s bold interface. They have a lot of young and hip users so it’s great for the social networking scene. And personally, it speaks to the graphic designer in me, because there are a ton of really beautiful templates that are simple to customize.

Negatives: It’s great for short and simple blogs, but if you want to start something that’s heavy with content, Tumblr might not be for you. The ‘comment’ feature has been removed (although for some people, this might be considered a good thing) and it’s replaced with a ‘reblog’ feature instead, but only if you have a Tumblr account. And despite what I said personally, I’ve read reviews saying it’s too ‘graphic designy’ and they removed certain important blog features to keep it simple.

A good example of Tumblr being used effectively: Spork Me


WordPress:
Positives: You can really let your creativity shine with this platform. It’s for the serious blogger. No matter the subject or length of the content, you can find the theme that works best for you. The amount of freedom and choice you have to be creative is endless. There are videos to help guide you through and since it’s a widely used product with a big community, there are usually people there to help you figure out what to do. WordPress, overall, is for pro-level bloggers.

Negatives: The dashboard to customize your blog can be overwhelming, especially for new bloggers. There could be a whole class purely based on how to work in the dashboard (that hopefully comes complete with a web-terms dictionary). For the most part, people want their blog to be something fun they do on the side, and WordPress can be a big commitment. The trial and error of discovery can be too time consuming for people with full time jobs. Plus, with so many options at your disposal, you run the risk of your blog being too cluttered.

A good example of WordPress being used effectively: Dinner: A Love Story



Hiring someone to design it for you: 
Positives: Your blog will be a unique experience and overall, it will just feel tighter. Often, bloggers will start solo, and as their popularity grows they hand it over to a professional. Designers have a way of thinking of more unique creative ideas. It’s their job!

Negatives: The personality of your blog is in someone else’s hands. Open communication is always key. Otherwise, the back and forth of corrections could take just as long as doing it yourself. And make sure they hand it off to you buttoned up so you don’t go knocking on their door every time you want to add a new post. Also, keep in mind, you get what you pay for!

A good example of what happens when you hire a designer: Emiko Davies



In the end, there’s no ‘best’ platform. It’s all a matter of personal preference. 


Blogs can be complicated or simplistic in their missions and construction – how do you know when it’s right to stop adding stuff for any given concept?

Keep the philosophy of ‘less is more’ for design of your blog. People have ADD enough as it is surfing the web, you don’t want to throw too much information at someone at once. Don’t get trigger happy.


This, of course, gets down to some real basics, like, what is good web design to begin with? Are there aspects people need to consider that are different from, say, designing something for print?  I’m sure you have plenty of thoughts and philosophies on that. But can you show us some good examples of different styles of blog design that really work?

Opinions about good design are completely subjective. There’s no exact formula, like math, where you have a correct answer. The closest thing we have is statistical ratings or studying the user experience. Even then sometimes, it isn’t accurate.

I believe, ultimately, good web design is when a site is memorable, highly functional and keeps people coming back for more.

An insurance website is boring, sure, but the structure could help you accomplish what you need fast and efficiently. That’s good web design. Say you want to find out more about a new gin. When you reach the website, you could be highly entertained and then more likely to order it next time you’re at the bar. That’s good web design. Take Smarty Pig, a savings account website, which does a wonderful example of marrying the two. The company takes a boring subject and makes it fun and highly functional.


And you’re right, I have plenty of philosophies about designing for print and designing for web. I’m sure you’ll agree with me that I want to slap anyone that says ‘print is dead’ but that’s a whole different story. The way our world is headed, the two are influencing each other more and more. Almost anything is possible these days. The best solution is to have print and web work together. 


Lunch at Sixpoint is a good example of a blog that takes the beauty of print and make it work in a web site.




I love Honest Fare and its form of navigation and use of photography. Everything about it is visual.




Good is a great example of taking loads of content, but with the right hierarchy, making it simple to navigate. All your subjects are on the left navigation with beautiful illustrations to partner with their headlines. The social networking icons are always available. The advertising banners are placed in spots that don’t bother you. It’s all simple and informative.



There’s no denying that Apartment Therapy has great content. But look at their navigation system. There are three stacked on top of each other at the top of the page creating odd hierarchy. 




The good news is a lot of the times people use their RSS feeds to check blogs. This creates a list of all your subscriptions, running through only headlines and main photos, without showing the design of the blog at all. However, this doesn’t excuse bad design. When someone sends one of your posts to their friends, it still links it directly to your blog. Make a good first impression.


 
Do you have any more specific practical advice along those lines for people starting out with Blogger, WordPress or Tumblr? What are the most essential aspects you think every good, serious blog should have? What gadgets or features really are essential to add?


As far as blogs, you have to consider the phrase even your grandmother is throwing around…

Social Networking.                 

Retweeting. Hashtagging. RSS Feeds. Dig This. All annoying web jargon essential for blog success. Almost all templates will have these features as add-ons. Many of them are all about the personal preference of the user, but the holy trinity is Facebook, Twitter, and RSS feed. If your audience is posting on their facebook wall, microblogging on twitter with links to your latest post, or subscribing to your blog as a part of their daily read, it’s a good day.

‘Labeling’ (or better known as ‘Hashtagging’) is a good tool to have when you make posts. If you have months of content, or even years, people can search these key words and every post with that label, shows up in your search. Depending which platform you use, it will even show other bloggers using this label. Usually in twitter it’s proceeded by the hash key (#), hence the word ‘hashtag.’ Also be sure to use good labeling. Don’t write like a 12-year old girl (#dinners instead of #dinnerz).

Find out what keywords for headlines do best on Google (i.e. "Roasted Corn Soup" will likely create more traffic from Google than "Tonight's Dinner"). But remember, good content is the most important thing. For more information about Search Engine Optimization, this is a good article to read.

Many people swear up and down that they never want to be a part of this crazy internet world, but being a member of the social network is essential to any serious blogger #suckitup. 




 
Do you believe food blogs, in particular, demand a unique sensibility in terms of design?


Yes, absolutely.

I’m a big food blog follower. I love to cook. I love perfect bites. And I think food is beautiful.

You want to treat your food blog the same way as if someone was going into your restaurant. Everything must have a flow and purpose. Maybe your blog is all about using local organic ingredients in your recipes. Choose soft and earthy colors. Or handwriting fonts instead of say, all caps. Maybe your blog is all about visiting diners. Choose big bold colors. Give it a silly personality. Add songs you heard while you were eating that big juicy burger.

But above all, your food blog must look appetizing.


Photos are an essential part of any blogger’s world – are there special considerations of how they should be used or placed into a blog? What are your thoughts on programs like Instagram that add various effects and borders to photos? They can look cool once, but used too much don’t they look formulaic?

Food photography makes a food blog.

I believe smart phone photography programs like Instagram are good and bad. They’re great for point-and-shoot-look-how-cool-I-am shots, but professionally, never. I just came back from a three month trip to Italy and I started a photo-a-day blog to keep my family and friends in the loop with my life. It was perfect because it was low maintenance and all my pictures, despite if they were point and shoot, came out great.

However, photographing food was one of my biggest challenges. Usually with those programs, everything is exaggerated. The color of a tomato could come out super bright red or super saturated. And if there is anything you want to capture in a photo, it’s the perfect color red of a fresh ripe tomato. Take TheUnbearable Lightness of Being Hungry for example, her photos of scenery are lovely, but food, not so much. 



Or take this food blogger, Sugar Sandwiches, where it looks like she photographs her food in a dungeon with fluorescent lights. Personally, I’m never going to read anything she says, despite how good her apple pie may taste.



Now put this food blog against Sprouted Kitchen. I mean, just look at this summer cheese plate. It makes me weak in the knees.


If you invested in a really nice camera for your blog (or you’re a professional photographer), do yourself a favor and invest in a food lamp. Or if you’re not ready for that leap, make sure to always shoot your food in broad daylight.

But fear not! You don’t have to be a professional to take good food photos. You know good food. You know what looks appetizing. Photograph it at all angles. Have fun with it and make people hungry!



What about dealing with long stretches of text – for example, like this Q&A? What are some good techniques to make a written interview interesting and engaging visually? Can you walk us through how you went about designing this very Q&A piece here?

I picked the template ‘Flows’ through BTemplates.




My style tends to favor simple design so the gridded organization appealed to my taste. I also believe that the organization of this template best fits the content. I wanted the words to be the hero, so I designed it without photographs or elaborate patterns, but with high contrasted words. I’m also a sucker for grey and blue.

I chose a layout that was best for heavy text, as oppose to the Vasiliki template, which would be good for letting photography shine. I also chose to make my own styled headers in place of the main photo to make the content king.



When you have long stretches of text, it’s best thing to have the ‘read more’ button. I like to give readers the option of scrolling through which topic appeals to them, almost like an RSS feed within it’s own website. This is all assuming there would be more than this one example post. Since this post was especially long, I designed my own headers as images to make the interview easier to swallow.

If you’re not using your own photography for you blog, choose wisely. You could be a hairline away from getting cheesy and unprofessional. Swissmiss does a good job of walking that line.



Many templates are made for blogs with multiple topics. Since I knew we would only be featuring these questions, I chose a top navigation bar that was simple, and easy to customize. If you notice, the social networking tools are always prevalent, with the holy trinity at the top. I deleted the homepage slideshow, some side navigation, and the parts of the footer. I believed these were unnecessary. Removing clutter always helps.

I’ll admit I edited the html to extend the length of the header. Think of the html like the architecture of the website. The foundation. If the internet was a building, these would be the blueprints. It can be scary when you open it, and as a beginner, the best thing to do would be to leave it alone. If you know what you're doing, go to town. If you're friend knows what their doing, then tell them to go to town.

I had fun creating this blog for the students. And no matter if you are a designer geek, foodie, math nerd, or sports fanatic, it's always fun building something uniquely your own and sharing it with the world. That's the beauty of the internet. Blogs should be fun to create, so make it fun for other people to navigate too.

Ultimately, if you put time, effort and love into your blog, it will show, and people will respond with love in return. 


Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More