Web Design Blog
Thoughts and commentary about web design plus links to helpful resources including fonts, plugins, templates, stock photos, software, scripts, tutorials, and other useful tools for webmasters!
Sunday, August 31, 2008
Clicky Web Analytics
Clicky Web Analytics is simply the best way to monitor, analyze, and react to your blog or web site’s traffic in real time.
What is Clicky?
Clicky is a web analyzer that works great with any web site, even Ajax and Flash sites. It was originally targeted towards smaller web sites and blogs because it tracks a high level of detail on every visitor, and these types of sites find this information very interesting. Since then, many additional features have been added to Clicky, such as the customizable dashboard full of Ajax love, and our amazing filtering interface that gives you actionable data on any subset of your visitors (see screenshots on the right hand side). These features, along with many others, make Clicky one of the best web analyzers on the planet.
How does it work?
Simply create an account and then add one or more web sites to that account. For each web site you register, you are given two lines of HTML code to place on your web site (this code is unique for each registered site). It’s this code that let’s us monitor all of your traffic and give you the juicy details you crave.
Is it free?
We have a free plan plus several premium plans, as shown below. You also have the ability to create your own custom Pro plan during the upgrade process, with support for up to 200 sites and 300,000 total daily page views.
When you first register, you get a 21 day free trial of the standard Professional service, so you have access to all of our features up front. After 21 days, you can sign up for one of our premium plans, or let your trial expire and automatically switch to our free plan. If you have any sites that get more than 1,000 daily page views on average, premium service is required to keep monitoring those sites after your trial has expired.
Visit GetClicky.com for more details
Sunday, August 31, 2008
Create an Awesome Looking “Coming Soon” Page with LaunchSplash
LaunchSplash aims to provide the tools you need to create an awesome looking Web 2.0 “Coming Soon” Landing Page for your domain quickly and easily.
Announcements
Let the world know what you’re working on. Post announcements to your visitors that are accessible via your Launch Page’s RSS Feed.
Email Signup Form
Visitors will want to know when they can use your product. Your Launch Page includes a signup form so you can let people know when you are ready.
Designs
We offer plenty of great looking “Web 2.0” Designs and color scheme options for each Launch Page. Currently we have over 25 different template options.
CSS Overrides
With a little bit of CSS hacking, your Launch Page is nearly infinitely customizable. Replace any logo, background image, and font on your page with your own.
Traffic Analysis
We’ll let you know how many people access your page each month. For more detailed stats, you can paste your Google Analytics code onto your Launch Page.
Launch Page Feed
Let your users keep up to date on announcements and site launch details via your Launch Page Feed. Integrates easily with FeedBurner.
Domain Mapping
If you have a domain, you can host your Launch Page directly from it via Domain Mapping. All you need is couple small changes at your Registrar, and it’ll be ready to go.
Fast and Friendly Support
We’re here for you if you need anything. We’re a small company and looking to do our best to make every user cheery.
Visit LaunchSplash.com
Sunday, August 31, 2008
CrowdSound - Listen to your Customers
Gather social feedback without sending your users away.
CrowdSound is a social feedback tool; your customers can make and vote on suggestions and you can respond back to them, starting a real dialogue. But with CrowdSound, the users never have to leave your site. Our customizable widget embeds directly into your web site, providing a full set of feedback tools without making them sign up for yet another account or navigate away from where you want them to be.
Customized to fit your brand and needs.
CrowdSound provides a simple intuitive interface for creating custom color schemes to match your company’s branding and website. In just a few short clicks you’ll be able to completely change the look of the CrowdSound widget and easily embed it on your page. You can also customize the ‘Buckets’ that suggestions are categorized into. Don’t like the defaults? Change them! If your site does not require a widget, then you can use our hosted site option.
Organize your users’ ideas.
CrowdSound allows you to give your customers categories for suggestions. Is it a bug? A feature request? Get greater specificity and organization by using CrowdSound’s tools and management interface. Account-specific issue? CrowdSound allows for suggestions to be marked as ‘private’, allowing a customer to submit a suggestion that can only be seen by your company, and also allowing you to take offline sensitive suggestions that may otherwise be visible to your competitors. CrowdSound also has a moderated mode, where every suggestion submitted by a widget user is not published on the widget until you review it.
Manage suggestions on the go with CrowdSound’s iPhone interface.
CrowdSound provides a full-featured iPhone interface, allowing you to manage and respond to suggestions wherever you are. Keep track of what your customers want whether you’re at the office or miles off-site.
Visit CrowdSound.com
Sunday, August 31, 2008
W3Counter - Essential, Real Time Stats for your Website or Blog
You shouldn’t need training to figure out your web stats program. W3Counter is your free, hosted website analytics solution for answering the key questions about your website: who’s your audience, how they find your site, and what interests them. There’s no installation, no configuration, and tracking starts as soon as you copy-and-paste a snippet of code into your website.
Follow Your Visitors
Since W3Counter’s service is truly real-time, you can follow visitors as they browse your website. See who’s online at any time and their entire path from referring source to the page they’re currently viewing. Plus, view detailed activity for visitors that have recently left your site as well.
Dashboards
A dashboard for each of your websites gives you an executive overview of the key statistics to watch. You’ll see trends in visit and page view activity over the past two weeks, along with your top traffic sources, search phrases, content and visitor locations.
City-Level Visitor Maps
Know exactly where your visitors are located with Google Maps down to the city level. You can even watch visitors arriving at your site in real-time appear as new info markers on the map, with referring source and landing page for each new hit.
Web Stats Widgets
Share your web stats with the world. Embed them in your website or blog with 7 different widgets including visitor maps, top pages, top searches, weekly visit graphs and a live feed of the most recent people on your site. You can even pull up a click overlay of your site without logging in to W3Counter.
Visitor Identification
Label your visitors, as easily as installing a plugin on a WordPress blog or adding a few lines of JavaScript to your membership or customer-based website. Your labels will appear in your reports of online and recent visitors, where you can view all the past activity of each member or customer on your website.
Navigation Tracking
Learn how visitors navigate your website with reports on visit depth, time on site, click lists and overlays of click data for every page. Identify hot and cold spots by overlaying color-coded click data right on top of your own webpage, either through the W3Counter site or while on yours with the Page Stats Widget.
Visitor Demographics
W3Counter captures and reports on key demographics of your visitor audience — languages spoken, browsers used, platforms, screen resolutions, locations, and technology features enabled in their browsers. All reported in simple, beautiful pie charts and lists you can drill down into.
Customizable Tracking Image
Choose from dozens of tracking image options — hit counters, images without counts, or no visible image at all. Counters and badges available in colors to match any website or blog theme.
Get more details a http://www.w3counter.com/
Monday, July 14, 2008
TextureWarehouse Back Online!
TextureWarehouse is back! After several months under reconstruction, Texturewarehouse.com is back online. Featuring hundreds of free, high-resolution texture images distributed under a creative commons license, the folks at TextureWarehouse have worked hard to get the textures you need for your design needs. Whether you’re designing websites, 3D models, or graphics featuring highly textured elements, you can find what you need at TextureWarehouse. Have something they don’t? Feel free to submit your texture images for the greater use of other designers.
Take a few minute to check out the new design, browse the textures, and contribute the textures you have to the galleries there.
www.texturewarehouse.com
Sunday, April 20, 2008
Free CSS Web Page Templates for sNews
DesignsByDarren.com has just release some new web page templates created specifically for sNews. Just upload the “index.php” file and “CSS” folder to your sNews directory and you’re ready to go! We highly recommend that you backup your current sNews directory before uploading any new template. That way you can “rollback” to your original design if you need to.
sNews is a completely free, standards compliant, PHP and MySQL driven content management system. Consisting of only one small core file, sNews is extremely lightweight, easy to install, and easy to use via a simple web interface.
These templates are licensed under a Creative Commons Attribution-Noncommercial 3.0 License. Essentially this means you may use the templates for any personal or non-profit web design project as long as you give credit (attribution). A link back to designsbydarren.com in the footer is required.
If you’d like to use one of the designs for a commercial project, you may purchase a commercial license for just $9.95. The license is good for 1 project / 1 domain. If you plan on building multiple sites from the same template you must purchase a license for each.
Monday, March 10, 2008
Painter Essentials 4
Based on Corel Painter, the world’s most powerful painting and illustration software, Corel Painter Essentials 4 includes everything new users need to set up their own home art studio. Featuring a wide selection of paint brushes, pencils, paper textures and built-in tutorials, Painter Essentials 4 is the perfect program to help users get started with digital art and create stunning paintings—either from existing photos or from scratch.
Working closely with its customers, Corel redesigned the Painter Essentials user interface to make it even easier for users to discover the tools they need to create stunning artwork. Available on the Windows and Mac platforms, Painter Essentials 4 is ideally suited to digital camera users, scrapbookers, arts and craft enthusiasts, art teachers and students of any age. With art tools that faithfully replicate their traditional counterparts, it is easier than ever before for users to achieve more expressive hand painted works of art.
“With Corel Painter Essentials 4, we wanted to make it as easy as possible for our customers to tap into their creativity, whether they want to create a painting from a favorite photo or develop a custom piece of artwork from scratch,” said Robert MacDonald, Product Manager, Corel Painter. “By further simplifying the user interface and including new training videos and tutorials, our goal is to educate and inspire our customers while giving them the creative freedom to develop something truly unique.”
New Features
With a simplified user interface, streamlined workflow and even more creative options, Corel Painter Essentials 4 provides the tools and guidance to help users create unique digital art keepsakes that are perfect for framing, using in craft projects and sharing as special gifts with family and friends.
New features in Corel Painter(tm) Essentials 4 include:
• New! Redesigned Workspace—To make it easier for users to get started with digital art, Corel Painter Essentials 4 features two distinct workspaces: Drawing & Painting and Photo Painting. Each workspace is easily accessible from tabs within the application and each presents customers with the tools specifically needed for the task they selected. Both workspaces offer a reconfigured toolbox, making it easier to identify and select brushes, media and paper.
• New! Brush Drawer—The new Brush Drawer makes brush identification and selection easier than ever before. Users can browse all brushes by category, quickly recall recently used brushes and easily add their favorite brushes to the Brush Drawer column.
• New! Color and Mixer Palettes—With the new Color Palette, users can choose a color with just one click. By simulating the traditional experience of mixing colors on an artist’s paint palette, the Mixer palette makes it easier for users to get the precise color they want.
New and Enhanced Tools
• New & Enhanced! Photo Painting System—The Photo Painting System has been redesigned and enhanced, making it easier for users to turn photos into paintings within seconds. Now organized in a separate workspace, all of the brushes within the Photo Painting System now act as cloners that take their color from the source image. As a result, users can now create a painting from a photo in as little as 3 easy steps.
• New & Enhanced! Smart Stroke Technology—The new Smart Stroke Technology paints with brush strokes that follow the forms of the original photo, dynamically changing brush size, stroke length and pressure, based on the detail and focal areas of the photo. As a result, users can quickly achieve impressive paintings or sketches with no prior training or experience required.
New Natural Media Materials
• New! RealBristle Painting System—Introduced in Corel Painter X, the new RealBristle Painting System heightens brush responsiveness and represents a major milestone for digital painting. Corel Painter Essentials 4 includes RealBristle brushes in two different brush categories. By authentically reproducing the sensation of the interaction between paint, canvas and brush, RealBristle brushes take realism to a whole new level.
• New! Pens—Corel Painter Essentials 4 introduces pens in the Pencils & Pens brush category. With new options such as the Scratchboard Tool and Smooth Edge Calligraphy, it’s easy for users to ink their own comic books or do calligraphy.
• New! Paper Textures—Corel Painter Essentials 4 features an expanded selection of paper textures that faithfully reproduce the feeling of using traditional art materials. Users can control the texture of the canvas to achieve the results expected from using traditional media on a given surface- for example pencil on watercolor paper, felt pens on cotton paper or chalk on a sidewalk
Built in Tutorials
• New! Tutorial-Based Guidebook—The Corel Painter Essentials 4 Guidebook provides step-by-step tutorials that help users discover the full capabilities of the software while completing fun projects. With options for both beginners and more advanced users, the guidebook introduces various Corel Painter Essentials media and educates new users about artistic principles and elements.
• New! Video Tutorials—Built in video tutorials by John Derry, noted Corel Painter Master and Ambassador, guide users through a variety of digital art projects, all included in the guidebook.
Enhanced User Experience
• New! Additional Undo Levels—With 32 undo levels, Corel Painter Essentials 4 provides users with maximum flexibility and freedom to experiment with techniques and effects- always confident that they can return to a previous step or design.
• New! Online Print Services—Once users have created their masterpiece, they can order prints of their artwork on canvas, watercolor paper or other fine art materials—directly from within Painter Essentials 4.
• Enhanced! Support for Wacom Products—Corel Painter Essentials 4 fully supports the entire Wacom product line, including the Bamboo(tm) Fun pen tablets, the Intuos pen tablet, the Wacom 6D Art Pen and the Cintiq 21 UX interactive pen display.
For a complete list of new and enhanced features in Corel Painter Essentials 4, please visit http://www.corel.com/painteressentials.
“With Corel Painter Essentials 4, anyone can produce truly exciting artwork even if they have never picked up a sketching pencil or a paint brush,” said John Derry, Corel Painter Master. “With a welcoming interface that encourages experimentation and creative ‘play’, Corel Painter Essentials 4 is designed to help users express themselves in ways they may have never thought possible. The features are easy to find and understand making for an intuitive, fun and rewarding user experience.”
Pricing and Availability
With a suggested retail price of $99 U.S. for the full version and $69 U.S. for the upgrade, Corel Painter Essentials 4 is available starting today through http://www.corel.com and in the coming weeks through Corel’s global channel partners. To learn more about Corel Painter Essentials 4 or to download a free, fully-functional trial version of the software, please visit http://www.corel.com/painteressentials.
Monday, March 10, 2008
Detailed Ultra High Resolution Parchment Textures from Photomorphix
Detailed ultra high resolution parchment textures great for chroma key background replacement and still life photography backgrounds. These Textures can also be used as Photoshop layers to add texture and color to your image.
Another unique, high quality CD from Photomorphix. More info.
About Photomorphix
Photomorphix offers a diverse range of royalty-free Backgrounds,Textures, Patterns and Stock Photos for the digital artist.
You won’t find any filter generated backgrounds here! All of our backgrounds and textures are created using high resolution custom made photoshop brushes one layer at a time.
All images are meticulously hand crafted for balance, color, contrast and content. We offer the most interesting and usable images available today. Our goal is to provide our customers unique, high quality images at a low price.
Please feel free to email us with your thoughts or ideas on our website or image products. We look forward to serving your creative imaging needs.
Monday, March 10, 2008
Build Amazing Forms Online with Wufoo
Wufoo is an Internet application that helps anybody build amazing online forms. When you design a form with Wufoo, it automatically builds the database, backend and scripts needed to make collecting and understanding your data easy, fast and fun. Because we host everything, all you need is a browser, an Internet connection and a few minutes to build a form and start using it right away.
We believe forms are the starting point for building anything useful on the web. Basically, they’re the most efficient mechanisms for collecting data from people. The problem is creating an online form isn’t very efficient.
The process of creating a form and all the database structures and scripts necessary to make it work (not to mention useful) is a really tedious process that makes what should be a simple task (collecting and understanding information), not really worth the time, effort or cost of the endeavor. The entire process could take you or your IT person days, if not weeks. With Wufoo, you can skip all the hard stuff (because it does it all for you), and start getting things done.
Top 10 Reasons to Use Wufoo
1. Wufoo is easy.
If you’ve ever used a desktop form building application, then you’re familiar with complexity. If you’ve ever hired a programmer to make a form for you, then you’re familiar with delays and communication barriers. Enter Wufoo. Wufoo enables anyone from students to secretaries to office managers the ability to publish an online form within minutes. Your forms, on your terms. Programming experience not needed.
2. Wufoo is fast.
Why wait days and weeks for someone else to build a database and all the scripts needed to just collect simple information from your form? With Wufoo, you can build, design, and collect with professionalism and personality in only a few short minutes.
3. Wufoo is fun.
Just because you’re working with forms and data, doesn’t mean you have to do it without personality and style. Gathering information from your users is exciting, why shouldn’t your tools be exciting too?
4. Wufoo is secure.
We’ve done everything possible to ensure the safe keeping of your data and the data you collect. Our servers are located at 365 Main and backed up onsite and offsite—every 12 hours in Toronto and every 24 hours in Virginia. We also offer plans with 128 bit SSL encryption on form submission. We have the expertise of BitPusher, a company whose founders have experience with Napster and Netcom (among others), to ensure that everything is safe and stable on the hardware end.
5. Wufoo is portable.
Wherever you have an Internet connection, you have access to Wufoo. Plus, all the data you collect with Wufoo can be exported to Excel or CSV so you can take your data offline and with you wherever you may go.
6. Wufoo helps you understand.
Your data is pretty useless if you have no way of organizing and understanding it. Wufoo allows you to filter through entries, create reports, and build graphs based on your collected data. We also give you the power to share and password protect this data, so you’re in control of who can see your information.
7. Wufoo integrates with your web site.
While we do offer hosting of all of your forms, we realize that placing a form on your own site is often a priority. Wufoo offers easy, copy/paste solutions for integrating a Wufoo form into a web page. For advanced users, full CSS and XHTML markup is also included. To simplify the process even further, the intuitive Wufoo theme manager allows you to customize the look of your form with a few clicks of the mouse so that your form seamlessly matches the look of your site.
8. Wufoo is affordable.
Desktop software, outsourced programmers, and even an internal IT department are all expensive solutions for building a form. With Wufoo’s tiered plans, ranging from FREE to $199/month, a more affordable solution is offered to anyone with form building needs.
9. Wufoo talks to you.
Forms are built to collect data, but wouldn’t it be nice to be notified when submissions come in, and have a statistical look on the activity of your forms. With Wufoo, you can have all entries emailed to you, or updated in your RSS feed, as they are submitted. On top of that, each form comes with graphs on the usage over the day, week, month, and year.
10. No long term contracts.
Wufoo costs less than most desktop software and a lot less than hiring a development team. After creating an account, you can leave at anytime without any questions asked. Why not try it out when it costs so little to be the office hero?
Visit www.wufoo.com for a demo.
Wednesday, December 26, 2007
RSSWorkbench - RSS Authoring and Publishing Tools for Webmasters
RSSWorkbench.com provides a nice collection of RSS/XML Tools for Webmasters as well as a RSS Feeds Directory. Currently the site contains 140 links to various resources and 196 feeds in 33 different categories. Topics include creating an RSS feed, parsing RSS feeds, combining multiple RSS feeds and ways to display live feeds on your own website. If you’re new to RSS, be sure visit the ’RSS Basics‘ section.
Tuesday, December 25, 2007
Dreamstime and PixelPerfect Combine to Offer a Picture Perfect!
Dreamstime.com and PixelPerfectDigital.com (PPD) have formed an alliance to make photo shopping easier for the PPD user.
Primarily a free stock imagery provider, PixelPerfectDigital (www.pixelperfectdigital.com) offers high quality stock photos to the design community in addition to providing the latest industry news and links to useful online resources related to photography and design. PPD will expand its service to feature photography, graphics, artwork, abstract sketches, scenic backgrounds and more, as exclusively offered by Dreamstime.
For the window shopper, PPD will now display on its home page select Dreamstime photos that are a “perfect fit” for its existing customer base. In addition to the Dreamstime photos that will appear on the PPD display counter, those PPD members that are in search of a photo-extraordinaire can now enjoy an unlimited photo shopping experience. PPD will provide immediate access to the best-edited gallery of the 2 million-plus images that Dreamstime.com has to offer--increasing PPD’s image library by 99.9%.
“We are excited about our partnership with Dreamstime and the value it brings to our users,” said Darren Hester, President of PixelPerfectDigital.com headquartered in Macon, GA. “We’re confident our users will appreciate the added selection of high quality imagery at such an affordable price.”
“The objective in our partnership with PixelPerfectDigital is two-fold,” added Dreamstime co-founder and CEO, Serban Enache. “One, to assist PPD to expand their overall service to offer a product that they could not otherwise provide and two, to enable both PPD and Dreamstime to become increasingly visible on the web bringing more value to the users and widening our audience.”
In it’s overall objective to become THE ONLY PLACE TO SHOP for microstock imagery, this “affiliate consortium” is in alignment with Dreamstime’s many interwoven internet marketing campaigns. Dreamstime has established similar relationships with Boombucket.com, Brightqube.com, Openphoto.net, Picfindr.com and Stockvault.net among others. “This is a Dreamstime blueprint,” Enache offered. “Aligning Dreamstime with PPD and many other community-based sites enables us to expand our exposure overall. It’s a win-win situation and another example of Dreamstime’s community/ networking strategy--keeping the pace with web 2.0 trends. Partnering with other sites will enable us to double our exposure.”
A multi-platinum global stock photo agency, Dreamstime.com is one of the top three stock photography agencies in the world. With now just over 2.1 million images, Dreamstime has the distinction of offering the best-edited images that money can buy, and some are ABSOLUTELY FREE! Make photo shopping a virtual and visual experience, visit www.dreamstime.com.
Saturday, October 27, 2007
Two New Templates Release at DesignsByDarren.com
I’ve just release two new CSS web page templates at DesignsByDarren.com. Garden Gate is a 3 column CSS template. The two smaller columns on the right are both 160 pixels wide. This gives you plenty of room for links, advertisments and affiliate links (see demo). The main content area is 340 pixels wide by default. At this width the entire page will be visible in 800x600 browsers. You can quicky change the layout to a wider fixed width or fluid width layout. The page width is defined in the #page_wrapper DIV in the style sheet included with the package.
Technology Blog is a 2 column fixed width template with rounded corners. The page width is 750 pixels so it fits nicely in a 800x600 browser window. The left column is 470 pixels wide. Perfect for displaying 468x60 adverts. The right sidebar is 160 pixel wide so it is ideal for 160x600 tower ads (see demo). This design is easy to modify. The horizontal menu is just a styled list. Changing the header graphic is easy as well. The layered PSD is included.
Both designs are provided free of charge under a Creative Commons Attribution-Noncommercial 3.0 License. Essentially this means you may use our free templates for any personal or non-profit web design project as long as you give me credit . I require a link back to http://www.designsbydarren.com/ in the footer of all sites using my free templates. ( How to Link )
Want to use this design for a commercial project? I charge a small fee of $9.95 USD. This will allow commercial use for 1 project / 1 domain. No link back required. You may purchase a commercial license using the PayPal. See site for details.
Friday, September 28, 2007
Over 320 mini pixel icons! All Free!
These mini icons are designed at 14×14px with transparent background. They are specially designed for header or side navigation buttons. Feel free to use these icons for your site (personal or commerical). However, if you are using more than 10 different icons, you must give a link back to N.Design Studio.
If you like these icons, please help me to spread out the word: bookmark this page, blog it, and share it on forums.
Visit N.Design Studios and Browse the Icons
Wednesday, September 26, 2007
Css Tab Designer by OverZone Software
CSS Tab Designer is a unique and easy to use software to help you design css-based lists and tabs visually and without any programming knowledge required!
With the CSS Tab Designer, you can :
- Quickly design your list visually
- Choose from a variety of styles/colors (60+ different designs/colors supported). [ Styles Authors / Credits ]
- Generate strict xhtml compliant code
(1.35 MB) Windows 98 / ME / 2000 / XP / 2003 [ Visit Download Page ]
Tuesday, September 25, 2007
34 Places to Get Design Inspiration - Online and Off
Article by Cyan Ta’eed, FreelanceSwitch.com
Everyone who hasn’t encountered designer’s block, raise your hand. Just as I thought. Well then, chances are you could use some places to get inspiration for those days when the pixels aren’t aligned and your mouse finger isn’t clicking like it should. We’ve compiled a list, online and off to serve up everything from logos to icons to art to fashion to just inventive ideas to get your mind ticking.
So kick back and let your senses run wild as we bring you 15 websites packed full of inspiration, 10 must-have books and 9 things to do to get inspired.
Tuesday, September 25, 2007
Stripe Generator - Ajax Diagonal Stripes Background Generator
Tired of pixel-by-pixel painting, trying to create seamless stripes textures? Here we are! Enjoy using stripe generator! Unleash your personal style, experiment and download the tile. You can use it directly in your css file or as pattern in Photoshop! If you like our tool, feel free to credit stripegenerator.com by linking us with our banner.
Monday, September 24, 2007
The Open Source Web Design Toolbox: 100 Web Design Template Sources, Tools and Resources
Article by Mustafa, DesignVitality.com
The open source model has, over the last 20 years, proven that collaborative development is one of the best ways to incorporate the newest ideas and latest concepts into design.
In fact, the open source model, which began with programmers, has been so successful that it is currently being applied in government, media, education and private business. But despite these new applications, the unique combination of the open source model with the universalism of web design remains one of the ideal applications of open source. This pervasiveness of the open source spirit in web design now means that you can use open source software to design both graphics and your CSS and HTML, and you can also use the dozens of reliable open source code resources or thousands of web design templates to base your own designs on. In this article we highlight 100 open source web design templates, resources, and tools.
Sunday, September 23, 2007
Web Design from Scratch
Web design is a complex discipline that involves a wide range of skills. I notice that some of the most basic skills are lacking in many web site designs. Those basic skills are quite simple, but can be hard to gain because of a lack of teaching material. That’s what WDFS aims to solve! Designing effective web sites requires having a firm understanding of design fundamentals, and applying them with an eye for simplicity. The simple approach doesn’t make sites boring or plain! On the contrary, well-designed sites can be beautiful, and fulfilling and enjoyable to use. ‘Web Design from Scratch’ describes my approach to simple web design.
Saturday, September 22, 2007
Input Forms Without Tables
Tutorial by Nick Rigby, A List Apart
“It can be time consuming to make web forms both pretty and accessible. In particular, laying out forms where the form label and input are horizontally adjacent, as in the image below, can be a real problem. We used to use tables, which worked well in this scenario—but forms don’t constitute tabular data, so it’s a semantic faux pas.
I’ve tried to create a form-styling solution that is both accessible and portable (in the sense that I can move the code from one project to the next). Floats have often provided a solution to my problem, but given the complexity of some layouts and the numerous float bugs associated with Internet Explorer, it’s not always easy to reuse a float solution. I wanted to create something that anyone could easily reuse on any project: a style sheet that, when applied to a correctly marked up HTML form, would produce the basis of the required layout. So here it is—my attempt at portable, accessible forms.”
Friday, September 21, 2007
COLOURlovers Allows Creative Individuals to Share Colours & Palettes They Love
COLOURlovers™ is a resource that monitors and influences color trends. COLOURlovers gives the people who use color - whether for ad campaigns, product design, or even in architectural specification - a place to check out a world of color, compare color palettes, submit news and comments, and read color related articles and interviews.
The COLOURlovers™ community is regularly updated with information and examples of the way colors are used in the real world—along with news articles on color trends and interviews with top creative professionals. Here everyone who is interested in the practical applications of color can find an index of color trends as they are happening. Together, they create a color trend index for the entire world provided by users of color worldwide. It’s a tool designers and artists of all kinds use to work with colors in new ways and quickly find out what’s hot and what’s not. This site allows anyone to find their inspiration for color by searching, sorting and filtering through keywords to a color scheme that interests them… or create and share your own!
Thursday, September 20, 2007
CSS Layout Generator
The layout generated has changed significantly from previous versions. The main reason for change was to simplify the layout and in doing so make it easier to use. It no longer provides fixed width columns with fluid center or full length columns by default. This generator will create a fluid or fixed width floated column layout, with up to 3 columns and with header and footer. Values can be specified in either pixels, ems or percentages. Links to articles in the “Layout Hints” box to the right and the CSS Forum will provide help where needed. The generator requires a DOM capable browser with JavaScript enabled.
Wednesday, September 19, 2007
70 Expert Ideas For Better CSS Coding
Tutorial by Smashing Magazine
CSS isn’t always easy to deal with. Depending on your skills and your experience, CSS coding can sometimes become a nightmare, particularly if you aren’t sure which selectors are actually being applied to document elements. An easy way to minimize the complexity of the code is as useful as not-so-well-known CSS attributes and properties you can use to create a semantically correct markup.
We’ve taken a close look at some of the most interesting and useful CSS tricks, tips, ideas, methods, techniques and coding solutions and listed them below. We also included some basic techniques you can probably use in every project you are developing, but which are hard to find once you need them.
Tuesday, September 18, 2007
2-Col Tableless Layout Tutorial at Wellstyled.com
Sometimes you may need two columns of the same height in your layout. If the height of their content differs, their backgrounds should flow and end at the same position. This is exactly how columns were made by tables.
There are several ways to make two columns in CSS. You can use one floating block, both blocks floating, one block positioned into other’s margin etc. Anyway, every time the block ends where its content ends. That’s OK — in fact, the “same-height columns” is just a design illusion: not the columns, but the background under them makes the effect. Thus, let’s make the columns of their own height and then just play with the background. That’s the matter.
Tuesday, September 18, 2007
Monoslideshow - Your Photos on Your Site
Monoslideshow is a Flash® slideshow to view your images in a web page. It can be placed on every website, in whatever size you want and filled with whatever content you like. It’s designed for maximum flexibility, whether you want to have a professional looking portfolio, or just an image rotator on your website.
Features
- Resize and position everything to suit your needs
- Color every object in the slideshow
- Performs professional transitions, including the Ken Burns effect
- Contains high quality typefaces
- Create your own water mark
- Supports sound and music
- Monoslideshow talks XML, so it’s easily integrated in your existing site
How does it work?
Monoslideshow is a single .SWF-file. There’s no need to edit the slideshow in the Flash® IDE itself. Instead, all its information is directly read from a .XML-file. It’s compact, extremely versatile and very easy to integrate in your existing website.
What you’ll need
- Flash® player 7 or higher
- A website
- A text editor (such as Notepad or Texteditor)
- An FTP client
What does it look like?
Have a look at the demo page for a live showcase!
Saturday, September 15, 2007
BrowserShots - Test Your Web Design in Different Browsers
Browsershots makes screenshots of your web design in different browsers. It is a free open-source online service created by Johann C. Rocholl. When you submit your web address, it will be added to the job queue. A number of distributed computers will open your website in their browser. Then they will make screenshots and upload them to the central server here.
You may use the screenshots of your own webpages for any purpose, even for inclusion in closed, for-cost works. It would be nice if you’d mention that you used browsershots.org for the screenshots, but you don’t have to. For the foreseeable future, there will be free screenshots for everybody. So far, there are no fixed plans for a commercial model. If and when a paid priority service is introduced, the free service will continue. Screenshots will be deleted when they haven’t been accessed in ten days. This means that if you post a link to your screenshots on your blog, and people look at them again and again, the screenshots will stay on the server forever.
Monday, September 10, 2007
Photo Sharing Forum - Free Stock Photo Community
Photo Sharing Forum is a new online community where users can upload and download free images for use in both personal and commercial projects. As of this post, the site has 180 high-resolution photographs online. All images are provided free of charge under a Creative Commons Attribution 3.0 License with the condition that a credit (printed use) or a hyperlink (online use) is made giving the photographer credit.
Crediting Photo Sharing Forum as the source of your images is easy (and a requirement of using the images on the site):
Online Use:
Includes websites, software, games, demos, pdf documents, flash presentations, interactive video presentations, office documents and any other medium capable of having a hyperlink inserted. If you don’t want to add a text link to your page then as an alternative you can make the image itself a clickable link with the target being “http://www.photosharingforum.com”
Printed Use:
Includes but is not limited to books, magazines, newspapers, flyers, pamphlets, mugs, t-shirts, banners, posters, key-rings, mouse-mats, fridge-magnets, CD and DVD cover artwork, non-interactive video presentations etc. The credit should be printed in the same way as any other photo credits in publication, if there are no other credits then place the credit somewhere on the same page or facing page. The credit at minimum is “photosharingforum.com”.
For more details regarding the terms of use, visit http://www.photosharingforum.com/how_to_link.php
Monday, July 16, 2007
Learn HTML and CSS: An Absolute Beginner’s Guide
SitePoint tutorial by Ian Lloyd
“So, you’re ready to take the plunge and begin to learn how to build your own web pages and sites? Fantastic! We’ve got quite a ride ahead, so I hope you’re feeling adventurous.
Before you dive in and start to build your web site, we need to take a little time to get your computer set up and ready for the work that lies ahead. That’s what this section is all about: ensuring that you have all the tools you need installed and ready to go.”
Saturday, June 30, 2007
Browse Hundreds of Photostore Sites at PhotostorePowered.com
PhotostorePowered.com is a specialized link directory and blog for websites using Photostore, a web based software package that enables you to publish and sell your photographs, images, and artwork online.
The PhotostorePowered directory is organized into five categories: Event Photography, Photo Sharing Websites, Posters & Prints, Rights Managed Photos and Royalty Free Photos. Browse by category or use the search feature to located listing based on keywords.
Every site summary includes a small 120x90 thumbnail and some basic info including number of hits and page rank. Results can be sorted alphabetically, by number of hits or by page rank. The listing details page provides a large 400x300 preview and additional statistics including Alexa traffic rank, number of indexed pages and number of backlinks.
If you have a Photostore website, you can submit it to PhotostorePowered.com free of charge. If you’re a webmaster considering Photostore, the site will give you lots of creative ideas and inspiration.
- Visit PhotostorePowered.com
About Photostore
PhotoStore allows you to setup a complete photo selling website on your server or hosting space in just minutes. Perfect for professional photographers looking to sell their photos or prints to their customers online. PhotoStore also works for anyone who would like to run a stock photo type site.
About KTools.net
In 2003 we realized a need for professional software to host photos online. From this PhotoHost was developed. Later PhotoStore was developed for selling photos online. Since then Ktools.net has been offering the very best in software and support.
Our goal is to provide the very best software for online photo hosting and selling and top notch customer support to go along with it. We will continue to develop relationships with our customers and create professional software for years to come. Currently over 1300 sites across the internet use Ktools.net software and that number is growing every day.
Ktools.net is located in the United States 20 miles outside of Grand Rapids in Cedar Springs, Michigan. For more information visit www.ktools.net.
Monday, May 28, 2007
Image Abstraction Offers Free Abstract Imagery to Photoshop Artist and Designers
Image Abstraction offers High Resolution Backgrounds, Patterns and Textures to Photoshop Artist and Designers. These images have been manipulated using Photoshop and a variety of plugins to create some interesting effects. You can learn more about the software used on their About Page.
Categories include:
- Brick, Rock and Stone
- Industrial and Mechanical
- Liquids and Gels
- Natural and Organic
- Old Signs and Stickers
- Synthetic Surfaces.
The collection is released under a Creative Commons Attribution-NonCommercial-ShareAlike 2.5 License which allows you to use them for non-commercial projects provided that you attribute the site by providing a link back to ImageAbstraction.com.
About Image Abstraction
Image Abstraction is a division of Pixel Perfect Stock. Pixel Perfect Stock offers affordable Stock Photos, Backgrounds and Textures to Photoshop Artist, Graphics Artist and Web Designers.
Wednesday, May 23, 2007
Pligg Content Management System
"Pligg is unique compared to most other content management systems because of its flexibility. A web designer can do pretty much anything with Pligg because the software was designed to be used in as many ways as possible. Not only can a person with very little knowledge of PHP and MySQL install it, but they can modify and administer it with relatively little difficulty. For those who have a greater understanding of web languages, Pligg can act as the first step in a highly customized personal content management system.” - Eric Heikkinen, Pligg Web Director
In a world with so many Content Management Systems fighting for control it can seem nearly impossible to pick out a perfect CMS to suit your needs. That’s why Pligg exists, because we know that no CMS is going to offer a perfect out-of-the-box experience for every user. The net would be a boring place if every site looked and acted the same, so be different! Pligg’s dynamic structure allows users to quickly and effortlessly install and customize their sites. Pligg acts as a framework for many sucessful sites who have taken the code offered by Pligg and added their own touch to it. If you’re looking to create a unique site quickly and with as little effort as possible, consider using Pligg.
Pligg requires that your server has installed a recent version of PHP and MySQL. You must be able to access a MySQL database for storing data, if you don’t know how or if your web host offers MySQL access please contact your host for details.
Tuesday, May 01, 2007
FreePhotoClips.com - Download Background-Free Photo Objects in Adobe Photoshop PSD Format
I launched another website this week, FreePhotoClips.com, that provides free photo objects (aka Photo Clips) for personal and non-profit design projects. I’ve masked each image on it’s own Photoshop layer which makes it a snap to incorporate it into any background regardless of the color. These are perfect for Web Pages, Blogs, Powerpoint Presentations, Newsletters and most any other multimedia project. As of this post I have 20 photoclips in the gallery. I’ll be adding more every week. I hope you find the site to be a useful resource.
Saturday, April 14, 2007
Urban Dirty - Free Texture Stock Photography
Urban Dirty is a regularly updated online photo library featuring 153 gritty, grimy and sometimes slimy images for use in design and artwork creation. For example, here’s a desktop wallpaper using an Urban Dirty photo. View the images in small, medium or large, download or edit online and have fun with them.
The photos featured on this site are currently free for you to download for both commercial and non-commercial use. All we ask is that you credit urbandirty.com, somewhere, somehow. All photos are licenced under a Creative Commons Licence.
The maximum size for most photos is 2048 x 1536 pixels at 180 dpi. You can find photos by searching for tags. Tags are descriptive words, or keywords, that help categorize content. For example, a search for splat would find all photos tagged splat.
Tuesday, April 10, 2007
500 Web Page Headers Online!
We now have 500 images online in our gallery. Thanks to all those who have supported the site by uploading. It’s very much appreciated. As of this post, we have over 1,500 registered users. We receive an average of 539 unique visitors per day. I’m glad to see so many people are finding the site useful. I’ve added 3 additional categories in the gallery: Animals & Insects, Digital Art, and Shapes & Patterns. Keep those images coming!
Monday, April 09, 2007
Designs By Darren Offers Original CSS Web Design Templates
Designs By Darren offers high quality CSS web design templates at affordable prices. Every template has been built from scratch using Valid XHTML and CSS. I also include the source PSD files that I used to create the template’s images. If you have a graphics editor that can open PSD files, such as Adobe Photoshop, Corel Paint Shop Pro, or The GIMP, you can easily customize the images in the template.
Download the Free Sample Templates template and check out the quality yourself.
Tuesday, March 27, 2007
StockVault.net Launches New Website
My good friend Bjorgvin has launched a brand new version of Stockvault.net. New look, new features, and lots of new images! Browse and search the photo gallery of over 7.000 royalty free, high resolution stock photos, templates and logos to use in your personal and educational design projects. You can now share your own photos by signing up as a photograper to give something back to the community.
In case you are looking for SUPER high resolution textures and backgrounds, visit StockVault’s sister site TexturePacks.net, where you can buy and download images in packs of 25.
Sunday, March 04, 2007
GrungeTextures - Free Stock Photos, Images, Backgrounds and Digital Art
Download Free High Resolution Textures for Digital Art, 3D Rendering, Web Design or Print Projects!
We have a growing collection of quality images ready for you to download including Asphalt Textures, Brick Textures, Concrete Textures, Grafetti & Vandalism Textures, Metal Textures, Paper & Cardboard Textures, Peeling Paint Textures, Rusted Metal Textures, Spills & Splatter Textures, Stone Textures, Trash & Garbage Textures, Wood Textures, and other distressed surfaces.
All of our images are high resolution JPG’s (2400 pixels x 1800 pixels minimum). Registration is not required and we provide flexible Creative Commons Licensing.
The gallery is updated monthly so be sure to check back to see what’s new. Please feel free to contact us if you have any questions.
Sunday, January 07, 2007
Build a Custom Amazon.com Associate Store
Amazon.com offers an amazing affiliate program where you earn up to 10% for every sale generated from your website/blog. They take care of order processing, collecting the money, and shipping the product to the customer.
The problem is it can take a lot of time and programming expertise to create a complete store from which to begin selling. That’s why Associate-O-Matic was created.
Features at a glance:
- Affordable
Free and paid versions make it accessible to anyone Profitable Turn visitors into buyers
- Customizable
Control the look and feel from top to bottom Integrated Uses your domain name throughout
- Timesaver
Build a complete store in literally minutes - Targeted
Choose the categories/items you want(filter those you don’t) - Selection
Thousands of items across thousands of categories - Simple Setup
No programming or database required - Expandable
Build one store (or many stores) or add a shopping area to your existing website or blog
For more details on this script visit Associate-O-Matic.com