.. Your Daily Design Dosis

Tweet-Parade (no.11 March 2012)

| Comments Off

It’s weekend! .. Time for a brand new Tweet-Parade! A Tweet-Parade is a post filled with the best articles and tutorials of last week’s blogosphere. It’s all about webdesign, graphic design, SEO, tutorials, social media and more. A broad scale of topics, but never-the-less the underlying focus is on Design.

 

Also I see this as my personal bookmarks of great articles from the Community of the last period. The different articles and post are categorized by their main topics. The best way to keep track of these tweets is simply to follow me on Twitter.

 

Webdesign Coding: CSS, HTML, Javascript, PhP, APIs, etc.

Thinking Async - when you load JavaScript from a third party you should do it asynchronously. You might want to load your own scripts asynchronously too, but for this article let’s focus on third parties.

Website Speed Part 4 : PHP Programming for Speed - Programming for speed is not what most coders think of. What they tend to consider first, and usually only, is getting it working. Sometimes people will talk of refactoring to reduce the amount of code, but again this is usually only ..

Use Pseudo Elements to Create an Image Stack Illusion - Today we’re going to see if we can take a single image inserted via HTML and make it look like a messy stack of images using only CSS. The key: pseudo elements.

8 Useful Tips to Add a HTML5 Canvas Animation in Websites - 8 ways to make HTML5 animation for your website. After you check up these approaches, you can create HTML5 animation with <canvas> tag or some practical HTML5 animation tools with ease.

Using Backgrounds in CSS3 - With CSS3, developers and designers can utilize an enhanced range of options for Web page backgrounds. New options include the ability to use multiple background images, to specify size properties for background images, and to define background  ..

Understanding em Units in CSS - Due to developers’ habitual reliance on pixel values, I think some of us may not have a full understanding of what the em unit is, and how it works in CSS. So I hope this will serve as a nice summary of what em units are all about.

Make Animation Effect Easily With 5 CSS And Javascript Plugins- In this post, we talk about CSS and Javascript animation effect framework and plugins. Nowadays, with the introduction of CSS3, it’s possible to make animation without using Javascript.

Sass and Media Queries: What You Can and Can’t Do - So what about leveraging Sass for responsive design, or more specifically, for media queries? Are there any features of Sass that pair particularly well with media queries? Is there anything you should avoid?

It’s time to start using JavaScript strict mode - Strict mode makes a lot of changes to how JavaScript runs, and I group these into two categories: obvious and subtle. The subtle changes aim to fix subtle problems, and I’m not going to delve into those here

10 Awesome JavaScript Plugins to Make Your Site Look Great - Despite the incredible advances in CSS3 and HTML5 we’ve been seeing in recent times, sometimes a grab bag of JavaScript plugins that can do the trick is useful to have on hand.

Javascript debugging for beginners - Outlining some of the features of modern developer tools that you can use today to help make debugging your JavaScript less painful. We’ll focus primarily on the Chrome developer tools and Firebug but many of these features are available in other tools such as Opera Dragonfly.

About HTML semantics and front-end architecture - A collection of thoughts, experiences, ideas that I like, and ideas that I have been experimenting with over the last year. It covers HTML semantics, components and approaches to front-end architecture, class naming patterns, and HTTP compression.

 

Usability, User Experience, Responsive Webdesign, Mobile, etc.

Create a Responsive Web Design with Media Queries - If you’ve yet to get your hands dirty with media queries, now is your chance to create your first responsive website design. In this tutorial we’ll look at converting a simple WordPress theme designs into a responsive layout ..

Web Design How-To: Get Started with Responsive Web Design - Responsive web design refers to making content that adjusts to the screen size on which it is displayed, making it the right choice for phones and tablets in addition to desktop computers.

Mobile First Design: Why It’s Great and Why It Sucks - There’s a growing trend in the industry though to flip this workflow on its head and actually begin with mobile considerations and then work up to a larger desktop version. Why would you ever approach a project this way? What are some of the pros and cons of this strategy?

For a Future-Friendly Web - It is time to move toward a future-friendly web. Our current device landscape is a plethora of desktops, laptops, netbooks, tablets, feature phones, smartphones, and more, but this is just the beginning. The rapid pace of technological change is accelerating, and our  ..

A 7 Step Guide to Website Usability - But what makes a site the cynosure of all eyes and at the same time a usable one? In this article I will be proposing a number of guidelines which I believe do just that.

9 Useful Free PDF Ebooks About Responsive Web Design - Responsive web design will continue to be the trendy topic in the following years. In today’s post we’ve gathered free ebooks in PDF format which are all about responsive web design.

A Simple Device Diagram for Responsive Design Planning - There are an ever-increasing number of devices with different screen resolutions to take into account with a responsive design, so we put together a simple but handy diagram that lists the most common device widths as of the present, along with overlays for potential device width ranges.

Multi-Device Layout Patterns- Through fluid grids and media query adjustments, responsive design enables Web page layouts to adapt to a variety of screen sizes. As more designers embrace this technique, we’re not only seeing a lot of innovation but the emergence of clear patterns as well.

Designing Search: Entering the Query - the design of the search box should follow its function. Its purpose is to allow the user to enter queries in the form of keywords, so it should look like it will accept textual input, and have an associated button that clearly indicates its function.

 

Webdesign in Common, Web Typography, jQuery, Tools, etc.

Hot new iPhone apps by irresponsible developers -  How many hot-hot-hot! new iOS apps have impressed legions of fans while demonstrating their developers are too irresponsible or incompetent to make them accessible under VoiceOver? Shall we start a list?

What’s new for designers, March 2012 - This edition of what’s new for web designers and developers includes new web apps, frameworks, jQuery plugins, icons, productivity tools, responsive design resources, and some really great new fonts.

Pixel Perfect Open Tracking and Alignment - When you open up your tracking, the text will always push out to the left as letter-spacing is applied from the right. As a result, if you’re centering or aligning your type to the right, it will be a few pixels further to the left than it should be.

Captivate your Audience with Typography - In this guide I’ll share a few tips for captivating your visitors with brilliant online typography. It only takes a bit of time and patience to understand these techniques and apply them into your own layouts.

What Role Web Design Can Play to Reflect the Image of Your Business? - It is very important to be focused in the development of a web design, because it demonstrates the success, popularity, and reliability of your business. What does a web design express about a company?

Tips for Creating Effective Email and Landing Page Content - Email marketing and landing pages are two of the most popular marketing tactics that demand original, customized content. So I’ve compiled a list of tips that will help your content efforts in these areas to get notice.

Improve Your Website with this Do-It-Yourself Website Audit Checklist - Doing a website audit can make sure your site is optimized to provide visitors with the best experience possible.  But this checklist is just a starting point.

Roundup of HTML-Based Slide Deck Toolkits - Create your own non-Flash, full screen, responsive presentations. Usually these presentations are HTML5-based, use JavaScript and/or jQuery, and often require a modern browser. But some of them are simpler and offer deeper browser support.

Designing Landing Pages That Work - Having knowledge on how to create an effective landing page can increase the number of site visitors that take the desired action of the web page. Lets discuss factors and considerations that can lead to a better landing page design.

10 Useful Tutorials And Plugins for creating Parallax and scrolling effects - While this effect seems impressive there are also some factors that one might need to consider before incorporating it into your web design. One of these factors is to consider preloading your graphics

15 Simple & Effective jQuery Plugins that Enhance Your Forms - We all know the importance of having a nice form for our website, but it will make you stand out from crowd when you have a stylish and effective form, we found a few simple and effective plugins which might help you in your design.

 

Graphic Design, Brand Identity, Typography, Print Design, etc.

Illustration Tips: Colour & Composition- There’s a certain something that marks out an amazing artwork from one that’s merely good: an extra little touch of talent or something special about the concept that raises it above the rest.

Why Businesses Can’t Afford to Ignore Print Media - Despite the proliferation of internet-based marketing methods, print media still plays a large role in reaching potential customers. To be the most successful, then, companies must include traditional print media as part of a  ..

Photoshop Mastery: 25 MORE Techniques Every Designer Must Know- There are always new tools and new techniques being shared. In that spirit of sharing, we decided to put together another 25 tips and techniques that every Photoshop designer must know.

Respect Thy Typography - Good typography shouldn’t have to rely on ornamental crutches to stand tall. Yet despite all the tools and knowledge available to us, we readily embrace a flourishing, decorative typography, with cheap tricks used in a misguided attempt to make it “pop”.

50 Time Saving Photoshop Actions to Boost Your Images - With Photoshop Actions, a set of otherwise repetitive tasks can be applied automatically. 50 time saving actions you can use to give your photos the boost they need without taking all day.

An explanation of Photoshop Blending Modes - Although there are 29 blending modes available we will be focusing on 8 of these modes. Having a knowledge of the varying blending modes will enable you to create better images and allow you to add more effects.

Logo Design And Branding Identity – 9 Vital Value Addition Tips - So here In this article, I will be giving you a few tips that will be a great value addition to shape up your current or new logo to make an iconic brand identity. A good logo, will enhance your reliability, credibility and excellence.

The elements of a good brochure design - In this post you’ll find a few things you should keep in mind to design better brochures.

 

Blogging, Social Media, Writing, Content Strategy, etc.

Want Your Blog Noticed? (Hint: It’s Not Just Content!) - Do you want to grow the awareness of your blog to expand its reach and influence? While many bloggers won’t admit it publicly, most want other people to read their posts, to share them broadly, and to recognize ..

Should I Add DoFollow Attribute to Comments in My Blog? - You should add the DoFollow links in comments when: You are going to approve only and only websites which you are sure that will provide content related to yours.

The Marketer’s Guide to the New Facebook Pages - If you took advantage of the features of the timeline design for personal profiles, then the pages will feel similar. This guide will help you find what you’re going to like and hate about Facebook’s latest updates to pages, including how your brand or business can adapt.

17 Foolish Mistakes to Avoid as a Guest Blogger - Guest blogging can provide a variety of awesome benefits: it can do wonders for your search engine optimization, be a great way to get exposed to a brand new audience, help you improve your thought leadership, and better establish you as an expert in your industry.

Protecting your website from hackers, why should you care? - We already mentioned ways to secure your WordPress website in the past, but what if your website or blog gets hacked nonetheless? All the hard work, your reputation and your customers’ trust can be gone within minutes.

 

WordPress

The Only WordPress Plugins You’ll Need – Year 2012 Edition #01 - Bored of your default comment system? Want to change those dull fonts to something richer? Is spam your concern? This article has something for everyone. Read through and find the plugin that suits your needs best.

10 WordPress Plugins for a Faster, More Search Friendly Blog - Fortunately, if you use WordPress, then most of the work is done for you. You just simply have to download one of these plugins, tick off some boxes and you’re off to a faster site with more shares.

10+ useful SQL queries to clean up your WordPress database - After years of usage, your WordPress database can contain weird characters, be filled with data you don’t need anymore, and so on. In this article, I’m going to show you 10+ SQL queries to clean up your WordPress database.

21 WordPress Cheat Sheets – All Fresh and Useful! -  what makes today’s post really special is the fact that it contains only WordPress cheat sheets and nothing but them (because often on other design blogs authors present all kinds of related WordPress info in the cheat sheet posts).

Coding Unique Ad Display Blocks in WordPress - In this tutorial I’d like to share a couple tricks for building customized WordPress ad blocks within your template. Development can be tricky if you are new to PHP. But it’s not awful to pickup and start running right away on your own layout.

Create Personal WordPress Login Page To Strengthen Your WordPress - I would like to share really simple steps help you improving your WordPress Login page security by changing wp-login.php to your personal login page. No advanced knowledge is needed.

Share Your Posts on Facebook With a Preview Image and a Description - In this tutorial we will write a plugin to set an image and a short summary that will be shown on Facebook every time a post is shared. We will use two WordPress core features: a Featured Image and the Post Excerpt for the description.

9 Tutorials to Get Started with Custom Post Types in WordPress - In custom Post types, we can create our own content publishing type. Lets get some more idea and hands on custom post type with the help of some awesome tutorials.

Developing WordPress Themes Using Responsive Frameworks - Responsive design is continuing to grow in popularity and knowing how to utilize it within your future theme construction will be crucial for success. Whether you are adding a framework to your ..

 

Search Engine Optimalization, Conversions, Analytics, Loadtime, etc.

Extreme Homepage Makeover: How to Increase Your Conversion Rate 106% - Specifically, it’s vital to make sure your homepage contains as few leaks as possible. Because a homepage typically gets more views than any other given page, it needs to educate, engage, and ..

Natural Link Building 101 - Link building is one of the most important things you can do in terms of off-site search engine optimization. As you probably know by now, search engines like Google tend to rank pages higher in search results based on the number and quality of links to those pages.

What to Do When Conversion Optimization Goes Bad - Not only will you be able to recover more quickly, but you’ll also be able to create a testing and optimization plan that helps you pinpoint where your target audience is slipping through the cracks – and get them back.

SeoMoz Top Tips on Crafting a Blog Post - The goal of the headline is to stop readers cold and draw them into your post. You can’t do that if you use cute, clever or confusing headlines. Just because you’ve published a post doesn’t mean you should forget about it. Each post is a valuable asset in which ..

How to Move Domains Without Losing SEO Value - Whatever your reasons for moving your domain, it’s important to undertake this process carefully in order to avoid losing all of the authority you’ve built up to your initial website.

How to Improve Conversions by Increasing Page Speed [Tips & Tools] - It only takes a few seconds for your site to make an impression on a visitor. If it hasn’t loaded in that time, then they might be gone, baby, gone. The question is, how do you fix a slow site?

3 Reasons You Should be Using Broad Match Keywords - It’s a common misconception that using broad match keywords in PPC campaigns will always result in out of control spend and loads of unqualified traffic; when used correctly, however, broad match ..

Too Much SEO? Google’s Working On An “Over-Optimization” Penalty For That - Google’s Matt Cutts announced that Google is working on a search ranking penalty for sites that are “over-optimized” or “overly SEO’ed.”

Going for Circles and Improving Search Rankings - What seemed to be a shameless act of promoting Google+ has now became one very generous way for many to gather more exposure in the Google search results.

 

Tutorials

CSS3 signup form - If you’re about to launch a new web product or you just need to improve the user experience for an existing web form, then this tutorial is for you. In this article you’ll find out how to design a clean and attractive CSS3 signup form.

Learn HTML5: HTML5 Tutorials and Guides - In this post we have gathered a number of resources that teach various aspects of HTML5, including tutorials, explanations and guides. With the help of these resources you should be able to learn more about the specific aspects of HTML5.

15 Best CSS Tutorials to Enhance Web Design Skills - CSS or Cascading Style Sheet acts like backbone of a web design; it is responsible for the entire layout and content styling of a website. CSS provides some sets of rules through which designers try to create beautiful websites and ..

How to Create Login Form with CSS3 and jQuery - In this tutorial we will code the Login Form that you can find in Futurico UI Pro made by Vladimir Kudinov. To create it we will use CSS3 and jQuery.

Code a Responsive Navigation Menu - Navigation menus used to be a fairly simple thing. Code up an unordered list, float it left and you’re good to go. With responsive design being all the rage these days though you’re faced with some new challenges when creating a menu design.

20 Useful Tutorials for Web Developers- Being a web developer is not an easy job because you must always stay up to date with everything related to this domain, but it’s impossible to know everything.

Parallax Content Slider with CSS3 and jQuery - Today we want to share a simple parallax content slider with you. Using CSS animations, we’ll control the animation of each single element in the slider and create a parallax effect by animating the background of the slider itself.

Responsive Web Design Tutorials - RWD is not just an adjustable screen resolution and automatically resizable images, it is a whole new way in thinking of the web design and a great collection of techniques and ideas. In this post you can find various responsive design tutorials ..

40+ Excellent CSS3 Menu Tutorials - The tutorials presented below in this collection are more experimental. Through these CSS3 navigation tutorials, you will learn how to create user friendly navigation menu both vertically and horizontally.

Making a Page Flip Magazine with turn.js - In this tutorial we are going to use PHP and the turn.js plugin, an implementation of the page flip effect with pure CSS3 and jQuery, to build a pretty magazine. We will fetch the most popular images from Instagram every hour ..

 

Freelance, Business and Workflow Related Stuff

21 tips for starting your own design studio - For those creatives who are less experienced in the business side of things, it can be a huge challenge. That’s why we’ve contacted a pro selection of designers who have made it – and are responsible for starting some of the most successful studios around ..

A Freelancer’s Nightmare: The Terrible Client - if you’re a freelancer, you probably don’t have the luxury of dropping a nightmare client, so how do you deal with them while keeping your sanity intact? I have a few pointers that might interest you.

How to Know and Beware of Some Bad Clients?- We have categorized the “bad clients” into five different categories and have also elucidated upon ways to combat the same. We are hopeful you would learn from this piece of information and in the future will be wary of such clients.

Building user trust - Keeping a user’s trust is no less important than earning it. Once users have decided to give you a chance, treat them with respect and communicate with them in meaningful ways.

100 Must Read Freelance Intelligence Tips & Tricks - Bad news people – you need to read all these 10 articles in order to become a better freelancer! That’s it, don’t make plans for the weekend!

How to Define Your Target Market in Design Projects - Having a target market gives even small businesses the opportunity to effectively compete with larger companies. Targeting everyone is a waste of money, resources and time.

How to Extract the Facts with a Web Design Client Questionnaire - I recommend using this questionnaire before you write a Web design proposal. You should reserve your proposal-writing time for the best-qualified prospects, rather than everyone who asks for one.

 

F*cking Brilliant, a great Read or just magnificent Tips!

Apps vs The Web - I believe the shift toward apps is about user experience. This experience is defined by a few philosophical differences. An app is a specialized tool, like a wrist watch. Apps thrive on mobile because people on the go have short bursts of time to accomplish tasks.

What is Spec Work and Why You Should Say No - Spec work is something new designers go for very fast, because they hope to “catch a big fish” and get some experience and build a portfolio at the same time. Well, I would not encourage you to do it, not even in the beginning.

How to become a powerful visual storyteller - Brand stories are no longer limited to blobs of text on “About Us” pages. Social media has given brands a platform to relay their story in multiple ways and to various audiences.  In essence, how to not just tell a story, but how to tell a good story.

Design Changes and Power - Software these days tends to auto-update itself, so the changes often come as a surprise. One moment you’re using the old interface, and then when you sign in later in the day you may find that something has been changed.

Why Creating Minimalist Design Makes You a Better Designer - Minimalist designs have been with us for quite some time now, emerging from nowhere a couple of years ago. It is easy to spot all over the place as everybody longs for such a design and everybody looks to have it.

Symptoms Of An Epidemic: Web Design Trends - So, exactly what is this new epidemic? Well, let’s start by looking at some of the most common symptoms, many of which you have probably noticed. They are easy to spot, and as with many other conditions, they often appear in conjunction with each other.

 

 

I hope you have enjoyed these hand-picked great articles? Please let me know by sharing your opinion in the comments-section. Did we miss a great article, please let us know  .. To keep up to date with all the cool links, simply follow me @gonzodesign

 

Author: Gonzo the Great

Jan Rajtoral AKA Gonzo the Great is the Founder of and Designer at gonzodesign, providing design services across the full spectrum of Brand Identity, Graphic Design, Print and Advertising Design & Website Design. I also speak about webdesign and branding in the Netherlands.

Sorry, comments for this entry are closed at this time.

top