Making Color Contrast Checks a Part of Your Web Workflow

So you have a great looking website and your checklist has you covered. But does your checklist include a color contrast check? Are you wondering what that is?

Let’s first walk through the basics of color contrast and then we’ll move on to some tools and techniques you can use to make color contrast a part of your workflow.

So you have a great looking website and your checklist has you covered. But does your checklist include a color contrast check? Are you wondering what that is?

No, we are not just talking about great looking colors here. More than 7 to 15 percent of males are color blind. Also, as people keep growing older, they have difficulty reading low contrast text. In addition, many of the websites today are viewed on smaller devices, such as mobile phones, and when out in the sun, color appear different. Small screens also make it difficult to read text that does not stand out from its background color. That constitutes a significant number of people with a need for high contrast text.

That’s the reason why a color contrast check is mandatory if you want your website to be accessible to most people. The color contrast used in your website needs to take into account the needs of people who are on the spectrum for color blindness, those using smaller devices (and different light conditions), and of course, the elderly.

Compliance to WCAG 2.0 (Web Content Accessibility Guidelines) norms ensures the accessibility of a website to color challenged people. If you did not do the color contrast check before designing your website, you might have to discard some of the vibrant colors or shades you have chosen.While it’s not a great position to be in, it’s nothing to panic about either! Checkmycolors.com’s color contrast tool can help you quickly find out which of your colors may not be WCAG 2.0 compliant.

That said, making your website accessible to color blind people does not mean you need to go for a bland and colorless website. Far from it! In fact, paying such close attention to your colors will enable you to develop greater sensitivity to design your website with colors that are even more vibrant ie visually accessible and give your website even greater appeal. Let’s first walk through the basics of color contrast and then we’ll move on to some tools and techniques you can use to make color contrast a part of your workflow.

Understanding the Spectrum of Color Blindness

The term ‘color blindness’ actually refers to a broad spectrum of color vision impairment. Not all afflicted people are blind to the same colors. The common types of color blindness are:

Protanopia: reduced ability to see red colors
Deuteranopia: reduced ability to see green light
Tritanopia: reduced ability to see blue light
Achromatopsia: reduced ability to see most colors

Protanopia and deuteranopia are more common while the other two are very rare. That does not mean we cannot use red and green in websites. It just means we need to be sparing in the use of these colors.

WCAG 2.0

While talking about contrasts, it’s not just images we need to look at. Color contrast for text plays an important role as well. WCAG 2.0 (guideline 1.4.3) norms dictate the minimum contrast that we need on webpages when displaying textual content. The color contrast between the foreground or textual color and the background color can range from 1 to 21. The minimum requirement is a ratio of 3:1. That leaves us free to unleash our creativity safely with all the other shades and hues.

Level AA and level AAA are used to differentiate the amount of rigor required in the color contrast.

Level AA

○ For normal sized text, the minimum color contrast should beat least 4.5:1.

○ For large sized text, the minimum color contrast should beat least 3:1.

Level AAA

○ For normal sized text, the minimum color contrast should beat least 7:1.

○ For large sized text, the minimum color contrast should beat least 4.5:1.

Integrating checks into your workflow

Instead of waiting until you finished designing your website, it is a good idea to integrate contrast checks into your workflow, so you do not need to re-do or change your color scheme later. Doing the work up front, during your design process, makes sure you have it handy once you start execution. So how do we go about it?

Map out your desired color scheme. Jot down a quick list of text and background colors you wish to use on your website. Feel free to refer to other websites using accessible color contrasts. When starting to build your color palette from scratch, Color Palette Accessibility Builder and Color Extractor are good tools to use. As the name suggests, the Color Extractor website extracts the colors from a website of your choice to help you build your own palette. Of course, your example website should have colors that are accessibility compliant. A good rule of thumb is to use cool colors for the background and warmer ones for the foreground text.
Check whether chosen colors are accessible. Traditional methods used colored goggles to do a contrast check for color blindness. However, we now have several online simulators that do the job. Checkmycolors.com can help you check whether your colors and text aer WCAG compatible.Paletton.com, WebAim and color-blindness.com are other online resources to screen out inaccessible colors. lets you quickly check color contrasts for accessibility. Paciellogroup offers you a free downloadable tool to do the same job.
Create a mockup or use placeholders to build content and use the selected colors to build a sample website for further testing.
Run a grayscale test. It is easier to judge color contrasts in grayscale compared to viewing website in color. After you are done choosing your color palette, converting all your colors to grayscale can be of help to evaluate the color contrasts used in a website. Gray-bit.com is among online resources available for your grayscale check.
Test on color blindness simulators to screen out non accessible colors. Chromatic Vision Simulator and VisionSim are among free mobile apps which help you check your colors for various kinds of color blindness.
Double check your buttons and CTAs. Using colors to indicate the functions of buttons is not enough. In some cases, red and green change to some other colors. You then realize the need to also have contrasting text to explain the button function.
Adjust your colors, hues and fonts to bring them within accessibility values. Tanaguru Contrast-Finder will suggest other colors if the colors you selected do not offer sufficient contrast.

By following these steps you can make color contrast a de-facto part of your web workflow. The wide range of tools and simulators available today ensures that you don’t waste time, and effort, in figuring out the right contrast and colors.

Are you already including color contrast checks in your workflow? How do you go about it? Share with us in the comments on Facebook or Twitter.

Coffee Break: An Interview with Chris Castiglione, Co-Founder of One Month

Chris Castiglione is an engineer, artist, and the co-founder of the Y Combinator-backed One Month, the “For Dummies” of online education. Prior to One Month, he was the first teacher at General Assembly, where he created the #1 best-selling coding class for entrepreneurs, “Programming For Non-Programmers.”

In 2013, he taught at Columbia University, and he is currently an adjunct professor at The School of Visual Arts in NYC. In the past, Castiglione has advised companies such as American Express, Donor’s Choose, The New York Stock Exchange and General Electric.

Q. Tell us about yourself. How have you come to development, and particularly to being a co-founder of One Month?

I always wanted to be a teacher. I taught guitar lessons for a few years, and then I taught English in Osaka, Japan for a year. It was amazing. When I was in my mid-twenties, I went back to school to get my masters (University of Amsterdam), hoping that when I returned to the States, I could teach at a university like NYU or SVA.

Little did I know, universities usually only accept PhDs to be their teachers. I started down the doctorate route for a few months, but it just didn’t feel right to be in academia for so long.

That’s when I met one of the founders of a place called General Assembly (GA). I told him (Brad) [about] my desire to teach, and early in 2011, I taught the first coding class at GA. At the time, the staff was only 5 people (today it’s close to 400)… but I don’t know if, back then, I could have imagined just how big coding classes would become. Things that seemed simple to me (HTML, Rails, etc) were selling out weekend after weekend.

I went on to create the best selling classes at the time, “Programming for Non-Programmers,” and “Front-end Web Development.” It was around this time that I met Mattan Griffel. He had just launched the best selling class on the Skillshare platform, called “One Month Rails.”

We were both members of the General Assembly co-working space, and every now and then, we’d take lunch together and dream up ideas for the future of education and what it might look like. There were lots of innovative things we wanted to try, and we both felt held back by the powers above.

Long story short, Mattan applied to Y Combinator. He got in as a solo co-founder, and sometime shortly after, he invited me in as his co-founder on the project. That’s how it began.

Q. How did the idea appear, and how have you come to the vision for what One Month is?

The idea appeared out of a natural evolution from the platforms we were creating. We weren’t trying to create a company at first; we just wanted to evolve online education. We wanted to know the metrics for our students’ happiness, and completion rates; we wanted to A/B test content and provide 24-hour live support.

Q. Who can benefit from One Month, and how? What allows One Month to stand out from the crowd?

One Month is for life-learners.

All our classes are broken down into manageable pieces: about 15 minutes a day, for 30 days. Every skill is project-based (ie. you’re making something from Day 1 of each class, so there’s never a ton of theory upfront) and you have unlimited access to our teachers and support throughout your journey. Which means, if you get stuck (we all get stuck sometimes)… you have someone there to get help you.

I don’t imagine One Month will be in elementary schools any times soon. We know our audience- I sometimes think of our classes as some sort of “Rated R” flavor of education. Our class are meant to feel like you’re at the bar sitting with your best friend who is just shooting the shit and helping you build your project. Approachable. We’re approachable.

Q. What do you enjoy about your project the most? Are there any negative moments you face up with, or is this experience 100% positive?

I love coming to work every day! I’m super inspired to be around everyone on our team.

Q. It looks like you change the lives of tens of thousands of students; how do you feel about it?

It’s hard to imagine what “20,000” people looks like. At that point, the number feels more like a statistic.

Luckily, I get to see progress from our individual students. That’s the best part… the testimonials that come in. Hearing that Patrick in SF was able to land a 120k job, or that Sarah in DC saved $20k building a project herself- I only hope we can help inspire more people!

Q. How can one wow you to become a part of One Month as a teacher?

We’re always looking for teachers, but we’re selective, so if you read this, please do
apply.

I’m looking for someone who has taught before, has a portfolio, a intro from a trusted friend always helps, and someone who passes the beer test (ie. Would I want to spend Friday night drinking a beer with this person?). You don’t need to be a rockstar before applying, but you have to want to become one once you join us:)

Q. Last summer, you had interesting experience when you and your team moved to Berlin to work and live in a house together for 30 days. Has this made you think this is the best way to grow stronger as a team? Do you live and work together with your team now, and how does your work space look like?

Berlin! It was the best.

The trip to Berlin was an experiment for sure. It could have gone horribly, but it didn’t. It was truly magic. Before Berlin, our team was only two people (me and Mattan). That month we grew our team to five, so Mattan and I thought, “What’s the best way to get to know our new teammates this month? Let’s try living together with them.” And what better place than fucking Berlin.

We don’t technically live together now, but One Month HQ is technically a “live/work” space. It’s a very large 2-bedroom in the village, and each of us has decorated the space with our personal toys from home (books, an electric piano, Halloween costumes, paintings). So yeah, it’s not home, but we treat it like a home.

Q. What is One Month’s monthly revenue?

I might only say, some months, we’re profitable. Most months, we’re close to profitable. Overall, it’s going well.

Q. How do you keep up with trends and keep your skills up-to-date? What inspires you to succeed in what you do?

How do I keep up with trends? The easiest way has been to surround myself with people that are smarter than I am. I’ve learned a ton over the years this way. I’m pretty sure each of us on the One Month team feels that way. A fun fact is that almost all 9 of us were freelance consultants before joining One Month. Being on the team has helped me grow so much.

What inspired me? It’s hard to answer that without sounding a bit stilted, but the truth is, I’m hungry for learning. I see a world that is much more empathetic and kind than the world we live in now. And empathy (for me) beings with understanding, and education.

To that extent, I’m also personally hungry to learn…I selfishly consume books, people, travel, and ideas. Here at One Month, I have this opportunity to live comfortably in NYC while also connecting people to these amazing books, people, travel and ideas…. and thereby spreading empathy. It’s inspiring for sure.

Q. Do you use your knowledge in practice, then, or is teaching currently the only way for you to share what you’ve learned?

The two classes I teach for One Month right now are One Month HTML, and Programming For Non-Programmers. I use those in practice, in that I was a developer for 10+ years. I still do development work on the side, but much less than I used to a few years ago. It’s more about managing our development team these days.

Q. Here is a tricky MV* Frameworks War question:) What is your favourite framework(s) and why? What do you think about the future of this/these framework(s)?

I’m not sure I have an exciting answer here. I tend to like things that are functional. I used to use WordPress as a backend, and more recently, I’ll use Rails. I think the biggest constant in frameworks is Bootstrap. So I’d have to choose that. Clearly, those guys have revolutionized development with what they’ve given the Web.

Q. What are your plans for 2015 in terms of your project and the class you teach? Do you plan to roll out new classes any time soon?

We’re rolling out a bunch of new classes in 2015. My class, Programming for Non-Programmers, will be released in February 2015, as will Content Marketing (taught by Sarah Peck), One Month Python, and One Month UX. That’s all I can talk about right now, but more exciting twists and turns (even outside of tech) will be out soon enough.

Many thanks to Chris for taking the time away from teaching to answer our questions and run through his pictures to share some of them with our readership. We expect the One Month guys will achieve the goals they have established for 2015 in the near future.

Tips For Enhancing Typography in your Web Projects

Understanding how to select and use appropriate fonts in web design can be a challenge, though. Luckily for you, we’ve compiled a list of tools and techniques to help you identify fonts, select appropriate font combinations, and implement typography elegantly in your responsive web designs.

Typography is a huge part of modern web design. Gone are the days where you were limited to using the handful of typefaces that were installed on almost every user’s system. Nowadays, through the use of web fonts, many hundreds of different fonts can be used safely on the web.

Identifying and selecting typefaces

Deciding on which fonts to actually use in your design can be difficult. Fortunately, there are some great tools out there to help you select fonts and combinations to enhance your design.

WhatFont Chrome Extension

WhatFont is an amazing extension for the Google Chrome browser (if you don’t already use Chrome as one of your primary browser for web design and development, we highly recommend trying it out; it has an abundance of useful extensions). To use the WhatFont extension, you simply install it within Chrome, enable it from the toolbar and then the name of any font you hover over will appear in a little tooltip near the font. If you click on the font, additional info will be revealed, like color, font size etc.

WhatFont provides an easy way to discover font combinations that are being used on beautifully designed sites, which can be a great source of typographical inspiration.

Fontpair.co

If you’re planning on using fonts from the free Google Fonts library, you should take a look at fontpair.co. It suggests a wide array of font combinations using fonts drawn exclusively from Google Fonts. You should be able to find a free combination to suit just about any project here.

Beautiful Web Type

This site is more of a showcase of what can be done with some of the fonts available for free on Google Fonts. It really does provide some beautiful examples of web typography and suggests some great font combinations. It’s sure to get you inspired.

Where to get your fonts and how to use them

There are a few options when it comes to sourcing the fonts for your website. We’ll cover two free options here, but there are many more – both paid and free – sources available.

Google Fonts

By far the easiest and most convenient way to use web fonts in your design is to use Google Fonts.

To use fonts from the Google Font library, you simply need to go and select the font or fonts you’d like to use, add them to your collection, insert the generated code into the <head> section of your site’s code, and start referencing the font as you normally would in your CSS.

For example, once you have added the following code to your <head> section:

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

you could make all h1 tags use Open Sans (and fall back to the system default sans-serif font) simply by adding the following regular CSS rule:

h1 {

font-family: 'Open Sans', sans-serif;

}

Font Squirrel and other self-hosted solutions

You may want to use a font that is not available on Google Fonts. In these cases, websites such as Font Squirrel may be useful. Using web fonts from these sites is also very simple; it just requires a few more steps than Google Fonts.

Firstly, unlike Google Fonts, you will need to upload the font files to your own server. You may also need to write your own CSS @font-face rules to load those font files and make them usable (this is not necessary with Font Squirrel).

For most of the fonts on Font Squirrel, you can generate a web font kit (some have licenses that don’t allow this). This takes care of most of the technical issues for you. To generate the web font kit, when you are on the individual font page (eg. http://www.fontsquirrel.com/fonts/open-sans) just click on the ‘webfont kit’ tab, select your options (the defaults are usually fine), and then click the ‘Download @font-face kit’ button.

This will generate a .zip file that contains everything you need to get your font working. Just upload the .eot, .svg, .ttf, .woff and .css files to a folder, preferably a folder under your existing CSS folder on your server.

Next, you need to add a reference in your existing web page to the .css file generated by Font Squirrel. To do so, add the following into the <head> section of your page, making sure to add the correct path to the Font Squirrel CSS file:

<link rel="stylesheet" href="path/to/stylesheet.css" type="text/css" charset="utf-8" />

The .css file generated by Font Squirrel should be in the same folder as the font files you uploaded to your server earlier. If they are in different files, you will need to correct the paths in the Font Squirrel stylesheet.css file.

Now that the files are uploaded and the CSS file is being referenced correctly, you can begin using the fonts in your designs just by referencing the font as you usually do in CSS. If you don’t know how to reference a font in your CSS code, you can find out by checking the Font Squirrel stylesheet.css file associated with that font.

Creating Your Own CSS @font-face Rules To Use Web Fonts

If you get a web font from a source that doesn’t generate the required CSS rules, you’ll need to create them yourself.

Basically, you just have to define the name of the font-family, then reference the font-files you’re going to use to render the font in different browsers. The example below shows the CSS @font-face rules needed to implement a font called Open Sans; it assumes the font-files are uploaded to the same folder as the CSS file.

@font-face {

font-family: 'OpenSans';

src: url('opensans.eot'); /* IE9 Compat Modes */

src: url('opensans.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

url('opensans.woff2') format('woff2'), /* Super Modern Browsers */

url('opensans.woff') format('woff'), /* Pretty Modern Browsers */

url('opensans.ttf')  format('truetype'), /* Safari, Android, iOS */

url('opensans.svg#svgFontName') format('svg'); /* Legacy iOS */

}

To use this font in your design, you would use a CSS rule, such as:

h1 {

font-family: 'OpenSans', Fallback, sans-serif;

}

Note that we are using the font-family name as defined in the @font-face rules; unlike regular system fonts, it must be enclosed within quotation marks.

These rules ensure the web font will be compatible with as broad range of browsers as possible.

Improve performance with Web Font Loader

On overstressed networks or over particularly slow internet connections, the performance of web fonts can become an issue. The content being rendered in web fonts may take longer than is ideal to become visible to users. This is commonly known as the ‘Flash of Unstyled Text’ (FOUT) issue. Although this issue rarely becomes a major problem, it can potentially pose significant usability challenges.

If you run into this problem when using web fonts on your websites, you may want to take a look at the Web Font Loader script. This script allows web fonts to be rendered in regular system fonts until the relevant files are loaded in the user’s browser. This can result in an improvement in perceived performance and a far better user experience.

Options for Responsive Text

Because the web is increasingly accessed on a mix of devices, such as desktop PCs, phones and tablets, it’s important your typography is flexible and adaptable enough to work and look great on a wide range of screen sizes. The most common way to do this is using regular CSS media queries and setting font sizing and spacing for each relevant screen size. This article is a great primer on CSS media queries.

FontFlex is a jQuery plugin, which offers an alternative approach. It results in much more dynamic and flexible scaling of text.

To use it, you simply reference the script after you’ve reference jQuery in your page’s code:

<script src="jQuery.min.js"></script>

<script src="jQuery.fontFlex.js"></script>

You should also declare general font-size and line-height rules in your CSS to ensure text scales properly:

body {

font-size:1em;

line-height:140%;

}

Then, to apply the effect, simply add the following self-invoking function, either in a separate JS file or within <script> tags on your page:

$(function()

{

$('body').fontFlex(14, 20, 70);

});

The parameters in order are: minimum font-size in pixels; maximum font-size; and mid-range buffer (best set between 60 and 70). Check out a live demo of some beautifully dynamic scalable text here .

This plugin works flawlessly in Google Chrome, Apple Safari Desktop and Mobile, Microsoft IE 9, 10, 11 and Mozilla Firefox.

Go forth and create beautiful web typography

So there you have it! This guide should give you all you need to start selecting great font combinations, implementing web fonts in your responsive layouts and optimizing web font performance.

Remember, the goal of web design is to facilitate and enhance communication, and great typography is central to achieving that goal.

January Think Piece: Web Design And Development News

In this issue, you will learn more about UX principles, font pairing, new releases of Firefox and Bootstrap, Project Spartan (rebranded IE for Win 10), and you will discover a new collection of design resources as well. We’ve also included several articles for inspiration and entertainment.

Welcome to our January Think Piece. Each month, we’re going to publish some of our favorite articles and resources we’ve discovered. In this issue, you will learn more about UX principles, font pairing, new releases of Firefox and Bootstrap, Project Spartan (rebranded IE for Win 10), and you will discover a new collection of design resources as well. We’ve also included several articles for inspiration and entertainment. Hope you’ll enjoy the reading!

Education

Understanding Web UI Elements & Principles

The design of any commercial website is about conversions, sales and leads. That’s why every good designer should know at least some UX basics. The more principles you know and apply to your designs, the more benefit you’ll bring to your customers and the more new orders you get.

This article talks about some of the most important principles of web UI design. The main idea is that the interface is not just a set of beautiful buttons and elements, but the funnel to guide a user towards some certain and fixed goal to complete (usually sale or lead generation). When drawing some innovative interface, please note that most users are quite close-minded and tradition-bound, and they might not accept some radical innovation, even if it promises them more convenience in the future. Your designs should pass the so-called MAYA-principle test (Most Advanced Yet Acceptable). All practical hints in this article have interesting and funny examples.

6 Tips for Perfect Google Font Pairing

There are no strict rules for fonts pairing; however, there are some basic principles for doing it properly. This article outlines several generic recommendations on how to pair fonts. The first rule is that no font can rescue bad content. Second, keep typography simple so it doesn’t become overwhelming. Third, use contrast fonts, but use them right. Don’t forget about readability; ensure the text remains easily readable. Do not limit yourself with several fonts you are used to working with – use online resources for new fonts, new pairing samples and inspiration. Be creative and do not be afraid of experimenting with new pairings.

Prepare for 2015 with 1000s of New Artistic Resources

This fresh collection of design resources will help you prepare and complete new challenges in 2015. Design effects, custom scene creation packs, Photoshop kits with styles, brushes and textures – these resources will help you create new, beautiful design effects and save you time. This collection has received several enthusiastic comments and you will definitely love it, too.

Photo from Designcuts.com

Inspiration for Text Input Effects

Opportunities for form input customization are undeservedly overlooked in most cases. The majority of input forms are, by default, just dull. Mary Lou shares some experimental styles and effects for text inputs in her post. Almost all of the effects use CSS transitions, pseudo-elements and CSS properties that will work on modern browsers only. The post itself was written more for inspiration rather than for practical use, but it is still worth reading.

Inspiration & Entertainment

How To Transform Your Problem-Solving And Creativity

Creativity is one of the most important things for any designer, but what, actually, is it? Is it some kind of God-given talent, or just a skill that can be trained and improved? Creativity is all about fresh ideas, and ideas are usually generated by thinking. So, theoretically, there is a direct relationship between mental capabilities, the level of creativity, and every person with a strong logic and strong ability for thinking, right? Well, the reality shows that is not always the case. Check out this article with an overview of five books that will stimulate and improve your thinking abilities, creativity and problem-solving skills simultaneously. They will teach you new methods and ways of thinking to remove any barriers and preconceptions of your mind, and free and improve your creativity.

8 Places to Prowl for Creative Inspiration

Every designer knows that inspiration is not something that can be bought or summoned to appear exactly when you need it. That means you need to look for it, and this article will help you in your search for places that waken your creativity. It introduces eight sources for inspiration available in any country, region and environment. The first place is nature, which, for example, inspired Nike to create a modular design of shoes (similar to the structure of microscopic water creatures). Music also works pretty well for inspiration. In some cases, you can use words for inspiration and try a so-called title-first approach (like Sting, who sometimes invents a title for his future song first, and then starts composing the music itself). All sources of inspiration in the article have very interesting, and sometimes funny, practical examples of famous people. We highly recommend you read this article in its entirety.

A Browser-Based Illusion Made all in CSS

As it turned out, CSS is applicable not only for ordinary styling; you can also do some magic with it. James Louis Walker introduces illusions with impressive animated effects. The illusions themselves were inspired by videos with optical illusions made by Brusspup on Youtube. But the feature of James’ illusions is that they are all completely done in CSS. The post gives you some hints on how this illusion was created, so if you want, you can do your own and send them to us for publishing on our blog and in our social groups to get some promotion in our community.

30+ Examples of Login Form Designs

Login and registration forms are very important elements of any design. They have to be easy to notice and easy to use. But when they are creative and beautiful at the same time, it’s a triumph for each designer. Here you can find examples of creative and efficient (and sometimes quite funny) forms. We hope this collection will inspire you and contribute to your own projects.

For Developers

This is Spartan! Project Spartan is Microsoft’s new web browser for Windows 10

It seems Microsoft will give up Internet Explorer in Windows 10 and introduce a new default browser called Project Spartan. According to Christina Warren and Mashable.com, it’s more like an attempt to rebrand IE rather than an intention to develop completely new and different browser. It’s quite logical step, because more and more developers pay little to no attention to IE compatibility at all. They mostly focus on Chrome and Firefox now. The new browser will be based on a new rendering engine with a cleaner user experience and a more streamlined appearance. More information on this topic can be found here.

Firefox Version 35 Has Been Released

Mozilla has also released a new version (version 35) of its Firefox browser recently. In addition to lots of bug fixes, this release contains several features that will make the life of developers easier. For example, they enabled CSS source maps by default. This feature was initially added into Version 29, but now it is enabled by default. Check Mozilla’s developer network for a full list of all the bug fixes, improvements and changes.

Bootstrap 3.3.2 released on January 19

According to the Official Bootstrap Blog, this release contains more than 300 commitments from 19 contributors. It doesn’t contain any significant new features, but it does include lots of bug fixes, accessibility improvements and documentation updates. As always, the post contains a link to a music video. This time, it’s Ace of Base – “The Sign”. Enjoy it!

That’s all for now. Subscribe to our blog updates and we’ll keep you in the loop.

Web Design Awards Worth Participating in 2015

Are you ready to let the world know about you as a web designer? If your answer is yes, then this post is for you. We’ve compiled a list of awards you might want to participate in this year.

Are you ready to let the world know about you as a web designer? If your answer is yes, then this post is for you. We’ve compiled a list of Web Design Awards you might want to participate in this year. Some of those awards are free and some require registration fee. Some of them are conducted just once in a year; other nominations are done monthly, weekly and even daily. Choose the ones you like the most and may the force be with you. Good luck!

1. European Design Award

Submission Deadline: February 21

Submission Fee: starting from EUR 40 (for students) and EUR 140 per single standard submission.

The European Design Award is the most reputable design award in Europe. It has 35 separate design nominations and you can take part in all of them simultaneously. The only limitation is its cost – you pay EUR 140 per submission. For multiple submissions, you get volume discounts. Each nomination has three levels of distinction: Gold, Silver and Bronze. Gold winners receive a trophy during the official Award Ceremony. All winners additionally get some recognition and promotion, as they will be published in the ED-Awards catalogue and on the website itself.

2. D&AD Award

Submission Deadline: February 18 (may be extended until February 25)

Submission Fee: starting from GBP 105.

The non-profit British Design & Art Direction organizes this prestigious international award each year. If you are between 18 and 23, you can participate in their New Blood Award section. Otherwise, you have to register for the Professional Awards section. There are many nominations available with different categories. All winners get a Yellow, White or Black Pencil as recognition of their achievements. New Blood Award winners can use their Pencil Marks in their portfolios, CVs etc. The winners’ works will be showcased at the D&AD Awards Night, as well as their international exhibitions and events. This Award is a great opportunity to get some buzz around your name in a designer community. However, it’s not the cheapest one.

3. Awwards Design Award

Submission Deadline: no deadlines, sites can be submitted all year round

Submission Fee: EUR 40 for a one-time single website entry, EUR 120 for an entry followed with a featured profile in the Awwards directory.

According to the site, they get more than two mil unique visitors per month. So if your website is featured as “Site of the Day” you will theoretically get visible for at least 100K visitors. All winners will be published in an annual book “The 365 Best Websites Around the World”. Depending upon the category, you have an opportunity to get official Awwwards certificates for the following nominations: Site of the Day, Site of the Month, Site of the Year and Honorable Mention. Judging criteria include 40% design, 30% UX, 20% creativity and 10% content. Once per year, Awwards.com holds a conference, as well as price-giving. So in addition to online exposure, you have a great opportunity to get featured at that event.

4. CSS Design Award

Submission Deadline: no deadlines, sites can be submitted all year round

Submission Fee: USD 30 per submission.

CSS Design Awards is a global platform showcasing the best web designers and their works. They say they are one of the top two most visited online web awards in the world (according to Alexa) and the most followed awards group on Facebook. The winners for Site of the Day get site badges and certificates. The winners of Website of the Year and Designer of the Year additionally get a handcrafted trophy finished in brushed chrome and gold. Judging criteria include the design itself, creativity, functionality, usability and code.

5. CSS Winner Award

Submission Deadline: no deadlines, sites can be submitted all the year round

Submission Fee: free of charge.

CSS Winner is an international platform awarding best designs on a daily, monthly and yearly basis. The main evaluation criteria are the design, user experience, creativity and content. All winners get exposure on the website and through social media network and obtain a CSS Winner certificate. The main jury consists of nine designers from all over the world, and 80% of the total ranking for each website takes the opinion of those designers. The community can also participate and vote – their opinion is taken into consideration as 20% of the total ranking.

6. Favourite Website Awards (FWA)

Submission Deadline: no deadlines, sites can be submitted all year round

Submission Fee: free of charge.

FWA is a UK-based design award portal for designers from all over the world. They were the first online award program that received over 200,000,000 website visitors. FWA accepts websites, online games and online movies/animation for nominations. The main criteria are creativity, originality, design, and content. A remarkable feature of this portal is their collaboration with Google’s Creative Sandbox. The winners of the Site of the Day nomination are reviewed with Google, and if Google finds the website suitable for their program, this particular website is featured on Google’s Creative Sandbox.

7. Promotion & Marketing Design Awards

Submission Deadline: Early-bird entry March 20, regular submission deadline – April 17

Submission Fee: starting from USD 40 for early-bird student submission, up to USD 85 for regular single entry.

This award is held by the HOW brand, which initially started as a print magazine in 1985. With time, they grew into a bigger hub for designers providing design competitions, online design courses, job portal and more. The award itself contains several categories and supports single entries and campaigns. They provide discounted prices for students and are quite flexible with submission fees. The winners get a free trip to the 2016 HOW DESIGN LIVE event and will be published in HOW’s FALL 2015 issue.

8. CSS Awards

Submission Deadline: new submissions accepted at any time

Submission Fee: USD 9.99 per submission, or alternatively, it’s free in exchange for a Like or Follow on Facebook and Twitter.

This website accepts website designs from all over the world. They have quite a tricky system for submissions – you can submit your website for a small fee of USD 9.99 or alternatively you can like them on Facebook or Follow in Twitter and then send a message with your website URL + Agency / Freelance URL. This is partially the reason why they have around 43K followers on Twitter and around 7K Likes on Facebook. But at the same time, they have 1,192 followers on Pinterest and 2,127 pins, so they’re still worth your attention.

This website also has an additional website exclusively for submissions of one/single page websites. All terms and conditions are the same.

9. Webbyawards.com

Submission Deadline: January 30

Submission Fee: USD 345.

The Webby Awards is one of the most prestigious international awards, presented by the International Academy of Digital Arts and Sciences (IADAS). They have several categories, and each category has two honors – The Webby Award and The Webby People’s Voice Award . The winners for the Webby Awards are determined by the International Academy of Digital Arts and Sciences. The winners of the Webby People’s Voice are selected by the online community. For the previous year they received 12,000 entries from over 60 countries. This year, the submission deadline was December 19, but they extended it until January 30. Even if you won’t manage to participate this year, you have some time to thoroughly prepare for the challenge for the next year.

There are lots of other awards and contests worth mentioning here, but we’ve limited the list to an uneven amount intentionally. Hopefully, you’ll propose to us the tenth award you like best. So what award would you like to be mentioned here? Share your thought with us on Facebook and Twitter.

Converting PSD to WordPress and Joomla Templates in 4 Easy Steps

The most popular systems on the modern web are Wordpress and Joomla, since they are the most versatile – with these CMS at hand you can easily create a blog with expandable menu, galleries, sliding images and other interactive elements. No expert knowledge is required either.

Yet, you need to add personal traits to your project to make it popular.

Creating a modern website is a project that involves generations of unique ideas and requires the author to handle large amounts of information. It is rather typical to opt for CMS use to save time and cut the amount of work overall. Content management software allows you to get your blog up fast and easy, and more importantly, no special expertise is required to perform basic operations. The most popular systems on the modern web are WordPress and Joomla, since they are the most versatile – with these CMS at hand you can easily create a blog with expandable menu, galleries, sliding images and other interactive elements. No expert knowledge is required either.

Yet, you need to add personal traits to your project to make it popular. No one is falling for another typical website, so it’s up to you to create a stunning design for your project. Once you have your ideas ‘on paper’ (or rather, in a PSD file), it’s time to convert the image to a fully-functional website.

What’s the difference between Joomla! and WordPress?

The main difference between WordPress and Joomla! content management software lies in the way they operate templates. WordPress pages are composed from a number of blocks: every single element is stored separately and used in a particular case. Once you make a change to an element (for instance, you alter background image for a menu) it takes effect immediately everywhere it is used.

Such ‘modular’ systems allow for faster work with complex projects. You create a set of components and assemble them at your wish.

Joomla, however, uses a different approach and handles every page as a separate set of components. This means that if you plan to use an identical item on every page (for instance, a navigation menu), you’ll have to add a separate menu to each one. If you change this component on a page, changes won’t affect the other parts of your website.

Every template should contain all the necessary code to make proper use of every single module type – authentication, navigation, text, images, video etc.

How do I convert a design project to a functional CMS template?

Working with CMS means you get to work with a product provided ‘as is’ by developers. Of course, there are advantages – you don’t need to hire a programmer to create frames for you, yet there is a drawback; you have to adhere to certain rules. Standard systems can be altered, but it takes time and certain web development skills; you would generally want to use a content-management system to save time and effort.

Converting a PSD project to a fully functional CMS template takes several steps:

1. Analyze your project. Split it into parts (separate pages and items – menu, text blocks, galleries etc.) and see which of them can be implemented by means of CMS systems. Generally, a WordPress or Joomla! website contains a header, menu, main block and footer. It is generally a good idea to stick with these modules to make further work easier.

2. Cut the PSD image into elements – buttons, triggers, decorations. Group up separate components – CMS will generally require you to place images in certain folders for the system to access it properly. For now, you have to handle components as separate parts (that are none-the-less tightly connected) and make them interactive.

3. Make every element work with the CMS of your choice. Assign each components its place on the page, qualities, set up the way it works (when it is shown, how it reacts to clicks and interacts with the user).

4. Run your website and enjoy the results of your work! You might have to check your code to get rid of unnecessary elements (some of them are implemented in the CMS, but you might never use them) to optimize memory and connection usage.

Keep in that you will be using classes to make your components work. Classes are basically unit types with a range of properties and functions – if you want to create a brand new item type, it should be compatible with the existing system. This is one of the limits set by CMS systems.

Is it worth using automated PSD to WordPress/Joomla converters?

There are a number of sites on the web that offer to convert your PSD file to a CMS template automatically. This option is certainly attractive if you are on a low budget, but it will ruin the whole project.

The process might be fast, but the result will leave you wanting more. Automated algorithms work with every project by a standard scheme. This results in a lot of non-optimized code with unnecessary components. Websites created by an automated system run slowly and lack functionality.

If you want an optimized website that runs fast and stable, you will want conversion to be done manually. It is a type of work that requires skill and knowledge; it’s best to let professional web developers to handle the project.

Yearly Think Piece: Best of the Web and Design In 2014

2014 is now over, and that means that it’s high time to see the old year out and the new year in. Let’s have a quick look at what was going on this year and check forecasts on what will be trending in the next year.

Remembering 2014:

Best and Worst Web Design Trends in 2014

Jake Rocheleau, web designer and social media entrepreneur, collected the most propagated design trends for 2014 in his article. According to Rocheleau, minimalist flat design is still popular because it is easy to design and use. Fullscreen responsive background became trendy this year since it can scale naturally with the browser. Mobile responsive navigation is another trend this year, and this trend will persist.

Among the worst trends of this year, Rocheleau mentions modal window promos, as they are annoying and have the same effect as pop-ups. Another thing that you must avoid is overloading your site with social media. If you have too many sharing badges for too many social networks, it is confusing. Preloaders and customized scrollbars are also elements not worth using in 2015.

The Evolution of WordPress in 2014 and Beyond

WordPress remains the most popular CMS in the world, covering around 23% of websites, and will continue dominating the market for at least the next year. One of the reasons for their success is that they are constantly evolving. This article studies the most remarkable WordPress releases and features throughout 2014. The main focus of WordPress 3.9 “Smith” was on improvements to the WordPress Visual Editor and media capabilities. Now you can have media lists and drag-and-drop images directly into the visual editor. WordPress 4.0 “Benny” contained no significant new features, just some minor updates and fixes. According to the author, one of the main focuses for 2015 will be to make working with media files easier. Hopefully, WordPress will finally start to update itself automatically, like Chrome or Firefox. This would help to keep all sites as secure as possible. Moreover, since the whole world is moving towards globalization, WordPress would need a better support for international sites by providing more tweaks for non-English-language users.

The Fifth Revision of the HTML Standard is Finally Out

After 10 years of development (which took more than 50,000 email exchanges and more than 4,000 errors resolving), the W3C finally released the fifth revision of the HTML standard. New features, which simplify multimedia and graphics handling, help to avoid using proprietary plugins and APIs, and also provide additional features to enrich semantic content. In particular, HTML5 introduced <video> and <audio> tags, and implemented 2D graphics rendering via <canvas> tag and corresponding JavaScript API. Forms are improved now and have become more user-friendly without any extra JavaScript code. Thanks to the use of Cache Manifest, the content is stored on the client so that users get fully functional applications, even if they work in an offline mode. HTML5 introduces many new features, markup elements, attributes, APIs, DOM interfaces and extensions. It’s definitely worth to study all of them in detail.

The 5 Most Popular Front-End Frameworks in 2014 – Overview and Comparison

There are plenty of CSS front-end frameworks available on the market. Each framework has its strengths and weaknesses, as well as specific areas of application. Here is an article about the TOP 5 front-end frameworks in 2014. This rating is based on their GitHub popularity, and the TOP 1 is, of course, Bootstrap. Initially released in 2011, Bootstrap is the undisputed leader among frameworks for the moment. It’s hard to tell whether it is technically better, but its main strength is popularity, which means lots of educational resources, manuals, articles,third-party extensions and plugins.The second popular framework is Foundation, and the next one is Semantic UI framework, which utilizes natural language principles. Thanks to this feature, its code is easy to read and understand. Another framework mentioned in the article is Pure, a lightweight modular framework by Yahoo! and written in pure CSS for those who need only specific components instead of a full-featured solution. Last but not least is UIkit, an easy-to-customize set of components written by Yootheme.

The article also contains several tips on how to choose the right framework for your needs. Briefly summarizing a framework should be popular (it usually means lots of tutorials, samples, third-party extensions, etc.) and under active development to keep up with latest web technologies.

Google Subtlest Logo Change in the History of Logo Changes

This year, Google changed their logo a bit. The changes were so slight they were almost invisible. They moved the “g” one pixel to the right and the “l” one pixel down and right. The community says it was done to solve a problem with the kerning of the letter. You can compare “before” and “after” here. Not sure if they really solved the problem, but at least they can be nominated for the subtlest change ever done to a logo.

Preparing for 2015:

Web Design Trends in 2015

It’s important to keep track of current web design trends. However, if you want to outperform your competitors, you have to learn to predict and forecast upcoming trends. Let’s have a look at what the community suggests as the most trending things for the next year. Responsive design can still be considered as a trend, but it’s more like a norm now. Ghost buttons are minimal and stylish, and perfectly suited for fullscreen backgrounds. The author says they will gain more popularity this year, along with large background images and videos. More attention will be paid to typography this year. That’s because type kits became more affordable and do not require larger budgets for website development. At the same time, they allow building really nice websites. Scrolling over clicking will obviously be more and more popular. The reason is with the development of the mobile world, more and more people want to have the same experience on their desktops. Card design will continue, as cards are a clean and simple way to present information. Flat design may remain trendy or grow up into material design, which was introduced by Google this year. Micro interactions in form of pop-ups will continue to grow, as well. Then, there is Personalized UX – this is what we already have on Youtube, for instance, where Google displays more relevant content using our cookies. The idea itself is not new, but more and more websites will adopt it.

HTML6: The Next Big Thing After HTML5

This year, the W3C officially launched HTML5. However, they are always on the move, so moving forward to the sixth revision of HTML will not be long. HTML6 will be more than just creating containers and assigning them IDs. The new language is planned to be more human-friendly and define containers and elements in a way convenient for you. This will be achieved via a combination of HTML and XML. In this new version, you will be able to create any tag you want and W3C will reserve and use namespaces that will call the required HTML APIs. There will also be the introduction of some new tags, like the <carousel> tag. This will help you implement carousels on your web pages in an easier way. Check out this article for more details on the upcoming changes.

Web Development Trends in 2014 and Predictions for 2015

Shiju Varghese shares his observations on web development trends this year, and makes predictions for the next year. Since web development technologies are powering and affecting designs, this article will be useful for both developers and designers. Responsive web design is now a must-have feature, but it doesn’t solve all the challenges and is suitable more for content-rich website. In addition, if you have something more along the lines of a Web app with a lot of UI elements, you should still think of a mobile version. The mobile-first strategy dominates in web development, so APIs become a key component of Web apps. Since Mobile Backend as a Service (MBaaS) solution on the Cloud platforms have been introduced, they are becoming another trend of this year. The author believes that they will be used for both Web apps and Mobile apps in the future. Yet another trend is single-page applications.

As for programming languages, dynamic languages like Ruby on Rails and Python become less relevant for Web development, and many apps initially built with these languages are now being re-engineered due to performance and scalability challenges. According to Shiju, the Go programming language will heavily replace dynamic languages, Java and Node.js soon.

Knowledge Base & Resources:

10 Quick Tips for Re-Designing Your Website as Per 2015 Trends

Don’t think you’ve completed your website once and it will perform efficiently for many years. The Internet is an ever-changing world; smart entrepreneurs monitor web design trends and tweak their websites to meet ever-growing users’ expectations. If you don’t want your website to become out-of-date and lose customers in favor of your competitors, check these 10 tips for re-design of your website and start implementing them. The author writes that content is the king like never before, so you should pay special attention to it. SEO is still not dead, so it is still worth making your website SEO-friendly. An attractive logo and catchy tagline will help your visitors remember your brand and improve brand awareness. Make the navigation on your website as easy as possible and don’t make your audience think. If you don’t want that your visitors to leave your website and go to your competitors because then had no time to wait for your page loading, be sure to optimize your page-load speed. Blog management is one of the most promising methods of your website promotion, so set up a blog (if you don’t have one) and don’t forget about RSS tools. The last, but probably one of the most important, tip is to measure the performance on a regular basis.

10 Must-Read UX Design Books

If you are a web designer and your designs sell the products of your end-customers well, this is your added value and your competitive advantage. Although UX is not rocket science and it’s just about common sense, there are lots of specific processes, tools and techniques that will help you create such designs. Adham Dannaway introduces his TOP 10 UX design books to help you improve your efficiency and increase your value in the eyes of your customers. Some of the books listed are intended for newbies and explain UX basics, and several books deal with UX life-cycle processes and methods. It’s interesting that Steve Krug, with his Don’t Make Me Think is still there.

50 CSS Tools & Resources from 2014

Speckyboy editors have published their 50 favorite CSS resources. The post is huge and contains the most useful CSS resources, tools, libraries, UI kits and frameworks that have been released this year. For more convenience, the resources are categorized into several sections. Enjoy the list and get the most out of it.

Trim your sails to the wind and read our blog in 2015. We’ll work hard to keep you in the loop. Happy New Year!

Christmas is coming! Download a Free Holiday Email Template! (PSD + HTML)

In the spirit of the holidays we’re giving our customers and blog readers a free holiday email template. It’s a responsive email template in a fully editable PSD format, with the full HTML markup included, hand-coded by our own Site Slinger team. It’s available for free download for your personal or commercial use. Edit away and have your mobile-optimized email template ready to go for your next email campaign.

Download a Free PSD + HTML Responsive Email Template!

In the spirit of the holidays we’re giving our customers and blog readers a free holiday email template. It’s a responsive email template in a fully editable PSD format, with the full HTML markup included, hand-coded by our own Site Slinger team. It’s available for free download for your personal or commercial use. Edit away and have your mobile-optimized email template ready to go for your next email campaign.

Great for advertising your holiday news or sales!

As the winter holidays are already upon us, you’re probably gearing up for those Christmas sales and other holiday events. Whether you are in marketing, event planning, or just need to send out a mobile-optimized email to your mailing list, we’ve got you covered with this free responsive email template. We’ve designed a great looking email ready for viewing on all major devices and email clients, including iOS, Outlook, and Gmail.

Mobile-optimized.

This email template was designed and hand-coded by experts to ensure a great mobile experience, along with full desktop viewing. Now days, more than half of emails are opened on mobile devices! It’s imperative your email reaches your audience when it’s convenient for them to view and act on it… without compromising the desktop aesthetics. We’ve put great effort into ensuring the email elements are mobile-optimized and appropriate for this holiday season.

We hope you’ll enjoy editing and using this free responsive email template, shared as a fully editable PSD and provided with hand-coded HTML – by our web development experts. If you need other PSD email designs converted to code, we can help! We’re experts at PSD to HTML, whether for emails or websites! Get your free holiday email template today!

Download

What’s Included:

Fully editable Photoshop file (PSD)
Hand-coded HTML template
High resolution image comp (JPG)

DOWNLOAD HERE

Preview

10 Proven Tips for You to Get Prepared for Holiday Email Campaigns!

At this time, when Christmas is coming, our main advice will be – do not try to just take from your customers (sell them something). Instead, give them as much as you can and your contacts will love you back. This approach pays off not only in Email marketing but also in life in general.

At this time, when holidays are coming, our main advice will be – do not try to just take from your customers (sell them something). Instead, give them as much as you can and your contacts will love you back. This approach pays off not only in Email marketing but also in life in general.

#1 Don’t Just Sell – Investigate and Communicate

Yes, your contacts database is still a source for additional sales to you. But why limit yourself to just selling? These people can become a valuable source of information, insights, and inspiration for your business growth. Beta test your new products or services on them. Ask what they find good about your customer service and what could be improved, etc., etc.

If you focus on selling to your current contacts database too much, you will miss a more promising opportunity. Use these contacts to better learn about your potential customers in general, their preferences and fears. This knowledge will help you get more new customers and get a bigger market share.

Stimulate your current contacts’ feedback by offering rewards in various forms. Take criticism even more gladly than the praise.

#2 Use Permission-Based Lists Only

Never ever purchase any contact databases for Email marketing. If you are just starting your business it may look like an attractive opportunity. But in reality unsolicited Emails will more likely damage your reputation and not bring any sales.

People usually share their addresses with those who can provide some value to them. So offer this value in the form of educational materials, tips, hints or any other valuable pieces of information. It is surely easy to say but harder to do. But it is worth doing.

#3 Use Email Marketing Automation Software

Even if your contact database is small there are still several reasons to apply specific Email marketing automation software like Mailchimp, Act-on, etc. right from the start.

With this software you’ll be able to reduce the guesswork to a minimum as these solutions provide very valuable statistics regarding your campaigns (such as Open Rates, Click Rates, Unsubscribe Rates, Bounce Rates, etc.).

Another advantage of such solutions is that they use special technologies and methods to ensure the highest delivery rate. If you do it by yourself using your personal/corporate Email address, you are at much more risk to be blacklisted for mass mails (even if you use permission-based lists).

Yet another advantage is that Email marketing software allows you to manage targeting and timing of your messages, schedule campaigns, and automatically send out Emails at the specified time.

#4 Test, Test, Test

Before sending your message to your end consumers, try it on your own test accounts including Gmail, Yahoo, Hotmail, and any account using Outlook client (especially if you have lots of corporate addresses in your list since many organizations still use Outlook as the default Email client). Check the layout of your Email message on your desktop, tablet, and cell phone.

You may also want to test some of your offers on a limited number of contacts from your database before sending them to the whole segment or a complete database.

If you want maximum efficiency, you can split one segment of your contact database into several sub-segments randomly and try several different messages to find the highest performing one (A/B testing).

#5 Use Responsive Email Template

Mobile Email usage statistics show that more than 50% of all Email opens occur on mobile devices nowadays. In some industries this ratio is up to 90%. So even if mobile traffic doesn’t take any significant share on your website according to your Google Analytics, you still need to make your Email responsive.

For this reason the ability of your Email message to be properly displayed on mobile devices is a must. If you already have a PSD file with your template, The Site Slinger will slice it to a responsive HTML template to save your time and efforts.

If your Emails contain links to some landing pages on your website, don’t forget to make those landing pages responsive, too.

#6 Get the Length Right

The length of your subject line and the Email itself is critical. The main rule is the more frequent your Emails are, the shorter they should be. Of course there are always some exceptions, especially if content is the feature of your business and consumption of that content is the feature of your customers. However, keep the volume of messages to the minimum possible.

The same is valid for Email subject lines. General recommendation and best practice here is to keep your subject line length under 50 characters. Such Emails always have higher Open Rates and CTR. Besides, longer subject lines are cut off on the majority of mobile devices, which additionally decreases efficiency.

#7 Keep Your Messages Easy to Scan and Perceive

People get lazier about reading and tend to pay more attention to rich media containing images, audio and video. Statistics show that rich-media messages generate much higher response rates. But it doesn’t mean you don’t need a text version anymore. Bear in mind Tip #4 Test, Test, Test, and experiment on your audience segments.

Use paragraphs, bulleted item lists, font bolding, columns. This will make the life of your readers easier and let them quickly scan your message for key points without going too deep into detail.

#8 Keep Track of Your Competitors and Industry Best Practices

Your competitors may become a wonderful source for inspiration and insights. You need to monitor them to keep track on what they do and how they do it. Do not afraid of borrowing and adopting their best features and know-hows. Your competitors’ achievements and best practices may build a good ground for your own strategy.

Keeping an eye on your competitors often helps to learn from their mistakes and avoid these mistakes in your own campaigns.

Keep track of latest design and Email marketing industry trends. Use free modern templates if you feel they perfectly cover your current needs. But craft your own personal designs as well.

#9 Keep Your Active Email Lists Clean

Pay attention to your bouncebacks and clean your lists accordingly. Distinguish between so called soft bouncebacks and hard ones. Soft bouncebacks mean that the Email address is generally valid but unable to receive your message because of temporary problems on the recipient’s side. Hard bouncebacks usually mean that the addresses have typos or the mailbox no longer exists.

Do not hesitate to delete hard bouncebacks from your active lists permanently, but keep them in inactive lists just for statistics and for the history. Otherwise you have the risk to be blocked by your ISP.

General recommendation for soft bouncebacks would be to categorize them in a separate list and make several attempts to deliver the message to them as part of your next campaign. If it doesn’t help, you should also move them to your inactive list.

Such categorization may help you understand your customers’ turnover and your minimum need for new contacts in order to maintain your database.

#10 Find Your Own Way to Success

Do not take industry surveys, best practices, and all those industry-related statistics too seriously. Of course you should take them into account, but in the end they all are just reference points, some kind of milestones and not verdicts.

Avoid copycatting your competitors’ strategy blindly even if they are well ahead of you. If you want to outperform them, you need to stand out from the crowd and invent your own unique features and style.

Do not afraid of experimenting and A/B testing, as they are the only means to find out what will work best for your business.

And don’t forget to wish your contacts Happy Holidays!

50% Christmas Discount on PSD to Email Conversion Services

This Christmas we’ve prepared something really special for you. Starting from December 04 until December 25, 2014, you can order our high-level PSD to Email and PSD to responsive HTML email conversion services with a 50% discount!

Christmas Is Coming – The Site Slinger Has Got Presents for You!

Dear friends,

Do not loose this one shot! This amazing Christmas offer is available for a limited time only.

High-end packages are now available starting at $149 (usual price is $299) and they are as follows:
– Easy to update flexible table structure;
– Deeply commented HTML code;
– Inline and embedded CSS versions;
– Easy to customize template;
– Tested and working with all major mail clients & devices;
– Retina 3x Support!

The offer expires on the 25th of December, so hurry up and grab your 50% discount! Request a free quote to get started – no credit card is required!

Click Here to order your outstanding PSD to Email Template.

Enjoy the Holiday Season with The Site Slinger!