BlogmyQuery – BMQ

The week is coming to an end and that means it is time for us to look back on the week that passed, the best design news, resources and other goodies. This week we look at Responsive Web Design, Twitter Bootstrap, what comes first the idea or the design, as well as taking a trip down memory lane with the history of Apple.com

Creative Techniques for Single-Page Websites

Over the past few years there has been an emergence of new custom trends in website design. A very popular idea is placing all your major content onto a single page and using dynamic scrolling animations to locate bits of content. These single-page layouts are popular among landing pages and mobile apps which only need to display a small section of related information. In this article I would like to go over some interesting techniques you’ll find in single page websites.

Quick Prototyping: Collection of Free HTML/CSS/JS UI Kits

The main idea of HTML/CSS/JS UI kits is to offer you a range of production-ready web elements with a consistent style, so that you quickly kick-start any new web project. Typically standard UI packs will include buttons of different sizes and types, form field elements, navigation & pagination systems, tabs, alerts and tags

21 Fresh Examples of Responsive Web Design

Responsive design is something a lot of designers talk about. And considering the importance of responsiveness and all the buzz around it, it’s impressive the amount of websites that are still not responsive. By now, with the amazing growth of mobile usage, every single website should be responsive to be able to attend to every user’s “screen size needs.�

Getting Started with Twitter Bootstrap

Building a website from the ground up is very hard. Even some people who are able to code in web languages like JavaScript, HTML and CSS would find difficulties in the process. Fortunately, a few Twitter developers and designers are aware of this situation and had launched a framework called Bootstrap to make life easier for web designers and developers.

Which Comes First: Web Site Design Or Content?

When you work on putting together your web site is it best to start with content or design? It’s a bit of a chicken or the egg conundrum. You really should not work on one entirely before the second. Here are two scenarios we’ve worked around and let me say, they are not ideal. 1. Working the design around a finished content document There have a been a couple of cases where a client hands me a finished Word doc to start a web site with and announces grandly: “I’ve got the content nearly finished for you.� On the one hand, it’s great that they’ve been thinking about the content of their web site.

7 Newly Released Frameworks for Developers

A framework is basically software application which assists developers to quickly design and develop dynamic websites. With the advent of HTML5 and CSS3, development becomes easy for everyone. Here at SkyTechGeek we conducted a search and collected 7 newly released frameworks which will assist our audience to design and develop beautiful cross browser dynamic websites, and applications.

Flat design vs. skeuomorphism

It seems that there has been a line drawn in the sand. A few brave design pioneers have all but denounced skeuomorphic design as yesterday’s news and have voted it off of the proverbial island. Are we witnessing the turning point of design as we know it, or are these champions simply jumping an imaginary bandwagon? Let’s take a closer look at the two biggest styles in 2013…

15 Years Of Apple Website History

After Tim Cook addressed The Wall Street Journal’s bad reporting on Apple’s cut on component orders for the iPhone 5, the quarterly numbers for 2013 were announced. As everyone expected, they were mind bogglingly good. As we have reported here on Bit Rebels before, Apple is in no way struggling to make profit off of their own ingenuity. But how is it that they continue their success year after year? Maybe the answer can be found in Apple’s website history.

20 Excellent jQuery Sliders for your Website

Making a website that is aesthetically pleasing is a process. It’s not generally going to happen overnight and it certainly won’t happen without a little intuition. It also requires the usage of a lot of different technologies to make the website look its very best.

30+ Creative and Inspiring Web Design Portfolio Websites

Many talented web designers like to show off their skills online and web design portfolio websites have become very popular. This is also a strong trend other creative niches and many graphic designers and photographers have creative portfolios as well.

The post Weekly News Roundup – 25 January 2013 appeared first on Design Reviver.

For designers color is perhaps one of the most important aspects of web design, some might find it a bit intimidating, some might simply go over the top with color while others just use a horrible mishmash of color that makes no sense. Check out this article for five of the most common mistakes web designers make when it comes to color choice.

Using Colors that don’t Enhance the Overall Message

When choosing a color scheme for a design, there are several questions that should be asked: What does this brand represent? What is the over all theme of this site? What is the target audience? Answers to these questions can help a designer choose colors that not only look good, but enhance the brand and make it easier for visitors to identify with the overall message.

Using Colors that are “Trendy”

I am a strong believer in looking at other designs for inspiration, but this shouldn’t be a primary method for choosing colors. If you frequent enough design galleries, you will definitely notice color trends. At the beginning of this decade, you may remember that it was difficult to find a site that wasn’t using blue and white. Then shortly after, we experienced the “web 2.0″ color palette. Be original with your color selection. Instead of extending the life of a trend, try to set the next one.

Forgetting that People Actually Need to Read the Text

Sometimes web designers can get so caught up in trying to make a site look cool, that they forget content is king. When designing for text, keep in mind that contrast is key. You don’t always have to use black text on white, but keep the contrast high and avoid using colored text on a colored background. Remember if visitors can’t even read your text then how are they supposed to understand your message.

Having a Crutch Color

Yes, choosing a good color scheme is tough, but when you hit that designer’s block, fight the urge to pull out “ole faithful”, that color that you used on your last three designs. Sure, it looks great, but chances are it doesn’t work for every product, service, or company. So, in order to avoid temptation, it may be a good idea to remove this color from your design repertoire all together.

The post 6 Color Mistakes Made By Web Designers appeared first on Design Reviver.

When it comes to online marketing one of the most used forms is Email marketing. The purpose behind email marketing is often to get a message across, whether this be to promote an offer, serve targeted advertisements or initiate deals. Email marketing is a great way to improve your brand image as well as knowledge of your services.

Often many designers make simple mistakes when creating an email, provided here are 10 tips to create better email designs.

Plain Text Version

This is without a doubt one of the most important things to remember when designing an email, always create a TEXT version of the email. Not all email clients handle HTML too well, some may not render email messages crafted in HTML. Furthermore including a plain text version makes your email more readable on mobile devices.

Keep everything within 500-700px wide

The width of the email should be 500-700px and centered. This is just as important as the tip above, if not even more important. There is nothing worse than receiving an email where you need to scroll from side to side in order to read the whole message. Why? Simply we are creatures of habit, we don’t take the time to read every word in a text we scan it. Since our eyes tend to focus on whats straight ahead of us, the stuff on the sides will get blacked out and ignored by our brains.

Allow Easy Unsubscribing

There is no if/but/maybe about this, it is absolutely essential that your readers can unsubscribe from your email, don’t try to be smart about this by hiding the unsubscribe mail in some obscure place within the email. Unsubscribing should be a painless process that virtually anyone viewing the email should be able to figure out. Remember if the recipient doesn’t want your email they are not going to read it anyways. You might be sending 1,000 emails, but if only 50 are being read then your system is not very effective.

Plan for no images

While you might have just downloaded the perfect image from Shutterstock, please remember that many email clients block images in messages unless the user decides to see them, pretty much that means that often your beautiful images will never get seen. Another problem is if your message is embedded in an image, then the same rule applies most readers will never see your message because your images are blocked.

Test it on-the-go

Just like you would test a website before launching it you should really test an email before sending it out to your final audience, remember that not only should you test these on the most popular clients such as Yahoo, Gmail, Outlook and others but also test to see how it looks on a smartphone or mobile device, If you don’t own a device then grab a friend who has one ask them if you can test your mail on their device!

View in Browser

There should be no reason why you would not allow people to view your email as a Web page. Face it, there are just some people who prefer to look at things in a browser, furthermore not all email clients render HTML as you expected and therefore making it possible for your readers to view your mail in a browser makes everyone happy.

Relevant Subject line

I cannot even begin to state the importance of this, if your subject line screams “I am spam from spam company don’t bother reading” well then guess what your reader isn’t going to read it, furthermore if your subject line is “READ ME I AM FULL OF BS” all in capital letters then they will also move on, or how about the “Make $1,000 in a jiffy!!!!!!!!!!” if nothing else then all the exclamation marks will deter anyone from reading this email, and besides spam filters will most likely mean your readers will never even see these emails.

Call To Action

So you have the best/newest/fastest something and you want to add a CTA, or Call To Action in your email, then make sure it is clear exactly what this action is, if you want your reader to do something then don’t just add a ‘click here’ button instead add something like “click here to…” tell them what will happen when they click here.

Don’t use video

Yes over the past few years there seems to be a video for everything, with sites such as YouTube getting more and more popular there should be no reason why you would include an actual video in your email. If your reader is using a slow internet connection then it will take them forever to load your email. Furthermore more and more email clients are filtering out emails with large file sizes, in other words if you add a video you run the risk of ending up in the Spam folder.

Make it clear who’s sending the message

Lets face it, if you don’t know the sender of an email you are more likely to just hit the delete button. Just like in real life people are suspicious of strangers and the same goes for email. In other words make sure your sender ID states exactly who you are, furthermore make sure your logo is visible at the top of your email.

The post 10 Tips to Remember When Designing For Email appeared first on Design Reviver.

The week is coming to an end and that means it is time for us to look back on the week that passed, the best design news, resources and other goodies. This week we look at how you can implement Responsive Web Design, four things media companies must do in 2013, different design elements to optimize your blog, as well as how you can make sure your animations are triggering at the right time.

The Next Step in the Evolution of Responsive Web Design: Responsivity Analysis

Beyond any question, responsive web design has become the standard for anybody who wants to make a strong presence on the internet. With the passage of time, rules, best practices, layout standards and guidelines have been commonly created, implemented and accepted by most web designers and developers.

50 JavaScript Libraries for Charts and Graphs

How are you visualizing data in JavaScript? What is your favorite library for creating charts and graphs with JavaScript?

I have been a long time fan of jqPlot for its open source approach, simplicity, examples, and great features. It performs well, it is used by many corporations, and it is built on top of jQuery

4 Things Media Companies Must Do … or Die

Adaptive design. It’s one of the big buzzwords in digital media right now, but what does it mean? Nick Davison, director of web development for ad firm Digitaria, has come up with the quickest explanation we’ve ever seen, not only for adaptive design, but for static, liquid and responsive designs as well. Best of all, it’s almost completely visual.

Use These 5 Design Elements to Create the Optimum Blog User Experience

One of the main unacknowledged problems with today’s websites is that many just follow the favorite design of the month. When Flash was born, we got bombarded by Flash-based sites that took forever to load. When sliding banners came along, almost everybody wanted to have one too.

21 Fresh Examples of Websites Using HTML5

After all the buzz involving the HTML5 CSS3 duo, it is nice to check how websites are using all the good practices you can get from HTML5. When the buzz around the subject started, we could see a lot of websites totally animated. Now, after all the benefits of HTML5 settled, we can see websites taking advantage of it to create smooth transitions, nice image sliders and subtle animations. It is interesting to see the evolution of practices in this matter and that is why today we gathered some examples of websites using HTML5. Enjoy!

25 Neat CSS3/Javascript Plugins and Coding Techniques That Will Boost Your Productivity

Using CSS3 and Javascript, you not only are able to do some awesome stuff but also to do it more efficient and faster. If you don’t know how to work with cascading style sheets or with JavaScript, then the best way to learning it is by looking at some examples, tutorials and coding techniques.

12 Extremely Useful And Powerful Free CSS Tools

Don’t Forget to participate in a contest where you can win the world’s biggest UI elements pack “Impressionist User Interface Elements Pack” for 3 winners (1 developer license and 2 personal license) to design your project more creatively.

11 Useful CSS Code Snippets for Responsive Web Design

Mobile responsive web designs have become extremely popular in the last 2 years, and with a very good reason. As such it’s common to see more code snippets published on the blogosphere, Github repositories, Codepen docs and more.

Getting animations to trigger at the right time

When we redeveloped our new website, we decided to use CSS3 animations to provide an impressive and interactive site experience. However, we struggled to time the animations to trigger at the right time.

50 Useful Tutorials To Learn PSD To HTML Conversion

Once again we have gathered a very useful and helpful collection of detailed tutorial for PSD to HTML conversion. Today, every designers, web developers or blogger should know how to convert PSD files to HTML code. This technique is very important for them because with this technique they can easily convert their designs into active blogs or websites. And also this technique makes their work easy and save their valuable time too.

The post Weekly News Roundup – 18 January 2013 appeared first on Design Reviver.

Facebook has just announced Graph Search, which is a new an innovative way for users to find information within Facebook. According to Facebook they currently host more than 240 billion photos with more than a trillion connections.

According to Facebook:

Graph Search will appear as a bigger search bar at the top of each page. When you search for something, that search not only determines the set of results you get, but also serves as a title for the page. You can edit the title – and in doing so create your own custom view of the content you and your friends have shared on Facebook.

Graph Search, will first be launched as a limited preview for U.S. audiences only, and it will allow users to discover connections between other members of the site and quickly identify which friends have been to certain places, “liked” specific topics or appeared in certain photos.

For those worried about privacy, Facebook says that if you want something to remain private and have marked it as such then no one will find it using the new search. “It makes finding new things much easier, but you can only see what you could already view elsewhere on Facebook,� says the company.

The post Facebook unveils Graph Search appeared first on Design Reviver.