Where Everything Comes Together

a:4:{s:13:”6053b0963772a”;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b0963772a”;s:4:”type”;s:3:”row”;s:6:”parent”;N;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:140:{s:5:”width”;s:5:”fixed”;s:13:”content_width”;s:5:”fixed”;s:17:”max_content_width”;s:0:””;s:22:”max_content_width_unit”;s:2:”px”;s:11:”full_height”;s:7:”default”;s:10:”min_height”;s:0:””;s:15:”min_height_unit”;s:2:”px”;s:17:”min_height_medium”;s:0:””;s:22:”min_height_medium_unit”;s:2:”px”;s:21:”min_height_responsive”;s:0:””;s:26:”min_height_responsive_unit”;s:2:”px”;s:17:”content_alignment”;s:6:”center”;s:10:”text_color”;s:0:””;s:10:”link_color”;s:0:””;s:11:”hover_color”;s:0:””;s:13:”heading_color”;s:0:””;s:7:”bg_type”;s:4:”none”;s:15:”bg_image_source”;s:7:”library”;s:12:”bg_image_url”;s:0:””;s:8:”bg_image”;s:0:””;s:12:”bg_image_src”;s:0:””;s:15:”bg_image_medium”;s:0:””;s:19:”bg_image_medium_src”;s:0:””;s:19:”bg_image_responsive”;s:0:””;s:23:”bg_image_responsive_src”;s:0:””;s:9:”bg_repeat”;s:4:”none”;s:16:”bg_repeat_medium”;s:0:””;s:20:”bg_repeat_responsive”;s:0:””;s:11:”bg_position”;s:13:”center center”;s:18:”bg_position_medium”;s:0:””;s:22:”bg_position_responsive”;s:0:””;s:13:”bg_x_position”;s:0:””;s:18:”bg_x_position_unit”;s:1:”%”;s:20:”bg_x_position_medium”;s:0:””;s:25:”bg_x_position_medium_unit”;s:1:”%”;s:24:”bg_x_position_responsive”;s:0:””;s:29:”bg_x_position_responsive_unit”;s:1:”%”;s:13:”bg_y_position”;s:0:””;s:18:”bg_y_position_unit”;s:1:”%”;s:20:”bg_y_position_medium”;s:0:””;s:25:”bg_y_position_medium_unit”;s:1:”%”;s:24:”bg_y_position_responsive”;s:0:””;s:29:”bg_y_position_responsive_unit”;s:1:”%”;s:13:”bg_attachment”;s:6:”scroll”;s:20:”bg_attachment_medium”;s:0:””;s:24:”bg_attachment_responsive”;s:0:””;s:7:”bg_size”;s:5:”cover”;s:14:”bg_size_medium”;s:0:””;s:18:”bg_size_responsive”;s:0:””;s:15:”bg_video_source”;s:9:”wordpress”;s:8:”bg_video”;s:0:””;s:13:”bg_video_webm”;s:0:””;s:16:”bg_video_url_mp4″;s:0:””;s:17:”bg_video_url_webm”;s:0:””;s:20:”bg_video_service_url”;s:0:””;s:14:”bg_video_audio”;s:2:”no”;s:15:”bg_video_mobile”;s:2:”no”;s:17:”bg_video_fallback”;s:0:””;s:21:”bg_video_fallback_src”;s:0:””;s:9:”ss_source”;s:9:”wordpress”;s:9:”ss_photos”;s:0:””;s:11:”ss_feed_url”;s:0:””;s:8:”ss_speed”;s:1:”3″;s:13:”ss_transition”;s:4:”fade”;s:21:”ss_transitionDuration”;s:1:”1″;s:12:”ss_randomize”;s:5:”false”;s:17:”bg_parallax_image”;s:0:””;s:21:”bg_parallax_image_src”;s:0:””;s:17:”bg_parallax_speed”;s:4:”fast”;s:15:”bg_overlay_type”;s:5:”color”;s:16:”bg_overlay_color”;s:0:””;s:19:”bg_overlay_gradient”;s:0:””;s:8:”bg_color”;s:0:””;s:11:”bg_gradient”;s:0:””;s:13:”bg_embed_code”;s:0:””;s:6:”border”;s:0:””;s:13:”border_medium”;s:0:””;s:17:”border_responsive”;s:0:””;s:14:”top_edge_shape”;s:0:””;s:14:”top_edge_align”;s:10:”top center”;s:19:”top_edge_fill_style”;s:5:”color”;s:19:”top_edge_fill_color”;s:3:”aaa”;s:26:”top_edge_fill_color_medium”;s:0:””;s:30:”top_edge_fill_color_responsive”;s:0:””;s:22:”top_edge_fill_gradient”;s:0:””;s:18:”top_edge_transform”;s:0:””;s:17:”bottom_edge_shape”;s:0:””;s:17:”bottom_edge_align”;s:13:”bottom center”;s:22:”bottom_edge_fill_style”;s:5:”color”;s:22:”bottom_edge_fill_color”;s:3:”aaa”;s:29:”bottom_edge_fill_color_medium”;s:0:””;s:33:”bottom_edge_fill_color_responsive”;s:0:””;s:25:”bottom_edge_fill_gradient”;s:0:””;s:21:”bottom_edge_transform”;s:0:””;s:18:”container_overflow”;s:0:””;s:18:”responsive_display”;s:0:””;s:18:”visibility_display”;s:0:””;s:26:”visibility_user_capability”;s:0:””;s:9:”animation”;s:0:””;s:17:”container_element”;s:3:”div”;s:2:”id”;s:0:””;s:5:”class”;s:0:””;s:19:”top_edge_size_width”;s:0:””;s:18:”top_edge_size_unit”;s:2:”px”;s:20:”top_edge_size_height”;s:0:””;s:17:”top_edge_size_top”;s:0:””;s:22:”bottom_edge_size_width”;s:0:””;s:21:”bottom_edge_size_unit”;s:2:”px”;s:23:”bottom_edge_size_height”;s:0:””;s:20:”bottom_edge_size_top”;s:0:””;s:10:”margin_top”;s:0:””;s:11:”margin_unit”;s:2:”px”;s:17:”margin_top_medium”;s:0:””;s:18:”margin_medium_unit”;s:2:”px”;s:21:”margin_top_responsive”;s:0:””;s:22:”margin_responsive_unit”;s:2:”px”;s:12:”margin_right”;s:0:””;s:19:”margin_right_medium”;s:0:””;s:23:”margin_right_responsive”;s:0:””;s:13:”margin_bottom”;s:0:””;s:20:”margin_bottom_medium”;s:0:””;s:24:”margin_bottom_responsive”;s:0:””;s:11:”margin_left”;s:0:””;s:18:”margin_left_medium”;s:0:””;s:22:”margin_left_responsive”;s:0:””;s:11:”padding_top”;s:0:””;s:12:”padding_unit”;s:2:”px”;s:18:”padding_top_medium”;s:0:””;s:19:”padding_medium_unit”;s:2:”px”;s:22:”padding_top_responsive”;s:0:””;s:23:”padding_responsive_unit”;s:2:”px”;s:13:”padding_right”;s:0:””;s:20:”padding_right_medium”;s:0:””;s:24:”padding_right_responsive”;s:0:””;s:14:”padding_bottom”;s:0:””;s:21:”padding_bottom_medium”;s:0:””;s:25:”padding_bottom_responsive”;s:0:””;s:12:”padding_left”;s:0:””;s:19:”padding_left_medium”;s:0:””;s:23:”padding_left_responsive”;s:0:””;}}s:13:”6053b09637ef7″;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b09637ef7″;s:4:”type”;s:12:”column-group”;s:6:”parent”;s:13:”6053b0963772a”;s:8:”position”;i:0;s:8:”settings”;s:0:””;}s:13:”6053b09637f5a”;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b09637f5a”;s:4:”type”;s:6:”column”;s:6:”parent”;s:13:”6053b09637ef7″;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:80:{s:4:”size”;i:100;s:11:”size_medium”;s:0:””;s:15:”size_responsive”;s:0:””;s:10:”min_height”;s:0:””;s:15:”min_height_unit”;s:2:”px”;s:17:”min_height_medium”;s:0:””;s:22:”min_height_medium_unit”;s:2:”px”;s:21:”min_height_responsive”;s:0:””;s:26:”min_height_responsive_unit”;s:2:”px”;s:12:”equal_height”;s:2:”no”;s:17:”content_alignment”;s:3:”top”;s:10:”text_color”;s:0:””;s:10:”link_color”;s:0:””;s:11:”hover_color”;s:0:””;s:13:”heading_color”;s:0:””;s:7:”bg_type”;s:5:”color”;s:8:”bg_image”;s:0:””;s:12:”bg_image_src”;s:0:””;s:15:”bg_image_medium”;s:0:””;s:19:”bg_image_medium_src”;s:0:””;s:19:”bg_image_responsive”;s:0:””;s:23:”bg_image_responsive_src”;s:0:””;s:9:”bg_repeat”;s:4:”none”;s:16:”bg_repeat_medium”;s:0:””;s:20:”bg_repeat_responsive”;s:0:””;s:11:”bg_position”;s:13:”center center”;s:18:”bg_position_medium”;s:0:””;s:22:”bg_position_responsive”;s:0:””;s:13:”bg_attachment”;s:6:”scroll”;s:20:”bg_attachment_medium”;s:0:””;s:24:”bg_attachment_responsive”;s:0:””;s:7:”bg_size”;s:5:”cover”;s:14:”bg_size_medium”;s:0:””;s:18:”bg_size_responsive”;s:0:””;s:15:”bg_overlay_type”;s:5:”color”;s:16:”bg_overlay_color”;s:0:””;s:19:”bg_overlay_gradient”;s:0:””;s:8:”bg_color”;s:0:””;s:11:”bg_gradient”;s:0:””;s:6:”border”;s:0:””;s:13:”border_medium”;s:0:””;s:17:”border_responsive”;s:0:””;s:18:”responsive_display”;s:0:””;s:16:”responsive_order”;s:7:”default”;s:18:”visibility_display”;s:0:””;s:26:”visibility_user_capability”;s:0:””;s:9:”animation”;s:0:””;s:17:”container_element”;s:3:”div”;s:2:”id”;s:0:””;s:5:”class”;s:0:””;s:10:”margin_top”;s:0:””;s:11:”margin_unit”;s:2:”px”;s:17:”margin_top_medium”;s:0:””;s:18:”margin_medium_unit”;s:2:”px”;s:21:”margin_top_responsive”;s:0:””;s:22:”margin_responsive_unit”;s:2:”px”;s:12:”margin_right”;s:0:””;s:19:”margin_right_medium”;s:0:””;s:23:”margin_right_responsive”;s:0:””;s:13:”margin_bottom”;s:0:””;s:20:”margin_bottom_medium”;s:0:””;s:24:”margin_bottom_responsive”;s:0:””;s:11:”margin_left”;s:0:””;s:18:”margin_left_medium”;s:0:””;s:22:”margin_left_responsive”;s:0:””;s:11:”padding_top”;s:0:””;s:12:”padding_unit”;s:2:”px”;s:18:”padding_top_medium”;s:0:””;s:19:”padding_medium_unit”;s:2:”px”;s:22:”padding_top_responsive”;s:0:””;s:23:”padding_responsive_unit”;s:2:”px”;s:13:”padding_right”;s:0:””;s:20:”padding_right_medium”;s:0:””;s:24:”padding_right_responsive”;s:0:””;s:14:”padding_bottom”;s:0:””;s:21:”padding_bottom_medium”;s:0:””;s:25:”padding_bottom_responsive”;s:0:””;s:12:”padding_left”;s:0:””;s:19:”padding_left_medium”;s:0:””;s:23:”padding_left_responsive”;s:0:””;}}s:13:”6053b096398f0″;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b096398f0″;s:4:”type”;s:6:”module”;s:6:”parent”;s:13:”6053b09637f5a”;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:31:{s:4:”text”;s:6886:”

ELEMENTS TO INCORPORATE AND THOSE TO LEAVE OUT OF YOUR NEXT WEBSITE DESIGN.

There are an overwhelming variety of website design features and functions to choose from these days – but don’t be taken in by all the fancy bells and whistles. They have the power to turn well-meaning websites into frustrating, user-UNfriendly monsters if not used effectively. We’re highlighting good and bad web design practices when it comes to mobile, layout, color, motion, funneling, and copy.

MOBILE

 
Good  
  • Mobile comes first
Today’s design recommendations include starting with a mobile layout, then moving onto a desktop look. Keep things linear and stackable, and program your website to be truly responsive in its ability to resize for every device.
Bad  
  • Separate mobile & desktop sites
When you use user-agent detection to show different versions of your website to mobile and desktop users, you’ll have to manage two versions of every page. It’s possible to streamline the process, but code issues often arise.
GC Studios’ desktop site neatly stacks and sizes down for mobile.

LAYOUT

 
Good
  • Clean & minimal  
Users are savvy these days, but they’re also impatient. Give them what they need and leave clutter out of the picture. Use simple, bold images and text.
Bad
  • Sensory overload
Websites with images, text, gradients in varied styles, and too many animations all shoved in a small space will confuse, distract, and infuriate users.
Herman Miller’s   homepage is the embodiment of a bold, no-frills layout.

COLOR

 
Good
  • Vibrant meets white
2020 saw an uptick in the use of vibrant, bold colors juxtaposed with clean, bright white. Contrast is a beautiful and effective way to direct the eye to important information.
Bad
  • Monochromatic colors
While we love colors that match, a fully monochromatic color scheme makes it hard for users to know where to focus.
Spotify isn’t afraid to think outside of the color wheel. Vibrant magenta fading to purple pops next to white.
 

MOTION

 
Good
  • For the function
Try incorporating a horizontal menu that expands from one side of the screen, and dropdowns with elements that rotate to convey when they’re open and closed. Motion is the best when it helps explain how a feature works.
Bad
  • Busy and chaotic
Avoid counterintuitive motions like adding hover changes to pieces that aren’t clickable. Animation of characters and text can be a great addition when used in moderation, but don’t go overboard.  

FUNNELING

Good
  • Stress-based funnels
Create a clear path for users to follow when they land on your site. What stressors do they have? How can you alleviate the stress? Create visuals and copy that offer clear answers and next steps.
Bad
  • No funnels
Website designs without funnels don’t allow users to quickly and easily find information that can help them solve a particular need or problem they are facing.
Kleenmark uses funnels that focus on user stressors ranging from pricing to quality.

COPY

Good
  • Smart, snappy, & personable
We’d argue that good copy has everything to do with design. A conversational tone personifies your brand and gives users a warm welcome to your website.
Bad
  • Overly technical & sales-y
Today, average users are inundated with hundreds of messages each day. Leave out technical jargon when possible and avoid overused sales-speak.
Smart, snappy copy from Skullcandy   : “SURVIVING STANDBY – Dig in and chill out to the albums that will keep you Zen throughout all those holiday travels.”
Want to learn more about website design strategy?   Get in touch with us today   for website design advice or to discuss your marketing needs with our savvy digital marketing team. We’ve been building beautiful, user-friendly websites since 1995.
“;s:5:”color”;s:0:””;s:10:”typography”;a:11:{s:11:”font_family”;s:7:”Default”;s:11:”font_weight”;s:7:”default”;s:9:”font_size”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:2:”px”;}s:11:”line_height”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:0:””;}s:10:”text_align”;s:0:””;s:14:”letter_spacing”;a:1:{s:6:”length”;s:0:””;}s:14:”text_transform”;s:0:””;s:15:”text_decoration”;s:0:””;s:10:”font_style”;s:0:””;s:12:”font_variant”;s:0:””;s:11:”text_shadow”;a:4:{s:5:”color”;s:0:””;s:10:”horizontal”;s:0:””;s:8:”vertical”;s:0:””;s:4:”blur”;s:0:””;}}s:17:”typography_medium”;a:9:{s:9:”font_size”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:2:”px”;}s:11:”line_height”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:0:””;}s:10:”text_align”;s:0:””;s:14:”letter_spacing”;a:1:{s:6:”length”;s:0:””;}s:14:”text_transform”;s:0:””;s:15:”text_decoration”;s:0:””;s:10:”font_style”;s:0:””;s:12:”font_variant”;s:0:””;s:11:”text_shadow”;a:4:{s:5:”color”;s:0:””;s:10:”horizontal”;s:0:””;s:8:”vertical”;s:0:””;s:4:”blur”;s:0:””;}}s:21:”typography_responsive”;a:9:{s:9:”font_size”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:2:”px”;}s:11:”line_height”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:0:””;}s:10:”text_align”;s:0:””;s:14:”letter_spacing”;a:1:{s:6:”length”;s:0:””;}s:14:”text_transform”;s:0:””;s:15:”text_decoration”;s:0:””;s:10:”font_style”;s:0:””;s:12:”font_variant”;s:0:””;s:11:”text_shadow”;a:4:{s:5:”color”;s:0:””;s:10:”horizontal”;s:0:””;s:8:”vertical”;s:0:””;s:4:”blur”;s:0:””;}}s:18:”responsive_display”;s:0:””;s:18:”visibility_display”;s:0:””;s:26:”visibility_user_capability”;s:0:””;s:9:”animation”;a:3:{s:5:”style”;s:0:””;s:5:”delay”;s:1:”0″;s:8:”duration”;s:1:”1″;}s:17:”container_element”;s:3:”div”;s:2:”id”;s:0:””;s:5:”class”;s:0:””;s:6:”export”;s:0:””;s:6:”import”;s:0:””;s:10:”margin_top”;s:0:””;s:11:”margin_unit”;s:2:”px”;s:17:”margin_top_medium”;s:0:””;s:18:”margin_medium_unit”;s:2:”px”;s:21:”margin_top_responsive”;s:0:””;s:22:”margin_responsive_unit”;s:2:”px”;s:12:”margin_right”;s:0:””;s:19:”margin_right_medium”;s:0:””;s:23:”margin_right_responsive”;s:0:””;s:13:”margin_bottom”;s:0:””;s:20:”margin_bottom_medium”;s:0:””;s:24:”margin_bottom_responsive”;s:0:””;s:11:”margin_left”;s:0:””;s:18:”margin_left_medium”;s:0:””;s:22:”margin_left_responsive”;s:0:””;s:4:”type”;s:9:”rich-text”;s:24:”flrich1616097444554_text”;s:0:””;}}}|a:4:{s:13:”6053b0963772a”;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b0963772a”;s:4:”type”;s:3:”row”;s:6:”parent”;N;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:140:{s:5:”width”;s:5:”fixed”;s:13:”content_width”;s:5:”fixed”;s:17:”max_content_width”;s:0:””;s:22:”max_content_width_unit”;s:2:”px”;s:11:”full_height”;s:7:”default”;s:10:”min_height”;s:0:””;s:15:”min_height_unit”;s:2:”px”;s:17:”min_height_medium”;s:0:””;s:22:”min_height_medium_unit”;s:2:”px”;s:21:”min_height_responsive”;s:0:””;s:26:”min_height_responsive_unit”;s:2:”px”;s:17:”content_alignment”;s:6:”center”;s:10:”text_color”;s:0:””;s:10:”link_color”;s:0:””;s:11:”hover_color”;s:0:””;s:13:”heading_color”;s:0:””;s:7:”bg_type”;s:4:”none”;s:15:”bg_image_source”;s:7:”library”;s:12:”bg_image_url”;s:0:””;s:8:”bg_image”;s:0:””;s:12:”bg_image_src”;s:0:””;s:15:”bg_image_medium”;s:0:””;s:19:”bg_image_medium_src”;s:0:””;s:19:”bg_image_responsive”;s:0:””;s:23:”bg_image_responsive_src”;s:0:””;s:9:”bg_repeat”;s:4:”none”;s:16:”bg_repeat_medium”;s:0:””;s:20:”bg_repeat_responsive”;s:0:””;s:11:”bg_position”;s:13:”center center”;s:18:”bg_position_medium”;s:0:””;s:22:”bg_position_responsive”;s:0:””;s:13:”bg_x_position”;s:0:””;s:18:”bg_x_position_unit”;s:1:”%”;s:20:”bg_x_position_medium”;s:0:””;s:25:”bg_x_position_medium_unit”;s:1:”%”;s:24:”bg_x_position_responsive”;s:0:””;s:29:”bg_x_position_responsive_unit”;s:1:”%”;s:13:”bg_y_position”;s:0:””;s:18:”bg_y_position_unit”;s:1:”%”;s:20:”bg_y_position_medium”;s:0:””;s:25:”bg_y_position_medium_unit”;s:1:”%”;s:24:”bg_y_position_responsive”;s:0:””;s:29:”bg_y_position_responsive_unit”;s:1:”%”;s:13:”bg_attachment”;s:6:”scroll”;s:20:”bg_attachment_medium”;s:0:””;s:24:”bg_attachment_responsive”;s:0:””;s:7:”bg_size”;s:5:”cover”;s:14:”bg_size_medium”;s:0:””;s:18:”bg_size_responsive”;s:0:””;s:15:”bg_video_source”;s:9:”wordpress”;s:8:”bg_video”;s:0:””;s:13:”bg_video_webm”;s:0:””;s:16:”bg_video_url_mp4″;s:0:””;s:17:”bg_video_url_webm”;s:0:””;s:20:”bg_video_service_url”;s:0:””;s:14:”bg_video_audio”;s:2:”no”;s:15:”bg_video_mobile”;s:2:”no”;s:17:”bg_video_fallback”;s:0:””;s:21:”bg_video_fallback_src”;s:0:””;s:9:”ss_source”;s:9:”wordpress”;s:9:”ss_photos”;s:0:””;s:11:”ss_feed_url”;s:0:””;s:8:”ss_speed”;s:1:”3″;s:13:”ss_transition”;s:4:”fade”;s:21:”ss_transitionDuration”;s:1:”1″;s:12:”ss_randomize”;s:5:”false”;s:17:”bg_parallax_image”;s:0:””;s:21:”bg_parallax_image_src”;s:0:””;s:17:”bg_parallax_speed”;s:4:”fast”;s:15:”bg_overlay_type”;s:5:”color”;s:16:”bg_overlay_color”;s:0:””;s:19:”bg_overlay_gradient”;s:0:””;s:8:”bg_color”;s:0:””;s:11:”bg_gradient”;s:0:””;s:13:”bg_embed_code”;s:0:””;s:6:”border”;s:0:””;s:13:”border_medium”;s:0:””;s:17:”border_responsive”;s:0:””;s:14:”top_edge_shape”;s:0:””;s:14:”top_edge_align”;s:10:”top center”;s:19:”top_edge_fill_style”;s:5:”color”;s:19:”top_edge_fill_color”;s:3:”aaa”;s:26:”top_edge_fill_color_medium”;s:0:””;s:30:”top_edge_fill_color_responsive”;s:0:””;s:22:”top_edge_fill_gradient”;s:0:””;s:18:”top_edge_transform”;s:0:””;s:17:”bottom_edge_shape”;s:0:””;s:17:”bottom_edge_align”;s:13:”bottom center”;s:22:”bottom_edge_fill_style”;s:5:”color”;s:22:”bottom_edge_fill_color”;s:3:”aaa”;s:29:”bottom_edge_fill_color_medium”;s:0:””;s:33:”bottom_edge_fill_color_responsive”;s:0:””;s:25:”bottom_edge_fill_gradient”;s:0:””;s:21:”bottom_edge_transform”;s:0:””;s:18:”container_overflow”;s:0:””;s:18:”responsive_display”;s:0:””;s:18:”visibility_display”;s:0:””;s:26:”visibility_user_capability”;s:0:””;s:9:”animation”;s:0:””;s:17:”container_element”;s:3:”div”;s:2:”id”;s:0:””;s:5:”class”;s:0:””;s:19:”top_edge_size_width”;s:0:””;s:18:”top_edge_size_unit”;s:2:”px”;s:20:”top_edge_size_height”;s:0:””;s:17:”top_edge_size_top”;s:0:””;s:22:”bottom_edge_size_width”;s:0:””;s:21:”bottom_edge_size_unit”;s:2:”px”;s:23:”bottom_edge_size_height”;s:0:””;s:20:”bottom_edge_size_top”;s:0:””;s:10:”margin_top”;s:0:””;s:11:”margin_unit”;s:2:”px”;s:17:”margin_top_medium”;s:0:””;s:18:”margin_medium_unit”;s:2:”px”;s:21:”margin_top_responsive”;s:0:””;s:22:”margin_responsive_unit”;s:2:”px”;s:12:”margin_right”;s:0:””;s:19:”margin_right_medium”;s:0:””;s:23:”margin_right_responsive”;s:0:””;s:13:”margin_bottom”;s:0:””;s:20:”margin_bottom_medium”;s:0:””;s:24:”margin_bottom_responsive”;s:0:””;s:11:”margin_left”;s:0:””;s:18:”margin_left_medium”;s:0:””;s:22:”margin_left_responsive”;s:0:””;s:11:”padding_top”;s:0:””;s:12:”padding_unit”;s:2:”px”;s:18:”padding_top_medium”;s:0:””;s:19:”padding_medium_unit”;s:2:”px”;s:22:”padding_top_responsive”;s:0:””;s:23:”padding_responsive_unit”;s:2:”px”;s:13:”padding_right”;s:0:””;s:20:”padding_right_medium”;s:0:””;s:24:”padding_right_responsive”;s:0:””;s:14:”padding_bottom”;s:0:””;s:21:”padding_bottom_medium”;s:0:””;s:25:”padding_bottom_responsive”;s:0:””;s:12:”padding_left”;s:0:””;s:19:”padding_left_medium”;s:0:””;s:23:”padding_left_responsive”;s:0:””;}}s:13:”6053b09637ef7″;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b09637ef7″;s:4:”type”;s:12:”column-group”;s:6:”parent”;s:13:”6053b0963772a”;s:8:”position”;i:0;s:8:”settings”;s:0:””;}s:13:”6053b09637f5a”;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b09637f5a”;s:4:”type”;s:6:”column”;s:6:”parent”;s:13:”6053b09637ef7″;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:80:{s:4:”size”;i:100;s:11:”size_medium”;s:0:””;s:15:”size_responsive”;s:0:””;s:10:”min_height”;s:0:””;s:15:”min_height_unit”;s:2:”px”;s:17:”min_height_medium”;s:0:””;s:22:”min_height_medium_unit”;s:2:”px”;s:21:”min_height_responsive”;s:0:””;s:26:”min_height_responsive_unit”;s:2:”px”;s:12:”equal_height”;s:2:”no”;s:17:”content_alignment”;s:3:”top”;s:10:”text_color”;s:0:””;s:10:”link_color”;s:0:””;s:11:”hover_color”;s:0:””;s:13:”heading_color”;s:0:””;s:7:”bg_type”;s:5:”color”;s:8:”bg_image”;s:0:””;s:12:”bg_image_src”;s:0:””;s:15:”bg_image_medium”;s:0:””;s:19:”bg_image_medium_src”;s:0:””;s:19:”bg_image_responsive”;s:0:””;s:23:”bg_image_responsive_src”;s:0:””;s:9:”bg_repeat”;s:4:”none”;s:16:”bg_repeat_medium”;s:0:””;s:20:”bg_repeat_responsive”;s:0:””;s:11:”bg_position”;s:13:”center center”;s:18:”bg_position_medium”;s:0:””;s:22:”bg_position_responsive”;s:0:””;s:13:”bg_attachment”;s:6:”scroll”;s:20:”bg_attachment_medium”;s:0:””;s:24:”bg_attachment_responsive”;s:0:””;s:7:”bg_size”;s:5:”cover”;s:14:”bg_size_medium”;s:0:””;s:18:”bg_size_responsive”;s:0:””;s:15:”bg_overlay_type”;s:5:”color”;s:16:”bg_overlay_color”;s:0:””;s:19:”bg_overlay_gradient”;s:0:””;s:8:”bg_color”;s:0:””;s:11:”bg_gradient”;s:0:””;s:6:”border”;s:0:””;s:13:”border_medium”;s:0:””;s:17:”border_responsive”;s:0:””;s:18:”responsive_display”;s:0:””;s:16:”responsive_order”;s:7:”default”;s:18:”visibility_display”;s:0:””;s:26:”visibility_user_capability”;s:0:””;s:9:”animation”;s:0:””;s:17:”container_element”;s:3:”div”;s:2:”id”;s:0:””;s:5:”class”;s:0:””;s:10:”margin_top”;s:0:””;s:11:”margin_unit”;s:2:”px”;s:17:”margin_top_medium”;s:0:””;s:18:”margin_medium_unit”;s:2:”px”;s:21:”margin_top_responsive”;s:0:””;s:22:”margin_responsive_unit”;s:2:”px”;s:12:”margin_right”;s:0:””;s:19:”margin_right_medium”;s:0:””;s:23:”margin_right_responsive”;s:0:””;s:13:”margin_bottom”;s:0:””;s:20:”margin_bottom_medium”;s:0:””;s:24:”margin_bottom_responsive”;s:0:””;s:11:”margin_left”;s:0:””;s:18:”margin_left_medium”;s:0:””;s:22:”margin_left_responsive”;s:0:””;s:11:”padding_top”;s:0:””;s:12:”padding_unit”;s:2:”px”;s:18:”padding_top_medium”;s:0:””;s:19:”padding_medium_unit”;s:2:”px”;s:22:”padding_top_responsive”;s:0:””;s:23:”padding_responsive_unit”;s:2:”px”;s:13:”padding_right”;s:0:””;s:20:”padding_right_medium”;s:0:””;s:24:”padding_right_responsive”;s:0:””;s:14:”padding_bottom”;s:0:””;s:21:”padding_bottom_medium”;s:0:””;s:25:”padding_bottom_responsive”;s:0:””;s:12:”padding_left”;s:0:””;s:19:”padding_left_medium”;s:0:””;s:23:”padding_left_responsive”;s:0:””;}}s:13:”6053b096398f0″;O:8:”stdClass”:5:{s:4:”node”;s:13:”6053b096398f0″;s:4:”type”;s:6:”module”;s:6:”parent”;s:13:”6053b09637f5a”;s:8:”position”;i:0;s:8:”settings”;O:8:”stdClass”:31:{s:4:”text”;s:6886:”

ELEMENTS TO INCORPORATE AND THOSE TO LEAVE OUT OF YOUR NEXT WEBSITE DESIGN.

There are an overwhelming variety of website design features and functions to choose from these days – but don’t be taken in by all the fancy bells and whistles. They have the power to turn well-meaning websites into frustrating, user-UNfriendly monsters if not used effectively. We’re highlighting good and bad web design practices when it comes to mobile, layout, color, motion, funneling, and copy.

MOBILE

 
Good  
  • Mobile comes first
Today’s design recommendations include starting with a mobile layout, then moving onto a desktop look. Keep things linear and stackable, and program your website to be truly responsive in its ability to resize for every device.
Bad  
  • Separate mobile & desktop sites
When you use user-agent detection to show different versions of your website to mobile and desktop users, you’ll have to manage two versions of every page. It’s possible to streamline the process, but code issues often arise.
GC Studios’ desktop site neatly stacks and sizes down for mobile.

LAYOUT

 
Good
  • Clean & minimal  
Users are savvy these days, but they’re also impatient. Give them what they need and leave clutter out of the picture. Use simple, bold images and text.
Bad
  • Sensory overload
Websites with images, text, gradients in varied styles, and too many animations all shoved in a small space will confuse, distract, and infuriate users.
Herman Miller’s   homepage is the embodiment of a bold, no-frills layout.

COLOR

 
Good
  • Vibrant meets white
2020 saw an uptick in the use of vibrant, bold colors juxtaposed with clean, bright white. Contrast is a beautiful and effective way to direct the eye to important information.
Bad
  • Monochromatic colors
While we love colors that match, a fully monochromatic color scheme makes it hard for users to know where to focus.
Spotify isn’t afraid to think outside of the color wheel. Vibrant magenta fading to purple pops next to white.
 

MOTION

 
Good
  • For the function
Try incorporating a horizontal menu that expands from one side of the screen, and dropdowns with elements that rotate to convey when they’re open and closed. Motion is the best when it helps explain how a feature works.
Bad
  • Busy and chaotic
Avoid counterintuitive motions like adding hover changes to pieces that aren’t clickable. Animation of characters and text can be a great addition when used in moderation, but don’t go overboard.  

FUNNELING

Good
  • Stress-based funnels
Create a clear path for users to follow when they land on your site. What stressors do they have? How can you alleviate the stress? Create visuals and copy that offer clear answers and next steps.
Bad
  • No funnels
Website designs without funnels don’t allow users to quickly and easily find information that can help them solve a particular need or problem they are facing.
Kleenmark uses funnels that focus on user stressors ranging from pricing to quality.

COPY

Good
  • Smart, snappy, & personable
We’d argue that good copy has everything to do with design. A conversational tone personifies your brand and gives users a warm welcome to your website.
Bad
  • Overly technical & sales-y
Today, average users are inundated with hundreds of messages each day. Leave out technical jargon when possible and avoid overused sales-speak.
Smart, snappy copy from Skullcandy   : “SURVIVING STANDBY – Dig in and chill out to the albums that will keep you Zen throughout all those holiday travels.”
Want to learn more about website design strategy?   Get in touch with us today   for website design advice or to discuss your marketing needs with our savvy digital marketing team. We’ve been building beautiful, user-friendly websites since 1995.
“;s:5:”color”;s:0:””;s:10:”typography”;a:11:{s:11:”font_family”;s:7:”Default”;s:11:”font_weight”;s:7:”default”;s:9:”font_size”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:2:”px”;}s:11:”line_height”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:0:””;}s:10:”text_align”;s:0:””;s:14:”letter_spacing”;a:1:{s:6:”length”;s:0:””;}s:14:”text_transform”;s:0:””;s:15:”text_decoration”;s:0:””;s:10:”font_style”;s:0:””;s:12:”font_variant”;s:0:””;s:11:”text_shadow”;a:4:{s:5:”color”;s:0:””;s:10:”horizontal”;s:0:””;s:8:”vertical”;s:0:””;s:4:”blur”;s:0:””;}}s:17:”typography_medium”;a:9:{s:9:”font_size”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:2:”px”;}s:11:”line_height”;a:2:{s:6:”length”;s:0:””;s:4:”unit”;s:0:””;}s:10:”text_align”;s:0:””;s:14:”letter_spacing”;a:1:{s:6:”length”;s:0:””;}s:14:”text_transform”;s:0:””;s:15:”text_decoration”;s:0:””;s:10:”font_style”;s:0:””;s:12:”font_variant”;s:0:””;s:11:”text_shadow”;a:4:{s:5:”color”;s:0:””;s:10:”horizontal”;s:0:””;s

Need Help? If so, complete the form below and we'll get right back to you...