2016

Web Trends Now

Learn More


Header image of code

stay_current_portrait

Works On All Devices

With the introduction of responsive design, modern websites look good on nearly any device, regardless of size. Whether you're on your laptop, your phone, your Kindle, or any number of other gadgets, sites are built to be versatile.

replay

Lightning Fast

Modern sites are built for speed. Hosts began transfer speeds of over 1 Gigabit, code libraries are now hosted on Content Delivery Networks (CDNs) for optimal load-time, along with numerous other ways that web developers work to keep sites loading quickly.

code

Semantically Coded

With HTML5's introduction of several semantic tags, sites are now coded smarter. With site navigations wrapped in <nav> tags, footers in <footer> tags, and more, sites are now coded to be accesible and easy to understand.

HTML5

HTML5's introduction in 2014 didn't bring any revolutionary concepts or new syntax, but it allowed code to be more straightfoward. Main site content doesn't just go in a <div>, it goes in the <main> section. Abbreviations aren't assumed, they're put between <abbr> tags. These are just a few examples of how websites became more semantic, that is to say, more logical in their coding. A web developer could look at the HTML of nearly any modern website and tell the purpose of most of the code.

CSS3

In contrast with HTML5, CSS3 did bring several advancements. It built on CSS2.1, the previous standard, and added numerous new properties and selectors, allowing web designers to style like never before. hsl(), rgb(), and rgba() functions were added to make color selection a breeze for designers. The :before, :after, and :nth-of-type() pseudo-selectors gave developers more flexibility with their code. Media queries allowed designs to become responsive, with styles being applied based on the size of the device, along with other factors. With these being only a select few of the innovations CSS3 introduced, it was a game-changer for web developers and designers alike.

Designs

Though HTML5 and CSS3 broadened the horizons of what web designers could create, many modern sites look surprisingly alike. A common trend in modern web design, as exemplified in this site, includes a hero image with a heading, subheading, and a call-to-action button, a set of three icons with headings and captions beneath them, and a "hamburger" icon when the navigation collapses on smaller screens. These along with a few other characteristics are visible in many sites currently. Frameworks like Bootstrap, Foundation, Materialize (which this site was made with), and more help designers and developers quickly and efficiently create websites; a side-affect of the use of frameworks happens to be sites having similar aesthetics.