.. Your Daily Design Dosis

Tweet Parade (no.34-2015)

| Comments Off on Tweet Parade (no.34-2015)

.. 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.

Techniques and Treatments for Background Retina Images – There are many possibilities for employing large background images that remain sharp on all screens with minimal file sizes: as always, the ideal solution is arrived at by anticipation, research, and testing.

Strategies for Cache-Busting CSS – Major performance gains are to be had from browser caching CSS. You ensure your server is set up to send headers that tell the browser to hang onto the CSS file for a given amount of time. It’s a best-practice that many if not most sites are doing already.

Laying Out A Flexible Future For Web Design With Flexbox – The CSS layout mechanism lets us arrange elements in a truly web-like way. Some elements can be fixed, while others scroll. The order in which they appear can be independent of the source order.

Making Charts with CSS – Plain CSS and markup solutions for charts and graphs work to a certain extent, and in many situations they’re probably the safest bet. But I think it’s worth exploring alternative solutions to representing data.

Convert Image to Data URI with JavaScript – Once the image has loaded, we thrust it into canvas and then export its data to a data URI.  In practical terms, this isn’t a useful task since the image has already loaded but if you’re looking to create a local utility to perform this task, here you go!

CSS First – The API of your CSS will be much more robust as a result of this work. That API is important. The inner-workings of your CSS are easy to change. Your HTML is easy to change. But that API between them is the most important part.

25 Free Apps & Tools For Working With CSS – For this post I have collected 25 small web-based apps and tools that will in one way or another offer quick solutions to many of those frustrating and time-consuming tasks you will often have to overcome when working with CSS.

Want To Learn Sass? Start With These Resources – Learning Sass can help to make life a whole lot easier for both web developers and designers. For beginners, you may find it a little difficult at first, but as time goes on, you will find that it gets easier and better.

7 Web Development Trends for 2015 – Every developer has a collection of tools that are indispensable to getting the job done. In this article, we will take a look at 7 web development frameworks and trends that are set to become even more important in 2015.

The @font-face dilemma – Standard @font-face can hurt site performance, but there are many ways to load web fonts without blocking text render. And working around these problems is getting eaiser.

CSS Modules – In CSS Modules each class should have all the styles needed for that variant (more on how that works in a minute). It makes a big difference to how you use these styles in JavaScript

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

The Problem with Automated Website Accessibility Testing Tools – The issue, in short, is that so much of determining whether a website is accessible or not is subjective enough that automated testing cannot support making a definitive judgment on whether or not disabled visitors can access and use the site.

Making Your Icons User-Friendly: A Guide to Usability in UI Design – You’re designing for your users. The easier your product is for them to use, the more likely they’ll be to use it. Make your icons work for you and your users.

9 CAPTCHA Alternatives That Won’t Wreck Your UX – A great design mentality leaves no stone unturned, which is why we’re offering up more user-friendly options for those pain-in-the-ass CAPTCHAs

Facebook’s Method of Compressing Images – Certain extreme cases and usage scenarios could put more strain on the compression algorithm & server environment. While this image compression technique is a step forward it is surely not a catch-all solution.

The Scroll Hijacking Usability Nightmare – I’d like to ardently state that scroll hijacking is a big no-no. There are some examples of decent experiences but they’re so few-and-far between that you’re better off not even trying to replicate anything at all.

Mobile Navigation Engagement Techniques – You have a horizontal menu on large screens and you hide it inside a burger on smaller screens. But is it good practice or has it become the most stupid no-brainer in the history of web design?

How to fix a bad user interface – Awkward UI is a missing loading indicator. It’s forgetting to tell your customer where something went wrong. Bonus points for doing so with a scary error message. It’s a graph that looks weird with only a few data points.

Supporting Mobile Navigation in Spite of a Hamburger Menu – Mobile sites that use the hamburger or three-line menu need to support navigation activities throughout the site, in case users don’t locate or use the main site navigation.

The state of responsive images in 2015 – The aim of responsive images then, is not to deliver a higher quality image to screens that can display it, the aim is to deliver the highest quality image supported and nothing more.

UI, UX: Who Does What? A Designer’s Guide To The Tech Industry – Job titles like UX or UI designer are confusing to the uninitiated and unfamiliar even to designers who come from other industries.

A Future-Friendly Approach to Experience Design – We should strive to design interfaces that can fluidly interact with the complexities of the real world. The future of experience design is about emotional awareness; connecting us with products the way we connect with each other.

Animation and the User Experience – Today, huge advancements in technology and a more thoughtful approach to human centered design, have sparked a renewed interest in the use of animation to improve the user experience.

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

Progressive design for the modern web – Recently we were approached by an existing client to responsively redesign their website. We’d previously worked with them using a rigid waterfall process. Moving to an agile workflow, we were able to embrace change at any point in the project.

Guidelines for Letterspacing Type – Effectively letterspacing text can make the difference between good typography and great typography. With that in mind, I decided to put together some guidelines for letterspacing type on the web.

Simple Tips for Creating a First-Class Personal Portfolio – And if you don’t get paid, then you… aw, you get it. The point is, having a great web design portfolio can greatly increase your chances of gaining more work and earning more money.

5 Most Common Interaction Design Mistakes on the Web – Designing an interaction has never been easy. It involves deep analysis of user behavior and meticulous planning. With new technologies and interaction design patterns emerging, things are not getting easier.

Using Contrast to Design Crisp Website Layouts – When the word “contrast” appears in design talk most people think of black & white. These two colors provide heavy contrast no matter if they’re used for buttons or typography.

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

9 Common Slip-ups That Designers Tend to Make During App Icon Design – Focusing on icon design is therefore more of a prerequisite in the app development lifecycle. This write-up discusses some of the most common slip-ups that designers tend to make during mobile app icon design.

The Colors Of An App Icon – Recently I stumbled across a cool Ruby library called Miro that extracts the dominant colors from an image. Finding the dominant colors of apps shows some really interesting results.

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

13 Ways to Drive Sales With Your Company Blog – To help you capitalize on this profit potential, YEC asked 13 successful business owners how they’ve used their own blogs to drive product or service sales.

How to Create and Keep a Consistent Blogging Schedule – You have to find what works best for you. I’m only sharing my system so you have another point of view and another example for how to create and keep a blogging schedule.

Blogging Success: 7 Reasons New Bloggers Fail – From our experience from the past 5 months, we can say: Yes, it is possible to build a successful blog, but there are many reasons why new bloggers fail. Here are 7 of them, you should avoid.


Using AJAX With PHP on Your WordPress Site Without a Plugin – In this article I’ll show you how to use Ajax in WordPress. The reason it can quickly become a lot more complex is that it is a technology meant as a bridge between your website and your server.

WordPress Version 4.3 Now Available: Here’s What’s New – With this update one of the most widely used content management systems becomes even more user friendly. The new menu customizer will no doubt make a lot of site owner’s lives easier.

5 Simple Methods for Creating Custom Queries in WordPress – Scenarios in which you might need a custom query, focusing on which require customizing the main query and which require a whole new query, and the five methods for creating custom queries.

Search Engine Optimalization, Conversions, Analytics, etc.

The big problem with sharing text in images – There’s a trend in the way we create and share content at the moment that’s harmful for accessibility. Too many of us are enjoying this trend without realising its implications.


Beautiful Examples of CSS3 Typography Code Snippets – Web typography is now more stylish and malleable than ever before. New CSS3 properties allow for truly unique typographic effects that in the past would have required images and custom JavaScript.

Animated SVG Hero Slider – Instead of using canvas, we played with SVG. Also, instead of creating a vertical layout that would require forced scrolling to see the animation, we turned the whole resource into a hero slider.

Freelance, Business and Workflow Related Stuff

The ultimate guide to doing anything in Slack – Slack, the team messaging app that’s the hot thing of the moment among startups, has seen explosive growth in the last year with over one million people now using the service every day.

How to Cure Design Perfectionism with The 80/20 Rule – Perfectionism can be devastating. It can make you feel depressed, frustrated, anxious, and even angry, especially if you constantly criticise yourself for not doing a good enough job after spending a lot of time and effort on a design.

Why GitHub is not your CV – People’s problem-solving ability and reasoning can’t be surmised from reading the end result of those processes, you have to talk to them. If you want to choose wisely, and fairly, stop demanding free work from people.

Getting the Clients You Deserve – By avoiding these 3 pitfalls, you’ll be well on your way to getting more clients. What’s great is you’ll also get to choose which clients you’d ideally like to work with, rather than getting desperate and taking what you can get.

Clients who dare ditching the pitch – I’m a fundamentalist if it comes to pitching. It’s often the wrong process for the wrong goal. Pitches were invented to make big corporations establish long term relationships with creative agencies.

Working Remotely Isn’t Always a Dream – Like many, I’d spent every day of my adult life beguiled by the dream that gets packaged with working remote: live anywhere, make your own schedule. Keep your job that you love, but travel whenever you want — as long as your work gets done

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

2015 is the year the old internet finally died – It’s an internet driven not by human beings, but by content, at all costs. And none of us — neither media professionals, nor readers — can stop it. Every single one of us is building it every single day.

How Good Developers Deal With Bad CodeIt’s this “all too human” weakness that each developer has that drives the best developers to assume the worst in their code and underlying infrastructure, and plan for it.

Reimagining the web design processGone are days of design projects that have a concrete list of deliverables. As web design and development continues to evolve, static web pages don’t cut it anymore.

Dear Developer. Love, Designer – The modern web design process is very different to what it once was. Gone are the days when each role was so distinctly separated from one another. Collaborate more, communicate more, embrace the cross overs and focus on ways to work better together rather than separately.

How to become an awesome designer in 365 days – If someone told me a year ago, that I’ll create a different illustration every day I’d probably wouldn’t believe them. I wasn’t aware how much progress I can make in such a small period of time.

Why content comes first – Now, I’m a content strategist, and yes, I believe that content—or at least, a concepting meeting with your content peeps—should always come first, but this isn’t a partisan stance. Design is communication. And you can’t communicate if you don’t know what you want to say.

– § –

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.