Time for a new roundup with the best design-related articles and tutorials of last week’s blogosphere, hand-picked for you. 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.
Cross Browser Styling of HTML5 Forms (Even In Older Browsers) - HTML5 Forms is probably the most practical and, I believe, will be the most commonly used module of the HTML5 spec. With it, you can create great looking, easy-to-use ..
Learning LESS: Using Functions - Time to get our hands dirty in some LESS functions, which will likely blow your mind that it can be done in CSS. The first type of ‘functions’ I’ll cover are Operations.
Build a Super Easy CSS Slider With Thumbnails - With CSS, you can’t create two distinct divs and then have the contents of one serve as an action point for the other. It’s easy enough in JavaScript, but CSS gives you less freedom in the way that you stack your selectors.
How to Resize Background Images with CSS3 - In CSS2.1, background images applied to a container retained their fixed dimensions. Fortunately, CSS3 introduces the background-size property which allows backgrounds to be stretched or squashed.
9 Useful Tips and Tricks for Web Developers - 9 useful HTML, CSS and Javascript Tips and Tricks I got it online and have been using them many times. A few of them are CSS3 and HTML5, so If you are a frontend developer like me, you will certainly find them useful.
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.
Creating a Full Screen Background for Websites - Most tutorials focus on complex CSS or using the <body background="some-image.jpg"> attribute. In practice, a very simple CSS solution exists without the use of any webkits or other complex code.
All About Unicode, UTF8 & Character Sets - This is a story that dates back to the earliest days of computers. The story has a plot, well, sort of. It has competition and intrigue, as well as traversing oodles of countries and languages. There is conflict and resolution, and a happyish ending.
CSS Filter Effects Landing in WebKit - Filter effects have been around for awhile but were designed to work in SVG. They’re fantastically powerful at applying effects like color intensity, warping, or blurring to an image before it’s composited and rendered into the document.
Convert Images To Black And White With CSS - Filters allow us to visually process an image in the browser without needing to go through PhotoShop or use cycle-intensive, script-heavy methods in JavaScript or PHP. CSS3 filters are broadly supported in the most recent versions of ..
Why Aren’t You Using SVG? - SVG, or Scalable Vector Graphics, is a XML-style markup driven vector graphic rendering engine for the browser. SVG is supported in every browser, except IE < v9 and Android < v3.
15 Best CSS Practices to Make Your Life Easier - Whether it be from all the small changes here and there, or from a messy job to begin with, it can be a struggle to clean it up. To keep the code clean and easy to manage, there are ways to improve the CSS process from start to finish.
Usability, User Experience, Responsive Webdesign, Mobile, etc.
Web Accessibility: Putting People and Processes First - For many web authors, developers and policy makers, the issue of accessibility to disabled people is addressed mainly by trying to ensure that their sites conform with the international Web Content Accessibility ..
Responsive images for mobile: don’t sweat it - I hope that if you are experiencing RIC (Responsive Image Consternation), you don’t spend a ton of time fretting about it today. Because clearly, no amount of analysis or fretting can definitively solve the responsive image issue today.
Eight Experiences Every User Enjoys - Users primarily remember how products make them feel. As you’re building your application, service, or website, try to evoke these emotions and users will be more likely to return.
7 Responsive Navigation Patterns - Once you get comfortable developing flexible layouts and moving around the big boxes of a responsive design, your attention will turn inwards toward the smaller boxes inside the big picture containers. First among those will likely be navigational systems.
UI vs UX: what’s the difference? - In general, always think of UX as an umbrella that houses all the points that make up your product’s experience, in the now, in the future (though that’s some strategy), and in the past.
Setting Breakpoints in Responsive Design - I’ve covered the technical side of media queries, basic implementation, full design tutorial and some CSS tricks. Today, I want to talk about setting breakpoints in responsive design. How should you set the breakpoints?
Responsive Content is not a thing – It’s not the content that is adapting there. The content isn’t doing anything. It’s just static. The content is being controlled by a responsive design system.
Build a smart mobilenavigation without hacks - Figuring out the best way to optimise navigation for mobile devices is downright challenging. Our community has come up with a ton of different approaches for addressing this issue, each with its own set of pros and cons.
7 Elements of a Well Converting Subscription Page - More and more sites and services are focussing attention on their subscription pages and discovering that a well-designed page is very important to new user sign ups.
How to Prepare for The High-Resolution Web - Whether we’re ready or not, the future of the web is going to be in High Definition. It’s been predicted for years now, but recently we are starting to see things really change. So, what is the HD web exactly?
Webdesign in Common, Web Typography, jQuery, Tools, etc.
Essential Tools, Resources and Examples for Creating Better Web Design Wireframes and Mockups - Nowadays you can find a lot of great tools that can help you create functional sketches in no-time so you and your team can focus on more important tasks.
Is Your Homepage Overcrowded? - Finding balance with design is difficult. Each page on the web typically has at least one conversion goal. It is the job of the design team (client included) to determine what the goal of each page is, and to make sure that goal is achieved.
40 Best Landing Page Templates - The landing page describes clear information, so that the customer understands your products easily. Here are 40 Best Landing Page Templates for your Products.
Roundup Of Free Tools For Web Designers And Developers - Currently we share a brand-new tools for Web designers and developers, We would love to hear from you, we hope you find the following list handy for your development and designing needs.
14 Most Popular jQuery Plugins of May 2012 - It is time we go through our monthly roundup of fresh jQuery plugins that have gained lots of attention in May 2012, these plugins are really worth checking out.
Useful Free jQuery UI Tutorials and Resources - There are certain jQuery UI tutorials and resources which guide the users in learning how to use jQuery in order to add a particular sequence of CSS classes in creating graphical lists. Another class of tutorials help the users in ..
Why Paying Attention to The Fold is Stupid - The problem is that the people asking this question haven’t been properly educated as to where the fold actually came from and how we can use it or if we should even care.
Principles of Quality Website Design - There are various principles, strategies and approaches, which are equally important for any successful web design. In order to make sure that your website performs equally well – if not better – make sure to apply these principles in your website’s design.
Utilizing jQuery UI Animations for Neat Page Effects - the jQuery UI Library allows developers to quickly animate with precision using custom functions. You can also include themable page widgets such as tabs and image uploaders. For this article I want to look into some of the custom animation effects you can utilize.
4 Landing Page Design Techniques That Grab Your Visitors’ Attention - The basic purpose of designing a Landing Page is to direct your visitors’ attention towards your conversion goal, get them to move towards your CTA and click it. That’s the bottom line of every Landing Page out there.
Rounded Corners and Why They Are Here to Stay – Rounded corners are here to stay, and it’s not just because they’re pretty. There’s more to them than meets the eye. Why, then, do we love rounded corners? Rounded Corners are Easy on the Eyes (and the Brain).
Showcase of Awesome e-Commerce Platforms for Your Website - And when it comes to e-commerce platforms, the options are numerous. In this article, we take a look at some of the best known e-commerce platforms to help you create your own online store.
Product Graphics: 6 Techniques To Make Images More Informative - Luring page content is always good, but when it comes to grabbing your visitors attention images are the most popular form of media.
Graphic Design, Brand Identity, Typography, Print Design, Icons, etc.
Must See Fresh Highly Creative Illustrator Tutorials - We’ll be sharing with you a collection of useful tutorials that will help you to use Adobe Illustrator in a variety of new ways.
Why Subtle Typographic Choices Make All The Difference - A strong understanding of how designers control meaning is essential for anyone interested in graphic design or typography. In this article, we’ll look at the reasons why subtle typographic changes can create considerable effect.
Typography: Common Myths and Mistakes - As graphic or web designers we work with typography all the time, and even if we don’t all call ourselves typographers, setting type in one form or another is unavoidable. It’s a very large part of our job. And for hundreds of years it was our job ..
How To Choose Typography For A Brand: Gather Inspiration, Find Common Concepts, and Offer Variations - Through a lot of trial and error, I’ve come up with a few tricks to help designers (and their clients) through this essential stage in the branding process.
Brand Better: Elements of an Identity Dissected and Explained - To eliminate some of this ambiguity and add distinct meaning back into these seemingly-synonymous terms, I thought I would break down the various elements that I use to create a strong brand.
Blogging, Social Media, Writing, Content Strategy, etc.
Is Your Blog Niche Enough? - Finding the right niche to blog in can be daunting if you haven’t started, but if you have started, honing your blog into a niche can be tricky too. I think a public exploration will help all us all learn a thing or two.
A Guide To Facebook Page Post Analytics - I am loving the new Post Analytics feature that Facebook rolled out for Facebook Pages this week. And what’s great is the Post Analytics display in close to real time, so you immediately have a sense of how many people are seeing your message.
Social Media Is A Part Of The User Experience - It certainly isn’t our responsibility—we build websites, we don’t run marketing campaigns. Is social media really somebody else’s responsibility? In my opinion, social media is very much our concern. That is because social media is firmly a part of the user’s experience, and we are user experience designers.
The Science of Networking and Connecting Through Social Media & The Blogosphere - Connecting through the social media gives powerful tools to smaller, independent businesses. Companies can reach established customers and attract new clients, find out what trends are hot, and promote engagement with their websites.
Get More Tweets: 5 UX Tips for Boosting Your Site’s Virality- Social networking sites account for the most referral traffic to all websites just behind organic search. So you better be optimizing for more sharing. Here are 5 fresh user experience ideas for boosting how much your site gets shared.
Are You Making These 7 Blog Promotion Mistakes? - While some bloggers have zoomed to popularity in a few months, the majority have to work hard to promote their blog. By now you know that there aren’t any silver bullets. I also know that you are committed to your blog’s success and willing to invest what it takes.
WordPress
Getting 110% out of WordPress – We take a look at some WordPress plugins and themes that can transform your WordPress site from a simple blog to a totally different web application experience. You will learn how to use WordPress as a framework to power social networks, FAQ’s, and ecommerce sites.
When You Should (and Shouldn’t) Use a WordPress Plugin – The key to effective use of plugins is to deploy them only from properly vetted sources, and only when necessary. Plugins should solve a specific problem or provide an essential function.
How To Enable Custom Permalinks In WordPress Local Server Environment - A problem that several of our users encountered with their local server installations of WordPress was that they couldn’t get permalink rewrite rules to work. Whenever they tried enabling ..
How To Create a Featured Post Layout in WordPress - Follow this overview post to see how a mix of query posts snippets were used to create a custom featured post layout in WordPress.
An In-Depth Understanding of WordPress Hooks - Say the phrase “WordPress hooks,” and any novice developer will almost invariably balk and begin fretting over how difficult it is to understand implement these advanced pieces of code in independent plugins and theme-specific functions.php files.
Quick Tip: Next and Previous Posts With Thumbnails - This quick tip will give you the programming you need to include the post thumbnail and the date of the next and previous posts. Styling is left up to you.
How To: Safely Backup and Retire a WordPress Powered Site - I recently decided to retire my two WordPress powered blogs. The reason was that the source of income for these blogs died and keeping them up required regular maintenance and paying hosting fees.
Focusing on Usability with an Enhanced Pagination Design in WordPress Entries - Those who prefer to develop their own, custom-designed pagination via coding it without a plugin will need to have pretty firm experience of PHP and CSS in order to have the greatest chances of success.
Developing a WordPress Theme for a Real Estate Website - Developing a WordPress theme for a real estate website can be a long process. In this article, I will explain the process of creating a website for a real estate agency and explain methods and best practices that are not only standard to WordPress, but also to make it easier to develop such a site.
How To: Add a Staff & Departments Section to your WordPress Business Site - one feature that a lot of business websites need is a staff listing section. You could accomplish this using normal pages, but a more elegant solution is to add a custom post type for handling staff and a custom taxonomy for handling the departments.
Search Engine Optimalization, Conversions, Analytics, etc.
The Great SEO MindSchmuck: Why businesses just don’t get SEO- There is so much confusion, misinformation and anxiety about this topic that it actually boggles my mind. Google’s in on it. SEO consultants are in on it. Website developers are often unwittingly doing it.
Increase Website Traffic through Internal Linking - One thing that sites that attract a lot of QUALITY website visitors do besides optimizing their website with the right keywords is use internal linking throughout their website.
How HTML validation benefits your website - There are certain standard HTML rules which must be adhered to by html web pages to fetch the maximum results. When HTML validation is done, errors of code are removed to enable efficiency and effectiveness to web pages.
10 Types of Unnatural Link Building Tactics + 10 Quality Alternatives - Here’s a look at 10 types of link building strategies that are spammy, low quality, or unnatural plus 10 quality alternatives.
8 Useful And Free Web Application Security Testing Tools - In this round up, we have gathered some free web application security testing tools for you. These tools help you run security tests and will let you identify any possible security loophole.
The Perils of Oversaturated Targeted Anchor Text Links in a Link Profile - In years past a link builder who acquired a choice link with targeted anchor text was feted with praise, but in the aftermath of the Penguin Update we have learned that too many anchor text links can get you a one-way ticket to Google jail.
Google Penguin: A bad Dream for WordPress Theme Creators - WordPress theme creators have got the hardest blow this year from Google Penguin. They have been penalized harshly for bearing credit in their footer. Simultaneously this gave rise to a lot of debates. While some believe Google was unnecessarily strict on this issue.
Shift in SEO Knowledge & Experience: Priorities in a Post-Penguin and Post-Panda World- Instead of blaming Google all the time for any ranking dips and decreases in organic search traffic, let’s look more into what kind of mindset should we have moving forward. What kind of thinking should your SEO team have to make your SEO strategies future proof.
10 No-Nonsense Ways to Build Backlinks - I personally think most bloggers are missing out on a huge potential source of traffic by just plain ignoring how search engines work and what practices are most effective. SEO for blogs doesn’t have to be overly complicated or require “black magic” in order to work.
Tutorials
Create a Swish CSS3 Folded Ribbon in Five Minutes- Take one line of markup, a couple of CSS3 rules (no images), and you can have yourself a swish folded ribbon effect in five minutes. Let’s see how..
Fullscreen Slit Slider with jQuery and CSS3 - A tutorial on how to create a fullscreen slideshow with a twist: the idea is to slice open the current slide when navigating to the next or previous one. Using jQuery and CSS animations we can create unique slide transitions. 20
Excellent Pressable 3D Buttons With Pure CSS3 - Internet expands the design industry and web standarts are changing and being improved almost every year. Although still having problems with browsers, the abilities of CSS3 allows more control on animated elements in web design.
4 Versatile JQuery Drop Down Menu Solutions - We have collected the 4 best drop down menu with many features such as autocomplete, search, tags, multi select, ajax and even populate with JSON data. Drop down menu is a very common form element but the greatest issue is, the way browser ..
40 Useful HTML5 Tutorials, Techniques and Examples - In this collection, we are sharing some useful HTML5 tutorials with our designing and development fraternities to help them learn the new ways to get web pages SEO friendly and more interactive.
Image Accordion with CSS3 - In this tutorial we will create an image accordion that will expand an item on click. Using the sibling combinators and a nested structure we can control the opening of the items/slides with radio buttons.
27 PHP/MySQL Tutorials for Building Web Applications- I’ve collected 27 brilliant tutorials which are perfect for beginner-to-intermediate web developers. You can pick up programming knowledge from these tutorials which usually stays with you forever.
Build an Animated Photo Wall With CSS - Building yet another awesome and fun CSS demo. This time we’ll create a big, seamless wall of photos. When the user hovers over an image, a transparent black overlay will fade it out as a text label fades in and the image zooms.
Freelance, Business and Workflow Related Stuff
Freelancers: Here is Networking Done Right! – What is your goal at a networking event? Are you looking to land new clients, make industry specific connections, or just mingle with fellow freelancers?
Understanding the Business Aspect of Freelancing - Being a freelance designer is more than just fun and games. It’s not just playing around with Photoshop and other gadgets. You need to master the harder aspect of freelancing too: the business aspect of things.
10 Warning Signs of Bad Client Types- Clients are supposed to be a focal point of any graphic designing business. Without clients you are obviously nothing because they are the main source of your income so keeping them happy is very important.
5 Things to Include in Your Web Design Contracts - Even for small projects there are essential elements that should always be included in your web design contracts. Here we’ll take a quick look at 5 of these important things to include.
7 Skills you’ll Need to Run a Successful Web Design Business - The secret is to never give up. Why not focus on the things you can do to start a successful web design business? This article will review the key skills needed in order to achieve your entrepreneurial goals.
Collaboration without compromise - Designers are notoriously inconsiderate of their collaborative practices, and are far too often comfortable with the compromised results of these decidedly common efforts.
How to Protect Your Design Work on the Internet - To attract new clients, they must showcase their work and put it on display on the internet. Yet, by doing so, they are more vulnerable to thievery. The possibility of people taking their work and re-publishing it or using it for ..
F*cking Brilliant, a great Read or just magnificent Tips!
Why Paying Attention to The Fold is Stupid - The problem is that the people asking this question haven’t been properly educated as to where the fold actually came from and how we can use it or if we should even care.
Design Patterns: When Breaking The Rules Is OK - We’d like to believe that we use established design patterns for common elements on the Web. We know what buttons should look like, how they should behave and how to design the Web forms that rely on those buttons.
Common sense for your website - I think you should not so much focus on hearsay about SEO, but think about what seems logical and makes the most sense. Only when your website makes common sense to you, you should go look for someone that can help you with the not so ..
Fix Your Website: 5 Things to Change Now - At Wpromote, we’ve conducted thousands of tests for hundreds of clients. Here are the factors we’ve found do the best job at improving the conversion rate of even the best pages.
10 tips to improve Google Chrome browsing speed - Without having to quote browser usage statistics, Google Chrome is undoubtedly the favorite web browser of today’s always-online, always-connected generation. If numbers are any help, approximately 40% of Internet users ..
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