Anyone who’s been involved in web development for any length of time has likely encountered the Developers VS Users situation. It’s a mistake that can often lead to expensive problems down the road. So what exactly is the problem? And how can you spot it–and solve it–before it derails you project and causes you to make a costly mistake? Here’s how…
Most developers became developers because they want to work on and build cool stuff…
I thought I could not be out-geeked. With a background in radio, and having dabbled in the demo scene on the Commodore 64 and hung out on BBSes and IRC for a long time and all the other things normal kids don’t quite get, I thought I was safe in this area.
Then I went to my first WhereCamp, an unconference dealing with geographical issues and how they relate to the world of Web development…
As some of you have heard, there have been two new methods added in jQuery 1.4.2, .delegate() and .undelegate(). These methods achieve the same thing as the .live() and .die() methods, they just use a different syntax. For those new to .live(), it’s a method in jQuery that allows you to attach events to elements that appear in the document as well as elements that will appear in the future. An example would be if you attached a click event via …
JavaScript can transform an otherwise static navigation menu into a feature-rich and interactive user interface that is both pleasing to use and helpful. But, if poorly executed JavaScript can also hide content from search engines, making a site harder to find, which in turn can be devastating for site traffic.
The difference between an effective JavaScript menu—that helps visitors easily navigate the site and helps search engine spiders index it—and one that hides content can be as simple as how the JavaScript is written and implemented…
First of all, thank you for all the great feedbacks and suggestions on the Vector Social Media Icons I released on IconDock. I updated the set with the new Google Buzz, Microsoft Bing, Picasa, Meetup, Feedburner, Ebay, Drupal, Gowalla, ICQ, Metacafe, Yelp, Xing, Paypal, Podcast, and various color buttons. Head over to IconDock to download the latest zip.
…
Using JavaScript has become increasingly easy over the last few years. Whereas back in the day we needed to know the quirks of every browser, now many libraries such as jQuery, YUI, Dojo and MooTools allow someone who doesn’t even know JavaScript to spruce up boring HTML documents with impressive and shiny effects. By piggy-backing on the CSS selector engine, we have moved away from the complexity and inconsistencies of the DOM and made things much easier…
jQuery can empower a developer with the tools required to create a better richer user experience. The way in which we display images, text, charts and graphs can enhance functionality for the wide range of users. Let’s take a look at 35 powerful and effective jQuery plugins and techniques for slideshows, graphs and text effects.
Also consider our previous articles:
Tree controls are one of the most popular ways to represent hierarchical information in web interfaces — they present deeply nested, multi-level content in a compact space, and allow users to expand and collapse nodes to control which parts of the tree structure are displayed.
Today, we’re releasing a jQuery tree control plugin that uses progressive enhancement to transform an unordered list (UL) into a dynamic tree control, complete with accessibility features like ARIA attributes, keyboard and mouse behavior, and focus management…
In recent years Internet Explorer 6 has become the browser web designers love to hate. Security issues, JavaScript errors and inexplicable CSS rendering quirks have made it the brunt of many jokes. With IE6 in its twilight and big companies like Google dropping support, it seems like a good time to take a fond look back at our old foe. In this post we’re looking at what Internet Explorer 6 used to be and why its image changed over the years…
As a thank you to our valued Get Elastic readers, we’re offering you our Friends and Family discount code for the Vancouver 2010 Olympic Store.
The code is good for 15% off any purchase, no minimum! (Excluding Red Mittens, Petro Canada glasses and video games. Ends February 14th.)
For our US readers, use the code EPFRIENDS2010US at the US Olympic Store.
The rest of the world, use EPFRIENDS2010 at the Olympic Store…
As we discuss in our new book, Designing with Progressive Enhancement, and in previous articles and presentations, building with progressive enhancement is essential to ensuring a usable experience for all. But how do you determine which browsers should receive the enhanced experience and which should stick with the basic experience?
Introducing EnhanceJS, a JavaScript framework designed specifically to deliver a usable experience to the widest possible audience, by testing the browser to determine whether it is capable of correctly supporting a range of essential CSS and JavaScript properties, and delivering features only to those that pass the test…
Links. We often talk about why we want them and how to get them, but today I’d like to go back to basics and look at the constituent parts of the HTML code behind them. This is definitely a post for the new SEO, or web-developer looking to expand their experience, but even experienced search marketers may want to comment the nuances of some parts of the humble anchor tag’s attributes.
Here’s a couple of example links; the first is a link to the White House’s website, the other is to Distilled’s new US website…
Though the methods used to gather website traffic statistics call into question the validity of the stats themselves, the fact is that some of your website’s visitors will have JavaScript disabled.
You could divide your traffic sources into four broad categories:
Search engines, mobile visitors, visitors using screen readers and visitors who have JavaScript turned off…
We’re proud to announce that the four of us here at Filament Group have written a book! Designing with Progressive Enhancement is a practical guide that both explains the principles and benefits of progressive enhancement, and explores detailed examples to teach you how, where, and when to implement specific coding and scripting approaches that embody broadly accessible development practices.
We’ll be writing about topics from the book and releasing some of the exciting new progressive enhancement-based jQuery plugins we include with the book over the coming weeks and months so stay tuned…
Print style sheets have been somewhat forgotten, and yet they remain important all the same. Many people print out articles to read while traveling or when they have no access to the Internet.
Print style sheets have definite benefits. For example, reading on paper is less tiring on the eyes than reading on screen.
Also, following tutorials is easier if you have one next to you, with your code editor open on the screen; that way, you don’t have to switch windows every time to look something up…
With relief efforts underway, many displaced Haitians and their friends and families around the world are deeply concerned about the safety and whereabouts of loved ones. In response to the Haitian earthquake, a team of Googlers worked with the U.S. Department of State to create an online People Finder gadget so that people can submit information about missing persons and to search the database.You’ll find this gadget on our Haiti earthquake response website as well as on the State Department website…
CSS and JavaScript are extremely powerful tools for designers and developers. However, sometimes it’s difficult to come up with the one excellent idea that would solve a problem that you are facing right now. Good news: almost every day designers and developers come up with fresh and clever CSS tricks and techniques and share them with other developers online. We regularly collect all these tricks, filter them, sort them, revise them and prepare them for Smashing Magazine readers…
I just wanted to update you the new coupon code on Design Jobs on the Wall. Enter coupon code "promo" on your first job post to get a 75% discount. Some of the potential employers who have posted on the wall include: Fi, The Brick, CTV, Fanshawe College, Hallmark Channel, Peace Corps, eHarmony, TechSmith Corporation, cPanel Inc., Washington Post Digital, Lime Wire LLC, MTV Networks, and more…
Android was developed with one simple idea: Open up mobile devices to enable greater innovation that will benefit users everywhere.We first executed on this vision a little over a year ago, when we launched Android on one device with one operator in one country. Today, we have 20 devices with 59 operators in 48 countries and 19 languages. And because Android is free and open source, it continues to flourish…
I thought we’d try something a bit off-topic and fun today – Hunch’s reader census widget. Go ahead and answer as many questions as you’ve got time for and we’ll publish the results to learn more about the community we’re all in:
Powered by Hunch.com
I’ll be returning to regularly scheduled programming tonight with my long-delayed blog post about our experience raising venture capital…
By Paul Andrew
Using AJAX on websites and applications is pretty much taken for granted nowadays. Users expect it. They want to be able to edit a page in-place, they want search queries to be auto-suggested, and they want to be able to submit a form without refreshing the page. Why? Because those things make browsing quicker, easier and, more importantly, enjoyable.
As great as AJAX is, though, it is not for every website or application…
As the new year is approaching, I have a Mac app giveaway that can perhaps make your freelance management less stressful. It is an app called Billings that allows you to track working time, invoice clients, manage projects, and keep track of your earnings, etc. Simply enter a comment in this post before Jan 3, 2010 for your chance to win one of the three license keys. If you are would like to buy the app, enter coupon code "webwall" to save 15% (valid until Jan 16, 2010)…
As we move forward with the Web and browsers become capable of rendering more advanced code, we gradually get closer to the goal of universal standards across all platforms and computers. Not only will we have to spend less time making sure our box model looks right in IE6, but we create an atmosphere ripe for innovation and free of hacks and heavy front-end scripting.
The Web is an extremely adaptive environment and is surrounded by a collaborative community with a wealth of knowledge to share…
Thanks to the might of JavaScript, the words “dynamic” and “illustration” no longer apply exclusively to Flash-based websites.
Now that dynamic HTML is a reality in most commonly used browsers and that a lot of fancy JavaScript libraries exist to make using it easy, CSS websites can take back some of the street cred held so tightly by Flash.
Of these new JavaScript libraries, jQuery has become one of the most widely adopted because of its ease of use, breadth of features and initial focus on visual uniqueness…
Blogger (Google) and Amazon it seems have collaborated and introduced a way for people using Blogger to monetize their blogs using Amazon. I wonder if Google is making some money as a 2-tier affilaite referring so many affiliates to Amazon
Anyway the implementation is broken for average users
This is what the interface looks like
Seems very simple
Perfect… not!
Average Users
An average blogger blogspot user will see
This as a nice text link
Kindle Wireless Reading Device (6" Display, Global Wireless, Latest Generation)
This as a nice image link
This as a nice text with image
Oops!
If your readers are reading from an RSS Feed that nice text with image gets stripped out, and the same would be true of emails created from an RSS feed…
In my last two tutorials, I explained how to use event delegation for showing and hiding tooltips. In a comment on the first one, Jan Aagaard asked how we might go about enhancing the script by adding a small delay before showing a tooltip. The answer lies with two JavaScript functions, setTimeout() and clearTimeout().
Setting Up
Picking up where we left off last time, I’m going to create the tooltip div, declare a couple variables, and then bind “mouseover,” “mousemove,” and “mouseout” all at once…
In our last article about CSS3, “Pushing Your Buttons With Practical CSS3, we talked about using new CSS3 techniques like gradients, border-radius and drop-shadows to create compelling, flexible and (in some cases) hilarious buttons.
In this second article we’re going to focus on using those CSS techniques (and a little JavaScript) to create some practical elements and layouts…
We’ve posted a few times about Google Web Elements and how they can benefit you as a publisher. Today, we’re excited to announce new features for Google Web Elements, including the addition of 3 three new elements for Google Translate, Reader, and Orkut. For publishers, this means 3 new options for engaging your users and making your website more interactive.To read more about the new features and how to get started, hop on over to the Google Code Blog…
Last time I showed how to use event delegation to create a simple tooltip for a huge number of elements without running into the problem of binding an event handler to all of those elements. In this tutorial, I’m going to refine that tooltip script a bit, avoiding some code repetition and fixing a bug that someone pointed out in a comment.
For review, here is the final version of the script from the last post:
PLAIN TEXTJavaScript:
In an online world now dominated by CSS layouts, CSS-styled HTML lists have become invaluable tools in a CSS developer’s toolbox, due to the HTML lists versatile and graphically flexible nature. All this despite some of the obvious browser inconsistencies that can affect the styling of the different types of lists available in HTML coding.
If you’re new to CSS, this article should provide a good overview of the different types of lists available, as well as some of the browser quirks that occur in relation to HTML lists, with some helpful advice that should prevent those quirks from becoming major road blocks to good design…
You're looking at my set of tools. The custom search engine helps me find the answers to questions more quickly. The RSS aggregator keeps me updated with industry news that matters. And, in the near future, I plan on documenting the major steps and considerations used in SEM as a check list (although it will also work well as a list of tutorials).
While I built (and am improving) the above tools for myself, it seemed like a waste to keep them to myself. After all, good will breeds good will, and perhaps you'll even help me find more great blogs to follow.
In the name of good karma, all my outgoing links on this site are followed. Treat others as you wish to be treated, right? Besides, I think the authors who we read daily deserve all the thanks (links) we can give.
I hope you find the SEM News feed and the free SEO search tool helpful.
- Brett at SEMNewsDaily.com
