.
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 current as of Jan, 2011.
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, concepts, 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/
|
MAKE YOUR WEB SITE MOBILE FRIENLY
Making sure your website is mobile phone friendly should be a priority for any business that wants to be found on the mobile web.
Read more about how to make your website mobile friendly in this article
http://www.blogstorm.co.uk/how-to-make-your-website-mobile-friendly/
|
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
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
|
REGULAR EXPRESSIONS FOR FORMAT VALIDATION
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.
37-tested-php-perl-and-javascript-regular-expressions
|
SEO CHEAT SHEET
A down-loadable SEO cheat sheet and other SEO information.
www.seomoz.org
|
VIDEO FORMATS ACCEPTED BY UPLOAD SITES
Sharing videos on the Web is hot! But perhaps you're getting confused by the increasing number of video sharing sites and can't figure out what's best. Well, don't worry. Movavi has done the hard work for you.
The file formats accepted differ from site to site - some even recommend a particular video format and resolution to achieve the best online quality. In their chart, you'll find the required formats and characteristics for each site.
www.movavi.com
|
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 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
|
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
|
Graphics Design
100 BEST SITES FOR GRAPHIC DESIGNERS
Here's an article by GraphicDesignClasses.net highlighting the 100 Best Sites for Graphic Designers. It's an interesting collection of sites to improve your skills, maximize your efficiency, and draw ideas from.
According to the publisher, "These final 100 sites were selected after a lengthy nomination period and were included based on a variety of factors including their creativity, quality of information, use for graphic design students and professionals, and overall adherence to design principals."
graphicdesignclasses.net/graphic-greatness/
|
Images
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/
|
Mobile Site Design
10 TIPS FOR BETTER MOBILE SITE DESIGN
Keegan Street's take on better mobile design.
He says: There are two factors that make this a necessity. First, mobile device screens are so small that you really need to utilise all of the available space. Second, there are a lot of different screen resolutions out there.
labs.thesedays.com/blog
|
On Line Tools
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
|
COLOR SCHEME GENERATOR
An on-line color scheme generating utility.
www.colorschemer.com
|
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
|
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
|
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
|
HTLM ENCYCLOPEDIA
According to the site's author David Merchant, "These pages were created to serve a selfish need: with continual evolution of HTML specs, browser compliance, and browser extensions, it was hard for me to keep up and remember all the changes. I found most tutorials to use dead examples which did not show me how the tag actually worked. These pages were designed to help me remember what I learned and as a way to test a tag to see if and how it was being rendered by a browser. Thus, these pages are meant to supplement or compliment a good tutorial. These pages will evolve as I learn more.
Every Example Page will have a HTML Practice Window button. Click this button to open a separate second window where you can practice HTML coding in. Enter HTML coding or cut and paste and alter HTML coding from the Example page into the top frame. Click on the "Show" button to see the result in the bottom frame. The "Clear Input" button clears the top frame, the "Clear Output" button clears the HTML coding results from the bottom frame, and the "Clear All" button clears both. The window is resizeable. If your browser doesn't support frames or JavaScript you will not be able to use the HTML Practice Window."
www.mountaindragon.com
|
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.
www.iconfinder.net
|
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!
launchlist.net/
|
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
|
SENDING WEB PAGES BY EMAIL
If you're a PC user you can send (most) web pages by email using the File >Send > Page By Email function, and there are similar functions in some other browsers and even some for Mac users.
However, these solutions are a bit spotty and have other issues that make EmailTheWeb.com an interesting (mostly perfect) option.
According to the creators, EmailTheWeb.com is the only web-based service that allows you to email any web page to any one.
All that's required is a Google account and you're good to go with their free or paid service options.
Check it out. It may solve some of your communications issues.
www.emailtheweb.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.
www.imagitek.com/bcs.html
|
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.
www.futurenowinc.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/
|
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
|
FORMS TO GO
In my search I found a candidate for converting any existing form to use PHP in order to keep prying eyes away from private information. The program is Forms to Go from BeboSoft You can easily set up multiple recipients, base those recipients on the content of another field, validate CAPTCHA entries, upload files to a server, populate a database with form results and lots more. While they charge $30, the flexibility the program offered seemed well worth it to me.
One note: to change the CAPTCHA to be case insensitive, in your generated php file, change $FTGverify = DoStripSlashes( $_POST['verify'] ); to $FTGverify = strtoupper(DoStripSlashes( $_POST['verify']) ); (if your captcha field is called something other than 'verify', search for and change that code). You'll have to do that each time you regenerate the php file.
www.bebosoft.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 EMAIL LIST MANAGEMENT
EasyList by Focal Media facilitates the creation and management of an opt in e-mail list. The process of being added to or removed from the e-mail list is automatic and protects participants from unwanted sign-ups by requiring a response to a confirmation e-mail before sign up is complete. Authorized individuals can manually add or remove e-mail addresses from the list. The program is free to download and install. Registration is currently $35
www.focalmedia.net
|
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
|
VALIDATE THE LINKS ON YOUR SITE
Use this link validation tool and you'll never publish a dead link again.
http://lithopssoft.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
|
USING THE ECHO COMMENTING SYSTEM
Echo is... the next generation commenting system. It’s the way to share your content, and watch the live reaction. You can quickly embed Echo on WordPress, Blogger, or any website and turn your static pages into a real-time stream of diggs, tweets, comments and more.
js-kit.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
|
BETTER FORM FIELD HINTS
By using a little CSS and JavaScript, instead of the input hints always showing next to each field and cluttering your form, only the hint for the currently focused input will show.
www.askthecssguy.com
|
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 ELEMENTS AND CSS3 RULES
HTML5 Please offers a dynamic updated list of HTML5 elements and CSS 3 rules with an overview of browser support and any polyfills for each element listed. The creators of the site then go a step further and offer recommendations, “so you can decide if and how to put each of these features to use.”
The goal is to help you “use the new and shiny responsibly.”
The site is well worth a look.
HTML5 Please
|
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
|
TOP 10 PHOTOSHOP TUTORIAL WEBSITES
Yet another top 10 Photoshop Tutorial Websites.
www.outlawdesignblog.com
|
USING SIFR FOR NON STANDARD FONT RENDERING
sIFR (or Scalable Inman Flash Replacement) allows you to use custom typography on your site by utilizing JavaScript, Flash, and CSS. While most people simply create images when they need a custom-type title, sIFR can dynamically create short text blocks using whatever font you want (while still rendering the text with a default font on non-Flash browsers). Here's the story...
www.wakeuplater.com
|
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
|
MOUSTACHE BUTTON GRAPHICS (SERIOUSLY)
Andrea thought the moustache craze needed some realism so here’s a set of buttons made of skin and hair. Useless? Maybe. Hilarious and beautiful? You betcha! (Her comment, not mine)
Moustache Buttons
|
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 HANDPICKED JQUERY PLUGINS REPOSITORY
The Handpicked jQuery Plugins Repository is a carefully selected roundup of some of the best jQuery Plugins ever released.
iwantaneff.in/repo/
|
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
|
