background preloader

Collective

Collective

50 Reasons not to use Photoshop for Webdesign | reinegger.net - professional webdesign First things first, I love Photoshop. It is the world’s best program for image editing. I do not intend to say Photoshop is a bad program, I just wish to clear up the misunderstanding that Photoshop is the right tool to use for web and screen design. Photoshop was designed to be used for image manipulation. It was not designed to create effective pixel-precise layouts for computer screens, or to make quick changes to screen layouts. Photoshop tends to be used for this purpose however, because users are familiar with the program, and are not aware that Fireworks was designed for this specific purpose. Users generally try to compare Fireworks with Photoshop. Fireworks can be thought of more in terms of a program such as InDesign. The following video demonstrates some of the most important features that make Fireworks the best layout tool for screen design. Adobe Fireworks CS5 Webdesign Workflow Tutorial from Andre Reinegger on Vimeo.

21 Amazing CSS Techniques You Should Know Cascading Style Sheets(CSS) is one of the building blocks of modern web design without which websites would have been ugly just like they were a decade ago. With time, the quality of CSS tutorials out there on the web has increased considerably. Here are 21 amazing CSS Techniques that you might not have thought could be done by CSS. 1. Cross Browser CSS SlideShow Amazing demonstration of how to create a cross browser image gallery using just CSS. 2. This tutorial demonstrates a crazy way to create an image map using just CSS. 3. Create a lighbox using just CSS with no JavaScript required. 4. Replace the submit buttons with images using CSS, degrades back to submit button if CSS is disabled. 5. Amazing tutorial on how to create an animated navigation menu using just CSS. 6. Create a tree like navigation from nested lists of links. 7. Create eye-catching titles with nice gradient effect using just CSS. 8. 9. Amazing way to create a liquid layout using negative margins 10. 11. 12. 13. 14. 15.

Responsive Web Design Patterns | This Is Responsive Responsive Patterns A collection of patterns and modules for responsive designs. Submit a pattern Layout Reflowing Layouts Equal Width Off Canvas Source-Order Shift Lists Grid Block Navigation Single-Level Multi-level Breadcrumbs Pagination Images Responsive Image Techniques Media/Data Video Fluid Video Iframes Tables Charts & Graphs Responsive Chart Forms Basic Forms Text Lettering Fittext Footnotes Responsive Footnotes Modules Carousel Tabs Accordion Messaging Lightbox

From up North - High quality design inspiration - Part 2 I just love it when companies think outside of the box and uses creativity to market their products. One company that frequently does this is McDonalds and here’s a collection of my favorite McDonalds ads. Which one is your favorite? Official sponsor Torino 2006 Code Snippets - Snipplr Social Snippet Repository 50 Useful Fresh CSS3 and jQuery Tutorials jQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML. it’s also known for fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. Or in developer’s words “write less, Do more”. Modern web sites are designed to provide various types of interactions with users. CSS3 and jQuery effects are used in most of those situations. Now days jQuery is on top of its charm and everyone from design world love to experiment with it. Because of the remarkable significance of JQuery in Designing field, it is an essential to keep yourself up-to-date with its Quality uses and Examples. Fresh Useful CSS3 and jQuery Tutorials In this compilation, we’ll take a look at some of the excellent CSS3 and jQuery tutorials to Enrich your knowledge as well as your site’s user experience. Experimental CSS3 Animations for Image Transitions CSS3 Image Styles Growing Thumbnails Portfolio

Symptoms Of An Epidemic: Web Design Trends Why You Should Get Excited About Emotional Branding Globalization, low-cost technologies and saturated markets are making products and services interchangeable and barely distinguishable. As a result, today’s brands must go beyond face value and tap into consumers’ deepest subconscious emotions to win the marketplace. In recent decades, the economic base has shifted from production to consumption, from needs to wants, from objective to subjective. Read more... A Guide To Validating Product Ideas With Quick And Simple Experiments You probably know by now that you should speak with customers and test your idea before building a product. Mistakes include testing the wrong aspect of your business, asking the wrong questions and neglecting to define a criterion for success. Read more... Building The Web App For Unicef’s Tap Campaign: A Case Study Read more... How To Build A Ruby Gem With Bundler, Test-Driven Development, Travis CI And Coveralls, Oh My! Ruby is a great language. Read more...

100+ Resources for Web Developers | BlogWell Photo Credit: SMITHMag Update #1 – March 14, 2008 Update #2 – September 22, 2008 Translated into Italian at Geekissimo There is some amazing stuff out there on the Web–resources, tools, tricks, and tips. So we’ve put together a list of over 100 resources to help make your life as a developer easier; where to find snippets of code, sites that automate processes, cheat sheets, lessons, useful tools and a couple of silly videos to give your brain a break if you make it through to the end. Code Photo Credit: Josh Lewis 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. .htaccess Creator Online tool to create .htaccess files 12. 13. 14. 15. 16. 17. 18. 19. jQuery jQuery is a fast, concise, JavaScript Library that simplifies how you write your web pages. Cool Online Tools Photo Credit: Stavros Markopoulos 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. Documentation and Reference Photo Credit: Perreira 37. 38. 39. 40. 41. 42. 43. 44. 45. 46. 47. 48. Testing Photo Credit: Sebastian Bergmann 49. 50.

Related: