Part 5 of the code snippets series sees us take a look at more handy pieces of html, css, javascript and other usefull things to a web designer …
Web Project Framework - The ESWAT web project framework is a kit that contains a folder structure and some pre-written components that I use whenever I start off a new web project
SwfIR - Using the dark arts of JavaScript and Flash, swfIR gives you the ability to apply an assortment of visual effects to any or all images on your website
Sexy Buttons with CSS - This tutorial will teach you how to create pretty looking textual buttons (with alternate pressed state) using CSS
Uni-Form - Uni-Form is an attempt to standardize form markup (xhtml) and css, “modularize” it, so even people with only basic knowledge of these technologies can get nice looking, well structured, highly customizable, semantic, accessible and usable forms
PNG Overlay - Basically, it involves creating a transparent PNG overlay which can be used as a mask / frame around regular JPEG or GIF. This way, a typical CMS installation can be configured so users can upload photos without having to worry about using any graphics program to apply filters
CSS-Based Form Template - Provided here is a flexible, semantically correct, and dare I say, accessible form template
CSS Cheat Sheet - All the CSS properties at a glance
New Clearing Method for IE7 - The easy clearing method described at Position Is Everything uses that to create a very convenient way of clearing floats without having to add extra markup. Unless I’m wrong that method will not work in IE7, since the box model bug was fixed in the original IE7 Beta 2 Preview
10 Free CSS and Javascript Calendars - Calendars may be used on webpages for various reasons, such as allowing users to easily pick a date in a form, or just to provide monthly information. Here are a list of various css and javascript calendars for use on your site
10 Free CSS Graph Resources - Often in web-based applications, developers want to be able to display on the fly graphs. Here are 10 CSS Generators or Techniques that may help you in generating CSS graphs
Master Stylesheet - One of the most common mistakes I see beginners and intermediates fall victim to when it comes to CSS is not removing the default browser styling
Grid Calculator - Change the settings (by dragging the sliders, clicking on the bars, or editing the values) to calculate the overall width of your grid
Subtraction - It’s been about a year now since I first started thinking about creating some kind of definitive documentation about my approach to designing for the Web with the typographic grid as my primary layout tool
101 CSS Resources - All the cool kids are using CSS to separate content from appearance on their sites. Here is 101 resources that will get your feet wet with CSS
CSS Boxes with Outside Frame (Rounded or Not) - The designer I work with wanted to have a site with information inside boxes. He also said that there would be a lot of boxes of variable height and width. More to that, the boxes needed to have a custom border all around and both the bottom side and the left one of the box would have a shadow that would be positioned above a random pattern
Ajaxian - JavaScript Round Corners with Drop Shadow
Heat Map - ClickHeat is a visual heatmap of clicks on a HTML page, showing hot and cold click zones
Ajax Poll Script - Download this Ajax script for creating a poll on your site
Ajax Load - Create your own animated gifs to indicate Ajax activity on your site
Ajaxian - Dynamic Right Click Context Menu
Plotr - I came across PlotKit, a well written piece of javascript that enables developers to use Canvas or SVG elements for rendering bar, line and pie charts. The only thing was that PlotKit needed the Mochikit library to work. So I took some parts of PlotKit and wrote some parts myself. The result is a lightweight charting framework (12kb!) named Plotr
Simple PHP randomizer - Display list items randomized
CSS Solid block menu - This is a lean, professional looking CSS menu that’s draped in a solid two color background image
8 Web Menus - I will show you some great examples in this posting which I hope you will enjoy and use on your websites. Some of them are built by me while other have credits but are free to use
CSS Link Backgrounds - Offering in-line external link backgrounds is challenging, especially getting them to work and look right with Internet Explorer 6. I decided to try it for myself to see what the fuss was all about
Possessing huge potential the online home based business is getting more and more attractiveness in the world. The business of webhosting firms is increasing with the increase in business sites. One should get through a proper hosting guide in order to have enough knowledge about recommended servers and hosting plans. These guides also enable the reader to choose the firms having insurance of their servers and company. Internet also provides the facility of online training and one can get Microsoft certification through online learning as well.
Here’s my 5 cents: for AJAX code search you should take a look to http://www.miniajax.com
+
How about doing a piece on mapping/ google maps and locations.
You could start with the ever so useful Link http://DigiLondon.com
[...] im TutorialBlog gibt es einen Artikel mit Links zu 25 Code Schnippeln die jeder Web Designer sich einmal angucken [...]
[...] 25 Code Snippets FILED UNDER Code Resources HAS Leave a Comment [...]
[...] Here are a list of various css and javascript calendars for use on your site Red more at TutorialBlog Tags:basic knowledge calendars cheat sheet cms code snippets css properties designers web graphics [...]
I like this all a lot. Swfir is useful, except for the whole elastic header image thing. Just so everyone knows, you don’t need javascript to do an elastic header image. As a matter of fact, you can make it so that all images on your page resize along with the text. All you have to do is use relative sizing units (such as em) in your css to size your images. If your image sizes are set in css in relative units, your images will resize relative to the text, which makes for fully zooming web sites. It’s a neat css trick that is fully standards compliant and requires no javascript whatsoever! Check out my site to see an example.
-=Rob Snyder=-
great tips and tools. wished i would’ve found this earlier. keep em coming
[...] html, javascript, Ajax and widgets that you can use on on your website or blog (Part 5) …..read more | digg [...]
[...] http://tutorialblog.org/25-code-snippets-for-web-designers-part5/ [...]
great list !
thanks !
Check out this live chat, instant messenger aggregater, and stats system. It also works directly with Skype. Coolest script I have seen.
http://www.chatstat.com
[...] read more | digg story [...]
[...] Snippets every Good Designer Should See Filed under: Uncategorized — recar @ 5:06 am 25 Killer Code Snippets every Good Designer Should See Round up 25 of the Best CSS, scripts, html, javascript, Ajax and widgets that you can use on on [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: css webdesign snippets) [...]
[...] read more | digg story [...]
[...] to del.icio.us I found 25 Code Snippets for Web Designers which has some really useful and interesting links, including a great presentation on designing for [...]
[...] Magazina “30 skripti za galerije” i još dva odlična sa Tutorialbloga - “25 Code Snippets for Web Designers (Part 5)” i besplatni Photoshop pluginovi. Evo i mali podsjetnik na Tutorial o CSS listama. Za kraj [...]
[...] 25 Code Snippets (Part 5) From TutorialBlog, 25 Code Snippets (Part 5!) [...]
[...] read more | digg story [...]
[...] read more | digg story [...]
[...] 18, 2007 at 10:00 am · Filed under Web » 25 Code Snippets for Web Designers (Part5): very [...]
Amazing, good job. Thanks
[...] code snippets css cheat sheet [...]
» 25 Code Snippets for Web Designers (Part5)
Part 5 of the code snippets series sees us take a look at more handy pieces of html, css, javascript and other usefull things to a web designer …
[...] read more | digg story [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: css webdesign) [...]
[...] http://tutorialblog.org/25-code-snippets-for-web-designers-part5/ [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: web design css) [...]
[...] » 25 Code Snippets for Web Designers (Part5) [...]
[...] 25 Killer Code Snippets every Good Designer Should See [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: CSS WebDesign Javascript design snippets code resources) [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: css webdesign javascript design code snippets resources useful web ajax) [...]
[...] 25 Code Snippets for Web Designers (Part5) (tags: internet) [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: webdesign css snippets javascript design) [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: CSS WebDesign Javascript design snippets code resources) [...]
Thanks! Great resources!
[...] read more | digg story [...]
en http://www.coralweb.com.ar hay un efecto muy interesante que simula la frialdad del metal, esta logrado en baja escala y en blancos y negros
[...] digg.com the other day which has a few handy things for anyone who does a lot of things with CSS (Link). There is so cool javascript/CSS calandars, some IE 7 work arounds, and a couple of other [...]
[...] » 25 Code Snippets for Web Designers (Part5) [...]
[...] » 25 Code Snippets for Web Designers (Part5) » 25 Code Snippets for Web Designers (tags: webdesign resources reference) [...]
[...] » 25 Code Snippets for Web Designers (Part5) (tags: Web_Design) [...]
[...] 25 Code Snippets for Web Designers (Part5) Part 5 of the code snippets series sees us take a look at more handy pieces of html, css, javascript and other usefull things to a web designer (tags: AJAX applications calendar code CSS design development graphics HowTo javascript lists programming reference resources scripting scripts snippets tips tools tricks tutorials WebDesign WebDev webmaster website widgets work) [...]
[...] fun, general dnt knw whether i hav given this link already but seems very useful link.. go for it >> No Comments so far Leave a comment RSS feed for comments on this post. TrackBack URI [...]
[...] 25 ترÙÙد بر&Osla… - [...]
[...] To read :http://tutorialblog.org/25-code-snippets-for-web-designers-part5/ [...]
Fantastic resource for coders and designers. Thanks for this useful compilation!
[...] Link: Tutorial Blog [...]
ff
excellent work, resources are great such as this list keep searching for more.
[...] read more | digg story [...]
Hello! Good Site! Thanks you! kzgfhkxwyefpa
[...] quanto riguarda le liste di risorse, segnalo le recenti Best of April 2007 su Smashing Magazine e 25 code snippets for web designer (part 5) su TutorialBlog. E sempre su TutorialBlog, merita una giretto la raccolta di Free PhotoshopPlugins. [...]
thanks for very good resources! it was very useful
awesome!!!!!!!!!!!!!!!!!!!!!!!!good job
[...] Turn google into your own free napster Massive list of sites all self learners should know about! So neighbors steal your wi-fi net access, kill the connection or have fun Need a Windows XP key? Google can help! 53 CSS-Techniques You Couldn’t Live Without Convert Everything Hack Lets You Access Pay Sites Free by Disguising Your Browser as GoogleBot The cost of leaving your PC on 15 coolest firefox tricks ever Tips on how to not get busted for file-sharing I want a Firefox Extension to … Linux - Avoid ATI Video Cards 10 Reasons Why It Doesn’t Pay To Be “The Computer Guy” Default Password List Why are geeks often atheist? Turn Off Unnecessary Windows XP Services Nine Inch Nails Releases Tracks on The Pirate Bay Stuck trying to design your website? btjunkie - the largest bittorrent search engine Worried about the airline losing your luggage? No problem. Just pack a gun. How to find fake torrents uploaded by the MPAA The 46 Best-ever Freeware Utilities How the US National Security Agency access was built into Windows Ultimate List of over 150 (!) Free Windows Software from Microsoft Top 15 Signs You’re Addicted to Digg Never Deal with Automated Phone Support Again… Top 10 Firefox Extensions to Improve your Productivity Forget YouTube: Go To These Sites If You Want Hard Core Copyright Content Drug dealers versus geeks. Simple hack lets you view all comments on a PRIVATE Myspace profile 10 Reasons I Didn’t Start a MySpace Account 13 Things to do immediately after installing Ubuntu Top Ten Geek Quotes…plus more The Fastest Windows Password Cracker 50 Common Interview Questions 25 Killer Code Snippets Every Good Web Designer Should See Build your own server IP -Tracing…find anyone How to easily tell if you are being lied to 50 Beautiful CSS-Based Web-Designs in 2006 Firefox Extension: Smart Digg Button Courtesy Digg API 8 Things Employers Need to Know About Geeks and Intelligent People The 7 deadly sins of resumé design Gmail Craze: 30 + Tools and Hacks for Gmail Simply Google - all of Google’s hidden features in one webpage! How I’d Hack Your Weak Passwords Ultimate boot CD Gaim is now Pidgin! Thorough C++ Tutorial for Noobs LifeHacker’s Top 10: USB thumb drive tricks The 15 minute Windows XP tune-up Hacking Firefox: The secrets of about:config I Want a Freeware Utility to…450+ Common Problems Solved How To Escape Professional Handcuffs How To Hack a Windows XP Admin Password Do I need the processes running on my PC? 685 of the best programming links How To Crack 128-bit Wireless Networks In 60 Seconds [inc Video] iTunes versus Pirating 32 Reasons Nearly All Geeks are Severely Underpaid Inside Newegg’s HUGE Los Angeles Warehouse Turn your $60 router into a $600 router, FOR FREE! USB flash drive that steals passwords in seconds Top Firefox 2 config tweaks Want a faster Windows XP? Here’s how! 83 Beautiful Wordpress Themes You (Probably) Haven’t Seen 20 must-have Firefox extensions The (only) Ten Things to Know About CSS Carry a PC Repair System on a USB Drive Army Forbids Troops From Blogging Digg Enters Top 20 (Most Visted Sites) In Alexa Rankings Digg.com Decreases Work Productivity by 43% Look At All These Passwords! What’s taking up my hard disk space? Awesome FOSS app will show you! Top 10 Web Tools For College Students The Megapixel Myth - You’re getting ripped off. 20 Things the average person may not know about XP Choose a programming language: The Best ever guide produced to date! Hacking Into Almost Any Windows XP Machine, With Just A Few Tricks. Gallery of stunning digital photography with tutorials 15 Javascript Snippets You Can’t Live Without Top 20 replies by Programmers to Testers when their programs don’t work Did you know these basic Firefox Tips? Top 10 Signs You May Be Charging Too Little Wanna find a linux equivalent to a windows app!? Mozilla Firefox Cheat Sheet One man writes Linux drivers for 352 USB web-cams 112 Windows Run Commands How to become a web designer 71 CSS Menus for free Why Can’t Programmers.. Program? Hack Attack: One-click DVD rips MyIPNeighbors - Find Out Who Else is Hosted on Your Site’s IP Address 16 Hidden Windows XP Goodies Things to Say When You’re Losing a Technical Argument No, I can’t fix your computer! 15 free security programs that work 10 things you should never buy new 30 Stunning One-Page Websites You Should See How To Write Unmaintainable Code How to hack network passwords in 13 steps A Handy Little CSS Cheat Sheet How to reduce the memory usage on Firefox? iTunes + Netflix = Cancel Cable? DiggStatus - How do you compare to the rest of the Digg community? Firefox Hack- Pasting multiple lines into input boxes 1043 programming exercises Top 10 Gmail tips and hacks 30 Stunning Websites Every Designer Should See YOU’RE BEING TRACKED in Firefox 2.0 - how to disable 3rd party cookies The Ultimate Search Engine For Programmers 281 of the best system administration tools Serenity: First HD-DVD Movie Leaked Onto BitTorrent What does the hot girl at the party think of your programming language? The Ultimate WGA Bypass - Bypass any WGA infested product. List of 300+ proxy sites which let you surf any site Safari Browser. The Ultimate Porn Browser. Top 10 Most Common Passwords CSS layouts “for those who want to start a css-driven website quick” How to login to an expired Windows The 15 Best Places to Waste Time on the Web This is How We Catch You Downloading Tutorials Round-Up: Ajax, CSS, JavaScript, PHP, MySQL and Much More 12 Basic CSS Templates Retrieve Serial Numbers or CD Keys from your computer 40+ Ways to Make Money on the Internet Podcasts, that will help you to learn foreign languages Everything you ever wanted to know about video codecs. The Best Place To Hide Money: Conversation With A Burglar 9 Bittorrent How-to’s Ultimate programmer’s reference - QuickRef.org launches 30 Essential Open Source Software Packages for Windows Tools for WEB DESIGNERS 25 Killer Code Snippets every Good Designer Should See [...]
some lovely techniques linked in, cheers
NICE JOB!!!
[...] html, javascript, Ajax and widgets that you can use on on your website or blog (Part 5) …..read more | digg story Posted by kamal Filed in [...]
[...] read more | digg story [...]
Hi visit my site
http://www.codepal.co.nr
[...] 25 Killer Code Snippets every Good Designer Should See [...]
bocnoeltacco
I thought this might be useful to those looking for a CSS Button solution: http://www.cssbuttons.net
Fantastic post, thank you
[...] Expert Ideas, 10 CSS, 13 Styles CSS Menus, 100 css tools, A CSS Sticky Footer, 25 Code Snippets for Web, 2-col tableless layout, 24 Ways, CSS Best Practices, All CSS Properties, 15 CSS Properties, [...]