Top 35 – Narzędzia WWW

Just copy/paste your CSS (or upload the file or type a URL), choose whether to have it “neat,” “pretty,” or “awesome,” and ProCSSor will clean up and improve your CSS. With a useful – and optional – fail-safe mode, this tool is now also available as a native Mac application.

GTmetrix’s Page Speed tool provides a report for any web page, breaking down page load speed by a wide variety of factors. Can be used as a bookmarklet and to compare different web pages. With unneeded CSS rules often a factor in excessive load times, identifying which CSS-related processes are not optimized for speed of loading can be extremely important.

Cut down on the size of your CSS stylesheets by choosing which level (highest, high, standard, low) of compression you want (as level decreases, legibility of the resulting file also decreases). Just copy/paste the CSS you wish to compress. You can identify the specific properties you wish to compress (colors, font-weight, unnecessary backslashes/semicolons, etc.).

Need some CSS but not quite sure how to code it? This tool will do the work for you, and covers a number of popular style items ranging from the simple to more complex. Examples of CSS styling possibilities include border radius, multiple columns, and shadows and transitions of various kinds.

Does your CSS need tidying up? With similar options to the CSSCompressor tool, this one also lets you upload a CSS file or access that file at a given URL. Has three compression levels (low for development, medium for staging, high for production) and four CSS options to choose from (colors, font-weight, lowercase selectors and unnecessary backslashes).

SpritePad has a three-step process for creating and editing CSS sprites in seconds. Drag and drop an image and the tool creates a PNG sprite and the appropriate CSS code for immediate use. A free account gives you cloud storage for your sprites. Premium features are also available, and a guided tour helps first-time users.

This app works as an extension in Photoshop and can also be used in Fireworks and in GIMP. Via a browser connection, the grid setup includes layout width, baseline, gutter, number of modules, and module width and height. The resulting grid can instantly be converted into a PNG pattern, Photoshop pattern, or transparency.

This tool provides you with an HTML layout and responsive CSS stylesheet files in response to the specifications you choose in the browser. In just a few minutes you can put together layouts for each of the planned pages for your site. Pick the size (laptop, tablet, phone, iPad and iPhone) and orientation of the desired layout and add the specific containers and their proportions for each page you plan to build.

A local storage based mockup tool, it uses drag-and-drop functionality directly in the browser. The demo has common shapes, buttons, and input areas, to which you can add size and color attributes. Can be integrated with any RESTful API or Backend service.

Screenfly is an application for testing the appearance of existing web pages in different screen sizes and resolutions to ensure they render well. Choose from popular hardware sizes (desktops, tablets, smartphones, TVs) or enter specific sizing. You can even create links for each resolution tested to include in a presentation or send to a colleague for input.

This app provides screenshots of a web page from more than 100 browser versions on Linux, Windows, Mac, Gecko and KHTML/WebKit operating systems. Choose one, multiple, or all versions of specific browsers. Other options with various settings include screen size, color depth, and presence of Javascript, Java, and/or Flash. Limits exist on the number of screenshots you can request each day, but priority processing is available for a fee.

This tool tests three major aspects – HTML5 validation, CSS3 validation, and JavaScript analysis (via JSLint), offering some filters and advanced analysis not found in similar tools. Works with all browsers, although it no longer supports Internet Explorer versions prior to 9. A demo and 30-day free trial are available.

Enter the URL of a web page and this tool will show you the percentage of the page that users of specific browsers will see after a Google search. The tool uses contour mapping to delineate viewable areas,. For example, the part of the page outside the 80% contour is not visible to 20% of those visiting the page via Google. The tool is best used for fixed layouts aligned to the left.

TypeWonder allows you to Instantly see how your website would look if it used a different font. Just choose the font from the huge variety shown and click “Use!” Within a few seconds, your web page appears with the font substituted. Switch back and forth between the original and changed version with a click of the button. If you like the change, choose to get the code to integrate the change into your CSS.

Create your own icon fonts with IconVault. Start by clicking on “create font” and either upload your icons or use the available ones. Results are downloadable in a couple of minutes. Their selection currently includes 10 social media icons and 21 iOS icons.

This browser-based tool lets you see how different fonts (Google fonts and some System fonts) will look when combined in the following different elements on a web page – H1, H2, body text, and background color. Options let you change color, font, size, line height and/or hide an element.

Turn any image into a Windows favicon (.ico file, 16×16 pixels in size), the format still required by Internet Explorer and recognized by other browsers. Includes an editor function for adjustments after favicon generation or to create one from scratch. Include the code to integrate into your site.

Makeappicon generates resized icons from your designs that are suitable for use in iPhone/Android apps. Also great for icon images to use on Apple Home screens for bookmarking purposes. Includes auto enhancement for smaller icons.

Quick and easy animation of your image. Add text, backgrounds, special effects, transitions, hyperlinks and loop slides. Templates and tutorials are available in a variety of styles and choices.

Need to create a PNG file that has added noise? Choose your background color, size, intensity, and opacity and this tool will generate a file and download it for use in your web project.

With a few different varieties available, including a mobile version, this app is an extremely popular photo editing tool that handles most basic image-related tasks. Offers 600+ different effects, borders, and overlays.

QRHacker takes QR code creation a step further by letting you add personalization or artistic elements to your QR codes without affecting their readability. Tracking and advanced features are available with a subscription.

In addition to the usual dummy text that most random text generators supply, this tool adds a couple more features. It will generate paragraphs, headings, or lists in either Lorem Ipsum or Gibberish, but will also let you copy/download it with the HTML code included.

Fakeimg.pl quickly takes care of the task of creating placeholders for images that you will add later to your site. Just enter the size of the image and add optional text or color information to the end of the URL of the tool to generate the image placeholder. For example, the URL http://fakeimg.pl/660 results in a 660×660 pixel, shaded image) being generated.

Net2Ftp is a web-based FTP client with a free trial. Use it to accomplish all the usual upload/download tasks as either an administrator or user. It also offers code view, chmod, zip/unzip of files, software installation capability, and calculation of file/directory sizes.

Site load time is increasingly important, and this tool lets you test the time to load a particular page and any bottlenecks discovered during the process. You can even sign up to have your site tested each minute and be notified of problems via email, SMS, or Twitter at no charge.

A tool for testing the performance of a web page under certain conditions and scenarios related to virtual users, LoadImpact can be very useful for sites expecting a lot of traffic. Geographic load zones, server metrics, and extra IP addresses can be customized.

This cloud-based development tool lets you write HTML5, CSS3, and JavaScript (separately or together) and test them in real-time. One great feature is its “hint” system, which guides you to create code with proper syntax. It’s free for any number of items, URLs can be shared, and a choice of different JavaScript libraries is provided.

Convert simple text into HTML lists or add options to elements quickly and easily with Listify. All you have to do is paste the text, choose the type of list, identify the delimiters you’ve used, and decide if digits should be ignored. The resulting HTML list can save lots of time you might otherwise spend adding list-related code tags.

This free online testing tool lets you edit and test regular expressions in a simple interface. Built using Flex3, it also has a RegExp snippet sidebar with descriptions and examples for trial-and-error learning.

Need to create or modify your .htaccess redirect file? This handy tool will generate the necessary code to include in the file. All you have to do is check off the items you want to include from the long list shown and provide the details requested (such as old and new file paths).

Use this fast and scalable tool to generate object-oriented code for PHP4/PHP5 applications. With three simple steps, PHP objects are created using integrated CRUD. Free for both personal and commercial use.

This free form generator is great for putting together simple HTML forms together with all the relevant PHP processing code. Client-side validation is also included, and up to 30 items can be added to the form skeleton. The final form you put together is sent to you via email.

If you are working with sensitive data or just want to ensure the integrity of the data in your files, the MD5 hash generator tool creates a hash of a string in one easy step. PHP/ASP programmers and developers on MySQL, SQL, Postgress, etc., may find this to be a time-saver.

BuiltWith provides information on the different technologies that individual websites – and websites as a whole for trending purposes – are using. Discover the most popular technologies for different applications or get a list of all sites using a certain technology, such as PayPal or Rackspace. A free trial lets you check it out, and the presence of optional geographic limiters provides focus to the resulting report.