.
Articles
45 BEST FREE EBOOKS FOR WEB DESIGNERS
Over the past year or Speckyboy has published several articles featuring a selection of the best free ebooks for web designers, with each post proving very popular and highly resourceful. Here's a list of 45 of them. The list was updated in May 2018.
Happy reading!
speckyboy.com
|
50 TOOLS FOR RESPONSIVE WEB DESIGN
According to Denise Jacobs and Peter Gasston (April 2012):
To get started with building a responsive site, having a strong toolkit can make a world of difference. Here Denise Jacobs and Peter Gasston round up 50 great tools to aid the process of making your sites responsive
As introduced/coined by Ethan Marcotte in both his article "Responsive Web Design" as well as his best-selling book, one needs three elements to make a site responsive:
A flexible/fluid grid
Responsive images
Media queries
There are plenty of other great articles that cover motives, and techniques regarding responsive web design, so we'll keep the focus of this article on some top tools that will help you become responsibly responsive.
50 tools for responsive web design
|
AVOIDING COMMON WEB DESIGN MISTAKES
This article reviews some important and necessary checks that web-sites should be checked against before the official launch — little details are often forgotten or ignored, but – if done in time – may sum up to an overall greater user experience and avoid unnecessary costs after the official site release.
www.smashingmagazine.com
|
HOW TO CREATE COMPELLING WEB COPY
10 more tips. This time it's tips for Creating Compelling Web Copy.
webdesignledger.com
|
IT’S THE CUSTOMER, STUPID
An article about the words on your web site.
www.clickz.com
|
JAVASCRIPT MENUS NO LONGER SEO NO-NO
JavaScript enabled, dynamic menus allow you to pack a lot of information in a tight space and make it easier for shoppers to find what their looking for. But for years, SEO professionals have advised against using JavaScript menus, warning that search engines can’t read JavaScript. In times past, that was true. But search engines have come along way since.
www.getelastic.com/seo-friendly-javascript-menus-mythbusters/
|
PRINT CSS STYLE SHEET PRIMER
If you've ever wanted a primer on creating CSS style sheets for printing, this "CSS Design: Going To Print" article on AListApart.com, suggested by user Keven Barker, is a good one. AListApart.com has other great articles too.
www.alistapart.com/articles/goingtoprint/
|
STATE OF HTML5 VIDEO REPORT
HTML5 has entered the online video market, which is both exciting and challenging for developers in the industry. With the HTML5 specification and the various browser implementations in constant flux, LongTail Video spent a significant amount of time understanding the limitations of the technology and optimizing their products for HTML5.
In developing the JW Player, they perform routine tests across the various browsers and devices to help determine the current state of online video. Their State of HTML5 Video Report is a compilation of their research and latest test results, focused on HTML5 Video playback. They share their findings with other developers/users in the industry as they explore just what HTML5 can and cannot support.
As they continue to build out their products, they will publish their up-to-date results here. They have grouped our test results into the few topics theye find to be the most critical for online video. As HTML5 Video evolves, so will this report. If a browser or device gains traction, they will add it here. The same goes for those features of HTML5 Video that are not widely used yet. They hope that you will benefit from their findings, and as always, look forward to feedback from the online video community.
LongTailVideo.com HTML5 Report
|
WHAT SIZE TO BUILD YOUR WEB SITE (SCREEN RES VS. BROWSER WINDOW SIZE)
Tin Forrest of Toledoh Enterprises said that a constant nag of his is what size to build websites.
He offered this great post about the issue.
In the article, Chris (css-tricks.com) offers a method of tracking the screen resolution of your site.
Tim also had a question about integrating this information into CMSB. It's partially answered in the forum post at http://www.interactivetools.com/forum/gforum.cgi?post=88617
Screen Resolution
|
Cheat Sheets
APPLICATION SHORTCUT MAPPER
The Application Shortcut Mapper
It's a bit off topic, but this amazing, free on-line tool by Waldo Bronchart, has visual shortcuts for Photoshop, Photoshop elements, Lightroom (and many other programs) on Windows or Mac. You tell it what program and module you are using and it shows you a keyboard with highlighted, labeled keys to shortcuts you can use.
It’s can help teach beginners and even intermediate and advanced users who don’t have all the shortcuts memorized yet.
Read more about it at http://www.mcpactions.com/blog/2014/05/26/keyboard-shortcut-app/
Application Shortcut Mapper
|
COMPARING BROWSER CSS CAPABILITIES
Wondering how to tell if a particular browser supports a CSS selector or rule? Here's a list of some resources that can help.
Sites that compare browser compatibility
http:///www.Caniuse.com
http://www.quirksmode.org/compatibility.html
http://www.wikipedia.org/wiki/comparison_of_layout_engines_css
How to deal with older browser issues
http://www.positioniseverything.net
Specific Browser Support Guidelines
http://developer.mozilla.org/en/mozilla_css_support_chart
http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariCSSRef/Introduction.html#//apple_ref/doc/uid/TP40002050
http://www.opera.com/docs/specs/
http://msdn.microsoft.com/en-us/library/hh781508%28v=vs.85%29.aspx
|
EXCELLENT CHEAT SHEET COLLECTION
23 excellent, print-ready cheat sheets for HTML/HTML, CSS, and JavaScript (including MooTools and jQuery).
www.sixrevisions.com
|
LIGHTBOX CLONES MATRIX
Confused by all the various lightbox clones that you can use to display your images, animations and flash, iframes?
This Lightbox Clones Matrix lists a number of javascript scripts designed to embed various objects in HTML pages and compares the various scripts and their features.
www.planetozh.com
|
PARAMETERS FOR OPENING PDF FILES IN READER
This document from Adobe lists all the parameters that can be passed to the Acrobat reader (V 9.0) when opening a PDF document. It covers basics like initial zoom settings, scroll bars, and much more.
Adobe.com
|
SEO CHEAT SHEET
A down-loadable SEO cheat sheet and other SEO information.
www.seomoz.org
|
XHTML CHARACTER ENTITY REFERENCE
The 252 allowed entities in HTML 4 and XHTML 1.0.
www.digitalmediaminute.com
|
CSS
CSS DESIGN TRICKS
As web designers and developers, we've all come to learn many css tricks and techniques that help us achieve our layout goals. This is yet another list of 15 excellent "must know" css techniques to keep in mind when developing a website.
blog.themeforest.net
|
CSS VALIDATOR
An easy, quick css validator to help find errors in your css style sheets
jigsaw.w3.org/css-validator/
|
CSS ZEN GARDEN PROVIDES HUNDREDS OF GORGEOUS CSS BASED DESIGNS
There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really.
www.csszengarden.com/
|
CSS/JAVASCRIPT-TECHNIQUES
From Smashing Magazine, another 45 useful CSS/JavaScript-techniques that may help you find clever solutions to some of your problems or just get inspired by what is possible with CSS
www.smashingmagazine.com
|
Debugging
OUTLINE PAGE ELEMENTS FOR DEBUGGING
This tool was offered by CMSB user Zaba.
According to the developer, "Placing an outline on every element can help you figure out what the %*%$#k is going on.
This little css module does exactly just that. Nothing more, nothing less."
Despite its strange URL, it can be a useful debugging tool.
Pesticide.io
|
E-Commerce
VERSATILE PHP BASED SHOPPING CART SOFTWARE
More than 40 shopping cart designs, and over 30 payment processing companies already integrated into the same feature rich PA DSS compliant ecommerce shopping cart software, and no recurring fees make this affordable software worth checking out.
ECommerceTemplates.com
|
Images
FREE PIXLR IMAGE EDITOR
Here’s a robust browser based photo editor, for all your editing needs. With PIXLR Editor, you have full control over your images - including layers and effects. It's quick, full featured, and as close to Photoshop as you can get for free.
pixler.com
|
IMAGE GALLERY SCRIPT COLLECTION
Ever found yourself scrounging around for a simple yet useful image gallery and slideshow script? Here's collection of AJAX, JavaScript, Lightbox, CSS and Flash-based image galleries that may provide all the resources you need.
www.noupe.com
|
SLIDESHOW - A JAVASCRIPT CLASS FOR MOOTOOLS 1.2
Slideshow is a javascript class for Mootools 1.2 to stream and animate the presentation of images on your website. Slideshow is the result of many trials in code attempting to create a javascript class that was lightweight, unobtrusive, a snap to setup (but also highly configurable), extendable and - built using the javascript framework with the best effects - visually very impressive.
code.google.com/p/slideshow/
|
WEBP IMAGES AND CONVERSION TOOLS
WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster.
WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index.
Lossless WebP supports transparency (also known as alpha channel) at a cost of just 22% additional bytes. For cases when lossy RGB compression is acceptable, lossy WebP also supports transparency, typically providing 3× smaller file sizes compared to PNG
developers.google.com/speed/webp/
|
On Line Tools
30 USEFUL REGULAR EXPRESSIONS TOOLS AND RESOURCES
A regular expression, also called regex or regexp for short, is simply a piece of code that matches a pattern.
Mastering regular expressions can be a difficult chore, and if you don't need them all of the time, the syntax is tricky enough to make the task frustrating or slow as you will constantly need to use a reference sheet.
In order to save you time, Ben Kuker compiled a list of PHP, Perl, and JavaScript regular expressions for common use cases that have been tested and are ready to go.
This isn't a regular expression tutorial or even a reference; you can think of it more as a cheatsheet for when you just need the regex but don't want to put a lot of time into relearning regular expressions.
30 tested php perl and javascript regular expressions
|
A DNS DISCOVERY TOOL
When you're transferring a site from one host to another this is a great tool for discovering a complete list of your DNS records if available and troubleshooting any issues.
If the records are not yet available, DNS propagation has not yet been completed fully.
Another useful tool is whatsmydns.net It checks DNS records around the world and shows them on a map
www.intodns.com
|
BULLETPROOF BACKGROUND IMAGES IN HTML EMAILS
Use rock-solid background images in your HTML email with some help from
VML and CSS.
This on line tool makes it one click easy.
backgrounds.cm
|
BULLETPROOF EMAIL BUTTONS
Design gorgeous buttons using progressively enhanced VML and CSS.
This tool makes it one click easy.
buttons.cm
|
COLOR SCHEME GENERATOR
An on-line color scheme generating utility.
www.colorschemer.com
|
CONVERT YOUR MYSQL CODE TO MYSQLI
No guarantees, but this on-line tool could help you save hours of aggravation.
seabreezecomputers.com/mysql2mysqli/
|
COUNT DOWN TIMER FOR YOUR SITE PAGES
Great countdown timer (and they've got a lot of other time related stuff too.)
Easy to customize using their on line form.
Multiple timers on a page
To implement into CMSB, replace the isoYYYY-MM-DDT00:00:00 code in the iframe with something like.
isoT00:00:00
Experiment with some of the other values in the iframe to change top padding, colors, etc. of the frame and text.
www.timeanddate.com/clocks/freecountdown.html
|
CROP OR EDIT AN IMAGE USING THE FREE PIXLR EXPRESS IMAGE EDITOR
With this free and fast on-line tool you, and your clients can easily crop and edit images before uploading them. I include it as a link in all my client's CMSB control panels.
Pixlr.com/express/
|
CROSS BROWSER TESTING OF YOUR SITE
Before you deliver your site to your client, you should test it in as many browsers as you can.
There are a number of fee based on-line testing services, but here's some free cross browser testing site that may come in handy.
http://browsershots.org/
browserling.com
|
CSS LAYOUT GENERATOR
This CSS generator will create a fluid or fixed width floated column layout, with up to 3 columns and with header and footer. Values can be specified in either pixels, ems or percentages.
www.csscreator.com
|
DETECT YOUR BROWSER SETTINGS
WhatIsMyBrowser.com makes it easy for you to find out all the interesting technical details about your web browser; most importantly: what browser are you using?
This makes it easy for your Tech Support team to help you fix your problems.
whatismybrowser.com
|
DISPLAY PDF DOCUMENTS ON YOUR WEB PAGE
iPaper by Scribd.com converts PDF documents into the Flash format, which can be displayed directly on your web pages. The service is free.
www.scribd.com/
|
E-MAIL SERVER BLACKLIST CHECK
This test will check a mail server IP address against 147 DNS based email blacklists. (Commonly called Realtime blacklist, DNSBL or RBL). If your mail server has been blacklisted, some email you send may not be delivered. Email blacklists are a common way of reducing spam.
http://www.mxtoolbox.com/blacklists.aspx
|
FAVICON GENERATOR
An on-line Favicon Generator.
tools.dynamicdrive.com
|
FIXING CSS ISSUES WHEN SENDING A WEB PAGE AS AN E-MAIL
Stack Overflow had a thread that listed the following inliner tools:
NOTE: These are all really written for HTML conversions and don't play well with PHP Code, so use at your own risk.
If anyone has a better solution, please EMAIL ME and I'll update this resource.
Campaign Monitor
Premailer
Inline Styler
Emogrifier
MailerMailer
Tikku
Mally
Zurb
And here is one that works in reverse (un-inlining your css)
CSS Out
Here's why you need to use them.
Some email clients strip out <head> and <style> tags from emails, so it's best to have your CSS written inline when sending web pages as emails.
It's a good idea to leave the CSS in the original <style> tag as a backup.
|
FONT COMPARING TOOL
The Typetester is an on-line application for comparing multiple fonts at one time. For each, you can change the typeface, color, background color, size, alignment, tracking, word space and other parameters. Its primary role is to make web designer’s life easier.
www.typetester.org
|
FREE PDF TO FLASH PAGE FLIP CONVERTER
There are many sophisticated software packages out there to create flip books from PDFs, as a quick search for "flip book software" will show.
Here's a free on-line conversion tool from CodeBox that may work for you.
www.codebox.es/pdf-to-flash-page-flip
|
FREE WEB DOWNTIME ALERTS FROM BINARY CANARY
BinaryCanary.com is a leading website and service monitoring service.
They detect website or service failures and issue alerts to specified contacts by email.
Their free service allows you to monitor up to 5 web sites every 15 minutes.
BinaryCanary.com
|
GRAPHIC WEB SITE USAGE ANALYSIS
Crazyegg generates a graphic representation of where visitors clicked on your site and how many clicked on each hotspot. You'll know what’s hot and what’s not, so you can make changes that matter.
CrazyEgg.com
|
HTML TABLE TO DIV CONVERTER
Transform traditional HTML Tables to Div Tables. Copy and convert any visual table document to Div tables with a simple click of a button.
divtable.com/converter
|
HTML, CSS, JS CLEANER CONVERT TABLES TO STRUCTURED <DIV> TAGS
This little set of gems will make quick work of cleaning up HTML, CSS, and JS Code.
But wait! there's more.
You can also use the HTML cleaner module to convert table layouts to use div tags by replacing your table tags with structured Div tags in one click
Granted it doesn't handle PHP very well, but most of the issues can be remedied with a quick search and replace.
Mostly it doesn't deal well with < and > tags and converts them into < , >:, , so it's a good idea to have your original PHP code handy to check.
Check it out, it can save you lots of time and frustration.
Here's their CSS Code for styling the divs, so you won't have to search for it.
.rTable {
display: table;
width: 100%;
}
.rTableRow {
display: table-row;
}
.rTableHeading {
display: table-header-group;
background-color: #ddd;
}
.rTableCell, .rTableHead {
display: table-cell;
padding: 3px 10px;
border: 1px solid #999999;
}
.rTableHeading {
display: table-header-group;
background-color: #ddd;
font-weight: bold;
}
.rTableFoot {
display: table-footer-group;
font-weight: bold;
background-color: #ddd;
}
.rTableBody {
display: table-row-group;
}
HTML CLEANER
|
ICON SEARCH TOOL
Iconfinder lets you search through thousands of icons (all in png format), making it easy to find that perfect (free) icon for your project.
iconshock.com
|
IS YOUR WEBSITE READY TO BE LAUNCHED?
Your one stop website checklist! Have you done everything you need before you launched your site? Are you SURE? Maybe you should check!
humaan.com/checklist/
|
JQUERY FORM BUILDER
According to the developer:
The right tool to build, download, then host forms on your own website, and done!
No subscription, no limitation! Just the way you like it.
A form designer helps you create ready-to-use professional, beautiful, and mobile-friendly web forms. Within minutes, you will have a fully functional web form that runs on your website; featuring field validations, email/sms notification to receiver and sender, picture choice, image/video, file upload, address autocomplete, multi-step, payments, conditional form logic, signature, SEO, google analytics, server side validation, field masking, reCaptcha, and localization. Each form has an admin panel to edit, view, and download form data in spreadsheet format.
According to Jerry Kornbluth:
The easiest and most flexible form builder I've ever used.
jqueryform.com/builder.php
|
LINK CHECKER - VALIDATE THE LINKS ON YOUR SITE AND MORE
Use this link validation tool and you'll never publish a dead link again.
search.google.com/search-console
|
MAIL TESTER
the guys from MailPoet and AcyMailing needed a cheap, simple and efficient way to quickly test the quality of our own newsletters.
They built on our own tool. Now they're sharing it for free via their web-interface and enable you to include our tests in your own app and whitelist our service by creating an account.
Simple but powerful.
mail-tester.com
|
META TAG ANALYZER, GENERATOR
Free service that analyzes the description, keyword and robot metatags on your site. They also offer a fee based submission service.
http://www.metatags.org/
|
MORE TIME SAVING AND-EDUCATIONAL RESOURCES FOR WEB DESIGNERS
Smashing Magazine has done it again with an overview of handy new resources for web designers; most of them were released recently, but some of them are a bit older.
Resources For Web Designers
|
ON-LINE TOOLS LIST
Luke, from Interactive Tools is convinced that this collection of 23 web apps is one of the very best of its kind. You'll find some very helpful online web designer's tools that can simplify a your work life and some that are just for fun.
www.smashingapps.com
|
PING.FM MAKES UPDATING YOUR SOCIAL NETWORKS A SNAP!
It's simple and it's free. Read more here
http://ping.fm/
|
ROBOTS.TXT ANALYZER
After you've created a robots.txt file with a tool like http://www.mcanerin.com/EN/search-engine/robots-txt.asp to hopefully exclude some of your folders from being indexed by search engines, here's a handy tool to check the code. Enter the url of the robots txt file and then enter some of the folder locations that you'd like to verify as disallowed. It's handy for catching those typos that haunt us all.
Robots.txt analyzer
|
ROBOTS.TXT GENERATOR
You can create your robots.txt file by hand in a text editor but it's much easier to use a tool like the one at mcanerin.com
Robots.txt Generator
|
SEE HOW YOUR SITES APPEAR TO THE REST OF THE WORLD
They've got advanced plans available but their free plan offers enough for most of us to get a good idea if our sites are propigating to the rest of the planet.
geopeeker.com
|
SEO TOOLS (FREE AND PAID)
These folks offer a wide array of free and paid SEO tools to SEO professionals and DIY webmasters.
Worth checking out.
SEOBOOK.COM
|
THE ULTIMATE GRADIENT GENERATOR
Here's a gradient generator that creates cross browser gradients that degrade nicely in non supporting browsers.
There's an in depth recipe in the Cookbook on USING CSS GRADIENTS AS PAGE BACKGROUNDS
www.colorzilla.com/gradient-editor
|
USE IMAGE COLORS TO CREATE A COLOR SCHEME
This on line app lets you easily pull colors from an image and create a color scheme.
www.colr.org
|
WEB PAGE COLOR TESTER
This neat site will let you test page background colors and textures, and font and link colors, and save both you and your client's a lot of time.
checkmycolours.com
|
WEWE WORDS MONITOR
Affectionately known as WeWe monitors, this family of tools measures whether the words on your client's web site talk mostly about their customers and their needs or about your client's themselves and their needs. It can be an eye opener for your clients and the nice thing is that you won't be the messenger that gets shot.
customerfocuscalculator.com
|
Programs
MYSQL DATABASE BACKUP
If you're looking for a more automated solution to backing up your MySQL databases then is offered in CMSB V1.34, you might want to take a look at Auto Backup for MySQL. It's a powerful Windows program that makes it easy to schedule the backing up and restoring of your remote and local MySQL databases, no matter what platform they're running on. According to the publisher, it's easy to backup one or many MySQL databases, and restore them to the same server, or to any server.
www.swordsky.com/
|
ANIMATED SCREEN CAPTURE TO GIF
This one is from Tim Forrest (www.toledoh.com.au ) and was posted on the CMSB Forum
He said: "LICEcap is a cool little app that lets you capture an area of your screen and take an animated gif screen shot. Great for explaining simple tasks to clients."
Example at: https://www.interactivetools.com/forum/forum-posts.php?postNum=2239210&download=quotemarks.gif
Cheers,
Tim Forrest
Toledoh Enterprises
www.toledoh.com.au
LICEcap
|
AUTOMATED CMSB INSTALLER UPDATER
According to user Sagenetic
You can use Package Foundry to make an automated installer that will do much of the work for you on the content, program installation, and program setup.
If you are going to to be doing this quite a bit, you may want to consider it. We have about 75 active installations of CMSB and many more planned, so using Package Foundry has helped a lot - especially with upgrades.
www.ioncube.com
|
BEST SCREEN CAPTURE UTILITY
Hypersnap is the best screen capture utility we've seen.
www.hyperionics.com
|
DIRECTORY PRINTING UTILITY (WIN)
If you’ve been looking for a great free utility that can print lists of files in a directory formatted the way you want them, try Karen’s Free Directory Printer
www.karenware.com
|
DOWNLOAD EXISTING WEB SITES
Use HTTTrack to download entire web sites to a local directory, recursively building all directories. HTTrack maintains the original site's relative link-structure. Great for working with clients that have an existing web site.
www.httrack.com
|
FREE WEBM VIDEO FORMAT CONVERTER
If converting your video files to keep up with the current standards has become a nightmare, here's one swiss-army-knife tool that might help.
Free-WebM-Video-Converter
|
JING - VIDEO SCREEN CAPTURE TOOL
A great tool (used by Interactive Tools) to create tutorials for your clients.
Select a window or region on your screen and Jing will record up to five minutes of video of everything that appears in that area. Point to things with your mouse, scroll, flip through photos, click around in a website or application...Jing captures it all. Jing can record your sparkling commentary at the same time.
www.jingproject.com
|
MAGIC TOOLBOX
A family of image display tools to make your site special, including:
Magic Zoom
Magic Zoom Plus
Magic Thumb
Magic Magnify Plus
Magic Magnify
Magic Touch
Magic Slideshow
Magic Scroll
Magic 360 Plus
Magic 360
Most are iPad and iPhone compatible
Check out their very well designed web site
MagicToolbox.com
|
MYSQL DATABASE ADMINISTRATION TOOL
Navicat - A MySQL database administration tool that makes importing data to, and exporting data from your on-line database, and many other data management tasks a breeze.
mysql.navicat.com
|
ON LINE PASSWORD MANAGEMENT
Account Manager by Site Interactive which controls access to password protected web pages like a member’s only area and manages user names and passwords. This program has a very simple user interface that allows an authorized individual to manage the password database for an organization and to easily authorize and remove a member’s access to controlled information. Instructions on how to get started are below. Their “lite” version is free.
siteinteractive.com
|
POP UP RULER FOR YOUR DESKTOP
The best popup ruler out there. Lots of neat features.
www.desktopruler.com
|
SHADOWBOX.JS
Shadowbox is a web-based media viewer application that supports all of the web's most popular media publishing formats. Shadowbox is written entirely in JavaScript and CSS and is highly customizable. Using Shadowbox, website authors can showcase a wide assortment of media in all major browsers without navigating users away from the linking page.
shadowbox-js.com
|
Scripting
FIND OUT WHAT’S CHANGED FROM ONE VERSION OF A FILE TO ANOTHER
Use Dave Edis’ favorite open source file compare tool.
winmerge.org
|
FREE DHTML AND JAVASCRIPT
The #1 place on the net to obtain free, original DHTML & Javascripts to enhance your web site.
www.dynamicdrive.com
|
Social Networking
PERSONAL PROFILE PAGE AGGREGATES CONTENT FROM AROUND THE WEB
With this custom profile & personal analytics dashboard you can quickly build your personal profile page that points users to your content from around the web.
about.me
|
SHARING WITH ADDTHIS
When you install AddThis on your site, your users have access to the most popular social networks and bookmarking destinations like Facebook, Twitter, Digg, and many more. New services are being added all the time, from international sites to helpful tools like translation and printing.
AddThis, a social network sharing tool, does the heavy lifting for you -- optimizing service selection, optimizing service icon sizes, maximizing speed while minimizing space, and providing industrial strength analytics. And now with the AddThis Toolbox, you can customize your own sharing menu and still enjoy the benefits of using the AddThis platform.
www.addthis.com
|
Tutorials
10 JQUERY SNIPPETS FOR EFFICIENT DEVELOPERS
The folks at Interactive Tools love jQuery. Here's a list of 10 jQuery snippets to help you be a little more efficient.
10-jquery-snippets-for-efficient-developers
|
ABOUT PODCASTING
A comprehensive podcasting resource detailing everything you need to know about Podcasting.
www.podcasting-tools.com
|
ANDROID APP DESIGN
Here's a web site devoted exclusively to designing Apps for the Android platform.
developer.android.com/design/index.html
|
CREATE BEAUTIFUL CSS3 TYPOGRAPHY
It has been suggested that beautiful and usable websites are created on a foundation of beautiful and usable typography. Fortunately, CSS offers a variety of styling options that allow you a great deal of control over how your present your content to your viewers and users. Here's how.
/blog.echoenduring.com/2010/05/13/create-beautiful-css3-typography/
|
CREATING WEB PAGE BACKGROUNDS
Background images are one of those visual elements that when designed well, can create an amazing atmosphere and convey the style the designer has chosen. here are some great tutorials for creating that perfect web page background.
www.noupe.com
|
CSS SHORTHAND
You can cut back on the amount of CSS declarations and clutter. T This article gives you an in depth look at 20 CSS shorthand properties that will most certainly come in handy.
www.webhostingsearch.com
|
CSS TABLE DESIGNS
Tables have got to be one of the most difficult objects to style in the Web, thanks to the cryptic markup, the amount of detail we have to take care of, and lack of browser compatibility. A lot of time could be wasted on a single table although it’s just a simple one. This is where this article comes in handy. It will show you ten most easily implemented CSS table designs so you can style your tables in a zap!
www.smashingmagazine.com
|
CSSGLOBE
The site has interesting ideas and recipes and is worth the read.
www.cssglobe.com
|
HTML5 STYLE GUIDE
The site is well worth a look. There are many articles about using HTML5 and converting old sites
HTML5 Style Guide
|
HTMLGOODIES MASTER LIST
Looking for a specific article on HTMLGoodies.com? Here's a master list of all topics covered.
www.htmlgoodies.com
|
IE ANOMALIES GETTING YOU DOWN?
Layouts not coming out just the way you intended? Cross browser issues making you tear your hair out? Here are some quick tips on how to avoid easy pitfalls when creating your CSS layout.
www.noupe.com
|
IMPROVING THE USER EXPERIENCE
Smashing Magazine has done it again. Here are 10 useful usability findings and guidelines that may help you improve the user experience on your websites.
www.smashingmagazine.com
|
LEARN ABOUT JQUERY
10 visual tutorials intended for web designers and newbies on how to apply Javascript effects with jQuery, a "write less, do more" Javascript library.
www.webdesignerwall.com
|
O'REILLY MEDIA - EBOOKS AND MORE
O'Reilly Media spreads the knowledge of innovators through its books, online services, magazines, research, and conferences.
oreilly.com
|
SUB-CATEGORIES TUTORIAL
Let's say you want to organize a bunch of articles into categories and sub-categories. In the end, you want a list of all your categories displayed on your site, and when users click on these categories, they'll see a list of all the articles belonging to that category. Of course, everything will also need to dynamically update as you change your categories and articles from within CMS Builder. Chris from Interactive Tools shows us how.
www.interactivetools.com/forum/gforum.cgi?post=77230#77230
|
THE BUSNESS OF WEB DESIGN
Becoming a freelance web designer takes quite a bit of talent, business savvy, commitment, and time. With all there is to consider when becoming self-employed, one can become overwhelmed — enough to deter themselves from trying at all.
This guide is meant to act as not only a step-by-step guide, but also as a checklist for those who have already started their career. Hopefully this guide can cover many of the important aspects of becoming a professional and freelance web designer, from business aspect and working with clients, to creating an effective portfolio and advertising one’s work.
www.smashingmagazine.com
|
THE WEB DESIGNER'S GUIDE TO FONT REPLACEMENT METHODS
Fed-up with Arial? Tired of Times New Roman? Font-replacement methods have improved dramatically over the past 2 years, but it 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.
webdesign.tutsplus.com
|
TOP 20 PHOTOSHOP TUTORIAL WEBSITES
Yet another top 20 Photoshop Tutorial Website.
Template Monster
|
VIDEO BIT RATE PRIMER
A scenario you might be familiar with is that you have filmed and edited your content into a package that meets your needs, but once you go to view your video on your website it takes forever to load or the video stutters during playback. This problem is not necessarily a bad encoding, but it could be the result of not encoding your video to a targeted connection speed.
This article looks at some ways to determine a workable solution.
ttp://www.ezs3.com
|
Web Design
10 USEFUL .HTACCESS SNIPPETS TO HAVE IN YOUR TOOLBOX
.htaccess, the file which control the Apache webserver, is very useful and allows you to do a lot of things. In this article, they have compiled 10 .htaccess snippets that any web developer should have in his toolbox.
catswhocode.com
|
BUILD YOUR WEBSITE BASED ON EVIDENCE, NOT FALSE BELIEFS!
UX Myths collects the most frequent user experience misconceptions and explains why they don't hold true. And you don't have to take our word for it, we'll show you a lot of research findings and articles by design and usability gurus.
uxmyths.com/
|
HOW A WEB DESIGN GOES STRAIGHT TO HELL.
This is a little bit of a humorous piece, but if you're in the business of designing websites I think you'll be able to relate.
theoatmeal.com
|
HOW TO "SMASH" WEB SITE COMPLEXITY
A complex interface can disorient the user in a mild case and completely alienate them in an extreme case. But if you take measures first to reduce actual complexity and then to minimize perceived complexity, the user will be rewarded with a gratifying experience. Smashing Magazine does it again with an interesting How To" smash" complexity.
www.smashingmagazine.com
|
HTML EMAIL TEMPLATES
If you're looking for a new HTML email template to use for your email campaigns, Campaign Monitor has created a set of 30 free HTML email templates, tested to work in the most popular email clients: Gmail, Outlook, Hotmail, Apple Mail, and many more.
www.campaignmonitor.com
|
IDENTIFY COLORS ON A WEB SITE
Colorzilla, a Firefox addin makes it easy for you to point to any color on a webpage and return the exact color in any of the standard formats. You can even zoom in on a webpage by as much as 1000% to pinpoint the exact color you want.
www.colorzilla.com
|
RESETS, WHEN WHERE AND HOW TO USE THEM.
Every browser has its own default ‘user agent’ stylesheet, that it uses to make unstyled websites appear more legible. For example, most browsers by default make links blue and visited links purple, give tables a certain amount of border and padding, apply variable font-sizes to H1, H2, H3 etc. and a certain amount of padding to almost everything. Ever wondered why Submit buttons look different in every browser?
Obviously this creates a certain amount of headaches for CSS authors.
Using a CSS Reset, CSS authors can force every browser to have all its styles reset to null, thus avoiding cross-browser differences as much as possible.
This site presents some of the mosty popular reset style sheets and talks about when to use all or parts of them.
CSS Reset.com
|
RETRO WEB DESIGNS
Retro and vintage web designs have become increasingly popular. Ironically, the more and more the web progresses, the more designers are reverting back to old retro styles. For your design inspiration, here are 40 beautifully-designed websites that revert back in time to retro and vintage styles.
www.sixrevisions.com
|
THE WORST WEB DESIGNS EVER
Looking at bad web site design is valuable because it give us the opportunity to learn from other people's mistakes without having to make them ourselves. These sites are some of the worst ever.
www.webpagesthatsuck.com
|
VINTAGE PHOTOSHOP BRUSHES
Vintage designs have gotten very popular over the past years, and it seems the trend keeps on going.
Here, you’ll find 20 vintage Photoshop brushes you can download for free. There are over 300 individual vintage brushes here, so you will have a broad choice of brushes to apply onto your designs.
www.sixrevisions.com
|
WEB DESIGN CHECKLIST
Designing websites can be a long and complicated process. Dealing with clients, designing prototypes, coding, programming, and testing – there’s a lot to keep track of and a lot to make sure gets done. That’s where checklists can make your life a whole lot easier. With lists of points covering multiple areas from content to usability to accessibility to standards, you’re a lot less likely to overlook important parts of a site.
www.smashingmagazine.com
|
WEB DESIGN DO'S AND DON'TS
This site lists their 20 Do’s and Don’ts of Effective Web Design. Yes, I know everybody offers their best web design tips, but this one's worth the read.
webdesignledger.com
|
Web Templates
WEB TEMPLATES FOR MANY PURPOSES
If you do a little digging, Creative Can turns out to be a really interesting resource for web templates (both mobile and fixed) as well as for many graphic design element resources. Check it out.
creativecan.com
|
