Author: Randy A Brown

Web Design Trends for 2017 – Material Design

Reading Time: 3 minutes
[et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”on” specialty=”off”][et_pb_fullwidth_post_title admin_label=”Fullwidth Post Title” title=”on” meta=”on” author=”on” date=”on” categories=”on” comments=”on” featured_image=”on” featured_placement=”background” parallax_effect=”on” parallax_method=”on” text_orientation=”center” text_color=”light” text_background=”on” text_bg_color=”rgba(0,0,0,0.5)” use_border_color=”off” border_color=”#ffffff” border_style=”solid” custom_padding=”320px||320px|” title_font_size=”52px” title_font_size_last_edited=”on|phone” custom_padding_tablet=”220px||220px|” custom_padding_phone=”120px||120px|” custom_padding_last_edited=”on|phone” title_font_size_phone=”42″ /][/et_pb_section][et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”off” specialty=”off”][et_pb_row admin_label=”Row” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” use_custom_gutter=”off” allow_player_pause=”off” parallax=”off” parallax_method=”off” make_equal=”off” parallax_1=”off” parallax_method_1=”off” custom_padding=”40px|80px|40px|80px” parallax_2=”off” parallax_method_2=”off” custom_padding_tablet=”20px|0px|20px|0px” custom_padding_last_edited=”on|tablet”][et_pb_column type=”4_4″][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”left” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

Material Design is Google’s web design principles that are basically a digital version of classic principles of good design. It uses visual cues for surfaces that are clickable and bold typography and vibrant color. It uses shadow and edges to show what can be clicked. Google has created lots of guidelines, resources, and tools, and since Google is behind it you can bet it will continue to grow in popularity.

Where flat design once ruled I see material design taking over. Flat design will continue to be used and even evolve to be more useful. However, it’s still limited. For example, flat design doesn’t have shading which can make it difficult to tell what is clickable (note – there are ways to achieve shading in flat design but that’s not typical). Shading looks better in many situations and Material Design is better suited for shading. Google explains all the details in their guidelines.

Material Design Blog

One of the best examples of putting Material Design to use is Google’s Material Design Blog. They have a similar layout to mine. I designed mine first, they just started their blog before I did. Yeah, I’m going with that.

Material Design Themes

Websites will focus on Google’s Material Design principles while developing their styles and designs in order to stand apart from the crowd. There are lots of themes built around Material Design to help you get started. There’s a nice list at Theme Forest. Here are a few examples…

WordPress Material Design

BeMaterial is a premium theme from BeThemes fully incorporates Material Design and a lot of design trends that I’m starting to see implemented on other websites. It’s built with the idea of online community engagement. It includes a modular drag-and-drop front page module builder, one-page parallax, AJAX portfolio, and unlimited typography and colors. Other features include image and video backgrounds, slider, more than 25 page transition effects, over 30 CSS animations, Magnific image gallery, and more.

Zephyr

Zephyr is a premium theme from UpSolution that won Evanto’s Material Design Most Wanted competition. It includes a header builder which lets you place any custom element within the header. It includes multiple sliders, portfolios, blogs, elements, advanced typography, pages, 1273 icons, and unlimited colors. Design your layout using the built-in drag-and-drop page builder or use one of the pre-made layouts.

Let’s Discuss

1. Do you follow Material Design Principles?

2. What are your favorite Material Design tools?

3. What are your favorite Material Design Themes?

Let us know in the comments. Thanks for reading and please subscribe if you haven’t already.

Featured Image from Google’s Material Guidelines

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]

April 3, 2017
Google Introduces Upside-down Websites

Reading Time: 2 minutes
[et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”on” specialty=”off”][et_pb_fullwidth_post_title admin_label=”Fullwidth Post Title” title=”on” meta=”on” author=”on” date=”on” categories=”on” comments=”on” featured_image=”on” featured_placement=”background” parallax_effect=”on” parallax_method=”on” text_orientation=”center” text_color=”light” text_background=”on” text_bg_color=”rgba(0,0,0,0.5)” use_border_color=”off” border_color=”#ffffff” border_style=”solid” custom_padding=”320px||320px|” title_font_size=”52px” custom_padding_tablet=”220px||220px|” custom_padding_phone=”120px||120px|” custom_padding_last_edited=”on|phone” title_font_size_phone=”42px” title_font_size_last_edited=”on|phone” /][/et_pb_section][et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”off” specialty=”off”][et_pb_row admin_label=”Row” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” use_custom_gutter=”off” allow_player_pause=”off” parallax=”off” parallax_method=”off” make_equal=”off” parallax_1=”off” parallax_method_1=”off” custom_padding=”40px|80px|40px|80px” parallax_2=”off” parallax_method_2=”off” custom_padding_tablet=”20px|0px|20px|0px” custom_padding_last_edited=”on|phone”][et_pb_column type=”4_4″][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”left” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

Footers are rarely seen in today’s websites. They not getting the love they used to because readers are not scrolling to the bottom of pages anymore. To find out why, I did what any web designer would do – ask random people on the streets.

Random Guy

“I don’t scroll all the way down,” said a random guy I met on the street, “because all that’s down there are hit counters and Flash animation. Besides,” Random Guy continued, “why scroll all the way down there when I can look at all of the shaking ads in the sidebars? I was the 100,000th visitor to every website I visited last week. That makes me kind of a big deal. They should be paying me…”

Unfortunately our conversation was cut short, but Random Guy does make a good point. However, it’s not the 1970’s anymore and anyone who’s scrolled all the way to the bottom of a website in the past few months has noticed there are some really good designs in those footers. Designers want their readers to see those footers. Afterall, all web design is art, they put a lot of time into them, and the art must be viewed.

Google Rep

To help with this, Google has developed the upside-down website. “It just makes sense” said the Google rep, “since the goal is to get your readers to the bottom of the page… to just go ahead and start there. Plus, we have to do something new or the web is going to explode due to the 2018 web bug (which we don’t want to talk about).”

The Google rep wanted me to strike that last comment but I used parenthesis instead. I hope he appreciates it.

Google’s Upside-down Web Design Standards

Here’s a look at a blog design using Google’s Upside-down Web Design Standards.

As you can see… it’s… well… upside-down. The text and images are in the proper direction, but the footer is on top, followed by the oldest to newest post, and then the header and primary menu.

Well it looks like we’re in for some interesting designs when the Upside-down Tool Kit is released later in the year. Until then, happy designing, and have a great April Fools Day!

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]

April 1, 2017
Web Design Trends for 2017 – Bold Color Choices
Reading Time: 3 minutes
[et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”on” specialty=”off”][et_pb_fullwidth_post_title admin_label=”Fullwidth Post Title” title=”on” meta=”on” author=”on” date=”on” categories=”on” comments=”on” featured_image=”on” featured_placement=”background” parallax_effect=”on” parallax_method=”on” text_orientation=”center” text_color=”light” text_background=”on” text_bg_color=”rgba(0,0,0,0.5)” use_border_color=”off” border_color=”#ffffff” border_style=”solid” custom_padding=”320px||320px|” title_font_size=”52px” custom_padding_tablet=”220px||220px|” custom_padding_phone=”120px||120px|” custom_padding_last_edited=”on|phone” title_font_size_phone=”42px” title_font_size_last_edited=”on|phone” /][/et_pb_section][et_pb_section bb_built=”1″ admin_label=”Section” fullwidth=”off” specialty=”off”][et_pb_row admin_label=”Row” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” use_custom_gutter=”off” allow_player_pause=”off” parallax=”off” parallax_method=”off” make_equal=”off” parallax_1=”off” parallax_method_1=”off” custom_padding=”40px|80px|40px|80px” parallax_2=”off” parallax_method_2=”off” custom_padding_tablet=”20px|0px|20px|0px” custom_padding_last_edited=”on|tablet”][et_pb_column type=”4_4″][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”left” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

Color can have an influence on the reader. Readers expect certain colors for certain genres. Expect an increase in awareness of color choices. As designers explore and become more creative with color choices, I would also expect to see some creative ways that designers are successfully breaking the rules or blending genres.

Purposefully Chosen Colors

In the past website owners have chosen colors they enjoy rather than colors to affect their readership. For 2017 websites will focus more than ever on color choices specific to their audience and purpose. Color sets the mood, tone, thoughts, and even affects conversion. Colors should be chosen carefully.

Color Psychology

There’s a lot of science behind color theory and psychology. Here’s a short list of how color affects readers and how to know which colors you need based on your niche:
- Black – sophistication, power, edginess, timeliness, seriousness – great choice for backgrounds.
- White – cleanliness, purity, virtue, simplicity, seriousness – great choice for backgrounds and for minimal and simple sites.
- Ivory – comfort, simplicity, elegance, softens colors, complementary – excellent for highlights, secondary, and background colors.
- Gray – formal, neutral, sad, professional, traditional, seriousness, calmness – great choice for backgrounds.
- Beige – humility, promotes the traits of surrounding colors – excellent for highlights, secondary, and background colors.
- Red – importance, power, danger, youthful (bright colors), comforting (warm colors).
- Pink – youthful, feminine, innocent.
- Orange – friendliness, energy, movement, uniqueness.
- Yellow – happiness, enthusiasm, youthful (bright shades – great for children), comfort (using middle shades), antiquity (using dark shades – great for showing authority), versatile.
- Green – growth, stability (using dark shades – great for environmental and financial themes), relaxing, honesty (using lighter shades).
- Blue – calm, safe, friendly, open (with lighter shades), reliable (with darker shades).
- Purple – luxury, mystery (using darker shades), romance (using lighter shades).
Pantone Color of the Year

Pantone provides color palettes that work in many industries including graphic design with each year focusing on a single color. For 2017 Pantone has determined that the color of the year is green. More specifically, Greenery 15-0343. Pantone provides color-paring charts to create 10 palettes of neutral, bright, pastel, metallic, deeper shades, etc. Expect to see Greenery 15-0343 and its surrounding palettes used a lot in 2017 as the various shades are well-suited to many genres.

Material Design’s Color Palettes

Google’s Material Design is becoming more popular among designers and in turn so will its bright color palettes. Google’s Material Design Palette allows you to choose two colors and it provides a palette that works with those colors.

Material UI

Another Google Material Design tool is Material UI. This tool has lots of features to choose color palettes for flat UI, social, Material, metro, HTML, Hex, and lots more. I expect this tool to become even more popular for choosing color palettes.

Let’s Discuss

1. Do your color choices follow the common color trends?

2. What are your favorite color tools?

Let us know in the comments. Thanks for reading and please subscribe if you haven’t already.

Image by Kyler Nixon

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]
March 31, 2017
WP Design Trends

Reading Time: < 1 minute
My new website, WPDesignTrends.com, is now live. This site is all about web design using WordPress. The focus is on the look and feel of the website with special attention to UX and UI. I will review themes, plugins, books, and courses. It also includes a job board where anyone post or apply for jobs within the WordPress industry.

Please check it out and subscribe, share, and comment.

March 31, 2017
Top 5 Apps To Keep Your Website Secure

Reading Time: 4 minutes
This guest post is from Kim DeLisle of SecureThoughts.com.

I would like to thank Randy A. Brown for allowing me to contribute to the site! I love his musings on writing and the Bible, and he also writes some really great, practical articles like this one on Creating Amazon Affiliate Links in WordPress. If you haven’t already, make sure you take a look around once you’re done with this article!

Keeping your website secure is one of the top responsibilities of a webmaster. Not only do your security choices affect you (and possibly your livelihood) but also anyone who uses your site. (more…)

August 5, 2015
A Look at Lean Manufacturing and the Toyota Production System

Reading Time: 16 minutes

Lean is a buzzword in today’s workplace. It is especially popular in manufacturing industries. While most companies have their own version of lean, the fundamentals are the same. This article takes a look at lean manufacturing, defines it, discusses the key terms, and describes the advantages of implementing lean into the manufacturing process.

Note – there are no industry secrets in this article. The content of this article is public knowledge. (more…)

May 14, 2015
Creating Amazon Affiliate Links in WordPress

Reading Time: 12 minutes

We’ve all seen Amazon affiliate links. They’re everywhere. Sometimes they have pictures of products and sometimes they’re just a string of blue underlined text that looks like we should click on them. When we do, it takes us to Amazon. When we buy something through this link, the person who owns the link gets a portion of the sell. You can easily add Amazon links to your own WordPress website. (more…)

April 14, 2015
Building an Online Store with WooCommerce

Reading Time: 9 minutes

Building an online store is easier and cheaper today than it has ever been. It can also be complicated. There is a lot to track and keep up with. You have to track orders, customers, and inventory. As your store grows, this gets even more complex. To build and maintain an online store that will grow, you need a single solution that gives you everything you need in one easy to use package. That’s what WooCommerce does.

WooCommerce is one of the most popular ecommerce solutions for WordPress with close to 6 million downloads and a rating of 4.4 out of 5. It’s a simple plugin that adds ecommerce features to your WordPress website. In this article we will take a look at its overall features and see why it’s the most popular choice for building online stores with WordPress. (more…)

April 6, 2015
All In One SEO Plugin vs WordPress SEO Plugin

Reading Time: 10 minutes

Search Engine Optimization is one of the most important, and easily overlooked, elements to WordPress websites. Websites can live or die based on how they rank in popular search engines. Awesome content isn’t worth much if no one knows it exists. You need to be found in the search engines. For this, you need to focus on search engine optimization (SEO).

That’s where SEO plugins come in. They can format elements of your site in a way so that search engines not only find them, but rank them well for keywords and topics that users use to find them. There are many choices when it comes to SEO plugins. The two most popular are All in One SEO Plugin and Yoast’s WordPress SEO Plugin. In this article I take both for a spin and see how they compare. (more…)

March 26, 2015
Guest Post on Bible Design Blog: Why You Need More than One Bible

Reading Time: < 1 minute
Many of us have searched for years for that one perfect Bible. After years of searching, I’ve come to the conclusion that you really do need more than one. I’ve written about this in great detail on the Bible Design Blog in an article titled:

Why You Need More than One Bible

March 20, 2015