via http://www.flickr.com/photos/27473194@N07/5128806918/in/contacts/
Archive for December, 2010
Google’s Ngram Viewer: A time machine for wordplay
17
Dec
You may never get through all 500 billion words from more than 5 million books over five centuries. But you can find out, for instance, that "smartphone" is a lot older than you think.
Originally posted at News - Digital Media
HTML5 and CSS3 Without Guilt
17
Dec
Not every HTML5 or CSS3 feature has widespread browser support, naturally. To compensate for this, enterprising developers have created a number of tools to let you use these technologies today, without leaving behind users who still live in the stone age.
Prologue
HTML5 Semantic Elements
The good news is that, except for Internet Explorer, you can create more semantic markup by using the new HTML5 elements — even in browsers which don’t officially support them. Just remember to set the correct display mode: block. The following snippet should reference all necessary elements:
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display: block;
}
IE Conditional Comments
Implementing many of the solutions in this tutorial involves including some JavaScript for specific Internet Explorer releases. Here is a quick overview: the test expression is enclosed in square brackets. We can check for specific versions or versions above or below a stated version. lt and gt mean lower than and greater than, respectively, while lte and gte mean lower than or equal to and greater than or equal to.
Here are some quick examples:
[if IE 6]
Checks if the browser is Internet Explorer 6.
[if gt IE 6]
Checks for a version of Internet Explorer greater than 6.
Tool 1: HTML5 Shiv
In anything IE, excluding the most recent version (IE9), you cannot apply styles to elements that the browser does not recognize. Your spiffy, new HTML5 elements, in all their glory, are impervious to CSS rules in that environment. This is where Remy Sharp’s html5shiv (sometimes called html5 shim) comes to the rescue. Simply include it in your page’s <head> section and you will be able to style the new HTML5 elements perfectly.
<!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->
Notice how the conditional comments only load the html5shiv code on the condition that the version of Internet Explorer is lower than 9. Other browsers, such as Firefox and Chrome, will also ignore this tag and won’t execute the script, thus saving bandwidth.
html5 shiv is based on a simple workaround: it directs IE to create the elements with JavaScript (they don’t even need to be inserted into the DOM).
document.createElement('header');
At this point, they can be styled normally. Additionally, the more recent versions integrate IE Print Protector, which fixes a bug where the HTML5 elements disappear when printing the page..
Tool 2: Modernizr
Modernizr allows you to provide “backup†styling in browsers that do not support certain HTML5 and CSS3 features.
Modernizr is perhaps the best known of these tools, but it is also fairly misunderstood (the name does not help). Take a deep breath: contrary to popular misconception, Modernizr does not enable HTML5 and CSS3 functionalities in browsers that do not support them (although it does include html5shiv to allow you to use HTML5 elements in IE < 9).
Apart from the html5shiv functionality, Modernizr does one thing and one thing only: it runs a series of feature detection tests when loaded, and then inserts the results into the
classattribute of the<html>tag.
Modernizr’s primary purpose is to allow you to offer “backup†styling in browsers that do not support certain HTML5 and CSS3 features. This is somewhat different than traditional graceful degradation, where we use the same CSS styling in all browsers, and then engineer it so that, when specific capabilities are missing, the result is still acceptable.
Now for an example of how Modernizr operates: if a browser supports border-radius and the column-count property, the following classes will be applied:
<html class="csscolumns borderradius">
On the other hand, if the same properties are not supported — say, in IE7 — you will find:
<html class="no-csscolumns no-borderradius">
At this point, you can then use these classes to apply unique styling in browsers with different capabilities. For instance, if you want to apply a different style to a paragraph, depending on whether CSS columns are supported, you can do:
.csscolumns p {
/* Style when columns available */
}
.no-csscolumns p {
/* Style when columns not available */
}
If a browser does not support columns, the .csscolumns class will not be present in the body, and the browser will never have a chance to apply the rule which uses it.
Some might object that this brings us back to the old times of building a different site for each browser. It is true that nothing stops you from writing so many style declarations that use advanced CSS3 features that your stylesheet becomes virtually empty when these rules cannot be applied.
If you want to use Modernizr in a way that makes sense, you must rely on your design talent to conceive alternative styles that don’t break the design and don’t require throwing away the rest of the stylesheet. For example, you might try replacing drop shadows on letters, when they are not available, with a bold typeface or transparency with a different color.
Usage
To use Modernizr, include the minified file, and apply a class of no-js to the <html> element. This last precaution allows you to provide styles for when JavaScript is completely deactivated; obviously, in those cases, Modernizr can’t help you at all. If JavaScript is enabled, Modernizr will kick in and replace the no-js with the results of its feature detection operations.
<head> <script src="modernizr-1.x.min.js" type="text/javascript"></script> </head> <body class="no-js"> . . . . . </body>
If you’re willing to accept that all websites needn’t display identically across all browsers, you’ll find that Modernizr is an essential tool in your web dev belt!
Tool 3: IE 6 Universal CSS
On the same note, designer Andy Clarke has devised an elegant solution for solving IE6′s lack of standard compliance. Called “Universal IE6″, this stylesheet focuses exclusively on typography. The key is to use conditional comments to hide all other stylesheets from IE 6.
<!--[if ! lte IE 6]><!--> /* Stylesheets for browsers other than Internet Explorer 6 */ <!--<![endif]--> <!--[if lte IE 6]> <link rel="stylesheet" href="http://universal-ie6-css.googlecode.com/files/ie6.1.1.css" media="screen, projection"> <![endif]-->
Important Note: Remember to include the latest version, as instructions for older ones are still floating around the web. The final results looks like so:
You have zero work to do to support IE 6 on a new site.
This approach has a pretty obvious advantage compared to classical alternate stylesheets: you have zero work to do to support IE 6 on a new site. The disadvantage, of course, is that the site displays very little of your design. Further, your HTML foundations also has to be rock-solid, in order for the page to be usable even with most styling disabled.
Note that Universal IE6 CSS does not include any styling for HTML5-only elements such as <section> or <footer>. It is not a problem unless you are relying on those elements exclusively to obtain block level display for some parts of the page. Generally, you would always wrap your text also at least in a paragraph or list element.
This solution is clearly not for everybody, and you might find clients who flat out disagree with their site looking brokenwhen viewed in IE6.
You might also argue that, at this point, you can just as well drop IE6 support entirely. Andy Clarke has summarized his answers to these objections here.
This approach works best for content-centric sites, and catastrophically for web applications; but then again, building a modern web application to work well on IE 6 is a challenge in itself.
Tool 4: Selectivizr
Our next champion is a JavaScript utility which aims to introduce new capabilities into older browsers (well, actually just IE 6-8): Selectivizr works in tandem with other JavaScript libraries such as jQuery, Dojo or MooTools to add support for a range of more advanced CSS selectors.
I’ve listed a few below, though note that the full list of capabilities will be dependent upon your preferred JavaScript library.
:hover-
:focus -
:first-child -
:last-child -
:first-line -
:first-letter
To use Selectivizr, download it from their home page and include it within your <head> section, together with one of the support libraries. Here is an example with jQuery:
<script src="jquery-1.4.4.min.js"></script> <!--[if lte IE 8]> <script src="selectivizr.js"></script> <![endif]-->
Selectivizr works in tandem with other JavaScript libraries to provide CSS3 support for IE 6-8.
This point is very important: Selectivizr cannot work alone; it requires your preferred library to be present. Luckily, it is compatible with the huge majority of popular JavaScript libraries. Chances are, if you are using JavaScript on your site, you probably have an appropriate library already included.
DOMAssisant
On the other hand, if you won’t be using a library as well, an alternative solution is to use the light weight DOMAssistant, although you might still prefer your usual JavaScript library for greater ease in managing files.
Be careful though, as the precise selectors that Selectivizr makes available depends on which supporting library is chosen. According to the home page, right now the greatest range of selectors is available with MooTools, while unfortunately jQuery makes the least number of selectors available. It must also be said that some of the selectors that are not available with jQuery are quite exotic and rarely used in the real world usage. Refer to our “30 CSS Selectors you Must Memorize†article for a full list of selectors.
As it happens, with most JavaScript solutions for CSS woes, some restrictions apply.
- For Selectivizr to perform its magic, stylesheets must be loaded from the same domain as HTML pages. This rules out, for instance, hosting stylesheets and other assets on a CDN.
- You are forced to use the
<link>element to include your stylesheets (as opposed to<style>). - Selectivizr does not update styling if the DOM changes after the page has finished loading (if you add elements in response to a user action, for instance).
Tool 5: CSS3Pie
CSS3Pie also enhances Internet Explorer’s [6-8] capabilities, but in a much more native way, as it effectively enables the use of a number of spiffy CSS3 properties, like border-radius, linear-gradient, box-shadow, border-image as well as adds support for multiple backgrounds. Use CSS3Pie and say goodbye to manually sliced and positioned rounded corners.
CSS3Pie: say goodbye to manually sliced and positioned rounded corners.
The way it works is by leveraging little known proprietary Microsoft extensions: the CSS behavior property and HTML component files (official documentation). This extension allows you to attach JavaScript to certain HTML elements using CSS. The JavaScript is included together with some Microsoft proprietary tags, in .htc files which are referenced within the style rules.
For this reason alone, many developers might argue that you shouldn’t use CSS3Pie. Internet Explorer’s proprietary tags are performance heavy and produce less-attractive output.
Why doesn’t CSS3Pie use plain JavaScript? Well there is a JS-specific version, though the team advises against its usage, due to the fact that the JavaScript blocks the parsing of the page.
With the current .htc solution, implementation is quite simple: you only need to upload a single file from the CSS3Pie distribution, PIE.htc, to your server. Afterward, every time you use one of the supported CSS3 properties, add the code below:
behavior: url(path/to/PIE.htc);
Above, path/to/PIE.htc is the path, relative to the HTML file being served; not the stylesheet.
Server Side Instructions
Of course, CSS3Pie can only do its magic in Internet Explorer. It also needs a bit of care and feeding on the server side:
- You should ensure that the
PIE.htcfile is served with atext/x-componentcontent type. The distribution includes a PHP script that can take care of this if you are not allowed to modify your server configuration, for instance on a shared host. PIE.htccan also trigger ActiveX warnings, usually when you are testing it on your localhost. This last problem requires the Mark of the Web workaround to be solved.
CSS3Pie is still, at the time of this writing, in beta mode – as there are still some kinks to be ironed out.
Tool 6: HTML5 Boilerplate
HTML5 Boilerplate goes much further than your standard starter templates.
HTML5 Boilerplate can be described as a set of templates to help you get started building modern HTML5 websites as rapidly as possible. But HTML5 Boilerplate goes much further than your standard starter templates.
For instance, it bundles the latest version of Modernizr (same creator), and the HTML even links to the latest Google-hosted jQuery, Yahoo profiler and Google Analytics scripts for you. The CSS contains the usual reset rules, but also a wealth of @media queries to get you started with responsive web design targeting mobile devices.
Configuration Files
The most unique feature is that, on top of client configuration, you also get the server side: configuration files for Apache and Nginx. This allows you to maximize download speeds and optimize HTML5 video delivery. In particular, the .htaccess files for Apache might be very convenient to drop into a shared hosting account, as often things like gzip compression and expires are not active by default.
Does it do too Much?
Some people might argue that HTML5 Boilerplate takes a bit too many decisions for them (hell, the Apache configuration even automatically strips www. in front of the domain name!) or that it is somewhat Google-centric, though, nonetheless, it’s always interesting to study the files and find what problems the authors have anticipated.
Further, you’re certainly encouraged to break it down for your personal needs. This is simply a boilerplate to get you started.
A Visual Overview
If you want a detailed breakdown of everything HTML5 Boilerplate includes, Paul Irish recorded an exclusive screencast for Nettuts+.
A fully commented version is available at html5boilerplate.com.
Epilogue: Be Bold
Often, the fear of implementing features which do not enjoy full browser support discourages designers from adopting the latest technologies. While the demographics of your audience has to be considered carefully, as well as your client’s wishes, if you accept that sites don’t have to look the same in all browsers, it is possible to make full use today of HTML5 and CSS3.
Think of it this way: if you wait until CSS3 “is complete,†you’ll be waiting forever. CSS2 isn’t even fully supported across all browsers yet! The guiding principle here is that every user should get the most bang for his buck: if he is using a bleeding edge browser, why not take advantage of all the features that browser provides?
Let us know what you think about these issues in the comments. Thank you so much for reading!
Delegating Email with Gmail
17
Dec
Delegating Email with Gmail
This content from: Duct Tape Marketing
Gmail just added a function that allows users to give another user permission to view and respond to their email. This function has been available through my Google Apps account for some time, but I just took note when they pushed it out to the rest of the world recently.
Now, delegating email may sound to some like a terribly impersonal touch or something reserved for only those with at least two or three personal assistants, but the practical small business use for this is very real.
Let’s say you want to create some company mailboxes for things like sales, customer service, advertising, media requests, etc. Many companies do this as a way to channel inquires to a company inbox even though it may be monitored by one person.
Now, let’s say you have two people that field sales inquires and two that field customer service requests. By creating shared or delegated email accounts multiple people can monitor these inboxes and everyone that has permission can see what was replied to and what still awaited a reply. (Add the Canned Responses function and you could also create a library of common responses so that everyone monitoring the box could have company approved messages at the ready)
This is also a great way for those small business folks that do have a personal assistant or VA to delegate certain email tasks or for those that simply use multiple accounts to hook them all together for the purpose of viewing and responding.
The reply from a delegated email says that it comes from the account holder but with that add-on sent by delegatename@gmail.com
Related Posts:
So THIS Is How Bloomberg Gets Earnings Reports Hours Before They’re Publicly Released…
17
Dec
Subscribers to the $1,700-a-month Bloomberg terminal have gotten a gift in the last couple of quarters:
Earnings reports for Disney, NetApp, and other companies have appeared on the system hours before they were publicly released.
If you're a trader, of course, this is manna from heaven. The news is on the Bloomberg, so it's not like it's "inside information" anymore. And yet all the schmoes who just check CNBC and Yahoo Finance won't get it for hours. So you can go ahead and take your position and then dump it as soon as the news hits the broader tape.
So how is Bloomberg pulling off this miraculous trick?
It's using its head! And its massive global technology team, says Ali O'Rourke.
It turns out that some companies don't want to wait until the 4PM market close to post their earnings online, perhaps because they're worried they'll forget. So what they do is post them online earlier, but don't link to the page from their web sites. This renders the page invisible--unless you know what to look for.
Humans are creatures of habit, and the humans who post earnings releases on company web sites are no different than any other humans.
Which means that if the web-page URL for a company's second quarter's earnings release was, say:
www.disney.com/earnings/Q22010release
It's probably a safe bet that the URL for the third quarter's earnings release will be:
www.disney.com/earnings/Q32010release
So the folks at Bloomberg just set their system up to ping the company's server constantly in the hours before the press release is due to appear, in the hope that some dolt in investor relations will publish it before the market closes.
And as the past several quarters have shown, many companies are happy to oblige.
So start pinging those servers, folks. Now that the "expert network" racket has been busted up, it's the best new way to get inside information!
(via Ali O'Rourke)
Now Check Out: 12 Other Awesome Things You Can Do With Your Bloomberg Terminal
Join the conversation about this story »
See Also:
25 New Free High-Quality Fonts
17
Dec
 |
Every now and then we look around, select fresh free high-quality fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually time you should be investing in your projects. We search for them and find them so that you don’t have to.
In this selection, we’re pleased to present Pompadour Numeral Set, Lato, Crimson Text, Espinosa Nova, Musa Ornata, Spatha Sans, ColorLines, Roke1984, Neuton, Avro, Baurete and other fonts. Please note that some are for personal use only and are clearly marked as such. Please read the license agreements carefully before using the fonts; they may change from time to time.
New High-Quality Free Fonts
Pompadour Numeral Set (.eps, released under Creative Commons)
A beautiful numeral font released by Andy Mangold under a Creative Commons license. The font can be useful in various settings, for instance for packaging design or logo deign. The .EPS file is available for free download. The font is free to use as long as the credit is given.
Lato (open-source sans serif)
Lato is a san-serif typeface family. The semi-rounded details of the letters give Lato a warm feel, while the strong structure provides stability and seriousness. Lato consists of five weights (plus corresponding italics), including a beautiful hairline style. The first release includes only the Western character set. Designed by Lukasz Dziedzic.
Crimson Text
“Crimson Text is a font family for book production in the tradition of beautiful old-style typefaces. There are a lot of great free fonts around, but one kind is missing: those Garamond-inspired types with all the little niceties such as old-style figures, small caps, fleurons, math characters and the like. In fact, a lot of time is spent developing free knock-offs of ugly ‘standards’ like Times and Helvetica. Crimson Text is inspired by the fantastic work of people like Jan Tschichold, Robert Slimbach and Jonathan Hoefler. We hope that the free type community will one day be able to enjoy Crimson Text as a beautiful workhorse.â€
Espinosa Nova: Regular (registration is required)
Espinosa Nova is a revival of the types used by Antonio de Espinosa, the most important Mexican printer of the 16th century and quite probably the first punch cutter anywhere on the American continent (1551). All of the fonts intended for setting text include small caps, five sets of figures (old-style and lining, both proportional and tabular, plus tabular small caps), many “f†and long “s†ligatures and a capital sharp “S†(U+1E9E). Designed by Cristóbal Henestrosa.
Color Lines
This decorative font can be used for a variety of products, such as posters, packaging and label design. Original and unique. Designed by Anton Gridz, and available in AI format.
Baurete (free download)
A playful, intriguing typeface that could work for designs without rigid alignment or symmetrically positioned elements. Baurete is free to use for personal and commercial projects. If you want to use it, please contact the designers at [we {at} welab {dot} info]. You can download it for free.
Neuton Font
Neuton is a clean Times-Roman–like typeface by Brian Zick. In structure, it is a transitional type with Dutch inspiration. The x-height is high and the color dark, and it is economical in ascenders, descenders and width. Also available in the Google Font Directory.
Melbourne (personal use only)
Melbourne is a sans-serif with a strong modern presence. The designer’s intention was to create a calm space-saving typeface. The glyphs have rounded corners and relatively large tracking, which makes it a good fit for dictionaries, indexes, catalogues and so on. When used at a large size, Melbourne can be used as a display or headline font. The typeface is released as a draft, and suggestions for improvements are appreciated. Designed by Marco Müller.
ROKE1984
A free display font based on geometric forms and mathematical symbols, this one includes accents and numerals. An interesting option for technical designs that call for a distinctive yet slightly challenging appearance. Designed by Wete. Available in OpenType format.
Classic Round: medium and italic (registration required)
This typeface was designed for text and display use. In small text sizes, the typeface looks clean, inviting and legible. When used in big display sizes, it looks playful and interesting. Designed by Ben Blom.
Free Font FR Hopper: regular and italic (registration required)
FR Hopper is a sans based on geometric forms but still retaining a friendly personality. It is intended for mid-length texts, captions, titles and almost any other occasional use: posters, flyers and even websites. The typeface comes with 7 weights, 12 styles with 836 glyphs, and many advanced OT features such as small caps, discretionary ligatures, alternate characters, fractions, arrows and ornaments.
Darth Vador Free Font
An original geometric font for the Darth Vador theme, designed by Juart Little from France.
League Script #1
“League Script #1 is a modern coquettish script font that sits somewhere between your high-school girlfriend’s love notes and handwritten letters from the ’20s. It includes ligatures and will serve as the framework for future script designs.†Designed by Haley Fiege and available in OpenType format.
Four Free Type
Free original and playful OpenType fonts available in two font weights, regular and italic. Supported languages are English and Russian only. Designed by Alexey Frolov.
Musa Ornata
This typeface, with its cheerful characters, could be a good fit for event announcements, grocery stores and public transport signage. To activate the alternative case, check the “Character Palette†in the OpenType options toolbar in your application. The download link is available at the bottom of the release post (above link). Designed by Carvente Dice.
Skyhook Mono: regular
This family is a carefully handcrafted monospaced typeface family that is modern, sturdy and minimalist, yet distinctive enough for refined and classy uses. The regular weight is available as a free download. The free weight may not be used in political or religious works.
Phoenica Std (personal use only, registration is required)
Phoenica offers an alternative to contemporary humanist sans serifs. It is a flexible family suitable for editorials and corporate branding. Phoenica comes in a big variety of weights, each available in both roman and italic. The regular width is available as a free download and for personal projects.
Indento: bold (registration required)
“Indento is a multi-purpose modern geometric slab serif for headlines, posters and branding, but legible enough to be used for longer text. The straight and rounded corners, combined with the deep cuts and asymmetric serifs, give it a distinctive look while still keeping its legibility.†The bold weight is available as a free download in OpenType format. Designed by Mugur Mihai.
Free Font Adec
This typeface was inspired by Art Deco and Constructivism. It would fit posters, magazines and logos. The distinguishing feature of this font is the combination of decorative elements, such as textures and frames. Designed by Serge Shi.
Jean-Luc (Godard) (via I Love Typography)
“Atelier Carvalho Bernau Design released Jean-Luc, a typeface inspired by the title cards of films like ‘Deux ou trois choses que je sais d’elle,’ to celebrate Jean-Luc Godard’s birthday. The style of lettering is so interesting to us because it is such a clear renunciation of the ‘pretty’ classical title screens that were common in that time’s more conservative films. It has a more vernacular and brutishly low-brow character; this lettering comes from the street.†To embed the font using @font-face, a copyright code must be appended as a comment in the source code.
Arvo Font Family
This slab-serif typeface was created by Anton Koovit especially for the Google Font directory. It is optimized for Web use. The typeface is “monolinear-ish†but has a touch of contrast. For Windows users, the smaller 9, 12, 14 and 16 point sizes are hinted in Truetype format.
Thunderball
This heavy sans font with 178 characters could be useful for posters, postcards and similar designs. Released under a Creative Commons license.
Spatha Sans
A sans-serif font with organic playful shapes that set a friendly tone and are easy to read. The font could be a good fit for titles and maybe short text. Designed by Carvente Dice.
Spatha Serif
As a counterpart to the above-mentioned Spatha Sans, the glyphs in Spatha Serif have classic proportions and short serifs, which retain the playful and organic design. The font can also be embedded using @font-face, but a credit link is required. Designed by Carvente Dice.
My Fair Cody
An interesting playful typeface that makes a an impression with its personality and warmth. The tone is inviting and informal, and as such might not be the best fit for a corporate context. Designed by Darim Kim, and available in OpenType format. You may use the font in your private and commercial projects; but if you embed it using @font-face, then a credit link is required.
Matchbook
Matchbook is a simple and functional set of two typefaces, designed in serif and sans-serif versions. Each set includes all accented characters and works beautifully in larger sizes.
Mota Pixel
Mota Pixel is a simple pixel font with simple roots. The regular weight was created as a custom design for TypeShow and is now available for free to the public. Optimized for use in 20-pixel increments, it is a larger than normal pixel design. Still, the regular is rather thin and delicate, expressing some tendencies of an upright italic.
Further Resources
- Soma FontFriend
FontFriend is a bookmarklet for typographically obsessed web designers. It enables rapid checking of fonts and font styles directly in the browser without editing code and refreshing pages, making it the ideal companion for creating CSS font stacks. - Cure for the Common Webfont: Alternatives to Georgia
For nearly fifteen years, if you wanted to set a paragraph of web text in a serif typeface, the only truly readable option was Georgia. But now we’re starting to see some valid alternatives for the king of screen serifs. What follows is a list of serif typefaces that have been tuned for the screen. - How to Detect Font-Smoothing Using JavaScript
Some fonts look bad on computer monitors without font-smoothing enabled in the operating system. The author of this article initially thought there wasn’t a way, but after seeing a promising but incomplete method of detecting font-smoothing, he spent a few days devising a way to do it. - When Free Fonts Aren’t Free
To ensure that you’re using “free†fonts as their creators intended, here are four things to look for when you’re scanning a EULA. - iOS Fonts
An overview of font families available on iOS devices such as iPhone and iPad. - Free Typography
A blog dedicated to free fonts. - Caligraffiti
A Brazilian blog that features freely available fonts.
Also, you may want to take a look at…
Last Click
Adfont Calendar 2010
Here is Fontdeck’s typographic Advent calendar. Open the current day’s door and behind it you’ll find details of a great typeface, with a Web font offer available free for that day only. To use the offer, click “Purchase font licenses†in your Fontdeck settings before the day is over. Free subscription applies to websites with < 1 million page views per month.
(al)
© Vitaly Friedman for Smashing Magazine, 2010. | Permalink | Post a comment | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: Fonts, free, typography
Word Lens augmented reality app instantly translates whatever you point it at
16
Dec
Augmented reality and optical character recognition have just come into their own, beautifully intertwined into an instant translation app for the iPhone. Download Word Lens, pay $4.99 for a language pack, then point it at a sign and watch as it replaces every word with one in your native tongue. It's a little bit like Pleco, but without the whole language learning stuff. We just gave it a spin, and while it's not quite as accurate as this video claims, it's still breathtaking to behold -- especially as it doesn't require an internet connection to do any lookup. Sadly, it only translates to and from English and Spanish for now. Still, Babelfish, eat your heart out.
Update: Looks like it only works on iPhone 3GS, iPhone 4 and the latest iPod touch for now.
Word Lens augmented reality app instantly translates whatever you point it at originally appeared on Engadget on Fri, 17 Dec 2010 00:09:00 EDT. Please see our terms for use of feeds.
PermalinkÂ
TechCrunch  | 
Word Lens (iTunes)  | Email this | Comments Word Lens Translates Words Inside of Images. Yes Really.
16
Dec
Ever been confused at a restaurant in a foreign country and wish you could just scan your menu with your iPhone and get an instant translation? Well as of today you are one step closer thanks to Word Lens from QuestVisual.
The iPhone app, which hit iTunes last night,  is the culmination of 2 1/2 years of work from founders Otavio Good and John DeWeese. The paid app, which currently offers only English to Spanish and Spanish to English translation for $4.99, uses Optical Character Recognition technology to execute something which might as well be magic. This is what the future, literally, looks like.
Founder Good explains the app’s process simply, “It tries to find out what the letters are and then looks in the dictionary. Then it draws the words back on the screen in translation.†Right now the app is mostly word for word translation, useful if you’re looking to get the gist of something like a dish on a menu or what a road sign says.
At the moment the only existing services even remotely like this are Pleco, a Chinese learning app and a feature on Google Goggles where you can snap a stillshot and send that in for translation. Word Lens is currently self-funded.
Good says that the obvious steps for Word Lens’ future is to get more languages in. He’s planning on incorporating major European languages and is also thinking about other potential uses including a reader for the blind, “I wouldn’t be surprised if we did French next, Italian and since my mom is Brazilian, Portuguese.â€
Says Good, modestly, “The translation isn’t perfect, but it gets the point across.†You can try it out for yourself here.
How Twitter Users Changed in 2010 [CHARTS]
16
Dec
Twitter signed on more than 100 million new users in 2010. As they get acclimated to the information network, significant changes in usage are bound to take place. That’s exactly what social media monitoring company Sysomos found when comparing Twitter usage in 2010 to 2009.
What stands out the most is that more Twitter users have much higher follower and following counts.
Twenty-one percent of Twitter users now follow more than 100 people — that’s up from 7% last year — and 16% now have more than 100 followers, according to Sysomos, which looked at over a billion tweets from 20 million users in 2010 and compared them against data gathered in 2009.
Twitter users in 2010 were much more likely to provide a bio (69%), detailed name (73%), location (82%) and website URL (44%) as part of their public profiles. All of those percentages are more than double what they were in 2009, which means the average Twitter user has become more comfortable with sharing personally identifiable information about themselves.
Sysomos also found that 80.6% of Twitter users have made fewer than 500 tweets, which likely points to the relative newbie status of the average Twitter user. Also noteworthy is that 22.5% of users are responsible for 90% of all tweets.
The report highlights other Twitter-related behaviors, including popular keywords in Twitter bios, and analyzes how the friend-to-follower ratio changes as follower and following counts increase. We’ve included a collection of charts from the Sysomos report below.
Twitter Stats 2010
Twitter Growth
Users with Bios
Users with Detailed Name
Users with Location
Users with Website URL
Change in Friends
Change in Followers
Follower to Friend Ratio
Friend to Follower Ratio
One Word Tag Cloud
Two Word Tag Cloud
Reviews: Twitter
More About: social media, stats, sysomos, twitter
For more Social Media coverage:
- Follow Mashable Social Media on Twitter
- Become a Fan on Facebook
- Subscribe to the Social Media channel
- Download our free apps for Android, iPhone and iPad
10 Free Online Resources for Science Teachers
16
Dec
One of the greatest ways technology can empower teachers is by helping them demonstrate concepts and by making it easier for students to learn through their own exploration and experimentation.
Because science teachers are often called upon to teach topics that are too large, too small, happen too fast, happen too slowly, require equipment that is too expensive, or has the potential to blow up a laboratory, the Internet can be particularly helpful in assisting them convey a concept.
Universities, non-profit organizations and scientists with free time have put an overwhelming number of resources for teaching science on the web. These are nine of our favorites.
1. The Periodic Table of Videos
A group of scientists based at the University of Nottingham added some character to the static periodic table of elements by creating a short video for each one.
Hydrogen, for instance, seems much more exciting after you’ve seen what happens when you hold a match to a balloon that is filled with it, and it’s easier to remember the name Darmstadtium after you have seen Darmstadt.
The group also puts out a non-YouTube version of the site for schools that have blocked the site.
2. Teach the Earth
The Science Education Resource Center at Carleton College has compiled just about every fathomable resource for geoscience educators. By serving as the portal to helpful web pages from dozens of independent project websites, the site provides visuals, classroom activities and course descriptions for everything from oceanography to “red tide and harmful algal blooms.â€
3. Stellarium
Stellarium is a planetarium for your computer. Just input your location and explore the sky outside or the view from any other location. The program offers up information on stars, nebulae, planets and constellations according to 12 different cultures.
In addition to being ideal for classroom astronomy lessons, Stellarium’s open source software is also used to light up the screens of a number of real planetariums.
Even though Google Sky won’t give you a view from a specific location, it will direct you to specific galaxies, planets and stars or to a map of the moon that notes where each of the six Apollo missions landed.
4. YouTube
“What happens when you put Cesium in water?†is a question that in some cases is best answered by YouTube. YouTube’s archive of demonstrations have the advantage of being safe, clean and unlikely to catch on fire.
You’ll find experiments for most concepts just by using the search bar. But if you’re in a browsing mood, check out this list of the 100 coolest science experiments on YouTube.
Most schools that block YouTube allow access to educational alternatives like TeacherTube and School Tube.
5. NASA Education
NASA has lesson plans, videos and classroom activities for science subjects ranging from Kindergarten to university levels. The best part of this resource gold mine is that it’s easy to search by keyword or to browse by grade level, type of material or subject.
Check out the Be a Martian Game, the interactive timeline and the NASA Space Place for some smart fun.
6. Learn.Genetics
These resources for learning about genetics by the University of Utah’s Genetic Science Learning Center include interactive visualizations, 3D animations and activities. Student activities include taking a “tour†of DNA, a chromosome or a protein, building a DNA molecule, or exploring the inside of a cell.
The university is also building a sister site, Teach.Genetics, with print-and-go lesson plans and supplemental materials for some channels on the Learn.Genetics site.
7. The Concord Consortium
The Concord Consortium is a non-profit organization that helps develop technologies for math, science and engineering education. Their free, open source software is available for teachers to download to use in their classes. They include visualizations and models for a broad range of topics.
Some examples include: The Molecular Workbench, a free tool that creates interactive simulations for everything from cellular respiration to chemical bonding. Geniquest introduces students to cutting-edge genetics using dragons as their model organisms; Evolution Readiness is a project designed to teach fourth graders about evolution concepts using simulations; and The ITSI-SU Project provides lab-based activities involving probes, models and simulations.
To search for classroom activities across all projects, teachers can use the site’s Activity Finder to browse by subject, grade level or keyword.
8. The ChemCollective
The ChemCollective, a project that is funded by the National Science Foundation, allows students to design and carry out their own experiments in a virtual laboratory and provides virtual lab problems, real-world scenarios, concept tests, simulations, tutorials and course modules for learning basic chemistry.
The project recently won a Science Prize for Online Resources in Education from Science Magazine.
9. Scitable
Scitable is both the Nature Publishing Group’s free science library and a social network. Teachers can create a “classroom†with a customized reading list, threaded discussions, news feeds and research tools. There’s also an option to use the material on the site to create a customized e-book for free that can include any of the more than 500 videos, podcasts or articles on the site.
Topic rooms combine articles, discussions and groups related to one key concept in science and make it easy to find material that is relevant to your class and connect with people who are also passionate about the subject.
What resources did you find most helpful, or what great science tools did we miss? Let us know in the comments below.
10. Impact: Earth!
Want to see how a particular projectile from space would affect the Earth? With this tool that was developed for Purdue University, your students can enter the projectile parameters, angle and velocity to calculate what would happen if the object were to actually hit Earth. You can also get the details on the projectiles that caused famous craters.
More Education Resources from Mashable:
- 8 Ways Technology Is Improving Education
- The Case For Social Media in Schools
- 7 Fantastic Free Social Media Tools for Teachers
- How Online Classrooms Are Helping Haiti Rebuild Its Education System
- 5 Innovative Classroom Management Tools for Teachers
Image courtesy of iStockphoto, rrocio
Reviews: Internet, YouTube, iStockphoto
More About: education, education resources, Kids, List, Lists, resources, school, Science, social media, teachers, tech, visualizations, youtube
For more Tech coverage:
- Follow Mashable Tech on Twitter
- Become a Fan on Facebook
- Subscribe to the Tech channel
- Download our free apps for Android, iPhone and iPad