Web Design Trends for 2014
News
Mobile Responsive
An extension of design trends from 2012 and 2013 is to build your websites to be mobile responsive. From 25 to 35 percent of many websites’ total traffic will come through mobile devices. The number of mobile device users is growing. Having a website designed to adapt to each device is critical. Before this trend began to emerge, you had to build a second website for mobile devices, which created extra work to maintain a second site. Most likely, you just let your site be as it is on a mobile device, which does not provide an optimal user experience.
Going responsive will allow your users to experience the colors and design of your site, crafted for their viewing device of choice. Gone are the needs to zoom in, crop a screen or just leave because the visual look is too much for the eye.
Minimalism
Perhaps the biggest change for many church websites is a move toward minimalism. The past practice has been to put as much information as possible in front of your site visitors. This makes for a busy, cluttered and often confusing front-page. Because of the growing use of mobiles for viewing webpages and emerging app culture, this show-everything trend is passé. With a minimalist design, you remove content and decide what content is most important for users to focus on. The focus might be to share who you are as a congregation or an important event of the church. Possibly, the focus could be to have people follow a call-to-action and sign up for an email list.
Flat Design
Trends change frequently. Once, the trend was to have a website with many graphics that had many textures and gradients. The aim was to give depth to the site. The new web design trend is more minimalist in order to be less distracting and drive focus on the content aim of your website. Flat design can be elegant and aesthetically pleasing when done well. Even with a flat design, your graphic design can give depth to important page elements or calls to action. The level of depth and manipulation of graphics will be significantly less than in the past.
High-Resolution Photos
We are an image-driven culture. We love large, eye-popping images within a website, whether they come as a large background image (see full screen web designs) or some high-resolution images that capture the user’s eye when he or she calls up your website. Apple has employed this technique for a few years, showing vivid pictures of Apple products. Many sites used a full-screen background to focus the feel of their message and create clear instruction to their website (example: Stumbleupon).
Infinite scrolling
Not long ago, it was the norm to design so that the end user of a website never had to scroll. The result was that a user had to click from page to page. Though this concept is still popular and a valid design technique, if your goal is to get a number of page views, it is not a “must have” design. One new design trend, with the assistance of micro-blogging sites (Tumblr, Pinterest), is to implement an “infinite-scrolling” technique. People are becoming more comfortable scrolling. They scan and find interesting content without complaint.Mashable, a popular tech news site, has implemented the infinite scroll technique. If you have a current Wordpress-built website (and theme), you can test your site’s infinite scrolling capabilities by turning on that function within the Jetpack plugin.
Infinite scrolling works well for blogs, but it may not be best for every page. However, it could be attractive to visitors to see landing pages that simulate your church’s “infinite” involvement in the community or with the youth group. Often, people search for youth activities and community involvement before visiting a church, so infinite scrolling could really help. Include pictures, progress and positive quotes from those affected by your church’s love.
If you include infinite scrolling, be sure to place contact info prominently so people need not endlessly scroll to find you. That gets annoying quickly.
Typography
In years past, web designs used web-safe fonts, fonts that end users most likely had on their computers. If you designed a website with a font you liked, the site might not have worked on other computers because that font needed to be part of their font library. By designing with Google Fonts, you can expand the use of typography and your website to be unique and convey your message for a pleasing user experience. What is the big deal about typography? Helvetica film is a good place to start your exploration into the importance of typography. Creative use of fonts and avoiding overused fonts (Comic Sans & Papyrus, for example) will give your website a new feel and convey a new message.
Not only is your font choice a design trend, but sizing and spacing your fonts correctly is an emerging trend. Larger font sizes and more white space provide great readability. Does your website have small, crammed print? Users may not read pages that have small, compressed fonts because copy is difficult to read and the value of the content might not be worth the effort.
Circles
Formerly, to make circles and curves happen on a webpage, you had to use a graphics program and then insert the circles and curves into a website. This served the needed purpose, but it was also time-consuming, as you had to go outside the website to change that element. More graphics make for slower load times. CSS coding has developed curves within a site, making it more feasible to create new shapes in a site. With the CSS radius function, you can change the boxy world of the web to give a fresh, less edgy, more appealing look. This might be the faddish design trend of the bunch, so decide if it fits within your design aesthetic before implementing.
HTML5 Coding Update
HTML5 allows you to choose from a new or streamlined set of web functions. HTML Goodies has an HTML5 overview that explains how the update uses a variety of graphics elements, such as animation and movies. It supports intense graphics effects such as lightning, shadows, 3-D, special effects and vector graphics. HTML 5 compliance will help videos play on various mobile browser platforms that once had limited video functionality. If your site cannot be viewed on a Safari mobile browser (because it is not compatible with Adobe Flash), moving to HTML 5 is a solution. HTML 5 is in the adolescence of development, so learn now before you get behind. Be sure to keep a minimal mindset while learning all the new effects, so your site does not look overdone.
Remove the clutter, focus on what is most important and create one responsive design for multiple devices. Implement these techniques, and your church will be set until trends shift again. Websites are always works in progress and need constant care.
Design to your website is similar to the fashion in your closet. Some things are timeless. Other items must go. Do not wait for your website to become retro fashionable. Go mobile minimalist in 2014.
While you are tackling website trends, learn about all the Search Engine Optimization of each website; this directs the search engines to look for the important content of your site.
Note: We are currently redesigning UMC.org and UMCom.org. It will take time to implement changes to thousands of articles and landing pages. We will keep you updated on the progress and send some church leaders links to the beta versions for testing and feedback.