Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Smashing Newsletter: Issue #13

This newsletter issue was sent out to 35,395 newsletter subscribers on July 20th 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

  1. Note and Point: Keynote and PowerPoint Gallery2
  2. Free Icon Set for Web Design and Software3
  3. ManyBooks: Repository of Free E-Books4
  4. Crack It Open5
  5. Fine Tune Paragraph Endings With CSS6
  6. Which Loads Faster?7
  7. Vintage Logos8
  8. Quick and Dirty Forms Generator9

1. Note and Point: Keynote and PowerPoint Gallery

Creative types are able to leave their mark on just about everything they touch, often transforming off-putting specs into a work of art. For example, mere mortals might underestimate the artistic potential of formal presentations, but you and I know that they can be a great support to let the imagination run free. Indeed, what is better than using a blank page and defined content to polish our design skills?

Keynote and Powerpoint Gallery10

The drawback is that these awesome presentations are made for clients and so usually don’t reach a wide audience. Fortunately, Note and Point11, a website that collects this work, might well change that. This gallery highlights the most beautiful Keynote, PDF and PowerPoint work on the Web, which happens to be mostly Web design-related, although various topics are covered. No doubt these presentations — which really do look that much better — will surprise you by the attention given to color, illustrations and typography. (jb)

2. Free Icon Set for Web Design and Software

Beautiful free icon sets always come in handy. Ömer Çetin’s PixeloPhilia 212 icon set offers 44 free PNG icons that could be a perfect fit for a Web or user interface design in an online or desktop application. The set contains both general icons (address book, map, mail, download, target) and rather obscure ones (comic book, license, mug, USB), all in a resolution of 32×32 pixels.

Free icon set13

The icons might be perfect for communicating navigation options or quickly illustrating the purpose of a page block. The set was released under a Creative Commons license. (vf)

3. ManyBooks: Repository of Free E-Books

Buying e-books to use on various e-reader platforms can get just as expensive as buying hard copies, especially if you’re a voracious reader. And while websites like Project Gutenberg offer free e-books of texts that are in the public domain, the formats available are limited, which means you have to spend time converting them.

Repository of Free E-Books14

ManyBooks15 offers a huge collection of public domain e-books, as well as other newer books that have been released in the public domain or under Creative Commons licenses, in a variety of formats. You can download classics such as Pride and Prejudice16, as well as newer books such as The Gospel of the Knife17, in formats such as ePub, Mobi, PDB and even PDF and plain text. Books are also browsable by genre, author and title. And of course, there is a search function. (cc)

4. Crack It Open

Sharing files with other Web workers around the globe sometimes makes you feel like you’re staring at a can of tasty food but can’t find a can opener. Just when you think you’re fully equipped, along comes a file extension you’ve never heard of. Don’t worry: no need to Google anymore. Check out OpenWith.org18. You’ll find a free program for just about everything you would ever need to open, including source code, data files, disc images, spreadsheets and video files.

Crack it open19

All formats are categorized by existing file extensions and the corresponding name right next to it. A click on the name opens a page showing free programs that can open the extension. OpenWith is a comprehensive and useful resource. Give it a try, and crack open your can. (mm)

5. Fine Tune Paragraph Endings With CSS

When typesetting, designers try to avoid leaving just one or a few words hanging on a line at the end of a paragraph. Doing so is considered poor typography because it leaves too much white space between paragraphs and interrupts the reader’s eye movement (see the example below). A simple typographic solution is to rework the line by adding indented paragraph endings. But the problem is particularly annoying when aligning a paragraph next to an image that exceeds the paragraph’s height.

Paragraph Ending with CSS

Soh Tanaka has come up with a simple and quick solution to this problem with CSS. Just add overflow: hidden to the relevant <p> tag, or wrap the paragraph with a container that has the attribute overflow: hidden. Simple and useful. You’ll find examples of the problem and its solution on the demo page. (vf)

6. Which Loads Faster?

With widespread broadband Internet access, page loading time has become less of an issue than it was 10 years ago, when the majority of users were still on dial-up. But that doesn’t mean we should disregard loading times entirely. To avoid visitor frustration, we should still make sure the loading times of our websites are comparable to those of similar websites.

Which Loads Faster

Which loads faster? lets us see two websites load side by side in real time. Then it shows how long each took to load and the percentage difference. It’s a useful development tool — and comparing how competing (or feuding) websites rank in their loading times is fun. (cc)

7. Vintage Logos

Vintage is in. Today’s lifestyles are infused with vintage fashion, books, music instruments, furniture, toys and much more. But here we’re addicted to design, so let’s talk about vintage logos20. This Flickr collection showcases logos from a mid-’70s edition of the book “World of Logotypes.” The collection will especially appeal to those seeking inspiration or interested in advertising relics of the past.

Vintage Logos21

The set will give you an appreciation of styles done decades ago, and many still look trendy, fresh and up to date. Logotypes, initials, monograms, icons, symbols — you can find every style of logo you’re looking for. Just don’t be disappointed if you discover that someone years ago has beaten you to a logo concept that you thought was original. (cs)

8. Quick and Dirty Forms Generator

Faary22 is an online form builder. Granted, generators like this have been around a long time. But Faary is a bit different. It operates with the help of text lines, and the form is generated as such. The tool creates an HTML form with CSS, which can be downloaded as a ZIP archive.

Forms Generator23

Available components are a form header, email field, text area, radio buttons, check boxes, drop-down menu and button line. Styling is not available, but the whole thing is pretty easy to use and will save you time. A commercial option is available, too. A one-year membership gives you unlimited forms with PHP functions for $19.95. (sl)

The authors in this newsletter are: Sven Lennartz (sl), Vitaly Friedman (vf), Jessica Bordeau (jb), Manuela Müller (mm), Cameron Chapman (cc).


  1. 1
  2. 2 #a1
  3. 3 #a2
  4. 4 #a3
  5. 5 #a4
  6. 6 #a5
  7. 7 #a6
  8. 8 #a7
  9. 9 #a8
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23

↑ Back to top Tweet itShare on Facebook

The Smashing Editorial prepares bi-weekly newsletter issues with lots of love and appreciation for the good ol' web with the latest tips and tricks for designers and web developers. Vitaly Friedman, Smashing Magazine's editor-in-chief, started this project back in early 2010. Today, we can't imagine a better way of informing and communicating with our fans and readers!

  1. 00

    No comments have been posted yet. Please feel free to comment first!
    Note: Make sure your comment is related to the topic of the article above. Let's start a personal and meaningful conversation!

Leave a Comment

You may use simple HTML to add links or lists to your comment. Also, use <pre><code class="language-*">...</code></pre> to mark up code snippets. We support -js, -markup and -css for comments.

↑ Back to top