Categories
Introduction
01. Creativity
02. CSS techniques and examples
02 a. CSS techniques03. Web design
02 b. Tabs & Navigation Menus
02 c. CSS- & HTML-Web-Tools
02 d. CSS/HTML-Specifications
02 e. Other useful Web-Tools
03 a. Written & unwritten rules04. Ajax Applications
03 b. Color Tools, Mixers etc.
03 c. Web Design magazines
03 d. Royalty free photos
05. Usability
06. Blogging Tools
07. Freelancers resources
08. Search engines & SEO
09. Other catalogs
10. Bookmarks: Maxi version
11. bookmarks: "pocket" edition
Submit a link
Support the project
Archive
Legend
new link
my personal favourite
english
german
russian
spanish
Where am I?..
You are visiting a list of essential web-sites, tutorials, references and examples (related to CSS Navigation Menus, CSS- & HTML-Techniques, Layouts, Accessibility, Usability, Search Engine Optimization (SEO) etc.), which make the life of web developers easier.
The list includes over 730 manually selected resources, is updated weekly and is compiled by Vitaly Friedman.
Submit your link
Fill out the form to submit a site for web-dev-bookmarks. You do not have to be the designer or owner of the site, it could be any site on the web. It is OK to submit your own site. Submit a link
Who is Vitaly Friedman?
Vitaly Friedman is a freelancing web designer from Saarbruecken, Germany, who creates simple, accessible and user-friendly web design. emm... so?
XML Feeds
Syndicate Web-Dev-Bookmarks (RSS) (updated once a week)
Donate
This web-site is being updated and edited by vitaly.friedman, prompted only by his motivation and his passion for web-development. If you appreciate his work and would like to support the project, you are welcome to donate money via Paypal (using a credit card, bank account, or existing Paypal balance).

» Web design & Web-development
updated/MondaySeptember19th
- "Not Found" Is Not An Option: Error Handling and User Experience
- 10 Big Myths about copyright explained
- 100 Do's and Don'ts in Web Design
- 11 Ways to Improve Landing Pages
- Abbreviations, Acronyms, and Shortened Words an interesting outlook on and
- Abbreviations, acronyms and definitions @ Maxdesign
- Accessible HTML/XHTML Forms and other tutorials provided by Webstandards.org
- All about fonts for captioning and subtitling: screenfonts are important because, in captioning and subtitling, our instrument is typography
- Basics of search engine optimisation @ 456bereastreet
- Bring on the tables: something that often seems to confuse people that are new to CSS-based layouts is the use of tables. It's important to remember that tables are still perfectly fine to use - if used correctly.
- CSS3 Color Module
- Designline - A Design Timeline: ...I have often wondered what it would be like to see a web site design progress from start to finish, with each tweak and change being shown as it progresses—a design timeline, if you will...
- Developing With Web Standards: Recommendations and best practices by Roger Johansson.
- Eight things I wish I'd known when I started: Details a great designer maketh. There’s a point at which quality becomes too costly. Find that point with every project. Communicate, don’t decorate.
- Five Critical (and Overlooked) Design Elements
- How To Nail A Sexy Layout
- mezzoblue Markup Guide
- Seybold Seminars: why tables for layout is stupid: problems defined, solutions offered
- Steadfast Suggestions for Web Design
- On separating style and behaviour - The KuraFire Network
- Open Source Web Development Tutorials
- Paul Graham. Taste for Makers: Good design is simple, timeless, solves the right problem, is suggestive, often slightly funny and looks easy.
- Rapid Web Development and Testing with Mozilla Firefox
- Site Design Tips to Improve Your Sales
- Standards and Accessibility - navigation lists : Do Standards- based menus help accessibility?
- Successful Web Development Methodologies [Site Planning]
- Ten CSS tricks you might not know
- The Principles of (Web) Design @ DigitalWeb
- The Web Standards Project
- The Well-Designed Weblogs series is a subjective and non-scientific selection of usable and readable weblogs. Look. Read. Be inspired.
- TripleColors: Guide to Official HTML Color Codes
- Transparent custom corners and borders @ 456bereastreet.com
- UI Patterns and Techniques are intended to be read by people who have some knowledge of UI design concepts and terminology: dialogs, selection, combo boxes, navigation bars, whitespace, branding, and so on. Some common techniques are described here to encourage their use in other contexts - for instance, desktop apps could make better use of Toplevel Navigation - or to discuss them alongside alternative solutions.
- Unwritten Internet Rules
- Using Color and Type Effectively
- W3Schools Online Web Tutorials: HTML Tutorial, XML Tutorials, Browser Scripting, Server Scripting, .NET (dotnet), Web Building
- Web Application Form Design: "...input elements should be organized in logical groups so that your brain can process the form layout in chunks of related fields."
- Web Design from Scratch is a free online course with many tutorials for everyone interested in creating effective web pages.
- Web Design Practices is a site devoted to helping designers understand what design practices are currently in use on the Web—and aims to gather research about the usability of commonly-employed design practices.
- Web Development is a resource for Web content developers. In these pages, a process-oriented methodology for creating World Wide Web-based hypermedia works is presented.
- Web development mistakes, redux @ 456 Berea Street
- Web standards project
- Web Style Guide, 2nd edition
- Website content & usability
- What is information architecture?
- What is in a name?: learn how to call containers, divs etc. in order to make the source code readable and transparent
- What Is Line Height?
- Writing for the Web - What is important?: some articles and links to useful sites for people trying to learn what works as text on a computer screen.
- Writing for Web: Fifty Tools which can help you in Writing
- Float: Die Theorie: eine ausführliche Beschreibung des Begriffs "Float" und dessen Anwendung in CSS
- Jendryschik: Einführung in XHTML, CSS und Webdesign
- Markup Weblog: Sinnhafte Websites: 1. Überschriften, 2. Textabsätze, 3. Listen, 4. Tabellen
- The Advantages of Web-Standards; Die Vorteile von Web-Standards ist ein ausführliche Artikel über die Web-Standards und Ihre Vorteile für die Besucher, Kunden und Webdesigner; übersetzt von Stefan Walter
- Toms Stichpunkte rund ums Web: CSS Tips & Tricks
- Webdesign mit Webstandards von Roger Johansson, übersetzt von Andreas Kalt.
- Favorite Fonts of 2004
- Five simple steps to better typography by Mark Boulton
- The Next Big Thing in Online Type
- The non-typographer’s guide to practical typeface selection
- Thinking With Type: theory + practice, how + why: a new approach to typographic education.
- Typolinks - essential links related to typography
- Typography Resources @ Simplebits
- Typographie für Webautoren - written by Christoph Paper
- Mezzoblue: Colour Schemes: A look at different methods of choosing colors from a design perspective.
- Boxes and Arrows: Natural Selections: An article on selecting colors from nature, with photographic examples.
- Web Page Design for Designer: Colour: Another look at color and selecting colors from nature.
- moreCrayons - Web-Smart Palette: Introduces a 4096-color palette that degrades well on older browsers as an alternative to the antiquated 216-color palette.
- 16 Lessons in Color Theory
- Adam Polselli: 2004 & 2005 Color Forecast, a series that includes a wide range of design guides that include everything you need to help jump-start your new design project.
- An Introduction to Using Patterns
- Causes of Colors - Why are things colored? is another interesting tutorial related to color theory.
- Color, Contrast & Dimension in News Design
- Color Information in Yahoo! directory.
- Color In Motion is an animated and interactive experience of color communication and color symbolism
- ColorShade helps you create professional matching color schemes for your project. With just a few clicks you will have an attractive, harmonious color scheme. Other features include web preview, scrollbar preview, vector image preview and palette creator (Shareware)
- Color Theory and Color Charts provided by About.com.
- Color Theory: A brief tutorial: brief, illumintaing, well explained.
- Color Theory Articles provided by Devx.com
- Color Theory Overview & Tutorial: Color, Creativity, Code
- Color | XPLANE: color resources, collected by xplane.com.
- Colour Harmony: Secrets of Web Color Revealed
- Colour Symbolism
- Colour Theory
- Colours on the web - color theory and color matching
- Design Psychology on Stylegala
- handprint : color is a comprehensive tutorial about color vision, color in the world, colormaking attributes, color psychology, additive & subtractive color mixing, color models, color wheels etc.
- Lesson in color: the theory of colors, hue, saturation, the adjacent effect, harmony and color mixing
- 100 Random Colors - Need a Color? is primarily a random color generator that's intended to help designers to get out of the "creative block"
- Defence Mechanism > Color Toy is a free online tool designed to simplify the nightmare of color scheme selection. It looks complex, but after a few minutes you won't be able to live without it.
- Color Palette Generator: enter the URL of an image to get a color palette that matches the image. This is useful for coming up with a website color palette that matches a key image a client wants to work with.
- With the Sessions.edu Color Calculator you can identify color harmonies faster than with any color wheel or chart. Use it to select a color scheme for a corporate identity or design project. Rotate shapes on the color wheel to identify harmonious color schemes. Adjust saturation and lightness. Save RGB, CMYK, or HTML color values, then send them to a colleague or client.
- Color Vision: 1 in 12 people have some sort of color deficiency. When you're designing for the web, this means that 1 in 12 people might not be able to see your site. That's alot of people. This tool helps you simulate the appearance of our site's colors for people with different color visions.
- ColorWrite 1.1 is a free color chooser with an integrated CSS/HTML code generator. It allows you to define colors using RGB, HSV, CMY and CMYK, makes using web safe colors easy and now, with Version 1.1, ColorWrite takes the guess work out of combining colors. ColorWrite runs on Macs (OS X), Linux, Solaris and Windows systems.
- Easy RGB has a unique set of color tools such as
Color Matching (Match your computer generated RGB values to color cards, paint lines, inks, fandecks and more...
Find an industrial standard match for your computer colors. Transform "virtual" colors in "real world" references.),
Color Harmonies (Search for colors complements to your RGB values. Create color harmonies, combinations and themes. From your main (or background) color select trim and accents tones.), Search a Tint (Search popular color collections for specific color codes or names. Once selected the desired color, find the closest match in competitors' fandecks and color cards, create harmonies or get chromatic data.), Color Calculator (Convert color data to different color spaces. RGB to CIEL*ab, CMY to XYZ and much more. Looking for color math or space conversion formulas?)
- Colour Contrast Check
- Color converter (RGB/CMYK/HSV)
- 4096 Color Wheel
- Eye Dropper Color Mixer is a freeware, desktop colour-grabbing utility, which picks the colour value from any pixel of the screen (RGB, HEX or CMYK).
- Jafar.com: Advanced Color Selector is a color selection tool that allows you to change both the colors and font characteristics and preview them before using.
- Chromatic Wheel: 12 color chromatic wheel similar to the theoretical chromatic circle. Find and simulate the harmony of your web interface.
- ColorBlender.com | Your free online color matching toolbox: calculates a 6-color matching palette (a "blend") automatically
- Color Mixers create mixed swatches of background color for your pages.
- Color Palette v1.2 and Color Palette Creator: just like Color Blender these tools
produce shades of your color, mixed first with white and then with black.
- Color Palette Generator generates a color palette based on an uploaded image.
- Color schemer Online v.2
- ColorLab is a tool for choosing a color composition - also available as a plug-in for Adobe Photoshop, Gimp, Fireworks, Flash, Golive, Painter, PaintShop Pro, Homesite, Illustrator, ImageReady etc.
- Colormix is a useful tool for creating a perfect color compositon or readable and accessible web design.
- Color synthAxis is a free online tool designed to simplify the nightmare of color scheme selection. It looks complex, but after a few minutes you won't be able to live without it.
- ColorWhore is a directory of nice colors
- Colour Contrast Analyser
- ColourMod :: DHTML Color Picker/Selector
- Colour exploration tools and a colour resources list: check readbility when any colour is used with black and white in four foreground and background combinations; explore colours near a specific colour, where you get to define what 'near' means; mix varying amounts of all combinations of red, green and blue with a specific colour; finely-tune your colour choice by hue, saturation or lightness, or make instant sets of co-ordinated colours; Colour schemes and palette layouts.
- Colour Scheme Chooser
- Conversion from Pantone to RGB and Hex HTML: Metallic Colours, Pastel Colours, 2x Colours, Skin Tones
- Design and Colour Utilities: CSS Border Test, Colourway, Colourband, Colourband Text, Colour Increments, Internet Explorer Scrollbars, RGB Converter, DOCTYPEs
- efg's Palettes and Colors Lab Reports
- How To Select Perfectly Matching Color Combinations: an Overview
- Image photo editor online: Resize, change dimensions, scale, crop, add text, optimize, color correction, adjust brightness, contrast, grayscale, rotate, flip, mirror, add clipart, and set transparency online with no image editing software to download or install
- Infohound Color Schemer: click around within the shaded box to set the saturation and brightness, or within the rainbow to set the hue. Matching colors will be automatically chosen
- Kolur.com Color Inspiration is a simple way to browse color palettes. Designs displayed in the gallery go beyond the generic 3 colored dots, and attempt to portray the possibilities in palettes.
- Patterns in Interaction Design is an exhaustive design-resource with numerous examples, descriptions and useful references; Web Design patterns, GUI Design Patterns, Visual design etc.
- RedAlt v1.0 - there is a form at the bottom of this page that lets you choose any URL you want to extract colors from. The colors you see are from the site that referred you to this page.
- The Man In Blue | Technicolor
- This or this generator of color schemes and palettes helps to create good-looking and well balanced and harmonic web pages.
- Triadic Color Harmony by Inherent.com
- Triplecode Munsell Palette is another color-harmony-palette-tool which is based on how people perceive colors. At its core is a set of data from perceptual studies; the result is a data set which defines a perceptually uniform color space.
- Unsafe Colormatch enables you to create 24-bit color schemes online - beyond the so-called safe palette. (IE 5.5 or higher)
- Web Color Theory helps to select a matching palette and determine a matching color arrangement for your website.
- Web Color Visualizer makes it easier than ever to select the color of the font and the background color.
- Web Safe Colours Table and Diagram with rgb and hex values
- A unique catalog of color-tools-bookmarks certainly completes the incomplete list of color tools presented on this page.
- ColorMatch 5K German edition is an optimized german version of ColorMatch 5K
- CSS Color Chart contains a neutral colors chart and a general-purpose color chart
- ColorCombos & Web Color Gallery: Combo Tester and Web Color Gallery allow web developers to see how different color combinations work together on the screen.
- color combinations is a list of harmonic colors, which includes over 200 entries.
- ColorMatch 5K helps to select a matching 6-color palette for your website.
- COLOURlovers is a place to view, rate and review some lovely colours & palettes. the idea is to create a place of color inspiration where a designer of any sort can see new and lovely colours... find out what colors are hot, what work well in other uses... and simply make some love with colour..
- Colr.org - "a site for playing with colors" contains 19655 colors and 6387 schemes.
- Color Shades: Colors and Lighter Hexadecimal Codes and Swatches
- Netcocktail :: Get Color
- Return of Design - Web Color Schemes: beautiful, harmonic web color schemes provided by Forty Media Corporation
- Patterns: Kaliber10000 | Patterns, Squidfingers | Patterns, Pattern-Bomb, The Inspiration Gallery.
- Behr | Color Smart
- Benjamin Moore: Personal Color Viewer
- Dulux paint colour range & advice about choosing paint colours
- Color palettes and color schemes at Sherwin-Williams
- Pantone's top ten fashion colors for fall 2005
- PANTONE Universe - Fashion ColorView: Color Your Life and choose from nine, beautiful in-season palettes
- Boxes and Arrows: The design behind the design
- Brain Bliss offers an impressive selection of free web design articles related to topics Multimedia, Marketing, Advertising, Writing, E-Commerce, Promotion, SEO, Affiliate etc.
- DesignInFlight
- Digital Web Magazine
- Graphics.com: The shared resource for creative design
- Poynter Online - Design / Graphics: a coloumn in the Poynteronline which features articles about design and graphics - particularly, for those involved in journalism.
- Web Developer's Journal
- AboutWebDesign.de is an online magazine for Webmasters and Webdevelopers / unter anderem sind auf der Seite Artikel mit dem Schwerpunkt auf Design-Theorie, Design-Praxis, Promotion, HTML/XML-Praxis, Projekt-Management und Webmaster-Praxis zu finden.
- WebInteger.net is an online magazine for Webmasters and Webdevelopers / Online-Magazin für Webmaster und Webentwickler
- [kak) - a journal about graphic design
- Nbsp.ru
- Webmascon: Russian "A List Apart". Multiple articles about webdesign, webdevelopment etc
Written & unwritten rules and standards
Typography: theory and practice
Web designers recommend (via www.figby.com)
Color Theory, Color Tools and Palettes
i. Color theory
ii. Color tools
iii. Color Schemes and Palettes
iv. Fashion: Colors Selection
Web Design magazines
Royalty free photos and images
- An enormous list of web-sites which provide royalty free photos
- DesignPacks.com offers royalty free, high quality image collections
- PictureQuest is a database of Royalty Free and Rights Protected Images Online - over 300,000 images.
- Pixel Perfect Digital: download free images, textures, backgrounds, illustrations, digital art and stock photos. 3,164 Files in 112 Categories, with 365,477 Views and 143,366 Downloads
- Pixsy - photos and videos from blogs and social networks
- StockVault contains a lot of exclusive free stock images
- stock.xchng
- Truly Free Stock
- Yotophoto is a search engine for free-use stock photographs,
which indexes over 70,000 free images.
- WallpaperStock: royalty-free quality desktop wallpapers
- Where To Find Great Free Photographs And Visuals For Your Own Online Articles is a great article, describing web-sites which provide royalty free photos.
- AboutPixel.de is a large database of royalty free images with many categories and abstract photos.
- A thread in a german-speaking forum with a constantly actualized list of royalty free photos
- PhotoCase.de is a German database of royalty free images which enables 3 free downloads a day; creative and easy to find.
- 9x13.de is a small database of royalty free images. Good quality and creative images.