You received this email because you signed up for this newsletter.
Does everything look mixed up? View the online version. Annoyed? Unsubscribe at any time.
Table of Contents
1. Beautiful Type: Inspirational Typography
2. Little Big UI Details That Make The Difference
3. The-M-Project: New Framework For Cross-Platform Mobile Apps
4. Responsive Images and Context Aware Image Sizing
5. Collection: Images, Words and More Inspiration
6. The Email Address Obfuscation Debate
7. Humans.txt: We are People, Not Machines
8. New on Smashing Magazine
9. Smashing Network Highlights
Editorial: The Smashing Book 2
The Smashing Book 2 is here. It's printed. It's available. And it's being delivered worldwide at this very moment as you read this. All pre-ordered books have been sent out from our warehouse and should reach all countries very soon. In fact, some readers have already received a copy of the book. What didn't quite work out the first time with The Smashing Book 1 has been successfully accomplished this second time. So, here it is, the brand new printed hardcover Smashing Book 2!
The Smashing Book 2 is a printed book about best practices in modern Web design. The book shares valuable practical insight into design, usability and coding. It provides professional advice for designing mobile applications and building successful e-commerce websites, and it explains common coding mistakes and how to avoid them.
You'll explore the principles of professional design thinking and graphic design and learn how to apply psychology and game theory to create engaging user experiences. We also feature interviews from experts on the future of Web typography and describe how you can publish a book on your own.
You can download a sample of the book, "Visible vs. Invisible Design" (PDF, 5.6 MB) by Francisco Inchauste, for free. Also, an extra free eBook "Lost Files" is now available in the Smashing Shop; you can find more details about the book in our official release post. We look forward to your feedback, guys. Also, please help us spread the word — it would really help a lot. Thanks!
1. Beautiful Type: Inspirational Typography
If you spend most of your time looking at design galleries and showcases, you can start to feel like you've seen everything out there. Finding fresh, new inspiration for your designs can be challenging, so when you are on the search for some specific artistic direction (e.g. typography), it can get even harder.
Beautiful Type regularly showcases artworks with a main focus on typography. Included is everything from posters to packaging, in a wide variety of styles. This gallery is a Tumblr blog, so if you're on Tumblr, be sure to follow them. (cc)
2. Little Big UI Details That Make the Difference
Quite often, it's the little things that make the world a better place… or, in the language of Web design, that improve the look, feel and user experience of websites.
That's why Your Neighbours, a Berlin-based Web design studio, has launched a simple but useful tumblog Little Big Details that features tiny details that improve the user experience of websites and mobile apps. You'll find some useful design techniques found by your colleagues across the Web. Also, share your favorite little things on the website as well. The collection is already very useful, with more design examples submitted every single day. (mm)
3. The-M-Project: A New Framework For Cross-Platform Mobile Apps
The-M-Project is a new HTML5 JavaScript framework for writing cross-platform mobile apps and that targets iOS, Android, BlackBerry and webOS platforms. This project is built on all of the UI and core files of jQuery Mobile. In addition, The-M-Project provides a build tool, called Espresso, that is written in JavaScript using node.js.
Espresso makes it easy to structure source code and then build and run it on a built-in server. The project team has put together sample apps that showcase the possibilites of this new framework. (tb)
Advertisement
4. Responsive Images and Context-Aware Image Sizing
Since Ethan Marcotte coined the term, responsive Web design has gained a lot of attention in the Web design community, mainly due to its remarkable potential for flexible layouts that respond to the browser's viewport for the best user experience. The main problem with such designs, however, is figuring out how to serve small images to mobile devices and tablets and large ones to desktop displays. At the most basic level, using fluid images and browser scaling to adjust the size of images would be fine, but it raises performance and speed issues.
You could swap out different scaled images for different display sizes or use .htaccess files and some JavaScript to serve up different sized images based on the screen width. Another option is to use a service like TinySrc: merely prefix all large images in your source code with a TinySrc URL, and the tool does the rest.
Another interesting technical solution is to use a server-side script (PHP) to serve up images of several different resolutions. The idea is that within the PHP script, a nested array is used that lists images files and their relative percentage scales. In HTML, the image src attribute would be set to get the requested image id, but with no scale specified. A JavaScript calculates the percentage width of the image relative to the maximum width of the container, and this figure is then appended to the end of the src attribute as the scale parameter. It's an interesting technique that could be adapted to other contexts. The comments in the article contain some nice ideas and suggestions on how the technique can be improved. (vf)
5. Collection: Images, Words and More Inspiration
Finding inspiration when you're just not feeling creative is a challenge for most designers. The ever-elusive "muse" is often temperamental and can disappear right when you need it most. That's why keeping links of inspirational sources handy at all times is a good idea.
Collection, from Thought and Theory, is just one such resource. It pulls together images, words, video, sound and objects that could serve as inspiration for designers. The design of the website itself is also pretty cool, with a twist on the traditional grid layout. (cc)
6. The Email Address Obfuscation Debate
There's been a lot of discussion about email address obfuscation and whether it's really effective at preventing spammers from getting your address. The discussion is taking place across Twitter and blogs. Everyone seems to have an opinion on whether it works and what the best method is.
Superuser, a Q&A website for computer enthusiasts, has an interesting discussion about email obfuscation, with opinions from a number of users. Included also are different techniques for accomplishing obfuscation, empirical data about its effectiveness and links to other discussions and articles. One interesting technique is to use the obscure unicode-bidi and direction CSS properties and write the email address backwards: for example, moc.elpmaxe@zyx. Plenty of interesting ideas worth learning and discussing. (cc)
Advertisement
7. Humans.txt: We are People, Not Machines
Hundreds and thousand of new websites are published every day, many of them part of the corporate world. Few of these companies like to grant visible credit to the authors of their content. What you will find on every website, though, is robots.txt, a file full of keywords and information for search bots. Why do robots get their own file but authors do not? Humans.txt is an initiative founded by a group of Spanish enthusiasts with the idea to give credit to the humans behind Web projects.
Start your own humans.txt now and stick it in the website's root folder, right next to robots.txt. Fill the file with whatever info about the contributors you like. Be a part of the initiative and help establish the standard for humans.txt! (sp)
8. New on Smashing Magazine
- Desktop Wallpaper Calendar: February 2011
- We Can Do Better: The Importance of Professional Journalism
- Free Minimal, Swiss Design WordPress Themes (4 Themes)
- Making It a Mobile Web App
- Showcase of Beautiful (or Creative) E-Commerce Websites
- Guidelines for Successful Communication With Clients
- The HTML5 Logo: What Do You Think?
- Falling for HTML5: Finding Love in the Little Things
- Cleaning Up The Mess: How To Keep Your Coding Workflow Organized
9. Smashing Network Highlights
- How to Create Your Own Custom WordPress Theme
- 20 Ways to Save Kittens and Learn PHP
- Simple Tips for Improving Web Typography
- HTML(5) and Text-Level Semantics
- For the Love of Rotating Feature Boxes
- Tutorials for Making Your Website Mobile-Friendly
- What to Ask a Client Before You Start Their Project
- HTML5 Grayscale Image Hover
- Are Current Web Design Trends Pushing Us Back to 1999?
- User Experience Is Not Just About Your Website
- Learning to Design Without Losing Your Soul
- The Web Is Changing: HTML5 and Native Media Support
- How to Get More Exposure for Your Freelancing Business
Tidak ada komentar:
Posting Komentar