Categories
Introduction
01. Creativity
02. CSS techniques and examples
02 a. CSS tecnhiques03. 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).


» CSS- & HTML-Web-Tools
updated/MondaySeptember19th
- Accessibility Valet Demonstrator
- Bobby Online Service
- Cynthia Says
- OCAWA Web Accessibility Expert
- Torquemada offers to website developers a complete methodology for accessibility analysis which uses a tool for page checking that makes it possible to quickly identify which parts of a page are in error and the HTML code corresponding to these parts.
- UI Site check - fill out only one form instead of dozens when checking a site. Site Check lists the test results provided by important validators and accessibility tools.
- WAVE 3.5 Accessibility Tool provides useful information about accessibility features and errors within your page. It is designed to facilitate the design process by adding icons to a version of your page. The icons represent structural, content, usability, or accessibility feature or problems within your content. You can easily see the exact location within your page where an error is present.
- Web-based Site Usability Checker
- WebXACT Quality & Accessibility Check is a free online service that lets you test single pages of web content for quality, accessibility, and privacy issues.
- Will the browser apply the rule(s)?
TAW - Test accessibilidad web
- Doctor HTML v6: checks the spelling, links, images, tables, html structure and standard appliance of your web-site. Besides, its formatter makes HTML code readable
- HTML Authoring Services are supposed to assist web authors who wish to make their information available to the largest audience. These tools provide alternate ways of viewing your pages, so that you can ensure that your content is received properly by all viewers.
- HTML Character Entities is a table with caracter entities for such symbols as €, ¶, √ etc. HTML 4.0 Entities, Latin-1, Greek & Symbols, Others, All Characters and the Unicode Character Table.
- HTML Help: CSS, HTML Checks
- HTML Tidy is a tool for checking and cleaning up HTML source files. It is especially useful for finding and correcting errors in deeply nested HTML, or for making grotesque code legible once more.
- Special Characters in HTML: ψ ω σ ♣ ♠ ‘ ’ etc.
- WDG HTML Validator
- CSS Centricle: Will the browser apply the rule(s)?
- CssCreator -> Page Layout: this generator will create a CSS layout that has fixed width left and/or right columns with a dynamic width center column, all the same height with header and footer
- CSS Formatter and Optimiser lets you select how readable or small you want your CSS to be.
- With CSS Multi-element Rollover Generator, you can create two distinct styles of rollover button, using CSS and just one image. The difference here is that you can optionally allow some background space above your image in which to place CSS- controlled rollover text.
- CSS Rounded Box Generator
- CSS Syntax Checker for BBEdit and TextWrangler
- Free CSS/HTML template roundup (found at lifehacker.com): Ruthsarian Layouts - 6 good-looking, free CSS page layout templates, complete with colors, headings, etc; Bluerobot Layout Reservoir - 2 and 3-column page skeleton CSS layouts; Glish CSS Layout techniques - Two, 3 and 4 column skeleton CSS layouts; The Layout-o-matic - enter page width, number of columns, and padding and it generates CSS and HTML skeleton layout; Little Boxes - various box layout CSS stylesheets; Open Source Web Design - various complete page templates free for use; Web Builders’ Toolkit - more links to template resources.
- Iconico Online CSS Scrollbar Color Changer
- korhoen typeviewer is a viewer which helps you to take a look at CSS typesetting and adjust it to a better readability
- List-u-Like is a CSS Menu-Generator: create cross-browser list-based navigation bars with ease
- Nifty Corners: rounded corners without images
- Online CSS Compressor cleans and compresses your CSS in a variety of ways, significantly optimizing and reducing its size at the expensive of readability.
- Round Corner Stone/Icon (rcsi) V1.0 - enhance the table with round corner stone!
- SelectOracle explains the structure of CSS- and HTML-documents. Enter semi-colon separated selectors or just paste in your existing rulesets into the "Direct Input" area, or provide the URL of a stylesheet or an HTML document with an embedded stylesheet in the "URL Input" area. English, Spanish, German and Bulgarian versions are available.
- Using Xylescope you can look forward to analysing complex CSS designs with incredible ease and experimenting with third-party sites, without having to download them onto your own computer first.
- W3C Core Styles
- CSS Centricle: Will the browser apply the rule(s)?
- CssCreator -> Page Layout: this generator will create a CSS layout that has fixed width left and/or right columns with a dynamic width center column, all the same height with header and footer
- CSS Formatter and Optimiser lets you select how readable or small you want your CSS to be.
- With CSS Multi-element Rollover Generator, you can create two distinct styles of rollover button, using CSS and just one image. The difference here is that you can optionally allow some background space above your image in which to place CSS- controlled rollover text.
- CSS Rounded Box Generator
- CSS Syntax Checker for BBEdit and TextWrangler
- Free CSS/HTML template roundup (found at lifehacker.com): Ruthsarian Layouts - 6 good-looking, free CSS page layout templates, complete with colors, headings, etc; Bluerobot Layout Reservoir - 2 and 3-column page skeleton CSS layouts; Glish CSS Layout techniques - Two, 3 and 4 column skeleton CSS layouts; The Layout-o-matic - enter page width, number of columns, and padding and it generates CSS and HTML skeleton layout; Little Boxes - various box layout CSS stylesheets; Open Source Web Design - various complete page templates free for use; Web Builders’ Toolkit - more links to template resources.
- Iconico Online CSS Scrollbar Color Changer
- korhoen typeviewer is a viewer which helps you to take a look at CSS typesetting and adjust it to a better readability
- List-u-Like is a CSS Menu-Generator: create cross-browser list-based navigation bars with ease
- Nifty Corners: rounded corners without images
- Online CSS Compressor cleans and compresses your CSS in a variety of ways, significantly optimizing and reducing its size at the expensive of readability.
- Round Corner Stone/Icon (rcsi) V1.0 - enhance the table with round corner stone!
- SelectOracle explains the structure of CSS- and HTML-documents. Enter semi-colon separated selectors or just paste in your existing rulesets into the "Direct Input" area, or provide the URL of a stylesheet or an HTML document with an embedded stylesheet in the "URL Input" area. English, Spanish, German and Bulgarian versions are available.
- Using Xylescope you can look forward to analysing complex CSS designs with incredible ease and experimenting with third-party sites, without having to download them onto your own computer first.
- W3C Core Styles
- 300 Images From 1800 Sites is arrows, posts, comments, mail, bullets, print, carts and bags
- .htaccess code generator - disable hotlinking
- .htaccess: Guide and Introduction
- Accessible Data Tables
- Acrobot - Abbreviation and Acronym Generator; automatically create and tags at the push of a button
- Alter Table Row Background Colors Using JavaScript
- A Simple Character Entity Chart: trackdown the ISO character entity and choose between the named and numeric value.
- 9 useful tools for web design
- Approximate Conversion from Points to Pixels
- 80x15 Brilliant Button Maker by LucaZappa.com.
- 80x15 Button Maker and Generator - Blog Flux
- 80x15 Buttons Gallery by Ggtmcknight
- BannerReport.com hosts a massive gallery of banner ads and will be of special interest to graphic designers, web developers and marketing professionals.
- Best Of Firefox Edition is a subjective, but a comprehensive overview of the best Firefox Extensions for web-developers
- Bookmarklets to User Scripts is a Greasemonkey script that lets you turn any bookmarklet into a Greasemonkey script.
- Browsercam - Check how your web-site looks in different browsers
- Browser Simulator shows how a web-page is interpreted by the older browsers
- BrowserShots is concerned with a favorite problem of web designers: websites look different in other browsers.
- Create compatible HTML email
- Cs2Aco Converter is a tool to convert a Color Schemer File (.cs) online to an Adobe Photoshop Color Pallete (.aco) (Dominic Lüchinger).
- Css Editors @ css-discuss is a list of css text editors, graphical web page generators and online editors you can use for CSS. Among them - BBEdit, Bluefish, CrimsonEditor, EditPlus, HTMLKiT, TextPad, UltraEdit, css-Maker, Web Developer Toobar and other editors.
- EffectsPack - Prototype/Effects based javascript effects is activeMenu, ActiveTab
- FaganFinder URLInfo is a tool for an extremely efficient handling web pages: numerous web-development-tools embedded in a single tool; URLInfo helps to find information about a web-site, link popularity, validate, translate it, find related pages etc.
- famfamfam.com: Icons
- Favourite Javascripts for Designers: ExpandCollapse Script, Timer Layer, Style Switcher, Form Checker.
- Free Photoshop Website Templates
- Greasemonkey is a Firefox extension which lets you to add bits of DHTML ("user scripts") to any web page to change its behavior.
- GreaseMonkeyUserScripts: undispensable scripts for the everyday life in the Net.
- ieCapture v. 0.0.4 alpha creates screenshots of your web-page in different browsers (currently unavailable)
- Javascript Diff Algorithm: makes it easier to correct the text you've written earlier but which isn't actual any more.
- JavaScript Toolbox - Reusable Libraries And Objects: DHTML Tree, Calendar Popup, Validation & Date Functions, Sortable Table, Auto-Tab, Dynamic Option List
- Javascript DHTML Table Sort @ BrainJar.com
- Link checker & Link Valet: do you have any broken links?
- Load time check
- Polaroid-o-nizer: creates Polaroid style images from the uploaded images
- Screen size simulator
- Semantics extractor
- SimpleViewer v1.7 is a free, customizable Flash image viewing application.
- slayeroffice - web experiments gone horribly awry: Favelets, Web Based Dev Tools, DOM/Javascript, Javascript Functions etc.
- Sparkline Generator Web Application is a generator of small graphic charts which can be inserted within text on a page
- Textarea tools is a collection of tools for use with textareas (or input fields)
- The Amazing Rolloverer a tool for generating Javascript-free, accessible, flicker-free menubars.
- The Box Office 0.3: automates the time-consuming job where one would have to manually create transparant div's so that a certain piece of text would go around the contour of an object inside an image.
- Toys - dhtml and javascript libraries, demos and applications @ Cross-Browser.com
- TwoGun Code Creator generates HTML-Code for presenting video-clips on a web-page.
- Vischeck Colour Blindness simulator
- Web Apps Compendium v1.0 || kuro5hin.org is a short but comprehensive compilation of web apps; the list includes Search Engine Optimization Web Apps, Search Web Apps, RSS Web Apps, Content Generation Web Apps, Tagging / Bookmark Web Apps, HTML / Design Web Apps, News Web Apps, Misc. Web Apps
- Web Developer Extension for Mozilla and Firefox adds a menu and a toolbar to the browser with various web developer tools
- Web Page Analyzer is a free Website Performance Tool and Web Page Speed Analysis
- Web Page Backward Compatibility Viewer
- X Library, Demos & Applications features X - a cross-browser DHTML javascript library, and many demos, applications, articles and documentation.
- Barrierefinder: Test: Ist Ihre Webseite barrierefrei?
- Among numerous Webmaster-Resource Tools you can find following services: CSS Generator, DHTML Transition Effects, Video Link Generator, Javascript Messagebox-Generator, Javascript MouseoOver-Link Generator, Link-Checker, Punkt/Inch/Millimeter-Convertor, Loading-, Link-Popularity-, Submission-Checker, Meta-Tag Generator, Bannergenerator etc.
- Service for checking the links on your web-site / Service zum checken der Links
- Accesible DOM DropDown Menu
- cssQuery() is a powerful cross-browser JavaScript function that enables querying of a DOM document using CSS selectors
- DOM: Dockable Comments: Intelligent DOM Scripting
- DOM: Dom-Drag-Crop is a cropping and resizing tool. The basic idea behind Dom-Drag-Crop is to have the user supply an image, and then let the user easily select a portion of the image that will be cropped and scaled to the desired thumbnail size.
- DOM: Mouseover DOM Inspector: this favelet allows you to view the properties of any HTML element on a page simply by mousing over the element.
- DOM-Scripted Lists, Revisited
- DOMSlides: Yet another DOM/CSS based presentation slides system
- Drop-Down Menus, Horizontal Style @ nickrigby.com
- Dynamic thumbnails and preview images with DOM, CSS and PHP
- Gecko DOM Reference
- 100 Seriously Free Fonts @ dafont.com
- fontleech is a constantly-growing index of the best free font sites on the web.
- Font Browser displays a listing of the fonts you have installed and provide a preview of them at different text sizes.
- Font guide for webmasters
- Fontsmack: sIFR, TrueType (sans-serif, serif) and PostScript fonts
- Font Type Navigator
- Identifont - Identify a font: answer a series of questions about the letter shapes to help narrow down the choices. Sometimes it works well, sometimes not as well. But definitely worth trying when you have a fairly good sample of characters to work with.
- Minifonts.com: Pixelfonts
- Monospace/Fixed Width Programmer's Fonts
- Pixelfonts: Style-Force Semplice Pixelfonts
- praegnanz.de - Free Professional Fonts: Freie Schriften im Portrait
- Serif or Sans? is a "typerator" which helps to select a perfect font for your site.
- WhatTheFont?! helps you determine the font used in an image
- Ping-o-Matic!: pinging lets dozens of services know you've updated your site and increases traffic to your blog
- RSS Tutorial for Content Publishers and Webmasters, RSS Workshop, 15 things you can do with RSS: among them "Find out what people are saying about you, your company or your product online", "Get notified of bargains at Ebay" etc.
- RSS: NewsIsFree is a catalog of RSS feeds. Search the news from 20856 sources updated every 15 minutes.
- RSS Newsniche: an RSS-Tutorial includes RSS Publishing Tools, RSS Feed Directories, RSS Submission Tools, RSS Validators, RSS Publishers FAQ, RSS Subscribers FAQ, etc.