This extended category features articles on client-side and server-side programming languages, tools, frameworks and libraries, as well as back-end issues. Experts and professionals reveal their coding tips, tricks and ideas. Subscribe to the RSS-Feed.
Popular tags in this category: CSS, CSS3, HTML, JavaScript, jQuery, PHP, Techniques, Essentials, Tools.
At some point or another, you will find yourself writing JavaScript code that exceeds the couple of lines from a jQuery plugin. Your code will do a whole lot of things; it will (ideally) be used by many people who will approach your code differently. They have different needs, knowledge and expectations.
This article covers the most important things that you will need to consider before and while writing your own utilities and libraries. We'll focus on how to make your code accessible to other developers. A couple of topics will be touching upon jQuery for demonstration, yet this article is neither about jQuery nor about writing plugins for it.
Read more...The trouble with a color’s name is that it never really is perceived as the exact same color to two different individuals — especially if they have a stake in a website’s emotional impact. Name a color, and you’re most likely to give a misleading impression. Even something like “blue” is uncertain. To be more precise, it could be "sky blue", "ocean blue", "jeans blue" or even "arc welder blue".
Descriptions vary with personal taste and in context with other colors. We label them "indigo", "jade", "olive", "tangerine", "scarlet" or "cabaret". What exactly is "electric lime"? Names and precise shades vary — unless you’re a computer.
Read more...This is our seventh article in a series that introduces the latest useful and freely available tools and techniques, developed and released by active members of the Web design community. The first article covered PrefixFree; the second introduced Foundation, a responsive framework; the third presented Sisyphus.js, a library for Gmail-like client-side drafts. The fourth shared a free plugin called GuideGuide with us, and later we've announced Erskine's responsive grid generator Gridpak and JS Bin. This time we present CSScomb, a tool to help you sort and categorize CSS properties in your code to improve maintenance.
As of this writing, Web browsers support about 200 different CSS properties. In all probability, you use pretty much every single one of them in your projects. So it’s about time to think of the consistency of the ordering of CSS properties inside selector declarations as seriously as you’d think about consistency in the formatting of code. So, if you want to pay attention to your code’s style, this article is for you. There’s a simple way to automatically sort CSS properties in your projects.
Read more...If you have a problem and need a solution for it, chances are high that a JavaScript library or jQuery plugin exists that was created to solve this very problem. Such libraries are always great to have in your bookmarks or in your local folders, especially if you aren't a big fan of cross-browser debugging.
Image credit: Yeoman
A JavaScript library isn't always the best solution: it should never be a single point of failure for any website, and neither should a website rely on JavaScript making the content potentially inaccessible. Progressive enhancement is our friend; sometimes JavaScript won't load properly, or won't be supported — e.g. users of mobile devices might run into latency issues or performance issues with some JavaScript-libraries. Often large all-around JavaScript libraries such as jQuery might be an overkill, while tiny JavaScript micro-libraries could serve as good, "light" alternatives for a particular problem. We'll present some of them today.
In this two-part overview (part 1 and part 2), we feature some of the most useful JavaScript and jQuery libraries which could be just the right solutions for your common problems. You might know some of these libraries, but you probably don't know all of them. In either case, we hope that this overview will help you find or rediscover some tools that you could use in your next projects.
Read more...If you deal with images, sooner or later you will want to automate the repeating process of saving different sizes from one source image. If you own Adobe Photoshop and do not save too many output sizes, Photoshop actions are probably quite enough for your needs. However, keeping a Photoshop action up-to-date is quite painful — change a source folder, and you're screwed.
As you probably noticed in Smashing Magazine's monthly desktop wallpaper series, especially if you work on wallpapers, preparing them for a plethora of desktop resolutions is quite a task. On my own wallpapers website, I generate more than 300 JPEG files for each wallpaper! I want my art to reach as many devices as possible, which means I need to publish my wallpapers in as many sizes as I can support. On the other hand, I do not want to spend the rest of my life resizing my artworks — I’d rather draw new ones!
Read more...With the recent announcement and release of the Retina Macbook Pro, Apple has brought double-density screens to all of the product categories in its current lineup, significantly paving the way for the next wave of display standards.
While the fourth-generation iPhone gave us a taste of the “non-Retina” Web in 2010, we had to wait for the third-generation iPad to fully realize how fuzzy and outdated our Web graphics and content images are.
Read more...Whenever people ask me about the most powerful things in JavaScript and the DOM, I quickly arrive at events. The reason is that events in browsers are incredibly useful. Furthermore, decoupling functionality from events is a powerful idea, which is why Node.js became such a hot topic.
Today, let’s get back to the basics of events and get you in the mood to start playing with them, beyond applying click handlers to everything or breaking the Web with <a href="javascript:void(0)"> links or messing up our HTML with onclick="foo()" inline handlers (I explained in detail in 2005 why these are bad ideas).
Howdy, folks! Welcome to more Smashing Magazine CSS Q&A. It works like this: you send in questions you have about CSS, and at least once a month we’ll pick out the best questions and answer them so that everyone can benefit from the exchange. Your question could be about a very specific problem you're having, or it could even be a question about a philosophical approach. We’ll take all kinds.
If you're interested in exploring more Q&A, there's a bunch more in my author archive.
Read more...When writing a web application from scratch, it’s easy to feel like we can get by simply by relying on a DOM manipulation library (like jQuery) and a handful of utility plugins. The problem with this is that it doesn’t take long to get lost in a nested pile of jQuery callbacks and DOM elements without any real structure in place for our applications.
In short, we’re stuck with spaghetti code. Fortunately there are modern JavaScript frameworks that can assist with bringing structure and organization to our projects, improving how easily maintainable they are in the long-run.
Read more...
Opportunity: WellnessFX, a fast-growing health 2.0 company based in The Mission District in San Francisco, is looking for an engineer with skills in front-end…
YAGER is currently seeking a talented and experienced Game Systems Designer to join our pre-production team of yet unannounced title. Join us in shaping the direction…
With a commitment to quality content for the design community.
Smashing Media Made in Germany. 2006-2013. Impressum