Tweet-Parade (no.44 Oct-Nov 2011)

Hello Saturday! .. It’s time for a brand new Tweet-Parade! A Tweet-Parade is a post filled with the best articles of last week from the various blogs around the world. 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, etc.

CSS3 in practice – great web presentation of all the new stuff in CSS3 with a nice visual explanation what happends when you use different codes for e.g drop shadow, etc.

A CSS3 & jQuery based Sliding Door Content Gallery - This gallery is a great presentational way to show more content using less screen real estate. A lot of information can be packed in to such a gallery where the content gets revealed to the visitors as they hover their mouse over the gallery items.

465+ Useful CSS Layouts for Download - Cascading Style Sheets (CSS) is a language which is used primarily in text formatting. But nowadays, CSS is not only used in presentation semantics but in positioning contents as well. Positioning content in a webpage using CSS ..

CSS Borders: The Basics And Rounded Corners - Borders are something I’m sure you use on most projects. Like backgrounds you’re probably familiar with css borders and yet may not be aware of some of all the properties and their values.

A Call for ::nth-everything - With CSS3, we have positional pseudo class selectors to help us select specific elements when there are no other distinguishing characteristics other than where it is in the DOM in relation to it’s siblings.

Expanding Text Areas Made Elegant - An expanding text area is a mutli-line text input field that expands in height to fit its contents. This UI element is commonly found in both desktop and mobile applications, such as the SMS composition field on the iPhone.

Original Hover Effects with CSS3 - The power of CSS3 is enormous and in this tutorial we will see how to exploit it in a very creative way. We are going to create some thumbnail hover effects with CSS3 transitions. On hover over a thumbnail, we will reveal some description ..

Playing with SVG Design - After years of quarantine, the Scalable Vector Graphics is finally raising fame as a feature of HTML5 with full native browser support. Exploring two aspects of SVG with interesting potential for the design of original interfaces: clipping paths and scalable 2D motion graphics.

Centered Heading Overlaying a Horizontal Line with CSS - Maybe there’s a technical term that I’m not aware of for this type of centered line-splitting heading. Whatever it’s called, I’ve used it in the new design of the footer on this site, where I’ve divided the footer into sections with headers

How To Add Images To Your CSS Borders - CSS3 introduces the ability to use an image as the border around an element in place of one of the border-styles. It also provides properties for controlling to a greater degree how these images will display as the border.

Writing Better JavaScript with CoffeeScript: The Basics - CoffeeScript is a small programming language that compiles into JavaScript. It seeks to make writing JavaScript code better by providing you with a more consistent and succinct syntax, as well as by avoiding the “bad parts” ..

Demystifing Nth-Child in CSS - Using nth-anything in CSS takes many of us back to our 9th grade Algebra class. The reason for this is the formula used for nth-child uses “variables”. These are represented as
n

.

Fully fluid, responsive CSS carousel - Making a carousel fluid is actually ridiculously simple. Let us assume you have five panels. Remember that number! A carousel is made up of three basic components ..

 

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

The developer’s guide to mobile frameworks - In this article, I’m going to share my process for determining the best development approach for an app and discuss some of the more popular tools that have emerged to address the fragmentation problem.

A case study in responsive design - a post outlining how I went about it, and some of the things I noticed along the way that might help if you’re attempting responsive front-end work for the first time, or just want some general tips, so here goes.

Practical Design Considerations for Responsive Sites - Responsive design is our current best solution to the phenomenon of the ubiquitous web. The Internet is being accessed by people everywhere on countless incredibly varying devices and responsive pages provide an ..

An Introduction to Grids in Web Design - The grid is an invisible structure that collects all the elements within a web page together. Grids are never properly visible, however traces of the grids’ “discipline” can be seen by the placement of elements within a web page.

Quick Overview of User Experience for Web Designers - UX takes clients off the center of their own arguments, and puts users back in the center of the design, therefore turning subjective (and sometimes egotistic) design change requests into rational arguments that benefit the user.

8 Techniques To Create An Irresistible Landing Page - A landing page is a very important tool for online marketing and is also known as a lead capture page. The definition of it is a single page that appears in response to clicking on an advertisement.

10 Important Articles for Web Designers - Web designers around the globe are very much busy now-a-days. They have to create lot of work to fill their clients demand. So it’s simple that one mistake can be occurred.

Navigation patterns for ten common types of websites - Navigation is one of the most important aspects of any website. Without good navigation, a site becomes useless to visitors. They can’t find the information they need, and then seek out competing sites instead.

Responsive Web Design Templates and Frameworks - the concept of responsive web design is still relatively new. For this post we’ve gathered a collection of Responsive Web Design Templates and Frameworks.

Variables to Test When a Landing Page Isn’t Working - The fastest way to get insights into what is (or isn’t) driving the right user behavior is to conduct A/B testing.   It’s relatively easy, allows you to systematically test key areas of a webpage, and gets you quickly iterating new ..

 

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

The best way to research your next web project – Many organisations rush into major redesign projects without having a clear idea of where they are going or even what is wrong with their current site. This inevitably leads to scope creep, internal politics and finger-pointing further down the line.

New Web Design Tools And Resources You Would Need – it’s amazing how often new resources for web designers or web developers appear on the web and it’s a really good thing cause in this way the techniques evolve and so do sites thanks to some people who try to help..

10 Benefits of a Professional Web Design - Even business can succeed through the internet. So, we will enumerate the benefits of having a professional website so that you can have a better understanding on its importance.

Firebug Guide for Web Designers - Firebug — an open source web development tool extension for the Mozilla Firefox web browser — is incredibly powerful, with a wide range of super useful and practical features that would benefit any web designer or developer.

5 Simple Font Changes to Boost Readers, Comments, and Shares on Your Blog - Just one common mistake with colors could reduce readership by a factor of five. So in this article, I’ll give you the five most important best practices for presenting text to keep readers glued to your content, and away from the old back button.

Minimit Gallery Plugin - Minimit Gallery is a highly customizable Jquery plugin that does galleries, slideshows, carousels, slides… pratically everything that has multiple states. It’s designed for advanced Javascript/Jquery programmers because you need to code all ..

Using jQuery to Test New Website Fonts - This is a neat little script I found which lets you preview live new font’s for your website using jQuery Font Dragr. Could be useful if your showing a client what various fonts look like, or for just everyday font test for website. Enjoy.

12 Best Online Typography Tools - Typography is an art of designing fonts in a manner that it creates a beautiful composition. In this post I am going to create a showcase of best online typography tools to help you design your next typography design.

10 Typography Tools for CSS - Tools to use CSS typography pop up every so often, but not all of them are as great as others. Here is a collection of excellent typography-related, CSS-compatible applications for you to use in your own work.

From Print to Web: Creating Print-Quality Typography in the Browser - Print, in the past forty years, has gone almost completely digital. While most of us still sit down with a pen and paper to sketch our ideas and flesh out layout mechanics, we design our spreads and set our type on the computer.

Basic web design principles that will make or break any site - The principles of design and the user-friendliness of a web site. There are two very important things you have to consider when designing a website: Users and Search Engines.

15 Best jQuery Drag And Drop Plugins - Today we are going to share best jQuery Drag and Drop plugins for developers, these plugins make your task more easy ans simple by just drag and drop elements from one side to other. This type of plugins makes the interface of site very friendly, you ..

 

 

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

Complete Guide to Photo Sharpening in Photoshop - As a photographer or retoucher, you learn that not all images are perfectly sharp in all the right places straight from the camera. You might make adjustments in Lightroom, Camera RAW, or in Photoshop but it often takes a ..

10 Reasons Why You Should Learn Adobe Illustrator - Adobe Illustrator is a popular program for designing that primarily manipulates vector graphic. It is a vector graphics editor that allows you to create and edit vector graphics images. You can create designs which can be printed in high quality.

The Ultimate Collection of Professional Free Fonts - Luckily we’ve compiled a comprehensive list of professional free fonts to enhance your designs. We’ve left out all the ‘filler’ fonts you find in a lot of roundups, so that every font below is really high quality and applicable.

Top 10 Don’ts of Brochure Designing - Following are a few mistakes that designers make unintentionally while designing brochures and these mistakes need to be avoided in order to make your marketing strategy work.

35+ Excellent Adobe Illustrator Tutorials - adobe Illustrator tutorials smoothens the process. Passionate designing meets a new level with Adobe Illustrator. You can’t ignore the tutorials to as it offers developed tools to improve designing.

Logo Design: Tips, Tutorials and Inspiration - The reason for this article is to push some tips, tutorials and inspiration your way in order for you to fully understand how vitally important a logo is to a business and that it isn’t just something you can rush.

9 Rules to Make Your Icons Clear and Intuitive - When you use icons in your designs it’s important to make them clear and intuitive. Here are a few solid rules to follow so that your icons don’t leave users scratching their heads.

15 essential Photoshop tools for web design - Whether you use Photoshop or have found a happy alternative, there’s no denying the vast array of tips and tools that are available for Adobe’s cornerstone software.

 

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

10 Essential Design Elements of a Blog - you will still have to follow some standards that will help you send the right message. There are several tips I will share with you on choosing the right design elements for your blog.

Quick Tips To Increase Facebook Page Fans - Facebook is one of the best social media platforms out there and it is a great marketing tools. It lets you find new customers and maintain the existing ones through interaction. It is also a great way of promoting your new products.

17 Twitter Marketing Tips From the Pros - Are you looking for fresh ideas to improve your Twitter marketing? We sought out hot Twitter tips from the pros. Keep reading for inspiration. Now’s not the time to let your Twitter marketing go stale.

The importance of user testing copy and content - After user testing a prototype of a new product feature (in this case a setup wizard), it took us 2 or 3 tests to determine issues like where a button should be placed, if it was distinctive enough, if the general layout and structure made sense.

 

WordPress

Default WordPress Generated CSS Cheat Sheet for Beginners - The goal of this cheat sheet is to assist beginners who are looking to get into WordPress theme styling. If you are a beginner who does not want to deal with the codes

Force Reload of Scripts and Stylesheets in your Plugin or Theme - If you’re developing a WordPress theme or plugin you may have had the problem that scripts or stylesheets are not reloaded from the source when you refresh the page because they are cached somewhere on the way from the server to the browser.

WordPress Shortcode TinyMCE Button Tutorial Part 2 - We will add following button of our shortcode [mylink] in the TinyMCE editor at the end of this tutorial.

WordPress Tips and Tricks for Beginners - WordPress can be a frightening lion or a gentle lamb, depending on how much experience you have. This platform gives you the opportunity to incorporate many useful plugins and code to manipulate your website to function exactly how you want.

Building WordPress Themes You Can Sell - I’ll share some of the important takeaways that I’ve learned so far, like how to gain a solid user base, what to include in your themes and, most importantly, what to leave out.

WordPress Security: How to Secure WordPress Thoroughly - Being open source makes WordPress vulnerable to hack attacks, henceforth making it very important for webmasters to consider WordPress security issues seriously.

Daily Tip: Display Your Latest FourSquare Checkins on Your WordPress Site - FourSquare API is a new plugin that will show your latest checkins in a widget on your WordPress site. Don’t worry, despite the plugin’s name, you won’t have to know how to work with the FourSquare API in order to add the checkins widget.

Unleashing .htaccess for WordPress - .htaccess is actually the shortened form of Hypertext Access. It is a configuration file which is designed to control the directory in which it is placed and all the respective sub-directories.

10 WordPress Plugins: Easy for Designers, Happier Clients - In this article, we will focus on a selection of 10 plugins that make the developer’s life easier by enhancing some WordPress functionalities and thus create a more useful ..

Ecommerce Integration In WordPress and Tools for It - before we describe in detail which WordPress shopping carts you should consider for ecommerce development, let us understand why CMS integration and shopping cart development should be brought under the scope of WordPress development.

 

Search Engine Optimalization, Rankings, Analytics, etc.

How Analytics Drive My Web Strategy - I’m just beginning to plumb its depths and it only starts to be really helpful after you’ve built enough traffic to show patterns. Here are a few things it’s shown me that are interesting and how it’s influencing the business decisions for my web company.

List of Free To Use Google SEO Tools - Search Engine Optimization is helpful for website owners in increasing their website’s traffic and global presence to be in the top of the list and to be ahead of their competitors. Here’s a List of Free To Use Google SEO Tools ..

11 Kick-Ass Free Live Web Analytics Tools – In this post i would like to share 11 Awesome free live web analytic tools to check traffic of your web site. Web analytics is the measurement, collection, analysis and reporting of internet data for purposes of understanding and optimizing web usage.

Spooky SEO Tactics to Avoid - In celebration of Halloween, here are a few spooky SEO tactics to avoid because they will certainly come back to haunt you!

The SEO Hierarchy of Needs - we just need to rename the four needs to correspond to the four major components of any SEO campaign. Our SEO hierarchy of needs looks something like this.

3 Metrics Google Analytics Beginners Should Watch - the top three things I think you should look at as you start through your Analytics journey. Feel free to add to this list in the comments below if there is a report that is especially useful to a beginner.

What You Can Learn from Bounce Rate & How to Improve It - Before we can fix our bounce rate, we have to fully understand what bounce rate is. Bounce rate is the percentage of visitors who come to your website and leave without viewing any other pages on your website.

Organic Keywords: The First Step In Search Engine Optimization - In this article, I’ll outline the steps we’ve developed over the years to optimize pages to improve organic search results – not just rankings, but click-throughs and conversions, too.

Increase Conversions with Geo Targeting - Optimizing your website for conversion is crucial, regardless if the aim is eCommerce, newsletter registrations, advertising impressions, time-on-site or any other purpose. The optimization process is data driven, much like any scientific experiment.

SEO Kung-Fu or SEO F-U? - What makes a good SEO? Is it just about having knowledge of search engine algorithms, being able to tweak code for the biggest ranking impact, or inserting keywords into a page to give it a better keyword focus? Is SEO all about search engine ..

A Step-by-Step Guide to Website Measurement - It covers my basic philosophy of web measurement, a simple approach to using Google Analytics, as well as two types of user testing that you can do easily and quickly on your own. It gets a bit mathy in the middle, so find a comfortable and quiet place to dig into this one.

 

Tutorials

Make an animated search form using only CSS – Make an animated search form using only CSS. I thought I would try to re-create the effect for myself. Using a bit of CSS3 magic, the effect is actually quite easy to re-create!

30 Must See HTML5 Tutorials - There are lots of designers and developers who started practicing HTML5 and implementing it in their web designs. In this roundup we have featured 30 useful HTML5 tutorials that will definitely help developers increase their skills..

Best of the Vector Web – October 2011 - This month, we showcase high quality tutorials on creating layered, limited color, vector style artwork. We also have tutorials on creating self promotional books, using Illustrator’s Brush tool to create intricate artwork, and more.

Simple and effective dropdown login box - Web users log in every day, so imagine how many times log in forms are being used in a single day. Usually, it don’t take too much to fill a form like this, but using a drop down solution will speed up things for you.

Guide to CSS Animations – Resources and Tutorials – CSS animations are becoming quite popular and I decided to compile a list of useful resources and tutorials for those that haven’t spent that much time with them. Here you’ll find the main guidelines and tips on how to take the first steps with it.

 

Freelance, Business and Workflow Related Stuff

How Designers Can Cope with Huge Information Overload - You really don’t have to go far in order to learn something new. Designers always have that desire to be updated all the time especially that it could give them ideas and let them know of the current design trends.

The art of charging more as a freelancer - As services such as design and development are rather abstract terms to most, and as the internet is still a relatively new medium, freelancers are left to wade through the muck in order to figure out their own worth.

16 Business Lessons for Freelancers - The vast majority of freelance designers and developers have chosen to embark upon a career as a freelancer because of their interests and abilities that are related to the work that they’re doing. Running a business is just ..

Creativity vs. strategy: what do people really want? - Strategy is what some people believe pays the bills. Now, I’ll say that’s up to personal interpretation, but if you have a plan and it makes sense, well then you’re far ahead of someone who has no clue what they are doing.

 

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

Strategic thinking - Asked to describe Landor’s approach to branding in a sentence, executive creative director (EMEA) Peter Knapp opts for “honest advocates of bravery”. It’s a dramatic, rousing call-to-arms, but then, in the cluttered, multiplatform modern marketplace, ..

Nostalgia - Partly it’s down to our willingness and ability to change; our adaptiveness. New things can be overwhelming, too complex to justify upgrading from the current norm. I often find myself saying “What does this solve?

When credibility and trust matter more than usability - The first step in building a successful website is to provide something people want or need—like a product, information or service. After that, it better be easy to use.  Now you may start to get users telling their friends ..

Why Are Designers Hiding? - As a designer and creative, you spend your life making other people look and sound compelling. Making an impact with your originality is your legacy. You tell amazing, original stories of brands, businesses, products and services and yet ..

Multi-Device Web Design: An Evolution - As mobile devices have continued to evolve and spread, so has the process of designing and developing Web sites and services that work across a diverse range of devices. From responsive Web design to future friendly thinking, ..
 

 

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