.. Your Daily Design Dosis

Tweet Parade (no.16 Apr 2014)

| Comments Off on Tweet Parade (no.16 Apr 2014)

.. stay up to date! Time for a new roundup with last week’s best tutorials and design articles! It’s all about HTML, CSS, PHP, responsive web design, branding, SEO, WordPress 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. These hand-picked articles and tutorials 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.

Creating a Simple Style Switcher – how to allow your users to customize parts of the page. You have also learned how to remember your users’ preferences in order to enhance their overall experience of your site.

Skewed Hit Boxes with CSS Transforms – One of the neatest things about CSS Transforms is that they change the hit area of an element to whatever transformed value we set. So, if we rotate an element, the hit area for that element doesn’t stay a box in the defined X and Y plane

Get on the CSS Grid! – Lots of designers use imaginary grids to lay out content, whether it’s for a site or app. The CSS group has been working hard to make layouts easier, and as part of that have produced the CSS Grid Layout Module which is now emerging in browsers.

Understanding CSS Timing Functions – People of the world, strap yourself in and hold on tight, for you are about to experience truly hair-raising excitement as you get to grips with the intricacies of the hugely interesting CSS timing function!

Using Inline-Block In Web Development – inline-block is a very, very useful tool to have in your web development arsenal: if you understand the purposes and limitations of inline and block, you can deploy the hybrid value where it is needed in your designs.

Learning to focus() – For accessibility, managing focus is essential in many of even the simplest JavaScript-driven interactive widgets, but correct usage is almost impossible to test for with automated QA tools.

12 Little-Known CSS Facts – In my research, I come across new little tidbits all the time, so I thought I’d share some of them in this post. Admittedly, not everything in this post will have a ton of immediate practical value, but maybe you can mentally file some of these away for later use.

Animating SVG with svg.js – You want to create tasteful animations that surprise and delight! In this post we’ll walk through writing SVG animations with JavaScript using a library called svg.js. I believe this is the most mature SVG manipulation library to date.

Animating SVG with CSS – There are libraries that help with it like Snap.svg or SVG.js. We’re going to look at another way: using inline SVG (SVG code right inside HTML) and animating the parts right through CSS.

Clean Up Your Shapes – As web developers and designers, we love our CSS shapes, shadows, and other effects. Browser issues and inconsistencies aside, sometimes using these awesome shapes isn’t so straight forward.

CSS Shapes Editor for Brackets – CSS Shapes open a lot of design possibilities with the ability to wrap content inside and around custom paths. However, creating the actual shapes used to be a cumbersome process.

Usability, UX, Responsive Web Design, Mobile, Performance, etc.

Creating a Responsive Email Template – Many email clients completely remove the head and strip out styles while some support a limited set of inline and internal styles for formatting. To many, an old-school table layout is the best way to go.

User Experience (UX) and User Interface (UI) Explained – User Experience (UX), on the other hand, defines the totality of the emotions evoked in a user when he/she connects with that system, and not just the interface.

Using Photoshop in Responsive Workflows – There’s no shame in using Photoshop as part of a modern web design process. All this time, we’ve been trying to use it as like a fountain pen and totally missed how great it is as a paint roller.

The Power of Microcopy in Web Design – It’s the page title, the copy by the terms and conditions agreement checkbox, sign up instructions, form labels, loading screen message, placeholder text, or disclaimers that your email won’t be shared. Microcopy is all over your website.

Why Users Fill Out Less If You Mark Required Fields – Are most of your users skipping the optional fields on your form? You might not need that extra information, but having it could help you learn more about users and give them a better experience

Perfect your website with 3 simple UX research methods – The point of the test is for you to find out where the participants trip up and not to get them from point A to B by holding their hand.

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

Wireframes vs. Prototypes: What’s the Difference? – A wireframe is not the same as a prototype but even seasoned design professionals can sometimes get the two terms mixed up.

Using the Minimum Viable Canvas – In this post we will see how to use the Minimum Viable Canvas, from Idea to Launch. Product first Canvas for Lean Startups.

21 User Activation Hacks You Need To Know – 21 user activation hacks that will help you understand your visitors and slash that annoying bounce rate.

Useful Freebies for Web Designers & Developers – April 2014 – In this article we have gathered up a list of 25 free tools, the following tools are free and useful for your development and design projects. We hope you will find the list handy and useful for your projects.

What’s new for designers, April 2014 – The April edition of what’s new for web designers and developers includes new web apps, Photoshop extensions, game frameworks, educational resources, mobile frameworks, jQuery plugins, and some really great new fonts.

How To Organize Information for Early Visual Perception – Through primitive features, textures, and grouping, we reduce the cognitive load of our visitors. We move some of the load from working memory to initial perception.

25 New Frontend jQuery Plugins That are Worth a Look – The jQuery plugins on this page are diverse: there are plugins that let you work with menus and scroll effects, and even some that will help you lazy

10 Common Landing Page Myths: Busted – We’ll debunk the most common landing page lies and arm you with information to take your landing pages to the next level.

5 Essential Elements for E-Commerce Websites – There are ways to make the e-commerce experience brilliant. The five topics below are things to keep in mind when creating/optimizing an e-commerce website.

Advanced web typography: Justification & hyphenation – We can hyphenate pretty well, but justification still has a way to go, so I’m afraid to say that we’re not going to be using them together the way we do in print any time soon.

20 Best CSS Tools for 2014 – There are number of css tools are being released and available over Internet which allows designers and developers to work and generate innovative results efficiently. These tools help within achieving good command over CSS.

5 Tips for a Fresh Website – That’s a lot of new content pouring on to the Web.This influx of new websites is a great reason to keep your own fresh website. After all, no one wants to invest a lot of money in a website only to turn around and become “yesterday’s news.”

5 fundamentals every web designer needs to understand – Well-designed websites are seen as more credible, according to a Stanford study and are actually easier to use. So here are five fundamentals to help you keep quality design at the forefront of your practice.

Designers Should Know How To Code – If you want to be a true professional, you will encounter this issue. Those who want to be designers wonder if it is necessary to learn how to write code as well.

Moving your website to https / SSL: tips & tricks – There are quite a few things we learned in the process of moving these two sites to SSL that we thought would be worth sharing with all of you. Also, some things happened in the last few weeks that make SSL a hot topic

15 Super Useful CSS Animation Tools – In this article we have compiled a list of CSS Animations Tools that would help you to create your own css animations without much efforts and hassle.

Designer’s Secret Sauce – If any random person, without any ‘design skills’, can easily spot out what’s wrong with some particular design, that’s probably a sign that your design is lacking common sense.

Free Icon Font Generators for Designers – Custom icon font generators are the tools that allow designers to generate their own custom icon fonts. There are innumerable numbers of online custom icon font generators are available that makes selecting the best one difficult.

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

Paper 101: Quick Start Guide for Print Projects – Elements such as paper stock, paper size, coating and fold can significantly impact how a design is put together for a printed project. Here’s a guide to help you get started and better understand the ins and outs of printed projects.

30 Fresh new illustrator tutorials from 2014 – It’s essential as a designer that you’re always striving to grow your design skill set. This is a great roundup of the very best tutorials for beginners, and as well as for more advanced illustrator users.

The designer’s guide to grid theory – Whether you work in web or print, you need to understand grid theory – even if you eschew grids. Grids are like the invisible glue that holds a design together, so whether you work in print or on the web you need to understand grid theory.

Understanding Vector Shapes in Illustrator – I’m starting this post at the beginning, so even if your goal is not to get blazing fast, you’ll still get a solid understanding of the basics.

10 Things You Need to Know About Smart Objects in Photoshop – Smart Objects have become much more powerful, and useful. In this tutorial, I will share with you 10 things that you should know about working with smart objects in Photoshop.

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

How to Easily Double Your Traffic from Social Media – The point is the more often you share, the more likely you are to get clicks. The big question most of us have is whether this type of thing really is ok?

12 Ways to Get the Most From Behance – I have decided to focus on one of my favorite social portfolio sites, Behance. Hopefully you will have a good feel for how you can make the most of your time on this excellent social portfolio site.

The Ultimate Guide to Write a Gripping Blog Post – Blogging cannot be called a science, but certain steps must be taken to ensure that all the essential elements of a good blog are included in the one you write. In this post I’ll explain how you can write a great blog by adhering to certain guidelines and norms.

Stop Doing These 5 Things (on your blog) NOW! – Do these blog “things” drive you bonkers as well? What else should marketers stop doing on their blogs right now? Here is our list of five things you need to stop doing on your blog…NOW.

How to Create a Successful Business Blog – In this article you’ll find numerous resources and practical advice to help you through each stage of the blogging process.

Stop Trying to Get Your Blog Posts Shared and Do This Instead – Use Social Platforms for Their Intended Purpose. Social networks aren’t for blog posts. They’re for bite-size pieces of visual content


The 15 Most Common WordPress Mistakes to Avoid – In this article, we’ve outlined 15 of the most common WordPress mistakes that almost every one of us makes in the beginning.

The Beginner’s Guide to Icon Fonts in WordPress – Here are some resources for taking the next step. Who knows; you may find yourself designing your own icon font at some point, when you just can’t find the right font for that particular project.

4 Easy Tips for WordPress Performance Optimization – In this article, we’ll show you how to improve server performance and page speed by leveraging things like browser caching and CDNs.

Getting The Most of Post Formats: What Are Post Formats? – In this series, I will be introducing you to WordPress post formats, dispelling some of the confusion surrounding them and showing you how to put theme to use in your themes.

Ten Awesome WordPress Snippets for the WP-Config.php File – In this article, I would like to share with you ten useful code snippets that you can add to your website’s wp-config.php file. These snippets will allow you to customize WordPress in a number of ways.

Organizing Your WordPress Data: Understanding Custom Taxonomies vs Custom Fields – You can attach to your content-types — which for better worse still go by the name “posts” in much of WordPress — two importantly distinct kinds of data

Why WordPress Theme Developers Are Moving Functionality Into Plugins – Over the past year, Atkinson and his team at Cr3ativ.com have made an effort to convert all of their theme functionality into free plugins, eschewing the theme bloat that prevails in this market.

How to Setup CloudFlare Free CDN in WordPress – Page speed is a crucial element in determining your website’s search engine rankings. In this article, we will show you how to set up CloudFlare’s FREE CDN in WordPress.

Dashicons in WordPress 3.9 – WordPress 3.8 has introduced an icon font for the WordPress admin, named Dashicons. Dashicons includes 167 icons until now. WordPress 3.9 includes 30 new fresh and clean icons.

Search Engine Optimalization, Conversions, Analytics, etc.

Website Designs that are People-friendly are Google-friendly – Google’s job is tough, so stick with ethical practices and your client’s site will come out ahead of those who constantly try to underhand Google with bogus link building practices.

15 Ways Your Google Analytics Might Be Broken, Part 1: Checking the Code, Requests, and Cookies – This post will show you ways you can check your tracking code, requests, and cookies to avoid some of the most common pitfalls.


How to Create Stylish CSS Buttons – In this tutorial, I’m going to run through the basics of 4 different style buttons – flat, border, gradient & shadow (skeuomorphic), and press style buttons.

Freelance, Business and Workflow Related Stuff

The Importance of Side Projects – In days where the good old college degree + resume are gone, specially in the design/tech industry, you have to keep in mind that side projects are the new resume and are the way you can show your potential to the world.

How I found the perfect work/relaxation balance as a freelancer – I’m not rich by any extent, but I have a much better work / relaxation balance that allows me to enjoy life.

5 Tips To Be A Better Freelancer – Regardless of whether you are a photographer, a software developer or an Internet marketer, the following tips will help you mold yourself into becoming a better freelancer.

Effective Cloud Migration for Businesses – It is the job of the IT sector to foresee business turbulence and find ways to provide effective solutions in an innovative and cost effective manner. Cloud computing is one such piece of technology designed specifically to cater to the ongoing needs of the business world.

10 Techniques in Handling and Dealing With Bad Clients – Below are the ten techniques you should try in handling and dealing with bad clients as well as negative people plus tips to consider to manage it properly.

Designing with Vision – It’s no guarantee that your favourite concepts make it through the decision process, but at least they’ll lose in a fair battle. It’s your responsibility to frame the discussion and make sure these out-of-nowhere-opinions don’t surface.

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

Baseline Grids on the Web – This is very much my personal take on baseline grids as they apply the web. I’m not trying to convince anyone; these are just the reasons I’m not a fan of them on the web.

“Creatives” – I recently read about a mother who is able to stretch a $14,000 annual income to feed and clothe her family. That, ladies and gentlemen, is creative. Your fucking banner ad campaign is not.

Why build new things? – Don’t believe anything others say (including me). Though it doesn’t mean you don’t have to listen — learning from other people’s mistakes is better than making your own.

Letter to a Junior Designer – I admit it: you intimidate me. Your work is vivid and imaginative, far superior to my woeful scratchings at a similar age. The things I struggle to learn barely make you sweat. One day, you’ll be a better designer than me.

Fuck Innovation, Everything We Have Now is Shit – The things we use every day are so disgustingly terrible, there’s unending opportunity. We don’t need novelty, we need better. The products that exist suck so much, there is endless opportunity.

– § –

I hope you have enjoyed these hand-picked great articles? 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: Jan Rajtoral

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.

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