Hard to understand, the web has been a part of our world since CERN brought it to the public in 1993. And if you were building or browsing websites during that era, you might not have imagined who more design and functionality. would emerge twenty or thirty years later.
Using this new experimental medium, web designers have repeatedly innovated and pushed boundaries. There were risks – but that was also what made it fun. It seemed like everyone wanted to play a part in helping the web reach its full potential.
In reality, most of the experiments did not work out. Some fell as fast as they launched. At the very least, they could be considered good learning experiences for a young industry.
But some trends, tools and techniques were cutting edge – even if it took years to see them that way. Looking at the web through today’s lens, you could say they were a forerunner of what was to come. Without them, we might not have some of the slick features we have now that’s for sure.
With that, let’s look at some web design concepts that were ahead of their time.
This is how the W3C describes HTML frames:
HTML frames allow authors to present documents in multiple views, which may be independent windows or subwindows. Multiple views provide a way for designers to keep certain information visible, while other views are scrolled or repositioned.
In practice, frames were able to display multiple HTML documents at the same time. As you would expect, some unique functions have been implemented. Some were more useful in real life than others.
One of the most common uses was navigation. For example, a UI designer could create vertical navigation within a frame located on the side of the screen. Clicking on a navigation item would load the content into a larger frame in the middle.
Headers were also a natural fit for frames. The element could remain active while the user scrolls through the main content area.
Overall, these were efforts to make websites more user-friendly. There was also potential for improved performance, as loading images once per session in static frames, rather than every page view, could lead to smart usage. This was a big deal in the days before caching was popular.
In retrospect, frames offered an early way to create “sticky” elements that stay in a fixed position on a scrollbar. And while the old HTML specification is deprecated, we can now use CSS to build these features.
Flash had to be one of the most divisive technologies on the early web. On the one hand, it allowed designers to create some incredible multimedia-driven content. But there were also plenty of downsides.
When entire websites were built with Flash, they often suffered from accessibility problems. Additionally, long load times were common for users with a slow internet connection. And it has also been known to crash a web browser or two.
Mobile compatibility was also a sticking point. Early iOS devices did not support Flash, which seemed to seal the format’s fate. Adobe finally stopped supporting it at the end of 2020 – long after its glory days were over.
Problems aside, Flash has shown a user appetite for animation and interactive multimedia. It allowed these features to become mainstream – even if the technology itself didn’t exist yet.
Everything from CSS animations to browser tools is thanks to Flash. It showed what the web of the future could look like. Over time there was a better way to implement multimedia and to do so through open standards.
Although these two languages are not directly related, they came together to bring a new level of functionality to early websites. And both are still around, although the former has reached far beyond the web.
Java was designed to work on multiple devices. And before databases and content management systems (CMS) were common components of a website, the language provided a way to add application-like functionality to a page.
For example, consider live sports scores or news headlines. Java applets could be embedded to automatically update this type of information as needed. It did that independently from the page, meaning you didn’t have to hit the refresh button in your browser to see the latest version.
This paved the way for technologies like AJAX, which can perform similar tasks without the performance overhead. Speaking of performance, Java was incredibly slow to load back in those days. Even a relatively small applet can tirelessly grind your system’s hard drive.
For example, let a designer replace the original image with another image. This was commonly used in image-based navigation UI. The popular Dreamweaver WYSIWYG editor came preloaded with a script for this purpose.
Each of these languages gave users a taste of what the dynamic web could be.
Seeds of the Modern Web
The web began largely as a static medium. Only a few years into its mainstream life, web designers aimed to provide more functionality and a better user experience. They would be critical factors in their growth.
Although those early implementations were rudimentary, they planted the seeds for what came next. Their quirks and drawbacks provided valuable lessons for the developers who created the next generation of tools. Technologies have become more refined resulting in an almost seamless blend of form and function.
So, the next time you use a modern web application, maybe take a moment to remember how we got here. It was a long journey, but one that turned out beautifully.
Historical screen captures courtesy of the Web Design Museum. Also be sure to check out our interview with the founder Petr Kovář!