Tweet-Parade (no.48 Nov-Dec 2011)

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

CSS In Depth Part 2: Floats & Positions - This week we’ll be discussing positions and floats as well as what the differences are and when it’s best to use them. Both floats and positions deal with the relationship of elements between each other. Without these, padding ..

How To Make Forms More Usable With HTML5 - Forms are how we interact with websites. We use forms to contact site owners, login to applications, reply to comments and so much more. Forms generally don’t inspire love. We don’t like filling them out or creating them.

Create Five Awesome Hover Effects Using CSS Multiple Backgrounds - Today we’re going to have all kinds of fun with the CSS multiple backgrounds feature. You’ll learn how to use multiple backgrounds in a simple way and how to go much further by combining the ..

Getting Started with Sass - CSS’ simplicity has always been one of its defining, most welcome features. CSS style sheets are just long lists of rules, each consisting of a selector and some styles to apply. But as our websites and applications get bigger and become more complex, and ..

CSS menu, 180 scripts, plugins and freebies - 180 CSS Menus (including the always popular freebies) to provide a go to spot, for those have had trouble finding merely suitable menus to incorporate in their website designs, after going through a disappointing web surfing process.

Reverse Ordered Lists in HTML5 – With all the hype surrounding the new APIs and the fancy parts of CSS3, I had almost forgotten about the new reversed attribute that allows you to write a descending list of numbered items, as opposed to the default ascending list of numbered items.

Use :pseudo-elements as list-style-image alternatives - We could use pseudo elements as the ‘bullets’. This would solve the problem of showing more sprite than we’d like since we can set the pseudo-element’s width and height and give it the sprite background.

How to use Firebug on your iPad and iPhone - Web developers targetting HTML5 on iDevices would really benefit from having Web Developer Tools or Firebug on Mobile Safari. Enter Firebug Lite! However, iPads, iPhones and bookmarklets don’t go well together, so I put together this little howto.

The difference between width:auto and width:100% - lately I’ve come across several cases where people use width:100% to undo explicitly specified widths when they should be using width:auto instead. So here’s a brief explanation of the difference.

 

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

Responsive Web Design: Overflow Image with vertical centering - If you want to use an image in your responsive web design you can use fluid images. But there is another way. You can set a maximum height and crop the image. If you want to learn more about it, ..

How to Validate & Test Your Designs for the Mobile Web - Validation and testing may not be the most exciting areas in web design, but they’re just as important as learning how to make things look great.

The Hype Around Responsive Web Design And Media Queries – An Insider’s Thoughts - Now, the latest trend is “Responsive Web” catering to cross platform users in both smart phone and desktop platforms.

Going from adaptive to fully responsive - I realised that there is a difference between responsive and adaptive web design. According the Ethan, who also coined the phrase “Responsive Web Design”, there are three components to a responsive design:

Usability Testing: What You need to Know? - Usability testing is often a misunderstood part of the web design process. While most designers, developers and business owners these days have the idea of what usability testing is, a good number don’t see what it can do ..

How to Design Functional Sub-Navigation Menus - Examining the functions of sub-navigation. Not only covering the realm of JavaScript, but also user experience and key design tips in this modern era. The concept of a navigation system isn’t ‘new’ by any means.

“Mobile first” CSS and getting Sass to help with legacy IE - Taking a “mobile first” approach to web development poses some challenges if you need to provide a “desktop” experience for legacy versions of IE. Using a CSS pre-processor like Sass can help.

Usability vs. Accessibility - The first step in making a website accessible and usable is to make a distinction between the twin terms, usability and accessibility.

Conditional Loading for Responsive Designs - a technique for loading some content after the initial page load. This gives you a nice performance boost. There’s another situation where this kind of delayed loading could be really handy: mobile-first responsive design.

10 Awesome jQuery Responsive Sliders, Galleries & Plugins - recently there have been some great responsive image sliders, galleries and plugins released.. so let me introduce my roundup of the 10 best responsive image sliders and galleries you can use on your website today

 

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

Build a Killer Website: 19 Dos and Don’ts - I’m continually surprised by how many people call my design company with very firm ideas about what they want on their business website and yet, they haven’t thought through some of the most basic questions first. For this reason, ..

The Web Design Process – 3 Important Steps - the process of website designing falls in between creating a sculptor and building a bridge. Thus while developing a client’s site; we have to take care of two aspects: aesthetic and utility.

15 Amazing CSS3 Text Effects - CSS3 boasts some turely amazing text effects that can help you make your website look really impressive and stylish. Designers loves clean and cool typography and now CSS3 has totally revolutionized the way text effects were added.

The Web Designer’s Guide to Font Replacement Methods - Font-replacement methods can be often hard to sort out the different methods if you’re not constantly reading about it. This article will discuss various font replacement techniques that are out there right now.

30 Most Popular jQuery Plugins Compatible to the Latest Web Trend - jQuery is one of the most popular and widely used technologies that assists you in fashioning your site more appealing and captivating. In the present scenario of web arena, more than 40% of websites ..

Selling Online: Design, Development, and Business Considerations - Selling physical and digital goods online has become a mainstream option for nearly every type of business. Traditional retail is moving stock online, there are endless online-only shops, and every other type ..

5 jQuery Infinite Scrolling Demos - Here are 5 demos which you could use as the barebones for your next infinite scrolling project. I’ve been playing around with infinite scrolling for one of my projects and I’ve tried a few jQuery plugins which can manage the “endless scroll” showing items ..

jQuery Lifestream - Show a stream of your online activity. The easiest way to get started is to create your own lifestream. Check out the example and the readme file.

10 Ways to Instantly Increase Your jQuery Performance - This article will present ten easy steps that will instantly improve your script’s performance. Don’t worry; there isn’t anything too difficult here. Everyone can apply these methods!

Creating Custom Font Stacks with Unicode-Range – We may not have really explored all the capabilities of @font-face properties as defined by the spec. One such property — the unicode-range descriptor — sounds pretty dull and is easily overlooked.

6 Questions You Should Ask Yourself When Choosing Fonts - Typography is truly a science and many designers spend an entire career devoted to the study. But selecting effective fonts for your project doesn’t require an in-depth, life long study of ligatures, glyphs or ..

Designing for the Web: Resolution and Size - I will cover basic as well as complex aspects of web design, but will not cross the threshold of coding. The aim is to arm the graphic designer with the knowledge and skills to design a solid website.

SliderWall – the best jQuery slider plugin - SliderWall helps you make a spectacle out of your content! You can use your text, images, videos and virtually anything to create slideshow-like presentations that we like to call “sliders”.

 

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

The Perfect Paragraph - In this article, I’d like to reacquaint you with the humble workhorse of communication that is the paragraph. Paragraphs are everywhere. In fact, at the high risk of stating the obvious, you are reading one now.

Comprehensive Guides For Mastering The Pen Tool - A great article which is a collection of comprehensive guides in order for mastering the the most difficult photoshop and illustrator tool. For a long time i struggled learning how to use the pen tool its such a difficult ..

Eight Best Practices To Create A Stunning Logo - There is nothing in the online medium more reduced in size but at the same time as important as a logo. The paradoxical issue is very simple to observe: usually, it is presented in the header of the websites and a common individual ..

10 Mistakes a Graphic Designer Shouldn’t be Making - The most common way for a graphic designer to learn is through trial and error. Especially for young and aspiring designers, who keep on committing mistakes because of lack of experience.

 

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

7 Reasons You’re Not Generating Leads From Social Media - Social media is a great inbound marketing tool that allows businesses and marketing teams to interact with prospects, cater to customers, promote their content, and yes, generate leads.

Mobile First Content Strategy - The mobile-first approach applies just as well to content as it does to design. In this post, we’ll look at two tools that you can use to assess written content for its appropriateness to mobile, or to hone your own.

Why Your Business Should Be on Google+ - By now, many of us have already started setting up our Google+ business pages, and have noticed that there’s nothing overly special about these business pages yet, since they currently lack a vanity URL, have no setting for multiple ..

Say Hello to the HTML Email Boilerplate - Figuring out html email will test the patience of any human being. A seemingly small formatting issue will inevitably arise and you think to yourself #$%@#^&.., That’s pretty much why the HTML Email Boilerplate is around.

Content Strategy Within The Design Process - Content strategy is an emerging field of practice encompassing every aspect of content, including its design, development, analysis, presentation, measurement, evaluation, production, management, and governance.

Can Google+ for Businesses Compete with Facebook/Twitter? - Google’s single biggest potential is in the “+1”. Facebook has ‘Like’, which certainly has its place, but it doesn’t directly translate into improved rankings and personal recommendations on the world’s most-used search engine.

 

WordPress

How To Create A Tabbed Widget for WordPress - How to create a tabbed widget that displays: Popular Posts, Recent Posts, Comments and Tags and you can easily to add it to your blog via drag & drop in widget management. With some simple PHP, CSS and Javascript then ..

HTML Formatting for Custom Menus - Clean, semantic HTML markup for all web pages, and WordPress’ custom-menu functionality to make things easy. In this DiW article, we’ll see how to enjoy both: WordPress custom menus and clean, well-formatted HTML markup.

A Collection Of Useful Hacks for your WordPress Blog - I use WordPress frequently in personal and client projects so have built up a list of hacks I use in day-to-day WordPress development. And today I’m going to share a few of my favorite and most used tricks.

17 Time Saving Code Snippets for WordPress Developers - The WordPress blogging system has grown by leaps and bounds in just a few short years. Web developers familiar with JavaScript and PHP have flocked into the community. As such we have seen a tremendous surge ..

Useful WordPress Tricks to be Like a Pro - We decided to collect some very basic tricks and snippets, that can help them mange blog more capably. Below are some every day demanding snippets and tricks for better WordPress experience.

WordPress tip: Restrict user access to specific templates - A common request of clients is to be able to have page that can be only accessed by specific roles (authors, contributors, etc). Here is a quick tip to create a page template that only authors can access.

How I built a micro-site within a WordPress theme - In this post you can expect a smattering of code snippets, a good deal of me explaining my weird website preferences, and of course some bouncing between functions.php files and functionality plugins.

Integrating Amazon S3 With WordPress - This article goes over Amazon’s S3 cloud storage service and guides you to implementing a WordPress plugin that backs up your WordPress database to Amazon’s S3 cloud. Note that this is not a tutorial on creating a WordPress ..

Why WordPress? - Over those last two years WordPress has changed vastly and thus it’s time to update that post with the reasons I still use WordPress in 2011. The chief reason remains its ease of use and flexibility.

 

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

Google Analytics For Bloggers – The Definitive Guide - Google analytics is by far the most useful tool that I use on the Internet when it comes to tracking the progress of my website. They provide you will all the information you could possibly need ..

Why SEO Comes First - For all their hard work, good intentions and passion, generally speaking they’ve all been a massive dud when it comes to one particular aspect of online marketing: search engine optimisation.

Two Examples of How One Line of Code Could Kill Your SEO [Case Studies] - With all of the buzz about Social Media Marketing, I think too many companies overlook the importance of having a rock solid technical structure (SEO-wise).

5 Reasons Why People Aren’t Coming Back To Your Website - Are you wondering why visitors don’t seem to be coming back to your website on a regular basis? Does looking at your website statistics on Google Analytics make you cringe?

10 New Google Analytics Features You Need to Start Using - If you’re not already familiar with the new version, take the next few weeks to get comfortable with it. To help you get started, let’s review the top 10 features of the new Google Analytics.

Top 10 SEO Tips and Tricks For Your Website - Knowing what goes into a successful SEO implementation and ways to build up your site, will turn your site into a major online destination and help you rank faster in search engines.

The Differences Between a 301 and 302 Redirect - more often than not clients forget to redirect all their old inbound links to the new site! Years of link building and site trust go down the drain in an instant. There is no way to get it back except with time.

Site’s Speed Optimization for Better User Experience - an important consideration as users usually don’t prefer to wait for long. Also, having a fast site can create a competitive advantage for webmasters as site’s speed has made it to list of Google ranking factors.

 

Tutorials

Pure CSS3 Slider - Today I’ll tell you about a remarkable thing that you can implement with CSS3 – it’s a slider. I think you may have noticed that some time ago was very popular variety of sliders, and many chose their decision to use jQuery easySlider example.

9 Awesome HTML5 Audio and Video Tutorials - Trying to learn HTML5? Wanna embed your videos and audio using HTML5? Check out these great tutorials on how to use HTML5 to embed your videos.

How to Illustrate a Tomato Using Adobe Illustrator - You will use Meshes, Gradients and Blends for creating the resulted picture. The skills you will learn here can easily be transferred to creating various objects.

Typography Effects with CSS3 and jQuery - Today we will create a set of nice typography effects for big headlines using CSS3 and jQuery. There are many things we can do with CSS3 animations and transitions and we’ll explore some of the possibilites.

Make Your Website Beautiful: 20 Must-Read CSS3 Tutorials - With the growing popularity of CSS3 and HTML5, developers are renovating the online world in which we live. As this technology becomes more widespread the websites we create will be more diverse ..

25 Amazing HTML5 Tricks and How to Make Them - some tips and tricks to help you with your HTML5 experiences. Usually, HTML5 goes hand in hand with CSS3 to create the ultimate web experiences so in this article you will see that there are some tutorials including CSS techniques too.

A Basic Responsive Grid (Plus Handy CSS3 Media Query Reporter) - Because responsive design allows us to address the needs of many (and conceivably all) screen sizes — from small handhelds to tablets to desktops to giant widescreen monitors — all with one code base.

 

Freelance, Business and Workflow Related Stuff

How Email is Still the Best Networking Tool You’ve Got - Email is not dead – it has been, by far, the most important and effective way of communicating with other bloggers, writers, and people in the online world.

5 Unique Benefits That Freelancers Offer to Their Clients - But, does a small business or a lone freelancer stand a chance when competing with a larger organization for a client? I think they do. Bigger isn’t always better.

4 reasons you still aren’t successful - There are a lot of articles that will try to tell you what you are doing wrong and how to fix things, but the truth is the majority of them aren’t super honest.

12 Tips for Freelance Web Designers that Will Bring You to Success - In this post, we will give you 12 tips to that will help you succeed as a freelance web designer. Since it is a challenging job, you really need self discipline and control in order to succeed.

5 Reasons Why I Prefer to Freelance for Others - Starting an online venture is not the ultimate answer to success any more. In this post, I’ve listed some reasons why I think working as a freelancer for others can sometimes be a better choice than starting your own venture.

Save your Business Reputation with these 5 Design File Tips - In the midst of a project, it gets hectic. Everyone knows what it’s like: The deadline is looming and you’ve got files final_v1 through final_v13, and you may even have final_final!

Making a Positive First Impression with Clients - When it comes to landing clients for design projects, the first impression is extremely important. With so many web and graphic designers out there, clients have a lot of choices about who to contact and ultimately who to hire.

How do You Create a Great Portfolio? - For Web Based Freelancers a portfolio can be used to present potential clients and employers with the opportunity to view their design or development skills put into practice.

How to guarantee return clients - Every business has customers; they wouldn’t exist without them. Some of these customers will never return and this is why most business owners put a high emphasis on getting repeat customers.

 

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

50 Practical, Problem Solving Items - In these situations, a well-built and tested template can be of enormous help. I’ll show you some of my favorites today, including everything from landing pages, to resumes, to under construction templates!

A Plea: Design With Conviction, Or Don’t Design At All - Design with conviction or don’t design at all, please. We can be serious and funny. We can be serious and jackasses. We can be serious and not change a bit. But please be serious and let us care enough to take ..

How to Find Your Individual Design Voice - In the design world, volumes have been written advising the newbs, and those with some established street cred, on the ins and outs of being a top shelf designer, and many of these posts will either be focused on or at least include ..

Misscrolling - We expect streams of text to scroll down in our browsers. But almost all of them scroll incorrectly.

Top 5 Reasons Why You Shouldn’t Create Trendy Designs - Following trends is a part of many creators in all creative mediums: design, fashion, music, film, whatever. It’s only natural: you see what people want, then you give it to them. What’s the problem, you might ask?

Die a designer: 10 steps to a long career - Designers need to be planning for career longevity, says Christopher Cashdollar, creative director for Happy Cog. His 10 tips will get you thinking beyond the pixel and on a path towards long-term professional relevance

The Politics of Typography - Typography doesn’t exist in a vacuum, the letters often powerfully evoke specific times and places and can help us come to a clearer understanding of significant cultural changes. Tracing their unique forms can provide a picture of the historical ..
 

 

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