Web Design:
Anything related to web design and development: templates, images, content, color. See also individual categories for these topics.


CSS Stopwatch Tutorial

  • Posted By: Jason Taetsch
  • ...

Ever since its creation in 1994, developers have used Cascading Style Sheets or CSS, to dynamically style web elements and HTML documents. With the latest CSS standards, developers can control how an object behaves as well as looks on a web page. The crew over at the CodePlayer have put together this walkthrough for creating a customizable stopwatch solely using CSS keyframe attributes. The walkthrough guides developers through the process of creating a stopwatch capable of being started, stopped and reset all using CSS states.

Header Checker Tool

  • Posted By: RankRaiser
  • ...

The headers of an HTML page are very important because when the information is incorrect it could lead to problems, including wrong status codes, incorrect redirects, wrong meta information, etc. The header checker at InternetMarketingNinjas.com gives you potentially dozens of HTTP status response codes and offers definitions for each one. Check your site periodically and during each and after redesign.

Javascript Editor Add-on

  • Posted By: Jason Taetsch
  • ...

The Live ScratchPad from NeoNux is a Firefox add-on that allows programmers to test, debug and edit JavaScript functions right from the comfort of your browser window. Once activated, the add-on can inspect affected objects and DOM elements used in the function as well as flag errors in the function’s code. The ScratchPad window features dual windows to view the output of the function and the code at the same time, cutting down time during the testing and debugging phase.
Get …

Social Media Postage Stamps

  • Posted By: Jason Taetsch
  • ...

Set your website apart from the pack with a custom set of social media icons from Tony Thomas of MediaLoot. This icon pack includes 24 custom social icons from the most popular social networks with their logos redesigned as postage stamps for a classic design theme. Each icon comes as a high quality PNG file at 64 px by 64 px. The icon pack is free for commercial and personal use and includes icons for Vimeo, App Store, StumbleUpon, YouTube, Facebook, Skype, LinkedIN, Blogger, RSS, Email, SoundCloud and others.

Streamline Creating CSS Sprites

  • Posted By: Jason Taetsch
  • ...

Sprites allow designers to load one large image and display only a portion of that image at a given time, saving load time by including all the desired images for a webpage into one big graphic that loads at one time.  

While the CSS code gives the designer the tools to display specific portions of the image, Wearekiss.com put together the SpritePad application to streamline the process of creating CSS sprites. SpritePad creates PNG files with the included CSS sprite code, saving designers from the tedious task of slicing the larger image into smaller pieces.