Sandstorm Blog

Top 7 Responsive Sites from 1996 (Yes, 1996)

1996 was a crazy time. Everyone was shouting “Show Me the Money!” or using a Fargo, ND accent. We were just meeting Kato Kaelin and teaching our friends the “Macarena”.

It was a huge year, the U.S. hosted the centennial Olympic Games in Atlanta, and Star Wars was back in theaters for the first time since its original release. And oh yeah, people started using the internet more and more. Sure it was on Mosaic and Netscape browsers, but the World Wide Web was in more households than ever. The sites were amazing by 1996 standards, and well... “interesting” by 2013 standards.

Exhibit A:

Accidentally responsive?

There is one thing that was happening that no one anticipated, many websites from ‘96 are tablet responsive. What? I thought this was a new thing that only recently started happening.

Well, it just recently started happening on purpose. Many of the sites in ye olde ‘96, were built using HTML tables — which meant that they were adjustable based on the size of the browser window. So, with a small window you would have compact content and on a larger window everything was more spread out. In effect, the site was “responsive” to your large (or small), hot, CRT monitor. (Note to our hipster friends, do not make giant, heavy monitors hip again. Thanks.)

Are we saying to build using tables? No. Not at all. It’s just fun to see how things from the past relate to modern technology.

Trends tend to repeat themselves, and a lot from 1996 has come back again. Game of Thrones was first published then and now it’s a phenomenon. Tupac (1971-1996? R.I.P.) was “revived” at Coachella last year as a “hologram.” So, building sites that are adjustable based on screen size is back, too (just for different, more portable screens).

We’re reviving a few website gems that are excellent examples of “antique responsive”. (There’s also a wealth of great examples on the Wayback Machine, too.) Enjoy.

7. VH1.com (circa 1996)

6. Beavis and Butthead Do America

5. CNN: OJ Simpson Trial

4. Dole/Kemp ‘96 Campaign

3. CNN: 1996 Year in Review

2. Space Jam

1. Lego.com  (circa 1996)

 

[Bonus: This site is not “responsive,” but it’s a great period piece of the era. 1996 Internet World Exhibition]

What will we think about sites from today in 17 years? Which will still be around?

This blog was posted by on May 30, 2013.
Will Biby

About the Author

Will Biby

Will wears many hats at Sandstorm. From writing web content to executing social media strategies, he is quick to act and insistent on a job done right. Will enjoys writing, so expect to hear from him often on the blog.

Mobiletanious responsive development on multiple devices and screen sizes.

I’d like to go on the record and claim the next catch phrase in UX and user experience design....Mobiletaneous!

Mobiletaneous is the art and discipline of building experiences for multiple screen sizes simultaneously, as opposed to starting from the mobile or desktop version. This a slight spin on the recent design trend “Mobile First” which was popularized by design guru Luke W. (Luke Wroblewski).

This is not to take anything away from the “Mobile First” philosophy. I’ve read “Mobile First”, practiced the mobile first methodology and extolled its virtues. There is no denying the expansive growth in mobile use, and the shift from desktop to mobile is indisputable. Any organization not focusing on their mobile experience is missing the boat.

Mobile First

However, as we’ve been designing and building for varying screen sizes, we’ve found it most useful to consider all screen sizes simultaneously. This applies to both the user interface design and front end development phases. It is particularly helpful when breakpoints for mobile, tablet and desktop screens are needed.

Mobiletaneous

This approach ensures designs for all screen sizes are getting the attention and consideration needed, rather than prioritizing one over the other. Because at the end of the day, the most important screen size to design for is the one your user is using.

We’ve learned this is a more efficient way to develop responsive designs. It’s no surprise it requires more time (and budget) to design and build responsive experiences, but we’ve found the mobiletaneous approach to be the most efficient.

So our interpretation of the “mobile first” philosophy is slightly different. We believe your mobile experience is crucial. So is your tablet and desktop experience. That’s why we’re on the leading edge of the mobiletaneous movement.

This blog was posted by on May 23, 2013.
Michael Hartman

About the Author

Michael Hartman

As Sandstorm's Technology and Usability Director, Michael leads our developers and usability researchers in creating web sites and applications—both desktop and mobile—that embody our favorite blend: intuitive user experience and dynamic Drupal development.

Happy New Year From Sandstorm

Sandstorm is ringing in 2013 by inviting you to collaborate for a cause. Scroll through our interactive New Year's Greeting. At the end, choose a charitable organization, and Sandstorm will give them a contribution.

We love how well parallax scrolling fits the theme of collaborating for a cause. Your participation begins before you even vote for a charity—it starts the moment you start scrolling. Your movement down the page activates snowflakes and triggers year-end greetings. So travel with us through the seasons and learn about our accomplishments in 2012. You'll be part of the experience in motion and part of the collaboration to give back. You'll even get to see a cameo from the SkiFree guy (sans the yeti).

Check out the greeting and choose a charity at the bottom!

This blog was posted by on January 11.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

THIS FILE WAS POSTED UNDER: 
this file was posted under: 
Sandstorm Launches Community Drupal Web Site for PROmeasure

Standardization is a hot topic in the PRO (patient-reported outcomes) community. It’s hot enough that the amount of information out there can be difficult to filter through, and makes it impossible to get your voice heard. PROmeasure is taking on these challenges with the beta launch of their site PROmeasure.org.

The site aims to involve the PRO community of authors, medical practitioners and health care IT professionals in enhancing the use of PRO in clinical practice and research by standardizing its use of measures (questionnaires). Users can download an open-source data model for measure standardization, search through a database of measures and participate in discussions with the community.

The PROmeasure web site is built in Drupal and includes a PubMed integration, user dashboards, commenting and personalization features, community forums, and content-manageable rotating graphics on the homepage.

Learn more about the possibilities available with Drupal development.

This blog was posted by on August 21, 2012.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Drupal basics

So, you're going with Drupal, eh? Let me be the first to pat you on the back! You're joining the likes of The White House, National Association of Realtors, Forrester Research and Harvard, all of whom have websites built in Drupal. This open source content management system is a developer favorite because of its robust and flexible capabilities for managing large amounts of content.

As with all things, the first step you probably took was a Google search to learn the basics of Drupal. But that quick search may bring up some overwhelming results as a lot of the information out there is actually for the thousands and thousands of Drupal developers who have made this content management system what it is today.

But you're not a developer, and no one expects you to be! (That's what we're here for.) You're what we call a content administrator. And we've put together some of the Drupal basics you'll need, without all that developer mumbo jumbo.

CONTENT TYPES

There are three main types of content on a Drupal site - Basic Pages, Articles, and Webforms. Each type has its own set of fields and purposes:

  • Basic page - Just what it sounds like, a basic page. This content type will usually have fields like a main header, sub header and body content and is used for most of the pages on your site (like About Us, Products, or Services).
  • Articles - These can be used for blog entries or news items. They have fewer fields than a basic page and include special fields like author and date.
  • Webforms - This content type is for the forms on your site, like Contact Us.

MENUS

Every site needs some form of navigation. The menus let you take the different pieces of content on your website and organize them in an outline. The main menu, for example could be made up of a few basic pages like About Us, Products, and Services, and a webform for your Contact Us page.

BLOCKS

Blocks are smaller chunks of content that might show on a page but wouldn't be part of the content type. For example, you might have a callout on all the pages of your site. If this callout is a block, you can edit it once and the changes will show on every page.

CONTENT + MENUS + BLOCKS = YOUR WEBSITE!

When you take these different pieces and add them together, they make up your website! Look at the example Drupal website below and see if you can identify the different elements:

Drupal Basics: Example Drupal 7 Website

 

BASIC PAGE CONTENT

Although we call it a basic page, not everything on the page is part of the basic page content. Notice in the image below that the basic page content only takes up the center of the page...

Drupal Basics: Basic page content

 

MENUS

That's because the rest of the information on the page is either a menu or a block. There are three menus on this page—the main menu on the top left, the secondary menu below that and a utility menu in the upper right corner.

Drupal Basics: Menus

 

BLOCKS

Finally, the callout on the right is a block. It would be edited separately from the basic page content in the center, and the changes would be carried over to any other pages on the site that include the block.

Drupal Basics: Blocks

There you have it, now you understand content types, menus and blocks! The basics of Drupal are easy to grasp, and once you log in and start updating, you'll love the ease and flexibility of it. Of course, if you ever need more than content updates, our Drupal developers would love to work on your website!

This blog was posted by on March 16, 2012.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Realtor University - Example of a Drupal web site

REALTOR® University and the National Association of REALTORS® partnered with Sandstorm's Drupal development team to build their first ever master's degree program. The web site was developed through a combination of marketing messaging, copywriting, tagline development, user interface design and implementation of the Drupal 7 CMS. Featured on the homepage are rotating graphics emphasizing the core advantages the university offers. We are so excited to announce this launch!

This blog was posted by on October 20.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Chicago marketing firm Sandstorm Design just moved

Following a year of exceptional growth, Sandstorm Design is excited to announce its move! Don’t worry, we’re still in Chicago—just a couple blocks north of our old address. In the heart of the Ravenswood Corridor, this architecturally inspired space is perfectly suited for the strategy and execution of Drupal web sites, interactive web applications and creative marketing campaigns.

With this relocation, we have expanded space for collaboration and day-to-day activity. This includes an on-site usability lab, ideal for conducting formal and informal usability studies. Our “zen room” is the ideal place to find inner peace.  The new office is distinctly Sandstorm with our giant swirl logo painted at the entrance (It’s 8-foot by 11-foot!), and 4700 feet of exposed ceiling pipe was hand-painted Sandstorm blue to give some added color to this former warehouse space. To see more about this exciting development, check out the Sandstorm Photostream. We even tallied all the numbers from the move, and put together this infographic.

Be sure to update your records, CRM system, and iPhones. Our marketing firm is now located at 4619 N. Ravenswood Suite 300, Chicago, Illinois 60640. Our phone number is the same, 773-348-4200, but all extensions have shifted with an upgrade to a new Shoretel phone system. 

This blog was posted by on October 17.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Chicago marketing firm Sandstorm Design featured in 2011 Inc. 500|5000 Fastest Growing Companies

Hooray! We are in the top 350 for companies in marketing and interactive on the 2011 Inc. 500|5000 list of the fastest-growing private companies in the country! “It’s a really exciting time for Sandstorm,” said Sandy Marsico, our marketing firm's Principal, as I snapped a photo of her with the package Inc. Magazine sent us. “I am so proud of our team’s relentless dedication to our clients and the exceptional work they produce.” Inc. Magazine releases the 500|5000 list each year to celebrate the companies who are thriving in their industries. The Inc. 500|5000 site has the full list, along with features, graphics and multimedia.

Be sure to check out the Sandstorm Design Inc. 500|5000 profile. “We’re honored to be a part of such an inspiring and aspiring group of companies,” said Marsico. Everyone at Sandstorm is enthusiastically looking forward to continued growth. Learn more about Sandstorm Design and our unique blend of marketing strategy, web design and usability services.

This blog was posted by on August 23.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Crain's BtoB

2011 has been an award-winning year for Sandstorm Design! Earlier this year we were recognized by BtoB Magazine as a Top B2B Interactive Agency. Today, we've been recognized again—This time as a top Chicago Web Developer for 2011 by Crain's Chicago Business. Not only does this mean we're in the printed newspaper, but we'll also be included in the Book of Lists for 2011. Our developers work closely with the design team to create powerful results. And when it comes to content management systems, our Drupal 7 developers build robust and flexible web sites customized to your needs. We love the work we do, and are so honored to be included as a top Chicago Web Development firm!

This blog was posted by on July 18.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Chicago is a booming city with a robust pool of developers—web developers, software developers, application developers. We’ve got them all. (Chicago even hosted DrupalCon this year.) So we are pleased to see our government agencies taking notice and utilizing the city’s developer resources by challenging them to “build apps that solve problems and improve services in Metro Chicago” with the Apps for Metro Chicago Illinois Competition.

While our Chicago web design firm focuses on user-centered design, we'd like to give kudos to the City of Chicago, the Chicago Metropolitan Agency for Planning, Cook County, and the State of Illinois for taking a user-centered approach to government and working to build useful tools for Metro Chicago. Bravo! Now, while we're pleased to see Chicago building useful apps, there are some pros and cons to the competition method, also known as crowdsourcing. Crowdsourcing has become very popular, even as a tool to leverage as part of a marketing strategy. But even with the possibility of benefiting from the talent that fills Chicago, in the end, there is just less creative control of the end product. Instead of choosing one dedicated team that builds a relationship with you, learns your business needs, and provides a customized solution to your problem, you end up hoping someone in the crowd finds the right idea.

But what if none of the entries solves your problem? During the two month entry period, how do you feel about sitting in the dark, unable to truly guide the direction your solutions are headed? And what do you say to all the unselected artists and programmers who put in dozens of hours creating an app for you and get nothing in return for their hard work? However risky their methods, we are still very excited to see Chicago focusing on technology! At Sandstorm we do custom quality work, gathering requirements to make certain that the end product meets the clients’ specific needs. Let us know what your needs are!

This blog was posted by on June 27.
Karen Boehl

About the Author

Karen Boehl

Karen does a little bit of everything – webmaster, social media manager and search engine optimizer. She can most often be found on Twitter, in the Usability Lab, or happily buried in the Drupal admin menu.

Pages