Click the button below to share this item:
Description:
It can be really frustrating if you re new to the design re probably already thinking, You can use Google or some other search engine to find all the information or resources you need . Well you re right, but only partly. While Google and the majority of other search engines are great to hunt for information, it can be confusing as to which site offers what you really need or really want to know, especially if you are new to the industry. Odds are that the more experienced designers 1. Web Developer Toolbar 2. Pixie 3.1 3. A List Apart 4. Multiple IE 5. Google Toolbar 6. Firebug 7. Macromedia/Adobe Flashpaper 2 8. Adobe Design Center 9. Adobe Developer Center 10. Lynda.com 11. CSS The Missing Manual 12. W3Schools 13.Open Cube Infinite Menu 14. Istock.com 15. jQuery AJAX Library 16. Typetester 17. W3C Markup Validation Service 18. W3C CSS Validation Service 19. ColorSchemer 20. sIFR Sources 600 or Custom Size) Tools for Validation. View Source And More Cost: Free Get It Here back to top 2. Pixie 3.1 from Nattyware Pixie is a great little utility, fast and tiny it a perfect fit for Webmasters and Designers. Pixie is a color picker that includes a mouse tracker. If you see a color on a website, document, or any other source that you particularly like, run Pixie and simply point to a color and it will tell you the hex, RGB, HTML, CMYK and HSV values of that color. You can then use these values to reproduce the selected color where needed. Once you start using a color picker you won’t know how you ever lived without one. Cost: Free Get It Here back to top 3. A List Apart A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. It is a huge resource with contributions by many well known and respected designers, technologists, programmers and more. It is a trusted source for quality commentary and discussion and they encourage contributions of high quality from anyone. Cost: Free Visit A List Apart back to top 4. Multiple IE Ever wanted to test your website in various versions of Internet Explorer? Testing in multiple browsers is an important part of testing when developing websites, testing in multiple platform versions of Internet Explorer on the same machine used to be impossible without over-writing the previous version. Luckily in November 2003, Joe Maddalone overcame this over-writing obstacle by exploiting a known workaround to issues involving DLL called DLL redirection. Manfred Staudinger perfected the standalone versions by adding IE version numbers to the title bar of the standalone browser window. Moreover, by removing the IE key in the registry Internet Explorer defaulted to respecting conditional comments based on the version number pre-built in the program. Yousif Al Saif of Tredosoft created this handy installer which contains IE3 IE4.01 IE5 IE5.5 and IE6. Give this a try, I don t think IE 5 should even be dignified with an install, but that would depend on your audience (people still running Windows98 that have never upgraded their IE). I can t say that this tool works flawlessly but we have not had any issues to date and any problem identified can be sent to the developer who from what I see from their Blog is quite active and helpful in any debugging issues. Cost: Free Get It Now back to top 5. Google Toolbar Besides the option of always having a reliable search engine right in the browser, the toolbar contains a built-in pop-up blocker that works great and many helpful add-ons such as spell check, RSS subscribing with one click, instant Blog posting, using Blogger of course, word translation, Gmail integration, an info button that is useful for backlinks and probably most notable feature is the Google PR feature that is handy when you need to get a general idea of Page Rank for a website. These are only a few of the many features at a glance, while you might only use a few of these on your toolbar, the ones you do use make a difference in your browsing experience and workflow. Cost: Free Get It Now back to top 6. Firebug One of our favorite development and debugging tools that we use on a daily basis is Firebug. Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. I use this constantly and I honestly can t give it enough praise. You have to give this tool a try if you re a designer or a developer because it will definitely make your work life run smoother. Cost: Free Get It Now back to top 7. Macromedia/Adobe Flashpaer 2 FlashPaper 2 allows anyone to convert printable files into Macromedia Flash documents or PDF files with one click. This is a great tool to create documents quickly and easily for clients or your websites visitors. We covered FlashPaper2 in one of our previous Podcasts if you want to hear more about the great features visit http://enginesofcreation.com/podcast/?p=6 FlashPaper2 is a great alternative to PDF, the text is crisp and the user interface is pleasing to the eye, easy to use and load time is a fraction of the time compared to .pdf. Some of the things you can accomplish with FlashPaper2 Instantly generate Flash documents that can be accessed by over half a billion web users, or transform files into secure, compact PDFs for e-mailing, archiving, and printing. Cost: Free Trial - $79.00 Get It Now back to top 8. Adobe Design Center Complete with a Think Tank to see how today designers engages with technology. There is a focus on broader issues involving the relationships designers have with developing technologies, tools and the impact they have on society. This may sound more academic but is more or less how Adobe wants this to function. By reading through the articles you will get a sense of how designers Design Box Section that focuses on motion graphics and tons of tutorials on how to use Adobe products. Cost: Free Visit the Adobe Design Center back to top 9. Adobe Developer Center This is a great place to go for information in developing in anything from CSS, Flex, ColdFusion, Flash, XML and More. This side of Adobe is definitely geared to the developer with a focus on code, programming etc. If you are looking for a resource to learn, re-enforce, or build your knowledge there is plenty of information for all skill levels with links galore to articles and tutorials. Cost: Free Visit the Adobe Developer Center back to top 10. Lynda.com Lynda.com is an award-winning provider of educational materials for creative designers, instructors, students, and hobbyists. Lynda.com features an online training library full of training videos with exercise files with a large assortment of topics lead by ell know professionals in their respective fields. Courses are available online or available on CD or by Book. They are constantly adding new titles and do listen to user feedback when considering which topics to expand their training library with. Each lesson is very well recorded and broken into short sections usually 2-5 min in length, perfect attention span oriented time limits. Exercise files are available with different subscription levels and include everything you need to re-create the project (excluding software) and useful resource links mentioned in the video. Cost: Free Trial - $200.00 a Year or $20.00 a Month Visit Lynda.com back to top 11. CSS - The Missing Manual I really enjoyed this book and I find it to be an excellent CSS reference and recommend it for anyone looking to learn CSS or just up their CSS game in general. The book didn t read like a manual, which is a good thing because god knows I read enough of those already. The author David McFarland combines realistic and crystal-clear explanations, real-world examples, a dash of humor, and dozens of step-by-step tutorials to show you ways to design sites with CSS that work consistently across browsers. You ll learn how to: Create HTML that s simpler, uses less code, is search-engine friendly, and works well with CSS Style text by changing fonts, colors, font sizes, and adding borders Turn simple HTML links into complex and attractive navigation bars-complete with CSS-only rollover effects that add interactivity to your Web pages Style images to create effective photo galleries and special effects like CSS-based drop shadows Make HTML forms look great without a lot of messy HTML Overcome the most hair-pulling browser bugs so your web pages work consistently from browser to browser Create complex layouts using CSS, including multi-column designs that don t require using old techniques like HTML tables Style Web pages for printing Cost: $34.99 Buy This Book Visit The Authors Website back to top 12. W3Schools At W3Schools you will find all the Web-building tutorials you need, from basic HTML and XHTML to advanced XML, SQL, Database, Multimedia and WAP. W3Schools is a free site dedicated to the learning of web practices. There are many tutorials offered in a wide array of subject matter related to web design. W3Schools also offers tests to measure your knowledge on a subject which may be followed up with a certificate exam at a low cost. This is a great way to develop a basic learning plan. The certification exam offered must be supervised, but you get to pick who that is, so your best friend is not a good pick, neither is your dog. I would try for an academic sort like a professor of computer science this will help to give your certificate more weight if you intend to use it as a job placement tool. W3Schools is not accredited so any certificate is worth more to you as a personal accomplishment, or to your employer as a measurement tool. W3Schools tutorials are recommended at over 100 universities and high schools over the world. Cost: Free Visit W3CSchools back to top 13. Open Cube Infinite Menu Sometimes it pays to have an excellent drop menu system that you don t have to create from scratch for a client, especially if it is fully compliant and browser friendly to boot. Drop menus are notorious for being tricky to implement and buggy, not to mention search engines don t always crawl them properly, until now. If a drop menu is needed we recommend Infinite Menus by Opencube.com. Infinite Menus is the only Zero JavaScript Pure CSS menu commercially available, our unique visual interface and optional scripted add-ons make site navigation a snap. Dual mode hybrid / pure CSS navigation is light-years ahead of the out-dated DHTML based drop downs still being offered by other software companies. Here are just a few advantages Naturally Search Engine Friendly without added markup. Fully accessible and 508 Compliant. Fully functional with or without JavaScript in all CSS2 browsers. Main menu functionality in non-CSS2 browsers without JavaScript. Zero load time, menu renders and functions immediately. Super tiny footprint is high traffic compatible. Cost: Free Trial, $139.00 - $389.00 Get It Now back to top 14. Istock.com This massive collection of royalty-free images is an excellent resource for photographs, vector Illustrations, Flash files, and Video clips, it is free to join istockphoto.com, and the benefits of joining include a wonderful light-box feature that allows you to save items in folders to reference later. When working on projects you will find it particularly useful to create a light-box with the client s name and save images there so that your design team can look at, add or delete items, this can be done from any location within a browser. You can also email you light-box to your clients so that they may view your selections, or create an account with a light-box for them to choose their own images. This can shift the workload over to the client and allow them to be more involved in their own project. Image prices are reasonable, although there has been a recent change in the pricing format; they are 99% cheaper than rights managed stock photography websites. X-small images start at a dollar and go up to XX-Large for around 15 bucks. Anyone can apply to contribute images to iStock s collection. You can apply to become a photographer, illustrator, or videographer. Once you are accepted, start uploading files, and earn royalties when your images are downloaded. If you are a good photographer and want to earn some extra cash this is a great option. Cost: $1.00 USD s life easier by creating a common set of rules. All we need now is for the major browsers to listen and play nice as well. Cost: Free Visit the W3C Markup Validation Service back to top 18. W3C CSS Validation Service Just as it is important to validate your XHTML pages it is just as important to validate your CSS. A great free validation service is the W3C CSS Validation Service, which will check your Cascading Style Sheets (CSS) and (X) HTML documents with style sheets. It will even give you a list of warnings so you can address potential issues before they arise. Remember, although validators find errors in your page s source, they do no ensure that it will appear as you want in various browsers. It merely ensures that your code is without HTML or CSS syntax errors. Ensuring that your code appears correctly in different browsers require cross a lot of browser testing. To ensure that your website appears as you want in various browsers, you should test as you build in multiple browsers. Cost: Free Visit the W3C CSS Validation Service back to top 19. ColorSchemer There are a ton of Color Wheels on the web; Colorschemer does a good job of providing a useful tool that is not complicated or technical for the exploration of color for your projects. The full version is reasonably priced and there is a 15 free trial for you to evaluate. Colorschemer allows you to save selected colors as favorites, has a built in drag and drop tool to simulate a basic web site design, and you can share your color creations with other users by uploading them to the web. There are many features that you may use to your advantage. There is a color blindness simulator, color mixer, switch from color wheel to swatches, ColorSchemer will even give you suggestions for color schemes, and a lot of other bells and whistles put together in a nice user interface familiar to windows users. Have fun, share your colors and hopefully this makes your life a little easier. Cost: Free Trial - $49.00 Get It Now back to top 20. sIFR Have you ever wanted to retain your non system composition fonts and avoid making them an image so the browser will render them properly? Than sIFR is for you! sIFR lets you use your favorite font on your websites by cleverly working with Flash, JavaScript and CSS. sIFR is a method to insert rich typography into web pages without sacrificing accessibility, search engine friendliness, or markup semantics. That to me is worth its weight in gold. I have always hated being confined to system fonts or having to create images for headlines, which makes them time consuming to change and hard for search engines to index, not to mention throws semantic layout out the window. sIFR solves all these problems and is quite easy to implement . sIFR or Scalable Inman Flash Replacement allows website headings, pull-quotes and other elements to be styled in whatever font the designer chooses sIFR requires JavaScript to be enabled and the Flash plug-in installed in the reading browser. The really cool part is if either condition is not met, the reader s browser will automatically display traditional CSS based styling - the user won t know the difference. That s the part that makes sIFR a safe alternative to image headers or plane Jane fonts. Does this mean that you should use a font face that no one can read? Absolutely not, although sIFR can do it, you should always ensure that whatever font that you choose is legible and reasonable in its use. You wouldn t want to use sIFR on a whole page for instance, it wouldn t be efficient and system fonts are fine for your actual page content anyway. If you want to add some style to your headers however, it can t be beat. Cost: Free Get It Now back to top Online Resources Resources for this entry and information pertaining to each resource was retrieved from the products or authors web site. back to top
