We’ve setup quite a few WordPress websites at Snoack Studios and have used many different plugins. Plugins help extend the capability of WordPress and make things easier for you to maintain your site. While WordPress used to be just a blogging platform, it’s now capable of controlling a whole website and with the use of plugins, it’s easier than ever for our clients to edit their text, add images to sliders, and complete even more complicated functions all on their own. Our list of favorite plugins is long, but we’ve narrowed it down to our top 5 favorites that are invaluable on many of our projects. Here are our top picks.

Contact Form 7

This is the most widely used contact form plugin for WordPress and it really works great. You can setup multiple forms on the same site, and have them complete different tasks as well. It’s easy for admins to edit and easy for users on your site to utilize too! See the documentation to read more information on it.

The picture on the right is of a form where users can give more information on their event to get a quote, so the form can be utilized for anything!

Easing Slider

There are tons of plugins that control sliders and slideshows on WordPress, but this one is a favorite because it’s really easy for users to use. Once it’s all setup, you just need to upload your images and add them to the Easing Slider, in the order you want them to appear. Super simple! See an example of this slideshow here and the documentation about it here.

MCE Table Buttons

We actually don’t use this very often, but it’s so handy when we need it! If you have to display any tabular data this is helpful for editing that table later on. Tables are considered a bit outdated in web design, but they are sometimes the best option and really helpful for displaying data, so this plugin helps our clients edit tables that we’ve created for them. This adds a great row of buttons in the admin panel that allows administrators that are editing pages or posts to add cells and rows and edit the table in the same way you would a spreadsheet in Excel. See the documentation for it here.

Rich Widget

Widgets are typically used for sidebar items, but they can really be used for anything you need access to edit. Like footer items and other global items on your site that are repeated across pages. The Rich Widget plugin gives your widget greater functionality because it adds WYSIWYG features, allowing you to easily add a link, upload pictures, bold text, etc. These things aren’t available with a normal Text widget so the Rich Widget plugin is very helpful when an administrator needs to do more with their widget space. See the documentation for it.

jQuery Lightbox for Native Galleries

One of our favorite ways to add a bunch of photos to a site is through this photo gallery plugin. It’s really simple to use, and can be used on any post or page, so it’s handy for admins. It’s also nice for users on your site because they can see thumbnails of multiple photos and then enlarge the ones they want by clicking on them. Pairing easy setup and easy use for users is a win-win! See the documentation.

WordPress is an excellent solution when you want easy access to edit and maintain your site, and these plugins really help to maximize your time so you can have full access to do what you need and then move on to other important tasks.

What other plugins do you use on your site that you couldn’t do without?

Big businesses can often have boring websites, and on the other side of the spectrum the automotive industry can get a bit loud and sales-y. However, I’ve noticed lately that there’s a trend of great-looking websites coming from the car industry. You’ll find great, large photography, new and cutting-edge website development techniques, interactive and fun features for users, and unique things that will help them stand out from their competition.

We’ve gathered a few in our collection today that we felt really stood out and were worth a visit. Enjoy!

*Click on the thumbnail above to see the full site.

Which one is your favorite?

I hear lots of rumors or myths about websites and wanted to list a few that I’ve heard before so we could clear up any misconceptions you might have with your own website. These myths include thoughts on designing your site, maintaining it and everything else in between. Your website can be a great marketing tool for your company, so it’s important to utilize it well so you can maximize the greatest value from it.

Check out some of of the myths we’ve heard so your website can be a powerful tool for you!

Your site is done once you launch it

This is probably the biggest misconception I’ve seen. People work really hard to create a great site and then they don’t touch it once it’s live, however continually updating your site is really important. There are two good reasons to keep content coming on your site, search engines and your users. Users need you to give them a reason to keep visiting your site and having something like a blog with constant updates and new content is a great way to encourage visitors. Search engines also look for new content and updated pages so updating is great for that as well.

Using analytics isn’t helpful

Analytics is actually really helpful, but only if you use it! Google Analytics is a free tool that we use for our websites and it gives you some really valuable information about your visitors. It tells you what pages are most popular on your site, how long visitors stay on your site, where they came from, what keywords they found you with on Google, etc. You can use this information to tailor your site appropriately so your users find it useful and relevant and will stay longer.

White space is wasted space

White space or negative space on your site is certainly not wasted. Your eye needs space in order to see things on your site and that white space allows items on your site to pop out more and be seen adequately. So it’s important to make sure you don’t cram too many things on your site, give things room to breathe and be seen so they can have maximum exposure.

The navigation is the best place for all new pages

Many people think each new page is really important and therefore needs to go in your main navigation. However, if you have too many pages in there, it starts to get overwhelming for people and they won’t be able to find what they are looking for. Great organization is really important for the page structure of your site, so it’s great to think about each new page and where it fits within your site. If it doesn’t fit well, think about how you could rearrange things, grouping together like pages so you can have the minimum amount of pages needed in your navigation.

You don’t need to worry about SEO

SEO is really important because it relates to how you’re found on search engines. So many people are using search engines to find products, recommendations, and services, and if your site isn’t being found because of poor SEO, then you’re missing out on potential business. So it’s important to make sure your site is optimized for search engines so they can crawl it easily, and there are also tons of things you can do on your own. Professionals can help as well, getting you greater results through more extended measures.

Make sure your site is as great as it can be, and don’t believe the website myths you hear!

What other myths have you heard about websites?

The use of smartphones and mobile devices like the iPad are growing quickly these days, with more people searching, shopping, and surfing on their mobile devices than ever before. There are some pretty incredible statistics with phones and mobile devices and this infographic from Microsoft Tag estimates that mobile internet usage will take over desktop usage by 2014. If your website isn’t mobile-friendly, you’re missing out on an ever-growing audience and potential business. We’ll cover lots of great reasons to make the move and some great ideas on how to make your site more mobile-friendly too.

Why should we make our site mobile-friendly?

As we mentioned above, mobile usage is growing pretty quickly. I’m a very visual learner and I like how the chart above illustrates just how quickly mobile internet usage is growing and when we can expect it to overtake desktop internet usage. These numbers are estimated, but from the usage you see out and about and with family and friends, I think it’s pretty clear that mobile usage is certainly on the rise. Why not take advantage of such a lucrative opportunity?

Take this for example, imagine you own a seafood restaurant in a large city and you don’t have a mobile-friendly website. I’m a consumer that’s out and about with some friends, and I’d like to see a menu before I drive over to make sure I like what you have. Your site is slow to load, and I have to scroll around too much so I give up before I find the menu. I know I can find another restaurant nearby that does have one that I can access. You’ve just lost my business, and your food may be better than your competitor, but that’s not what matters at this particular moment. Don’t let your competitors win over something you can control.

What does it mean to make your site mobile-friendly?

A mobile device is navigated by the use of your fingers and it’s generally a much smaller screen than a desktop so accommodating those 2 things will make your site more mobile-friendly for your users. The average width of a website today is 960 pixels, whereas the resolution for a smartphone is usually around 300-400 pixels. Unless your site layout is fluid and resizes to fit that different resolution, your users will need to constantly scroll and zoom to see everything. In my experience Android and Apple phones usually do a good job of displaying websites as they would be seen on a desktop, but usability is still changed because of the scrolling and zooming hinderance.

Another drawback of usability on a mobile device is the fact that you navigate with your fingers and websites are generally created to be navigated with a mouse so links are tiny and hard to click on. This makes it tough to get where you need to go, especially if you’re just looking for something quickly.

How do we become mobile-friendly?

There are a few different ways to make your site mobile-friendly, and our favorite method is to create a site with a layout that resizes based on the size of your browser or mobile device. The needs of an iPad are different from that of a phone user even so we like to accommodate for that as well. The Snoack Studios blog is fully mobile-friendly and illustrates this method well, even on a desktop browser. Visit the site on your phone and on your computer to see the difference, or resize the width of your browser window on a desktop or laptop computer to see how the site changes when it becomes smaller. The navigation text becomes larger and more accessible, pictures become smaller as needed, and everything resizes nicely to stay within the constraints of your browser size. It even goes so far as to move the sidebar completely at the smallest size because it wouldn’t make sense to keep it as a sidebar.

The best layout will depend on your particular site and the things you have on it, but the most important things to keep in mind are:

• Readability – make sure text is readable on a small device, and not too large on your regular computer.
• Click-ability – links, buttons and any navigational items probably need to be larger so they can be easily located and clicked on.
• Scrolling – vertical scrolling is much easier than horizontal scrolling on a mobile device so don’t worry about your site getting too lengthy, but instead worry about it being too wide.

Making your site mobile-friendly isn’t just a trendy thing anymore, it’s a necessity to stay accessible for your users and to stay on top of your competition. Snoack Studios would love to help you out if you need advice or help on making your site more mobile-friendly. Get in touch with us today!

The design is complete, your text and pictures are in, what else is left? You must be ready to launch your site!

There may actually be a few things you’ve missed, and a hasty launch before everything is complete isn’t usually a good idea. Make sure you’ve completed all the necessary steps before the launch to save yourself some headaches later on. See our checklist below that covers things to complete, check, and test before you launch, plus some possible items to think about including before it’s out there for the whole world to see.

Browser testing

Testing your website in multiple browsers is a MUST. At Snoack Studios, we test in both Apple and PC environments and include multiple browsers: Safari, Firefox, IE 6-9. Chrome and Opera are good ones to check as well. Websites are rendered differently in some browsers and it’s best to check the differences so you can accommodate for those things.

Spellcheck

Check your spelling again and again before the big launch, it’s one of the best ways to appear unprofessional as a company. Also check your grammar, punctuation, capitalization, etc. Any textual errors aren’t going to do your business any favors so it’s great to have multiple people look through the text on your site before it goes live.

Test links

Click on every single link on your site to ensure it works properly. Internal links, navigation links, and external links are all great things to test and find before your users do.

SEO checks

Make sure your site is optimized properly for search engines including adding unique page titles for each page, image alt tags, and other metadata. It’s also a good idea to get Google Analytics set up and tracking right from the beginning.

Functionality tests

Along with clicking on all links on your site, click through any functionality items you have like email forms. Fill it out just as a user would so you can make sure you receive the email afterwards, and your user gets the proper notification that it was filled out correctly.

Blog posts

If you’ve added a blog to your site, add a handful of posts to make it look a little more full and enticing. You’ll probably see some great traffic in the beginning from promoting the launch of your new site, and you’ll want users to subscribe to your blog. However, no one will be interested in an empty blog because they won’t know what to expect from it.

Additional items

Think about any additional items you’ll want on your site down the line, and how you can prepare for that now so that you don’t have to bring your whole site down to set that up later on. This can include a photo gallery, image slider, blog, video gallery, or any additional functionality. Prepare now or even implement it now so you can test before it’s live.

Mobile site

Getting your site optimized for mobile devices is a great idea with today’s growing smart phone and tablet market. It’s easier to configure this before the site is launched so it’s something to consider.

This post includes most of the big items to think about and check off your list, but keep in mind that every site and its needs are different and unique. Hope this helps get you started on thinking what would be best for your site and making the big launch great!

What’s one thing you’ve forgotten to check off the to-do list before a site launch?

Blog Action Day is an annual event that allows bloggers of the world to come together and focus the conversation on one important topic. This year’s topic is food, so we could hardly turn down the opportunity to participate! This year also marks our 4th year that we’ve joined the conversation. Please check out the BAD website to see more information about this great event. Today, we salute local restaurants, farmers, foodie bloggers, and anyone working hard to bring great food to the table. We’ve gathered together a collection of tasty websites that showcase great design and good food. Enjoy!

Take this great quiz to see how much you know about world hunger issues, and what you can do to help.

Have you seen any great food-related websites lately? Tell us about it in the comments below!

Texture is a great way to add some visual interest to a design and give it that extra spark. Depending on the choice of texture, it can also add some character to the design as well, so it’s important to choose appropriate textures that match the style of the company.

We love using texture at Snoack Studios and wanted to highlight some really great uses of texture in web design today. We picked out 8 sites that have different types of textures and also different levels of intensity too. They all do a great job of utilizing these textures to enhance the site and create a great look.

* Click on each thumbnail to see the full website. All sites were originally featured at Make Better Websites, a great online design gallery.

Everything about your website gives valuable information to your potential customers, the typography, layout, content, etc. But the style of your website especially says a lot about your company, whether you want it to or not. We’ve mentioned it before and we’ll say it again, your website is often the first impression many customers will have of your company, so it’s important to make sure that impression counts and is giving an accurate representation of your business.

What kind of impression is your website giving?

Style Types

There are many different styles of websites including professional, minimal, teen-oriented, grungy, earthy, etc. Your audience, products/services, and company culture play a big role in determining what style suits your company best. There are lots of ways to communicate each of these styles, getting your ideals and character across through pictures, amount of white space, colors, typography, icons, etc. Here are a few popular style ideas and what they might say about the company using them.

• Soft gradients and shadows, lots of white space and clean font choices – This site is very professional with clean lines and a sophisticated look. The company sells high-quality services and targets quality clients.
• Curved lines, soft colors and cursive fonts – The feel of this site is feminine and will connect well with a female audience. Feminine sites don’t always have to use pink, but soft colors in general work well to communicate a feminine influence.
• Lots of white space, minimal colors with no gradients, and great pictures – This site has a classic feel and will connect well with many audiences, with it’s clean lines and easy to navigate layout. A minimal look works well for many companies, especially if that fits in well with your company culture.
• Great rugged textures, dark colors and bold fonts – This grungy site has a rough and rugged feel, communicating with a more fun-loving, outdoorsy or youthful audience. Depending on the usage of these items you could really have some fun with it and create a unique look.

It’s important to keep in mind that the style of a site is a combination of many different factors (only a few are represented here) and these style types are just generalizations about a large style category. Your company may not fit into any of these directly, because each business is unique and has it’s own style and look.

Colors

Color is another big factor in the style of a site and how people perceive who you are. Dark versus light colors give a different style perception and bright versus dingy hues do the same. The range of colors on the color wheel each hold a certain significance and meaning for people, something that you should take into consideration when choosing what colors to represent your company. Red is a vibrant color and can portray romance and love or excitement and energy. Blue is a more peaceful color and depending on the hue can mean anything from serenity and calmness to professionalism and trustworthiness.

Most people perceive the style of your site without directly thinking about your typography and color choices, they see it and digest the information to make a perception decision in their head. The style of your site plays a big role in how they think about your company so it’s important to find a style for your site that suits your company well and communicates the ideals that you wish to display. Think about your own company site, is it communicating the right message about your business?

You may have heard the phrase before, it actually started with printed newspapers and later on was applied to websites as well. With newspapers, it refers to the part of the paper that is above the halfway point of the paper where it’s folded, it’s the most prominent area and the most valuable space to occupy. When papers are folded and sitting on the newsstand, you only see above the fold, so the phrase was coined to refer to that lucrative space. With web design, it  refers to the space that users can see without scrolling. Today, we’ll talk more about this space and what you should know about it in regards to your own site.

People will see things that are above the fold of your site first, so although different people will argue differently on whether or not to worry about where this area is, in general, it’s a good idea to keep important things up near the top if you want them to be seen by everyone. This is why your logo and site navigation are best placed at the top, where you know everyone will see them first. Other things like important call to action items, your phone number, or other important information could also be well-placed in this area.

Where is it?

Above the fold is actually a rather vague term as it applies to websites. With a printed newspaper, you can give an actual measurement as to where that will fall on a particular paper because the size doesn’t vary for each print of that paper. On a website, the fold line is different for every user depending on their monitor resolution, screen size and the size of their browser window. The last one can be changed by dragging the window larger or smaller at any time, so it’s really impossible to put a number on where that is for any site, it’s completely user-dependent.

Browser statistics

The best you can do is to take into account the average internet user and your target audience. Looking at browser and display statistics from January of 2011, 85% of internet users had a monitor with a resolution of 1024 x 768 or higher. With that knowledge, and the fact that most people have their browser window open just about as tall as their screen allows for (on average) I would conclude that the majority of users can see at least 700 pixels tall. This is what Snoack Studios like to aim for with our websites, and it’s a good rule of thumb to have. Some people will see less, but the majority will see at least that much of your site.

Do take into consideration your own audience though because you may be targeting a completely different user. This is where Google Analytics comes in really handy. If you’re tracking your site, you will be able to look up the average monitor resolution for your users. If you find that your users are mostly browsing on mobile devices or small screens, you might want to adjust your thinking and your site layout to accommodate for that.

What this means for you

For the most part, I believe today’s users know that many sites continue past where their browser window ends and will scroll to see more, especially if they are interested in finding something. However, I would argue that this space could make or break whether or not they care to scroll and see more. So, I would make sure your homepage top area is descriptive and valuable for users right when they land on your site since this is their first impression. When you make a good impression, people will scroll on to see more! The best you can do is to make your site work for you, and your users. Strive for quality content and a great design and you’ll have a winning site overall.

As we mentioned a few posts ago, font options used to be quite limited. The default way to render fonts online is to use the font library of the computer you’re browsing with. This is actually still true today (although this post will introduce other methods). Since Apple and PC computers come with different font options installed, you had to stick with a list of about 10 or so fonts that were considered web-safe fonts. These fonts were on every machine so it was safe to use them because you knew they would appear correctly on your site. Today, we have more options for fonts on your site so keep reading to find out more.

@font-face

@font-face has been around for a while now but has really gained popularity in the last couple of years. It’s our favorite option here at Snoack Studios for implementing fun fonts. This option, along the with all of the options we’ll present today, allows the text to still be actual text (instead of a flash file or an image) so users can highlight it and search engines can read it. These are 2 big steps forward for online text.

Instead of using the default method to render a font, you add the actual font file to your website ftp and call it in through your CSS file. You can use most any licensed OpenType or TrueType font that you have in your possession, which opens the door for tons of great-looking fonts on your site. We like searching DaFont for great free OpenType and TrueType fonts to use. We recommend using this method to create better headlines and stand-out text. Stick with web-safe fonts like Helvetica and Arial for body copy, to keep things simple and help your site load faster.

Keep in mind it doesn’t work with every browser unfortunately, older browsers only use the default font rendering method. So you must take this into account and allow your fonts to degrade gracefully in your CSS files.

Google Web Fonts

Google created an online font library that’s free to use with quite a few fonts to choose from. Using a very similar method to @font-face, you can call in a great-looking font. With Google web fonts, they store the font for you, so you don’t have to have the license for the font or worry about storing it. Currently they have 238 Open Source fonts to choose from, which is great, giving you a bunch of options to choose from. Google also allows you to download the font for your own usage so your company can use the font online and offline if you choose to make one of these fonts your official company font.

Typekit

Typekit also uses a similar method to embed fonts on your site, but boasts a much larger library to choose from. They do charge for the premium service, but they have several plans available so you can find something that best fits your needs. They store the font libraries for you and allow you to find that perfect font for your website, getting the ideal look you’re going for.

These are just a few of the options available today, there are even more out there to choose from. With all these options it’s easier than ever to have great looking typography that’s searchable, search-engine-friendly, and selectable. The look of a site depends heavily on the typography and font choices so spend some time looking into your options and choose something that fits your company and works well for you. Have fun with it too!