Smashing Newsletter: Issue #12
This newsletter issue was sent out to 34,116 newsletter subscribers on July 6th 2010.
Every other week our editorial team works on short, entertaining and (of course) relevant articles for the upcoming issue. The newsletter is sent out on Tuesdays, and contains unique tips and tricks for designers and Web developers, written by us exclusively for our email subscribers. You can subscribe to the e-mail newsletter1, of course.
Table of Contents
01. Showcase of Propaganda2
03. Rounded Images With CSS3 and jQuery4
04. Generate Secure Passwords Without Typing Randomly5
05. What Software and Hardware Do Professionals Use?6
06. The Art of Analogue Computing (Video)7
The showcase We Love Propaganda8 is full of colorful creations, with a lot of polarizing political perspectives. In its most basic sense, propaganda presents information that is primarily meant to influence an audience. No surprise, then, that this kind of public relations comes with some rather expressive graphic design and typography.
Depending on the political statement or social or environmental concern being espoused, propaganda can be perceived as being shrill, gruff, cheeky or provocative. Simple mass marketing and an ubiquitous public presence are always suitable for propaganda. Messages and appeals have to be simple and easy to understand. Vibrant colors, sometimes in striking contrast, are as characteristic as iconic pictures and bold fonts. The statements are usually grossly misrepresentative, intentionally, of course. We don’t love propaganda as an instrument to influence opinion per se, but it is a remarkable way to use design to achieve certain goals. (cs)
Have you ever tried to apply the
box-shadow properties to images? If you have, you probably noticed not only that modern browsers display corners differently, but that the corners look a bit unfinished and broken. Webkit displays rounded corners but does not support the inset box shadow. In Firefox, the
border-radius doesn’t display at all (see the image below).
Nick La has come up with a solution to this problem14. The idea is simple: wrap a
span tag around the image element. Then, put the original image in the background with the
background-image property, and then hide the original image by applying
opacity: 0 to it. Or to make it easier, just embed a jQuery code to generate
span tags for images on the fly (which you’ll find in his article).
The technique works with any image dimension and works even if the width and height attributes are not defined. Obviously, the user has to be using a modern browser to see the effect. (vf)
Secure passwords are the backbone of website security. Whether you generate passwords for your own website or to use for online banking or on another website where security is paramount, any time you use a logical password you make it easy for someone to abuse it or hack into your account.
The Secure Password Generator16 lets you enter parameters, including the length of the password, whether to include uppercase and/or lowercase letters or numbers or punctuation and whether to eliminate characters that resemble each other (such as i and l, 1 and I, and o and 0). Then, just select the number of passwords to generate, and it returns a list. It even includes phonetics for each password to make it easier to read out loud (in case you’re giving a password to someone over the phone, for example). (cc)
Here is a simple idea: ask a bunch of professionals and experts what software and hardware they use, and then present the results in a series of blog posts. Someone did just that for the setup17, a blog that asks professionals what they use to get the job done.
The website is a useful resource for people who love to discover new tools. Browse these nerdy interviews to find a job title that appeals to you (there are people from all walks of life) and then explore the answers. Guaranteed, you will come across some new wonders, especially because every interviewee explains why they have chosen a particular tool.
The setup is growing in popularity. People are creating setup-style websites in other languages19, such as German, Czech/Slovakian, Romanian, Vietnamese, Hungarian and French. For those who really like this idea and want to create their own website for it, they can start by drawing inspiration from people who have already implemented a set-up of their own on a website. (jb)
Many jokes are circulating these days that show people who work too much on a computer trying to execute computer-like shortcuts in real life. The video The Art of Analogue Computing20 exploits this idea of mixing our online and offline lives by imagining what our computers would be like if they were constructed in analogue. The result is an entertaining short movie that achieves its goal: being funny while reminding us how digitally connected we all are. (jb)
The authors in this newsletter are: Vitaly Friedman (vf), Christina Sitte (cs), Cameron Chapman (cc), Jessica Bordeau (jb), Manuela Müller (mm).
- 1 http://www.smashingmagazine.com/the-smashing-newsletter/
- 2 #a1
- 3 #a2
- 4 #a3
- 5 #a4
- 6 #a5
- 7 #a6
- 8 http://www.flickr.com/photos/x-ray_delta_one/sets/72157622160036906/
- 9 http://www.flickr.com/photos/x-ray_delta_one/sets/72157622160036906/
- 10 http://scriptsrc.net/
- 11 http://scriptsrc.net/
- 12 http://www.twitter.com/scriptsrc
- 13 http://www.webdesignerwall.com/tutorials/css3-rounded-image-with-jquery/
- 14 http://www.webdesignerwall.com/tutorials/css3-rounded-image-with-jquery/
- 15 http://www.pctools.com/guides/password/
- 16 http://www.pctools.com/guides/password/
- 17 http://usesthis.com/
- 18 http://usesthis.com/
- 19 http://usesthis.com/community/
- 20 http://www.elastika.org/2010/06/the-art-of-analog-computing/
- 21 http://www.elastika.org/2010/06/the-art-of-analog-computing/