There are many online resources for designers to utilize, but some of the most important are inspiration showcases. When learning CSS back in the day, I spent countless hours perusing some of the first CSS galleries, closely examining each pixel of a layout, digging into the source and figuring out how folks were getting sites set up without tables. Now that CSS layouts have become the “norm” I still cruise these showcase sites for ideas and inspiration.
One of my earliest and longest client relationships has been with Marjorie Treu of Team Fusion. I’ve known Marjorie for over 7 years and enjoy the projects that she allows me to work on and help her with. Creating an online presence for her new book, 78 Manager Mistakes, was a project that was eager to start working on.
This was the second book-related site that I’ve built over the past few years and had some unique goals and challenges when working on layout ideas. The end goal is to sell the book, but there were secondary goals and opportunities that presented themselves as the project moved forward.
A focus on the product.
The homepage design makes the book and the intro/call to action the focal point. Pretty simple idea, isn’t it? I wanted to match the books branding and colors, so a bit of contrast was needed to help make the book pop. There was also opportunity to make a big statement (literally and figuratively) on the homepage, which I positioned along side the book cover. This is the focus area of the homepage and within it is a call to action for those wanting to quickly purchase the book.
With the layout taken care of, it was time to start putting the pieces into place.
Diving into WordPress
As I’ve mentioned before, I have used an array of content management systems in the past and this particular project was to be built on WordPress. I had originally set up a development arm for this project on Expression Engine, but I was able to turn that around in a short amount of time and get my hands dirty with WordPress.
One of the keys to this site for Marjorie was the ability for her to quickly and easily make changes to not only the blog and the site content but other important, interactive areas as well. Along with the “basics” (blog and book information), the site was to have an event calendar (for which I employed a very nice plugin, Calendar), an editorial calendar for blog posts (WordPress Editorial Calendar), and enhanced membership features (Register Plus Redux).
Great project, great client, with great learning experiences along the way.
Technology is great and advancements in technology have allowed us to do many amazing, revolutionary things. Technology can also be a barrier to creation and achieving what we want. It can be daunting, it can mock us, and can make us feel inferior. When you strip away the clutter of tech, what are you left with?
Apple has been running an ad for the iPad 2 the past few weeks. In fact, it’s the first TV ad for their second iteration of the tablet. It doesn’t tout specs or rattle off features or display overlays of how amazing the price is. It focuses on simplicity, namely how simple the use of this device can be. It also raises a good point/question. What happens when technology gets out of the way?
If you think about the devices, websites, tools, and instruments you come in contact with on a daily basis, how many of them do you enjoy using? How many of them make the job that you’re using them on mean more, because there aren’t barriers put in place by those tools. On the flip side, how many times do you encounter a device or an interface that you dread, making the work (or play) unenjoyable?
I’ve encountered both in my line of work and some of the bad (user) experiences stand out in my mind more than the good ones. I like keeping track of the good and the bad, but not dwell on the negative. After all, it’s good to learn from mistakes. The great experiences, the truly amazing ones, leave ever-lasting memories for not only myself, but for the people close to me that were also part of the experience. Something as simple as watching a movie with my kids or sharing photos with my family are fun activities, but stripping away restrictive technology and design can make for a much-more remarkable moment.
A few years ago there was a battle cry that quickly built a following in the web design industry. The fold is dead! That long clung-to idea that content above "the fold" of a webpage was the most important, and was on prime real estate, had found it's detractors and was showing signs of weakening. Today, I think the general consensus among creative professionals was that there was no need to worry about what content was above the fold on a webpage given the interactive and elastic nature of the medium. Pages expand based on the amount of content on them and can easily be scrolled to reveal more content. Game. Set Match. The thing is, that entire discussion took place in the desktop Web design world. Enter the world of mobile and I'm wondering if we don't have an uprising of "the fold" on our hands.
The thought of a mobile fold has been in my mind for a while now, but it really hit home today as I was working on a one-off mobile page. The focus of the page was to get as much information in plain sight as soon as the page loaded. Anything below the *ahem* fold might be missed. The main difference I've noticed between content displayed on a mobile device is the lack of scrollbars. Yes, there are scrollbars that appear on mobile Web browsers but some of them only appear when the screen is being interacted with. If you're not touching the screen, only looking at content, you may not think to scroll down the page, especially if the page looks like it's completed at the point that it is cut off.
Mobile page design items to consider:
Keep an eye on how your content looks at the bottom of the page. If it looks like an article has ended at the point of the fold, your viewer might think so as well.
Provide anchor links to important items or elements that are on the lower portion of your page. For example, if you've placed a store locator at the bottom of the page, place a link in the upper portion of the page that points folks towards that tool.
Along the same lines of the previous tip, look at placing standard "skip to content" anchor links on your content or mobile home page. This is a gentle visual reminder that there is additional content further down the page and it gives a quick point of access for your site visitors.
Earlier tonight Twitter announced a major update to their Web interface once again making Twitter.com a destination, rather than a site to check every once and a while.
By beefing up the Twitter homepage, @ev, @biz, and the gang are making a compelling argument for people to not use third party Twitter apps and to stick with, what used to be, the only place to tweet.
The one-pane approach that Twitter has employed for some time is now a two-pane split The thinner, two column layout is now much wider and uses some very nice visual effects taking place when you act on certain links. If you've seen or used the recently-released Twitter for iPad (iTunes link), you'll see many similarities between that app and the new site.
Photos and video are now embedded within tweets and will show up underneath the message in the "reading pane". Another cool tidbit that's been discovered is the ability to include whole Flickr sets in a tweet.
The background scoop.
With the wider interface, you'll quickly notice that background images aren't as easy to see as they once were. This change will be a challenge to online marketers, designers, and anyone else that want to display a custom background on their page that has detailed information or branding included.
Change = Good.
These are some exciting changes for Twitter and I'm looking forward to see it rolled out in the coming weeks. To see more of the changes for yourself, check out their preview page.
A few years ago there was a battle cry that quickly built a following in the web design industry. The fold is dead! That long clung-to idea that content above "the fold" of a webpage was the most important, and was on prime real estate, had found it's detractors and was showing signs of weakening. Today, I think the general consensus among creative professionals was that there was no need to worry about what content was above the fold on a webpage given the interactive and elastic nature of the medium. Pages expand based on the amount of content on them and can easily be scrolled to reveal more content. Game. Set Match. The thing is, that entire discussion took place in the desktop Web design world. Enter the world of mobile and I'm wondering if we don't have an uprising of "the fold" on our hands.
Earlier tonight