JPS Design Group - Website Trends graphic design, packaging design, web design en-us Sat, 25 May 2024 23:02:00 -0800 Thu, 21 Dec 2017 00:00:00 -0800 no From Top to Bottom: Vertical Orientation is Gaining Popularity in Web Design <p>from left to right (or for such languages as arabic or persian from right to left), from top to bottom that is our accustomed path of exploring things in the books, documents, websites, advertisements, pamphlets, etc. in general, horizontal orientation comes first. so when the things are arranged according to the y-axis, it always feels like a disturbance in the force.</p> <p>the fascination with vertical orientation became perceptible last year when it started to set the rhythm for primary navigation menus, as designers saw it as an interesting technique to enhance aesthetics. to be completely honest, split homepages (the website of <a href='' rel='nofollow' target='_blank'>erkan demiroglu</a> is a perfect example) that are the product of the vertical orientation, have been in-trend for a couple of years.</p> <p><img alt='erkan demiroglu' src='' style='height:594px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>erkan demiroglu</a></em></p> <p>but what about 2017? this year, it hits its stride to the full extent, starting to dictate the rules for different elements and aspects of interfaces. if you pay attention, you may notice it everywhere. unlike the majority of trends that quickly invade the design and eventually become annoying, the solution does not feel overused nor banal; on the contrary, it looks great and fresh like an icing on a cake.</p> <p>like “yummy chocolate sprinkles,” it can benefit almost any element of the interface. let’s start with the minor usage and end with websites that manage to master the mainstream.</p> <h2>at an easy pace</h2> <p>our first stop is websites that distinguish themselves with single or minor usage of vertically aligned elements. in the traditional horizontal entourage, such injections give the general aesthetics an outstanding spice without much effort.</p> <p>the trend can serve as a way to:</p> <ul> <li>present the sphere of expertise. examine the personal portfolio of <a href='' rel='nofollow' target='_blank'>rob mills</a>. the stack of vertical panels subtly embraces all directions and creates a pleasant sense of order.</li> <li>convey a message like <a href='' rel='nofollow' target='_blank'>ims productions</a>’ homepage where the perfect combination of vertical typography treatment and decorative elements such as an outline rectangle and striped-like background put the message in the spotlight.</li> <li>organize content flow like <a href='' rel='nofollow' target='_blank'>taika strom</a>. here the content is densely located in the center with white space on the left and right. this forms a prominent visual path for the readers, saving information from being overlooked.</li> <li>give the brand identity a special spot like <a href='' rel='nofollow' target='_blank'>gera & rod</a>. the majestic floral centerpiece that adorns the typography-based logotype instantly becomes the center of attention.</li> </ul> <p><img alt='rob mills' src='' style='height:551px; width:1199px' /></p> <p><a href='' rel='nofollow' target='_blank'><em>rob mills</em></a></p> <p><img alt='ims productions' src='' style='height:592px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>ims productions</a></em></p> <p><img alt='taika strom' src='' style='height:597px; width:1199px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>taika strom</a></em></p> <p><img alt='gera & rod' src='' style='height:531px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>gera & rod</a></em></p> <p>if you think that the trend is applicable for general purposes only, then you are wrong since it can be found in unconventional and unexpected spots these days. the elements of the interfaces that you are accustomed to seeing mainly stretched derive benefits from it most of all. for example, <a href='' rel='nofollow' target='_blank'>momento multimedia</a> and <a href='' rel='nofollow' target='_blank'>two chimps coffee</a>.</p> <p><img alt='momento multimedia' src='' style='height:583px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>momento multimedia</a></em></p> <p>the first opts in favor of a slider that depicts images in full-height rather than at full-width. this trick gives visual content almost the same priority as the text block on the left.</p> <p>the latter has a neat minimalistic front page where two straight-up outline drawings, which are on the sides, tell the story and establish the mood. this approach works great also with the non-static art; look at the website of <a href='' rel='nofollow' target='_blank'>heart of travel – southwest rapid rewards</a>.</p> <p><img alt='two chimps coffee' src='' style='height:594px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>two chimps coffee</a></em></p> <p>it has a small exhibition of upstanding dynamic computer-generated artworks with one of them featuring in the welcome area. it looks artificial as compared with the previous example, yet still, it charms with magnetic personality<em>.</em></p> <p><img alt='heart of travel - southwest rapid rewards' src='' style='height:560px; width:1199px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>heart of travel – southwest rapid rewards</a></em></p> <h2>take the trend more seriously</h2> <p>the teams behind the websites of <a href='' rel='nofollow' target='_blank'>tender to art</a>, <a href='' rel='nofollow' target='_blank'>canvas united</a> and <a href='' rel='nofollow' target='_blank'>one year in review</a> by one design company did not stop with minor changes – they got the most out of the trend. let’s examine them closely.</p> <p>as an artistic incubator, tender to art avoids the banality of using illustrated approach and proves everyone that even without picturesque environment you can impart the impression of creativity and class.</p> <p>while the inner pages are rather conventional, the homepage catches the eye with a masterful usage of vertical orientation. the text-based logotype, scroll-down indicator, slider, a hamburger menu button all have elements that are enhanced with vertical appeal.</p> <p><img alt='tender to art' src='' style='height:584px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>tender to art</a></em></p> <p>canvas united is more conservative than the tender to art; nevertheless, its take on the trend is worthy of attention for those who intend to use more than one or two vertically aligned elements in the design. here, the block of stacked social media links, tiny slider pagination buttons, and marvelous striped-like background underlie general aesthetics.</p> <p><img alt='canvas united' src='' style='height:593px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>canvas united</a></em></p> <p>one year in review’s landing page consists of four main elements: tagline, dynamic background, thank-you list and a call-to-action button. the first three lie in the vertical plane naturally guides users from top to bottom.</p> <p><img alt='one year in review' src='' style='height:590px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>one year in review</a></em></p> <h2>vertical orientation in all its beauty</h2> <p>it is difficult to go wrong with the minor usage. after all, it is still the same traditional site that rests on the horizontal position with details nicely aligned in y-axis that are focal points without being loud or overwhelming. however, what about creating a website where the vertical orientation lies in the heart of the overall aesthetics? much like with any other trend, it should be practiced with the caution. if you overdo it, the tendency will fire back ruining the harmony. it is a bold step to take, but when done wisely, it will bring about the fabulous outcome. consider <a href='' rel='nofollow' target='_blank'>crazy</a> and <a href='' rel='nofollow' target='_blank'>carazo arquitectura</a>.</p> <p>both websites are thoughtfully constructed. the vertical plane stamped its charming personality on both of them. notice how the alignment breathes new life into basic elements of the interface.</p> <p><img alt='crazy' src='' style='height:591px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>crazy</a></em></p> <p>crazy’s homepage has only two things that obey the traditional x-axis: the logotype and hamburger icon. everything else is upright. visually, you can define three columns with sensible gaps and a sense of order. the design breaks out of the classic structure and excels with the visual appeal.</p> <p>the carazo arquitectura’s front page uses vertically aligned elements as decorative details. while the image in the center stays in a precise oblong, the navigation, tagline, caption, and slider pagination with a bunch of complementary carefully scattered throughout the screen short lines remain straight-up as if appealing to move down. the design is sophisticated and elegant.</p> <p><img alt='carazo arquitectura' src='' style='height:594px; width:1200px' /></p> <p><em><a href='' rel='nofollow' target='_blank'>carazo arquitectura</a></em></p> <h3>conclusion</h3> <p>once in a while, it’s great to go off the beaten track just by altering an angle. vertical orientation is a trick that is quite familiar but is still able to give the boring things a lively zest. moreover, it works well with almost any element of the interface whether it is a slider or just an ornament.</p> <p>what do you think about this trend? is vertical orientation a valid tool to introduce improvements and diversity in designs? in what way does it benefit your interfaces?</p> <p>original article on <a href='' target='_blank'><strong>design modo</strong></a>.</p> Website Trends Thu, 21 Dec 2017 00:00:00 -0800 My website woes <p>as a writer with 30 years' experience, a couple of awards and a rock-solid sense of my own importance, barbara wade rose decided to get a new website. video! hot buttons! cold buttons! clever blogs on the host page that blow browsers' minds! this is her story.</p> <p>geekheaven (not its real name) is the hottest web-design firm in toronto, and nothing but the hottest was good enough for me, so i met with andrew, a skinny guy with a tight plaid shirt, tight black pants, white sneakers and an artisanal beard. he showed me all the cool things they could do (hot and cold running buttons! time-lapse portal pages!) if i ordered a custom-made website. i paid half upfront. he said they would have a mockup for me in a few weeks, they would tweak it to my approval, and my site would be ready to roll in just over a month.</p> <p>i sent him two dozen ideas and content for all parts of the website to their generic address. a couple of weeks later i asked how it was going and andrew said someone named mark would take care of the design. i should talk to him. a couple of weeks after that, and a nudge or two from me, we agreed to meet at geekheaven's offices: a loft, of course, with wind blowing through the industrial-glass windows and walls papered with extremely nerdy head shots of all the staff members.</p> <p>my custom design? mark had prepared a one-page website page about as good as any template wordpress turns out. i told him i had ordered a custom site, which surprised him. we spent an hour talking about ideas; he had some good ones, he listened, and we agreed to get it done. he seemed eager and i felt sorry for him.</p> <p>mark disappeared for over a month. i was looking through the fine print of the geekheaven contract when an e-mail came from someone named rebecca that said they couldn't do any work on my site until i submitted some content and, meanwhile, for me to have an amazing day. i sent them my two dozen ideas and content.</p> <p>i eventually sent this e-mail to geekheaven:</p> <p>i have paid [insert embarrassing amount here] for four months of nonsense. the geekheaven welcome package states: "we're great at managing your project, especially when things go wrong."</p> <p>please let me know specifically how, when and whether a new site will be finished.</p> <p>the owner read my e-mail and decided the buck stopped with andrew. but they promised they would have a website ready for me to review in a couple of weeks! i'm an optimist. a couple of weeks later three new hipsters greeted me, none of them mark. "he's at an uptown location now," said a man with waxed curlicues at the ends of his mustache. a fourth wandered in and out of the room, playing a ukelele. i kid you not.</p> <p>i showed them hard copies of my ideas for the site. "oh," one nodded. "i worked on that last night." we could hear plunking somewhere down the hall. i realized i could be the mother of any of these banjo-playing fools, and they knew it, and if mom expected them to act like grown-ups they were going to teach me a thing or two.</p> <p>but after the meeting a staffer named nadia met with me one-on-one, and when she was told what i had gone through she actually started to cry. "you've got a good heart," she said. "you are golden." and as i said before, i'm an optimist. nadia worked diligently on the site for a week until it was "almost done." then i was told she had gone to the same uptown location as mark and everybody's old dogs.</p> <p>"i may be an optimist," barack obama once said, "but i'm not a sap."</p> <p>six months had passed since my first conversation with geekheaven. when i went to their office the next time i took my husband, a university professor who inhales hipsters and exhales man buns. we asked rashad, the new web designer, what was going on. he confessed working for geekheaven was a nightmare.</p> <p>we demanded to meet the owner in person. finally. the cool dude in the e-mail photo turned out to be a guy my age wearing a too-tight plaid shirt, too-tight black pants, white sneakers and an artisanal toupee.</p> <p>we fired geekheaven, of course. i guess losing my [insert embarrassing amount here] deposit was worth feeling, for a moment's interim, like a righteous warrior instead of a wrinkled, stupid, unhip sap.</p> <p>as we left, my husband gave rashad some advice. "if you are a web designer like you say you are," he told him, "there are 1,000 jobs out there. if this place operates like we've seen, you need to leave. it'll destroy your soul." the look of gratitude on rashad's face said it all. we weren't the only saps paying a terrible price for all style and no content.</p> <p>original article on <a href='' target='_blank'><strong>the globe and mail</strong></a>.</p> Website Trends Tue, 19 Dec 2017 00:00:00 -0800 Web design trends you want to be aware of in 2018 <p>one of the greatest things about web design is the fact that its trends evolve with each passing day, giving small business owners an opportunity to adapt before their larger counterparts and in this way gain a competitive edge. however, this requires a huge amount of investment of both time and energy, which is only fair if one is to triumph over companies with greater assets and better-established business infrastructure. it also means that you need to be on an active lookout for the newly emerging web design trends, as well as some old ones that are soon expected to re-emerge. here are several examples that just might come in handy.</p> <h3>mobile-first</h3> <p>in april this year, android has officially overthrown windows as the primary web-browsing trend out there. while it is true that tablets and desktop devices still have higher conversion rates, smartphones dominate the asian market, which is currently becoming one of the greatest trading hubs in the world. therefore, in order to approach the ever-growing demographic of mobile users, you might want to further invest in making your website mobile-first.</p> <p>on the other hand, it is a known fact that about 90 percent of the time on their smartphones people spend on apps, rather than on browsers. this is what made some people question whether investing in mobile-optimization is even worth the effort. still, considering how little effort and investment this idea may yield, as well as how great of an roi it brings, going with mobile-first design indeed seems like a win-win scenario. </p> <h3>authentic content</h3> <p><img alt='great gif' src='' style='float:right; height:270px; margin-left:20px; width:345px' />another thing you need to keep in mind is the fact that the online audience values authenticity above all else. this especially takes prominence when it comes to the issue of images and illustrations. you see, using a generic image to back your content may be fairly successful but it will never have the impact of an image taken especially for that situation. with about 1.3 billion websites out there, it is getting harder and harder to appear unique, so tailoring your content to appear as a single-purposed might just be the tool that can win over your audience.</p> <h3>hand-crafted design</h3> <p>earlier on, we addressed the issue regarding the ever-growing websites out there. with the number constantly on the rise, it is getting harder and harder to distinguish yourself in a positive way. sure, going for a free template might seem like a more frugal choice but how can you quantify losses you will endure due to the fact that your website appears generic? the truth is that when it comes to web design there are no one-size-fits-all solutions. this is also why web design veterans from <a href=''>bapple</a> focus on hand-crafting high-performance business websites, in order to create a unique impression on your audience.</p> <h3>homepage videos</h3> <p><img alt='video camera' src='' style='float:right; height:152px; margin-left:20px; width:300px' /></p> <p>according to one conversion-rate statistic, including an introduction video before offering your audience a cta (call-to-action) button can increase your conversion rate by <a href='' target='_blank'>144 percent</a>. this is why so many companies nowadays decide to use this tactic on their very homepage. one major drawback of this tactic is a fact that the video needs to be of a high-production value, which makes it quite costly to produce. first of all, you need a great script, an adequate gear and someone with either great editorial skills or at least a naturally gifted orator on your retainer. this is also what makes so many websites outsource this function, which is also quite expensive.</p> <h3>daring shapes and colors</h3> <p>finally, even in the era where minimalism and flat design seem as predominant forces, going with daring shapes and colors does have its advantages. the perfect example of this is <a href='' target='_blank'>the trend of brutalism</a> which draws inspiration from the soviet-era eastern europe architecture. odd and unpredictable geometrical shapes dominate the landscape of brutalist web design, as well as color combinations that even some of the most experienced web designers wouldn’t even dream of. </p> <p>the key here is to attract the attention of your website’s visitors at any cost. surprisingly enough, this design trend which so many professionals deem as ‘ugly’ manages to succeed where all other trends have failed. so, if we are speaking of results only, brutalism is definitely not a force to be reckoned with and not an idea you should outright dismiss.</p> <p>as you can see, with these few revolutionary ideas at your side, you have all the tools necessary to start making your mark in the digital world. keep in mind that even though some of these trends may give you great immediate results, there is no guarantee that they will still be valid for several years or even months. the key to survival, therefore, rests on your ability to adapt to the newly changed circumstances in the world of web design. luckily, succeeding at this daunting task will be more than worth your while.</p> <p>original article on <a href='' target='_blank'><strong>knowtechie</strong></a>.</p> Website Trends Wed, 29 Nov 2017 00:00:00 -0800 Mobile SEO Is More Important Than Ever – Here’s 3 Tips To Get Prioritized, Not Penalized! <p>it’s no secret that it’s no longer optional to have a <a href='' target='_blank'>mobile presence</a>, and that means using mobile seo. if you’re not mobile-ready, you’re failing to connect with a large portion of your target audience. but while any marketer who’s worth their salt recognizes the value of going mobile, it’s not always quite as easy to figure out how to optimize mobile content for seo purposes.</p> <h2>mobile seo is not new, but penalties are</h2> <p>did you know that mobile users now exceed the number of desktop users? google noticed, and at the beginning of 2017, began applying penalties against sites that fail to meet the needs of mobile users. designed to make sure search engine users get the best results out of their searches, these penalties can actually result in lower rankings on the serps. google also <a href='' target='_blank'>prioritizes sites that are mobile-friendly in the rankings</a><u>,</u> as usage patterns help make the rules.</p> <p>mobile seo is a lot like regular seo: to rank, you need to be crawlable, share awesome content, and – perhaps most importantly – have a really great ux design that is mobile focused.</p> <h3>want to master mobile seo? start here…</h3> <p>keep reading for 3 tips to make sure you’re mobile-ready, mobile-first and mobile-focused.</p> <p>use tools to improve</p> <p>a great first step for making sure your site is mobile-optimized is checking it using google’s <a href='' target='_blank'>mobile usability tool</a>. this tool checks six main elements of your mobile site to measure how well it is performing for mobile users, mainly focusing on ux. run this report to figure out where to start making changes to your site.</p> <p>another great tool from google is the pagespeed insights tool. this easy-to-run report will let you know how quickly your page is loading on both desktop and mobile. a google-led open source project that provides a complement to pagespeed insights is amp, or accelerated mobile pages. this tool is designed to make your pages load as fast as possible. not every site needs amp, but recent improvements to the project mean that <a href='' target='_blank'>any prior drawbacks to using it should no longer be an issue</a>.</p> <p><a href='' target='_blank'></a> structured data is also another tool that can help improve your presence in the serps. mobile users don’t like to browse in the same way as desktop users, and google recognizes and caters to this behavior. schema is code that improves rich snippets – meta descriptions below the title tag that include enhanced information for search engine users. this includes photo thumbnails, publication dates, or other important details from the page the search result entry represents. sites that optimize their serp results to make them friendly to mobile users in this way can avoid penalties and improve their rank.</p> <p>consider user intent</p> <p>mobile and desktop users have different expectations when it comes to content. when we use a smartphone to conduct searches, we often have different intentions, needs, and habits than when we’re on a desktop. recognizing and catering to these differences can help you optimize your content for mobile users.</p> <p>for instance, many <a href='' target='_blank'>mobile users are increasingly conducting searches using their voice</a>. “siri, alexa and other voice technology have their own search algorithms, and your site may not rank the same in voice searches as it does in browser searches,” <a href='' target='_blank'>notes sandi leyva, founder of accountant’s accelerator</a>.</p> <p>content length is also worth considering when you’re optimizing for mobile. on desktops, longer written content performs better, but mobile users look for shorter, easy-to-digest pieces. front load your content, cut out extra wordiness, and create powerful headlines. make sure your content is easy to scan, and don’t discount the value of images on mobile – just make sure they work well on the page!</p> <p>it’s also a good idea to consider <a href=''>l</a>ocal search optimization. mobile users are much more likely to expect instant gratification results from their searches, whereas desktop users tend to have different intentions. desktop users are likely to be planning – mobile users need answers on the fly. google defines those times when a user needs something <em>right here, right now</em> as <a href=''>a </a><a href='' target='_blank'>micro-moment</a>.</p> <p>this means <a href='' target='_blank'>keyword research for mobile seo</a> also requires a different strategy than desktop. you can get in front of your target audience on their mobile devices by including both your target keywords and your location in places like title tag, page title, alt text, and throughout your content.</p> <p>be ux ready</p> <p>the elements that the mobile usability tool look at are all related to ux. things that will hurt you include: text that’s too small, clumsy touch features that are positioned too closely to each other, flash use (most mobile devices can’t run flash), and <a href='' target='_blank'>viewport configuration issues</a>.</p> <p>load times play into usability and can also have a big impact on conversions. you can reduce your bounce rate and boost your position in the serps by making easy fixes to improve your load times. “one of the biggest contributors to slow page load times is hosting large videos on your site. compressing your video files first before uploading them to your site can drastically improve the time it takes for your page to load. the smaller your video file, the faster your load time will be,” <a href='' target='_blank'>shares marketing writer anastasia passaris</a>.</p> <p>google now also penalizes for “intrusive interstitials” – pop-ups or other content that appears over the top of the page a user expected to find on the other side of the link. users want to see the page that they followed a link to – not an ad or invite to your newsletter. there’s less space on mobile devices, which means pop-ups can be even more irritating to mobile users than those using a desktop, especially when the ad isn’t responsive or easy to navigate out of. avoid these, unless it’s something legally or ethically necessary, like an age verification.</p> <p>are most of your visitors mobile? consider an app, especially if your content is best displayed in one. however, don’t scare off mobile users by making the mistake of forcing their hand to download an app they don’t need, don’t want, and won’t use.</p> <p>space on mobile devices is valuable. if you’re hoping to get users to download your app by neglecting to develop your mobile site, you’ll just frustrate them and hurt their trust. mobile optimization is all about what’s fast and easy for the user, and interrupting normal browsing behavior with a push to force users onto an app isn’t either of those things.</p> <h2>stand out with great mobile seo</h2> <p><a href='' target='_blank'>optimizing your site for mobile</a> can be a major competitive advantage. making sure that you use every opportunity you have to create a great experience for your current customers and leads can make the difference between them choosing you, or your competitors. it’s not difficult to optimize for mobile if you use the tools available, consider user intent, and craft a great experience for your users – and it’s well worth the advantage you’ll have in the serps.</p> <p>original article on <a href='' target='_blank'><strong>rocks digital</strong></a>.</p> Website Trends Mon, 20 Nov 2017 00:00:00 -0800 How to Hire a Great Web Developer <p>a good web developer can be the difference between having a great online presence and a counterintuitive, ugly website. but finding the right person for your needs can be harder than you might think. that's especially true for business owners who aren't tech savvy. your company's online presence is an important marketing tool. oftentimes, it's a customer or client's first experience with your business or product. having a website that reflects your company culture, values and practices</p> <p>since your company's online presence is an important marketing tool, it's key to get it right. afterall, it may be a customer or client's first experience with your business or product. </p> <h2>what you need to know</h2> <p>before diving into exactly how to hire a web developer, where to find them or what to look for in candidates, it's important to understand a few marquee distinctions about the industry.</p> <h3>web developers vs. web designers</h3> <p>while these terms may seem interchangeable, there is a difference between web designers and developers. designers are more focused on the aesthetic and visual aspects of your website. these people are usually well versed in using adobe creative suite to create graphics, edit photos or draft company logos. many web designers also have coding knowledge, but if you're looking to build a site from the ground up, it's important to understand their background.</p> <p>web developers, which are usually hired on a freelance or in-house basis, know many programming languages and can build the online infrastructure needed to support your website. developers will oftentimes build a website and apply the design of a web designer.</p> <p>ian mcclarty, ceo of phoenix nap global it services, recently hired a web developer and said that knowing the difference between the roles is very important. "a web developer is not a web designer," mcclarty said. "many developers are not great web designers. if you expect the developer to redesign your website and work on graphics, make sure to cover that during the interview process." </p> <h3>assessing your project needs</h3> <p>before pursuing a web developer, take the time to understand your website needs. if you're looking to create your website from scratch, do some brainstorming to get an idea of what you want. a good way to do this can be browsing the websites of your competition for examples. or check out <a href='' rel='nofollow' target='_blank'></a>. it's a good place to view types of websites to get an idea of what you want yours to look like.</p> <p>if you're looking to make a small addition, add mobile components or update your site with the latest trends, it's important to have clear ideas so the developer you hire has a clear sense of scope. roman zrazhevskiy is the founder of <a href='' rel='nofollow' target='_blank'>ready to go survival</a>, a retail brand that specializes in personalized emergency preparedness, and has been through four website redesigns. zrazhevskiy said that it is imperative to have a clear understanding of what you need to be done to your website before you start looking for web developers.</p> <p>"write out detailed requirements, mock up all pages and have all the copy ready to go before contracting a web developer," he said. "the clearer the instructions, the happier you'll be with the final product, and the less money you'll need to spend."</p> <p>while assessing your project's needs, it's also be a good idea to explore some of the technical aspects of your website. this will give you a good foothold when interviewing candidates to determine who you want to hire. upwork is an example of a good resource for web interface and design information. even if you have no background in website creation, doing a quick search for key concepts can be a great way to familiarize yourself with what your project could need.</p> <p>besides having some knowledge going into interviews, knowing what you need will also help you get an idea of exactly how much your project will cost.</p> <h3>in-house vs. freelance developers</h3> <p>the choice between bringing someone in full time and contracting out work to a freelancer can depend on a lot of different variables. there are some great freelance developers out there, but if you're a business owner who needs someone who can constantly update and adjust your website, it may be beneficial to hire someone instead of contracting out the work.</p> <p>bill mclaughlin has worked in it development for 30 years and is currently the chief technology officer for <a href='' rel='nofollow' target='_blank'>whizz education</a>, an online math tutoring service based in the united kingdom. for mclaughlin, the difference between freelancers and in-house developers is all about flexibility. if a business needs to quickly add or update a site, a freelancer may be a better option than bringing someone on full time.</p> <p>"hiring a freelancer gives you flexibility on the cost and length of engagement. there are times when a business has a discrete set of goals for its web development (a new section, a refresh of the look and feel, or even a complete rebuild) and this can be done within a set timeframe," mclaughlin said. "however, for some businesses, like ecommerce or community-based sites, their website requires constant investment and, in this case, an in-house developer is best."</p> <h2>tips for hiring</h2> <p>even once you get an idea of what you want, it can be hard to wade through information on hiring web developers and make the right decision. these tips will help with discovering a great web developer.</p> <h3>be hands on with past work</h3> <p>look through a candidate's past projects. this will give you a good idea of where their talents lie, what their work is like and how their style aligns with your business needs.</p> <p>make sure the developer provides you with live work as well. that way you can use the website and assess the functionality of it. scott marquart, founder of <a href='' rel='nofollow'>stringjoy</a>, said that this was vital when deciding who to hire to help develop the website for his guitar strings business.</p> <p>"the no. 1 mistake businesses make when hiring a web developer is hiring someone who is knowledgeable at development but knows very little about user experience or conversion optimization," marquart said. "looking good is only a small piece of what makes a website excellent, it also needs to function intuitively and be easily navigable, so that any prospect who lands on your site knows exactly how to do what you want them to do."</p> <h3>follow up with references</h3> <p>make sure you get a list of references, then actually follow up with them. while the developer's work is important, their work habits, organization and ability to meet deadlines is as crucial to you and your business. past employers will be able to speak to how dependable – or unreliable – a web developer is. </p> <p>lilly ghahremani, founder of <a href='' rel='nofollow' target='_blank'>lucky 13 strategies</a>, said you should "feel comfortable asking for references. the most successful web project will happen with a team that is responsive," ghahremani said. "don't just rely on yelp ... speak to someone. a great designer will be able to provide references easily, because their past clients are happy to take a few moments to rave about them."</p> <h3>be realistic about cost</h3> <p>the cost of your project will vary depending on whom you hire, how much work needs to be done and other added features you may need on your website. <a href='' rel='nofollow'>upwork </a>provides some ballpark price ranges for different projects. overall, general costs can range between $15 and $150 per hour, depending on how complex the work is. in addition to per-hour payment, some developers charge per project.</p> <p>the cost of a good web developer should be viewed as a company investment – you are investing in a website that will draw users to your business. this service, when done right, can be invaluable.</p> <p>akiva leyton, a marketing manager for <a href='' rel='nofollow' target='_blank'>falcon marketing</a>, said that there are a lot of types of web developers out there, but a business owner should be wary of putting cost before pure talent.</p> <p>"when it comes to development work, you truly get what you pay for," leyton said. "those cheaper developers usually don't have much experience, are slow to deliver work or more often than not are simply a scam. try to find a developer looking for a midrange salary, if you truly can't afford the best."</p> <h3>don't obsess on education</h3> <p>some businesses that have hired successful web designers have put more emphasis on prior work when hiring as opposed to resume details or education information. there are some great developers who may lack education in a formal collegiate setting. in the end, it's all about you and your business's needs.</p> <p>daniela arango, an hr and creative manager for <a href='' rel='nofollow' target='_blank'></a>, said that when her company hires developers, they place more of an emphasis on life skills. "we stopped vetting tech candidates based on lack of experience or formal education a while ago. we also stopped looking too much at resumes because we could not find in them the right information to make the best decision for our company," arango said. "what we look for now are references of tech professionals that have great resilience in life, and a natural ability and predilection for learning."</p> <p>overall, a great web developer will have a body of work that showcases the necessary experience to be able to build your website in the way that you want it. that is why following up with references and viewing previous projects are two essential practices when hiring a developer.</p> <h2>where to find web developers</h2> <p>there are different networks with freelance developers for hire. upwork offers a service that pairs businesses with web developers and even provides an option to view who is available and determine their skill level before contacting them. besides upwork, and are two other good resources for finding freelance web developers.</p> <p>in addition to freelancers, there are web design and development agencies. the best way to find an agency, which will likely offer more services that complement design, development and project management, is to first search your local area for businesses that specialize in web development. once you find a few options, narrow them down in the same way you would a freelancer – understand the skills they offer versus what you need, and then make a decision.</p> <h2>bottom line</h2> <p>hiring the right web developer can be a big task. deciding what you need from your website is an important first step, and choosing the right candidate requires a certain level of research and hands-on experience with their past work. in the end, hiring a great web developer is like hiring any employee – you can find a great worker if you put the time in to do the research and understand what a candidate can bring to your business.</p> <p>original article on <a href='' target='_blank'><strong></strong></a>.</p> Website Trends Mon, 30 Oct 2017 00:00:00 -0800 5 website development trends that rocked 2017 <p>over the recent past, websites have entirely become vital corporate tools. they are used at least in every field from marketing to engineering. the high demand for websites has put developers on the spot, a situation that explains the current industrial competition for better platforms.</p> <p>regardless of the technological dynamics, a good website should be easy and affordable for use by the web owner or their clients, a convenience which should be prioritized by web developers. hence, the following website development trends made to the top list in 2017.</p> <h2>1. angular js</h2> <p><a href='' rel='nofollow noopener' target='_blank'>angulajs</a> should be familiar with those who are always up to date which technological advancements in the web-based development industry. the tool is an open-source javascript framework that is designed for single paged web applications using an mvc (model viewer controller) architectural framework.</p> <p>angularjs is a front-end plan aimed at supporting your web page design process. the new angularjs 4 is extensively different from previous versions such that, it’s building blocks are data bindings, components, dependency injections, metadata and more. angularjs also uses a component of hierarchy as its principal architectural concept, and more so, its modularity makes it more of a faster and lighter core.</p> <p>in summary, the following <a href='' rel='nofollow noopener' target='_blank'>features make angularjs</a> an important 2017 trend:</p> <ul> <li>it can deliver modern based web capabilities and experiences like offline availability, high performance, and zero-step installation.</li> <li>enables faster creation of ui views.</li> <li>boost your web’s command line tools, for the development side.</li> <li>faster loading of apps.</li> </ul> <h2>2. artificial intelligence</h2> <p>it is another advancement that has revolutionized the modern it industry. ai (artificial intelligence) was first conceptualized by tech giants like google and facebook, but today many app developers have adopted the tech to make their inventions operate more like humans. for example, facebook uses facial recognition in photo tagging.</p> <p>the key advantage of ai is that it facilitates devices to web-platforms to automatically operate without strict human interventions. hence this leads to improved accuracy, efficiency, and generally better user experience. linkedin, a global leading web-based professional site has become the latest adopter of ai. the website now targets mobile users with its improved interface, this owing to the previous research, which suggests that 50 percent of its users use mobile phones to access the website.</p> <p>ai is not only a trendy dynamic, but it also enhances user experiences. a study by merril lynch estimates the <a href='' rel='nofollow noopener' target='_blank'>ai market to rise to $153 billion</a> by the end of 2018. <a href='' rel='nofollow noopener' target='_blank'>microsoft’s cortana</a> or <a href='' rel='nofollow noopener' target='_blank'>google assistant</a> are some of the high-level web-based ai adjustments of this age. online marketers and retailers have also adopted this tech as their branding strategy.</p> <h2>3. virtual reality</h2> <p>vr technology is often associated with video games. although the tech has been around us for some time now, its potential is increasingly getting realized by corporate bigwigs days on. bigger industrial players like google have already incorporated their apis (application programming interface) to enable web-based vr transition.</p> <p>the vr tech generates improved customer experience through virtual presentations for products like golf courses and real estate properties. thanks to this tech, major brands have reported improved sales. thus, it strategically positions itself as an important marketing and web-based tool that needs to be observed over time especially this period where web users are increasingly demanding for improved content consumption experience.</p> <h2>4. ruby on rails</h2> <p>also referred to as ‘rails’, the tech is a server-based web application system. although since 2005 rails has not shown much competitiveness in web development, the rise of rails 5 on june 2016 has proven the tech’s influential capabilities. features like <a href='' rel='nofollow noopener' target='_blank'>actioncable</a> and turbolinks 5 are amongst the favorite in the new re-engineering.</p> <p>with turbolinks 5, web developers can directly create single paged applications from rails stack. meaning that with the system, developers don’t require client-side javascript frameworks. ruby on rails 5 performance has also been improved and enhanced using aesthetic flexibilities, which capacitates web developers to shift their focus on the overall website’s appearance.</p> <p>the actioncable feature enhances an integration of websockets with other rails applications. moreover, they enable the real-time writing of features on ruby in similar form and style of other rails applications while maintaining scalability and effective performance.</p> <h2>5. static website generators</h2> <p><a href='' rel='nofollow noopener' target='_blank'>staticgen</a> combines language markups like restructuredtext or markdown with engines for creating templates such as jinja, to generate html files. html files developed from the process can be served and hosted by a cdn (content delivery network), or a web server without using other dependencies like a wsgi server.</p> <p>the advantage of static content files like css (cascading style sheets), javascript, and html is that they can be served using a cdn at a low cost yet with high scaling. cdn’s can also sustain the high concurrent traffic on a website that is statically generated without dropping connections.</p> <p>generally, static website generators work by allowing users to generate html files through coding of template files, written in a markup language. html generated from this process regenerates each type of templates or markup modification. with the staticgen, websites can also be created using plaintexts as opposed to coding.</p> <p>other techs, like jekyll, can help enhance the speed, security, ease, and bolster the handling of a traffic surge on a static web. other common static generating elements include <a href='' rel='nofollow noopener' target='_blank'>pelican</a>, which is often used to create a full stack python, lektor a content management system, and more others. the staticgen technology has also improved the efficiency of web host managers like the 24/7 <a href='' rel='nofollow noopener' target='_blank'>wordpress support</a> team in dispensing their supportive services such as live customization of css forums.</p> <p>to conclude, websites are increasingly becoming important tools for individuals and corporate branding, marketing, and more other uses. these means that web developers should rise to the occasion by remaining versed with the industrial dynamics especially in the contemporary world where consumers are getting more inclined on consumption experiences.</p> <p>origianl article on <a href='' target='_blank'><strong>tnw</strong></a>.</p> Website Trends Thu, 19 Oct 2017 00:00:00 -0800 5 Ways You Can Build Links Like a PR Pro <p>for years, i’ve been saying that public relations practitioners should make the best search engine optimization professionals. in fact, i even <a href='' rel='noopener' target='_blank'>wrote about it</a> 10 years ago. little has changed since then.</p> <p>the premise is simple:</p> <p>search engines like quality links.</p> <p>public relations professionals work every day to get their clients mentioned in the press. in most cases, the press will provide links in these mentions. these links are far more valuable than any links you can get from other sources.</p> <p>building links is the hardest part of search engine optimization (i’m sure some will argue after me on this point – well, prove me wrong).</p> <p>so if public relations professionals can do the hardest part of seo, they should be the best seos.</p> <p>but with few exceptions, they aren’t.</p> <p>there are many reasons that pr folks don’t like seo. they think it’s just for techies; they don’t want to be seen as an seo; but mostly they don’t realize the value links can have for their clients or organizations.</p> <p>but many pr professionals are changing their attitude toward seo and embracing search. others, though, are happy to pitch away, worrying more about the ink than the link.</p> <p>but as a search engine marketer, you have an advantage. you can do what pr professionals do, even if they can’t do what you do.</p> <p>here are five ways you can build links using the time-worn media relations techniques that have been practiced for years by pr pros.</p> <h2>1. find your influencers & create relationships with them</h2> <p>seo professionals are typically tech-minded. seos typically work to create scalable solutions that automate everything. no exception in link building.</p> <p>from e-mail scraping tools to private blog networks, seos will jump on any link building tool which promises to create links <em>en masse</em> that they control. well, at least until google bans those techniques and the tools start getting websites into trouble.</p> <p>i can tell you from experience that successful link building is more about quality than quantity. i’d rather have one link from the wall street journal than 1,000 links from joe schmoe’s blog. but a link from the wall street journal is difficult to obtain.</p> <p>you don’t have to go that big.</p> <p>finding the influencers in the niche you are working in isn’t hard. it just takes time and research.</p> <p>once you find those influencers, engage them. not by spamming them asking for a link. really read what they are saying.</p> <p>comment. send influencers helpful articles that have nothing to do with your site. when the time is right, they’ll be more apt to link to what you want them to, even if it’s not quite a fit.</p> <p>it’s the law of reciprocity – if you do something for the influencer, they will feel that they need to help you out.</p> <p><strong>pro tip:</strong> whenever possible, meet with influencers in person. buying a journalist or blogger a beer typically has a very high roi.</p> <p><strong>pro tip #2:</strong> limit your reach. this sounds counter-intuitive, but if you target everyone, you target no one. identifying the top 10 or 15 best influencers and cultivating relationships with those folks is, in most cases, far more effective than trying to interact with 100 influencers. everyone has limited resources. use yours wisely.</p> <p><strong>seo pro tip:</strong> when looking at influencers, look at their search presence. if a decent influencer has a bad search presence, offer them some tips for free. depending on the influencers, it can be profitable to even offer to fix their site for free. i can say, however, that i’ve turned influencers into clients with this tactic. again, law of reciprocity.</p> <h2>2. look for opportunities that tie into current events</h2> <p>many seo pros already do this, to an extent. but most write an article around something timely and then pitch it.</p> <p>for many of the top sites, that’s too late.</p> <p>have your experts ready to go quickly. when a news story that affects your niche hits, have your list ready and offer expert commentary. expert commentary almost always comes with a mention and a link.</p> <p><strong>pro tip:</strong> set up google alerts around key topics and people in your industry. that way you can know when a big story hits.</p> <p><strong>pro tip #2:</strong> practice getting the word out. create “fire drills” with your team and client and act like a big news story just hit. this is a good way to get your team and client onboard with what you are doing so you don’t get blank stares or flat or refusal to participate when the real thing hits. this is especially important for seos who work with other pr professionals. get the other pr pros involved in the process. that way they don’t feel like you are taking over their job – a common problem for seos who practice pr tactics for link building purposes.</p> <p><strong>bonus pro tip:</strong> make sure you have your lists ready as much ahead of time as possible.</p> <p><strong>seo tip:</strong> in most of these cases, it’s ok to ask if you get a link expert commentary. you don’t need to demand one. in most cases, you’ll get one, but influencers sometimes forget. better to ask before their story goes out rather than trying to get the link from them later.</p> <h2>3. use press releases for big news</h2> <p>a few years back, seos almost ruined the press release. we found out that a tool that has been used for decades by pr pros also worked to create links on a ton of sites. and so we use them, abused them, and almost “losed” them.</p> <p>today there is still some abuse of press releases, but most legitimate services have increased their prices so that sending out a press release is not practical for every little piece of news.</p> <p>but when you have something big to say? the links are still there. but they don’t come from the syndication.</p> <p>in fact, most of the links that are syndicated are now nofollowed or carry no value.</p> <p>like you (see tip #2), influencers are monitoring for new stories. they will see your press release. if you don’t get any calls, that means you either used the wrong service, didn’t use the right keywords in the release, or your news wasn’t big enough.</p> <p><strong>pro tip:</strong> the “emabargoed” release, or a release that goes out to a few influencers before it is syndicated, is a great way to get an influencer’s attention. if you have one that you really want a link from, send them the press release beforehand and ask them not to put anything out about it until it goes live – but make sure to tell them when it goes live. in some cases, you can even let them break the story, which influencers love to do.</p> <p><strong>pro tip #2:</strong> if you don’t embargo (or more likely don’t embargo to everyone), you can send links to your release in the sites that pick up the release through your wire service of choice. if you send a link from the houston chronicle or even the influencer’s local paper that has your news in it, you’ll get their attention.</p> <p><strong>seo tip:</strong> if you work with a pr firm, ask to see their releases before they put them on the wire. that way you can insure that the keywords you want in there are actually in there. pr folks love language, and sometimes use different words than what is searched. showing them the light in regards to specific keywords is a win for everyone.</p> <h2>4. look at haro</h2> <p>help a reporter out was founded by peter shankman initially as a facebook group to help reporters find sources for stories. shankman knew that most reporters are looking for sources, and pr pros are looking to provide sources.</p> <p>the facebook group was such a hit he turned it into an e-mail list. then cision bought the whole thing for several million dollars.</p> <p>today there are still tons of journalists and other influencers asking for sources for stories. there is a veritable linking gold mine in every issue of haro. and there are three issues per day.</p> <p><strong>pro tip:</strong> it takes some time to really read through haro every day. if you can, assign someone on your team to be responsible for looking through each issue to see if there is anything relevant for your client or your company.</p> <p><strong>pro tip #2:</strong> follow haro on twitter at @helpareporter to see urgent requests from journalists.</p> <p><strong>seo tip:</strong> there are frequent questions from reporters around search related subjects. don’t forget to check it for yourself.</p> <h2>5. research your niche</h2> <p>most pr pros are news junkies. many came into the profession from a journalism background. good pr pros always know what is going in their niche – from the latest rumors down to the competitor offerings.</p> <p>most seos i know are news junkies when it comes to seo, but not when it comes to their clients. seos miss out on so many link building opportunities when they don’t know the industry they are working in.</p> <p>for our clients, we try to become experts in their field. we may never know the business as well as the client does, but we can certainly become proficient enough to identify linking opportunities we would never find if we didn’t know the industry.</p> <p><strong>pro tip:</strong> if there are publicly traded companies in your niche, read their earnings reports. you can learn a lot from earnings reports, and your influencers may not be reading them, so letting them know what’s up is a way to further the relationship.</p> <p><strong>pro tip #2:</strong> if your niche is wide, try to narrow it. the more you can narrow the niche, the easier it is to become an expert. and once you learn one aspect of your niche, it’s usually easier to expand to broader topics.</p> <p><strong>seo tip:</strong> keep tabs on what your competitors are doing in search, what’s working for them, and what isn’t working. don’t forget to <a href='' target='_blank'>look at their backlinks</a>. by doing this, you will become better at optimizing your own sites.</p> <p>original article on <a href='' target='_blank'>search engine journal</a>.</p> Website Trends Thu, 12 Oct 2017 00:00:00 -0800 Study: 57% of Google search traffic is mobile <ul> <li> <p>mobile searches on google <a href='' target='_blank'>now represent about 57% of all search traffic</a>, as mobile web site traffic is now clearly outpacing traditional desktop traffic, according to a new study from content performance marketing company brightedge.</p> </li> <li> <p>the study also found that 79% of all searches were different across mobile and desktop, suggesting a significant shift to the mobile-first search index google announced last year. brightedge said its research confirmed the emergence of two separate search indexes –– one for desktop and one for mobile –– with 47% of keywords in positions 1–20 ranked differently on mobile and desktop search engine results pages.</p> </li> <li> <p>additionally, the study found that the first page that ranks for a domain on a search query is different on mobile and desktop search engine results pages on about 35% of searches.</p> </li> </ul> <p>through 4500+ hd screens in 300+ of america's favorite malls, adspace delivers high-impact video impressions to 71mm unique shoppers steps from your storefront & is proven to increase retail store traffic by 1.5x.</p> <p><a href='' target='_blank'>see the study</a><img src='' style='height:0px; width:0px' /></p> <h3>insight:</h3> <p>the ultimate takeaway from this study goes a little something like this: mobile is happening, people. get with the program.</p> <p>we have been hearing about <a href='' target='_blank'>the impact of mobile search </a>for a while now, so this study should not come as a complete surprise to retailers. there is more detail, of course, to the lessons that can be learned from this study, but a big part of it is that brightedge is presenting some evidence that mobile search traffic represents the majority of search traffic by a margin — 14% — that is only going to grow. well, that and the notion that a mobile-first search index has some unique value.</p> <p>the frequency with which search results come out differently for mobile and desktop-initiated google searches means that retailers need to have search engine optimization, content and marketing strategies that reflect those differences.</p> <p>some retailers and brands may already understand this. in the study, brightedge notes that carlos spallarossa, director of seo at l'orÉal, is pushing for a mobile-first perspective. "we are developing content with a mobile-first perspective to connect with our users with info, use advice, and reviews — especially when they are near a store where they can easily purchase,” he said, according to the study. </p> <p>others may not be so far along in understanding it, and brightedge has a few suggestions about how to change up their approaches. designing and optimizing websites for speed and mobile-friendliness is a start, but among other suggestions listed in the study, retailers and brands need to understand different online consumer intent signals across desktop and mobile devices. also, producing separate mobile and desktop content that resonates on multiple device types is a good idea. brightedge also advises tracking, comparing and reporting mobile and desktop share of traffic continuously, as well as tracking organic search rank for mobile and desktop separately. </p> <p>mobile commerce may have once seemed to be nothing more than a sub-set of the broader e-commerce universe, but now it's becoming clear that mobile is charting its own unique territory.</p> <p>original article on <a href='' target='_blank'><strong>retail dive</strong></a>.</p> Website Trends Wed, 6 Sep 2017 00:00:00 -0800 Slow apps and websites can ruin your reputation <p>app and web users are growing more demanding and less forgiving, according to the results of a consumer survey from apica. in a clear call to action for organizations around the world, apica's survey found that three quarters of respondents expect websites and apps to perform faster than they did three years ago. <br /> <br /> apica conducted the survey among internet users in the uk, us and sweden, to investigate changing attitudes towards a brand's digital performance. the survey of 2,250 consumers reveals that nearly 40% of us won't wait more than ten seconds for a website to respond before navigating away. one in nine users (11%) won't even give a site <strong><em>five seconds</em></strong> before moving onto another website. </p> <h2>performance affects your digital brand</h2> <p>the survey also found that digital disappointment <a href='' target='_blank'>affects brand loyalty</a>, with 60% of consumers likely to be less loyal towards a brand if they experience poor website or app performance. 10% of participants said they would never return to an offending brand for goods or services. swedes are least loyal towards a brand that lets them down online, with 73% likely to turn to competitors.<br /> <br /> some noteworthy findings include:</p> <ul> <li>over 80% would consider telling friends about a poor website/app experience</li> <li>more than 1 in 3 respondents say long loading times cause them to lose patience</li> <li>three quarters of users expect sites and apps to perform faster than 3 years ago</li> </ul> <p>carmen carey, ceo, apica, said, "these results demonstrate that digital consumers have limited patience for slow performance or delays. there is clearly a general expectation that sites and apps will perform faster and better, particularly with the advent of born digital organizations. the onus is now on businesses, whether they're a leading financial company or an online retailer, to ensure peak performance at all times."<br /> <br /> the survey also revealed that users also have limited patience for organizations that schedule maintenance on websites and apps. less than half (46%) of users said that several hours of downtime was acceptable, and even then, reasons for the downtime had to be properly communicated. 54% respondents had an 'upper limit' of one hour, and more than 1/10 (13%) actually expect 100% up-time.</p> <h2>your app brand reputation at stake</h2> <p>negative digital experiences are also likely to impact brand reputation with 83% of global respondents reporting they would consider telling colleagues about a poor website or app experience, and almost 4 in 10 would definitely share this. </p> <p>"if companies wish to retain both customers and revenue, they must focus on proactive performance testing and monitoring of their digital services to ensure that, even at peak times, downtime does not occur," added carmen. </p> <p>apica monitors ecommerce websites and publishes an annual black friday web performance index. last year, it revealed that whist the top ten ecommerce websites are healthy, the rest are lagging expectations. the 2017 index is due to be published late november after black friday and cyber monday.</p> <p>original article on <a href='' target='_blank'><strong>app development magazine</strong></a>.</p> Website Trends Wed, 23 Aug 2017 00:00:00 -0800 An Intro to Minimalist Web Design <p>minimalist design is everywhere, and it’s especially popular among web designers. it’s easy to see the appeal: many of minimalism’s core tenets mesh very well with the constraints of modern ui and ux design, especially on mobile devices.</p> <h3>a (very brief) history of minimalist design</h3> <p>minimalism traces its origins back to the early twentieth century. though we tend to associate it with media and design now, its origins lie in fields as diverse as architecture and painting. here are a few early influences on the minimalist style:</p> <ol> <li>de stijl. dutch for “the style,” de stijl was an artistic movement that celebrated simple, abstract shapes, bold primary colors, and straight lines. piet mondrian’s city grid-inspired paintings are a perfect encapsulation of de stijl.</li> <li>constructivism. the constructivist style came out of early soviet revolutionary art. its goal was to create a new style of art that could create social change, rejecting the idea of “art for art’s sake.” the result was an aesthetic that communicated using a combination of strong, dramatic shapes, black-and-white photography, and bold typography.</li> <li>bauhaus. the bauhaus movement emerged from germany in the 1920s and early 30s. it jettisoned styles associated with earlier eras in favor of practical, functional aesthetics. “form follows function” is a maxim often associated with the bauhaus, one that inspired the designs of visionaries like mies van der rohe and le corbusier.</li> <li>zen simplicity. a final source of inspiration for minimalist design is in traditional japanese aesthetics. based on the tenets of zen buddhism, this style emphasizes clean forms stripped of flourishes and an emphasis on harmony, order, and balance. the stylized arrangements and attention to detail found in zen rock gardens captures the essence of zen minimalism that countless designers have worked to emulate.</li> </ol> <p>you can find traces of these different styles all over the modern web. as you’ve probably noticed, what ties all these styles together is a desire to remove extraneous elements, stripping everything down to its essential elements. if there’s an aphorism that best summarizes minimalism, it’s “less is more,” from the architect mies van der rohe.</p> <h3>the essential elements</h3> <p>there’s no single definition of minimalist web design. it’s less a meticulously defined set of guidelines than a set of general principles that can be applied to any situation. that said, there are a number of features that are frequently (though not always) found across minimalist designs.</p> <ol> <li>the use of typography as a central element. while minimalism is often associated with iconic sans serif typefaces like helvetica, futura, and univers, plenty of apps and sites also use more traditional serif typefaces to great effect. the key is that the type itself is as central to the look of a composition as shape and color.</li> <li>deliberate use of white space. rather than think of white (or negative) space as the lack of something, minimalism treats it as an element unto itself.</li> <li>imagery reduced to geometric shapes. strong iconography is a hallmark of minimalism, reducing a concept (like using a pictogram of a house for “home screen” or a trash can for “delete”) to the simplest and most evocative form possible. while modern design makes more allowances for representational graphics, it still often relies on geometric shapes for guidance, as in twitter’s logo redesign.</li> <li>relying on high-contrast color palettes. inspired by de stijl’s primary colors, minimalism often favors clear, solid blocks of color rather than shadows and gradients.</li> <li>using photography for contrast. large, often full-color photographs are often a key element in minimalist design, providing a pleasant contrast to the simplicity of type, shape, and bold color.</li> <li>an emphasis on cleverness and playfulness. breaking down a composition to its barest elements also gives minimalist designers the chance to take liberties they might not with a more maximalist or traditional style. this especially comes through in logos and wordmarks.</li> <li>the use of symmetry and grid layouts. here you can most clearly see the influence of traditional japanese design, which emphasizes the harmonious relationship between different elements.</li> </ol> <h3>the hamburger nav: a cautionary tale</h3> <p>many minimalist designers are inspired by the words of the author and pilot antoine de saint exupery, who said: “perfection is achieved not when there’s nothing more to add, but when there is nothing left to take away.” that said, judging what is safe to take away isn’t always obvious. take the case of the hamburger nav, for example.</p> <p>a common design challenge on both web and mobile is how and where to put navigation elements. the hamburger nav emerged in the early 2010s as a way to save space on mobile devices. the idea was to create a recognizable icon where common menu items could be kept so that they’re not constantly taking up precious real estate. after it was adopted by apple and facebook, the hamburger nav became a ubiquitous (and frequently frustrating) feature of modern app and web design.</p> <p>there was only one problem: what apps gained in simplicity they often lost in functionality. multiple studies found that hamburger navs caused user engagement to plummet. fortunately, most apps and websites have found other ways to keep navigational elements, including tabs, collapsible menus, and scrolling menus. but the case of the hamburger nav serves as a good illustration of what can happen when designers favor aesthetics over functionality.</p> <h3>trends in minimalist app and web design</h3> <p>we’ve gone over some of the basics of minimalist web design, and you can find countless examples of this style all over the web. now we’re going to look at a few distinct but related trends in minimalist design you may see on the web and in apps.</p> <h3>“complexion reduction”</h3> <p>over the last few years, you may have noticed a distinct trend among certain apps. from instagram to airbnb to apple music, major apps are stripping away color and ornamentation to create stark, simple, visually neutral uis that put the focus squarely on their content.</p> <p>in addition to draining interfaces of color, complexion reduction relies on large, bold typography to direct and orient users. think of complexion reduction as the white gallery wall on which the app’s photos, music, videos, and copy can be arranged. it lends itself naturally to the idea of a scrolling feed that lets users explore at their own pace.</p> <p>complexion reduction lends itself most to apps with lots of visual content and relatively simple feature sets. that may make it great for certain apps, but wholly unsuitable for others that require a more active hand in guiding users. additionally, the starkness and simplicity of complexion reduction can make it hard to stand out visually. without colors or illustrations, it can be hard to establish a strong visual identity, leaving you to either rely on your typeface choices or embrace the neutral look.</p> <h3>flat design</h3> <p>originally developed by microsoft in the early 2000s, flat design isn’t a new trend, though its use has exploded in recent years. in contrast to what’s often called “rich design,” flat design is known for its simple geometric shapes, open space, solid colors, and conspicuous lack of shadows, highlights, textures, and other features meant to suggest 3d space. using a combination of typography, icons, and colors, it creates a clean, efficient, modern-looking interface.</p> <p>flat design shares many of its characteristics with the bauhaus style, especially its desire to create a design style that feels native to digital displays, rather than relying on imagery ported over from the physical world. removing design embellishments can translate into quicker load times and better performance, especially when developing responsive websites or mobile apps that will need to work on a wide range of devices.</p> <p>that said, flat design comes with its own risks. while designers may celebrate the lack of clutter and sleekness of flat design, many users find it unintuitive and confusing. for example, the lack of drop shadows and highlights can make it hard for some users to distinguish a clickable button from a simple label against a block of color. some studies have shown that flat design can impair usability.</p> <h3>material design</h3> <p>related to flat design, material design is a design language and set of guidelines developed by google. like flat design, material design avoids trying to imitate physical objects. that said, material design doesn’t completely do away with depth. instead, it relies on subtle use of drop shadows to create the impression of many flat panels layered over top one another. in essence, it adds just a little bit of real-life back into digital design for the sake of usability.</p> <p>also unlike classic minimalism, material design uses much less white space and photography. with its solid colors and rectangular panes, material design compositions often look like pieces of colored construction paper layered atop one another.</p> <p>the advantage of material design is that it can address some of the usability concerns that plague flat design. because it comes with a detailed set of guidelines, it can also speed up the design process, since it leaves very little to the individual designer’s discretion. the other side of that coin, of course, is that material design runs the risk of looking pretty generic and distinctly google-esque. so if your visual identity is meant to stand out, material design may not be for you.</p> <h3>looking for a ui or ux designer?</h3> <p>applying minimalist design principles is about more than the appearance of your website or app. it’s about solving design challenges by identifying and emphasizing critical information and functionality. when looking for a ui or ux designer, make sure to pay attention to their portfolio, and ask them about their design process to make sure they have a good sense of how they approach the kinds of problems you’ll be asking them to solve.</p> <p>original article on <a href='' target='_blank'><strong>business 2 community</strong></a>.</p> Website Trends Fri, 18 Aug 2017 00:00:00 -0800 Understanding The Basics Of Responsive Website Design <p><strong>it is no longer enough to design a website solely for the desktop screen. the growing market of mobile phones and tablets is compelling web designers to reconsider how their work would be displayed on various devices. people are using their smartphones more often than accessing their desktops today. this necessitates a responsive web design.</strong></p> <h3>what is responsive design?</h3> <p>rwd or responsive web design is a design approach that would be allowing the code and the design to respond intuitively to the size of any device’s screen. this implies that you would be getting optimal viewing experience irrespective of the device you are using.</p> <h3>why is responsive design so important?</h3> <p>if designers came up with infinite versions of any particular website that would be working effectively for every possible device available to us, the process would be impractical from the point of view of the time and it would prove to be exorbitant. these sites would not be responsive to any technological changes in the future and so site maintenance would prove to be pretty challenging. use responsive design as it is the best solution for future-proofing your website.</p> <h3>know your audience preferences well</h3> <p>the vital factor responsible for the success of a responsive web design is identifying and understanding the preferences of your audience. find out what device they actually use while viewing your website. you need to have a clear idea about the components of your current traffic. how many of them are tablet users, desktop users, or even the mobile users? it is essential to come up with a <a href='' rel='noopener' target='_blank'>website design</a> that is responsive to varying devices. however, it is quite a complicated and challenging affair to design across diverse web browsers. moreover, there are numerous versions of browsers which require being catered to.</p> <h3>plan for both big & small screen devices</h3> <p>one of the significant factors that are responsible for the success of an intuitive or responsive web design is the capacity to give a better experience to the users accessing the website via mobile devices. responsive web design should not be restricted to or treated as just a small screen resolution. in fact, responsive web design is advantageous to practically all screen sizes including excessively large displays as well. while designing any web experience, you should not only consider mobile first as your ultimate goal, you must also keep in mind larger screen sizes.</p> <h3>arrange content differently</h3> <p>shifting from the typical multiple columns meant for a larger screen to just one column layout meant for a really small screen is the chief characteristic of any responsive site. however, keep in mind that only changes in columns are not enough. different contents present on your site necessitate different layout approaches.</p> <h3>scalable navigation is a must</h3> <h3>navigation plays a pivotal role in the development of a responsive website design. scalable navigation is a must for creating a responsive website. you must understand that what is working exceptionally well for any large device may not perform smoothly on other smaller devices. you cannot just have a constant and a uniform navigation experience across diverse screen sizes. you must concentrate on creating a truly user-friendly navigation all the way.</h3> <p>original article on <a href='' target='_blank'><strong>business computing world</strong></a>.</p> Website Trends Fri, 18 Aug 2017 00:00:00 -0800 Custom Web Design vs Content Management Systems <p>there are two different camps in the world of web design. the first is having a web designer/developer build a custom website from scratch. the second is to use a content management systems (cms) with their included templates. each has benefits and short comings.</p> <p>before we start looking at the pros and cons of each design methodology, i think you must honestly assess what your goals and hopes for your website will be by answering some simple business and marketing questions.</p> <h3>who are you and why do you want a website?</h3> <p><strong>why do you want a website?</strong> do you want just a couple of pages to show the world who you are, what you do and where you’re located (like a placeholder on the worldwide web)? or do you want a website that is expandable and adaptable as your business grows adding new products, services and/or new information?</p> <p><strong>are you looking to build a website that is an online application?</strong> in other words, do you want your website to perform specific functions? these functions might include processing event registrations, selling and shipping products, managing different types of events or activities (i.e. tracking scores from competitions), managing a photo or literature library, publishing quarterly reports - you get the picture.</p> <p><strong>will interaction with your customers online be important aspect of your website?</strong> do you plan on providing quotes for your services, having feedback or reviews of your services or products, providing a comments section for customers, etc.?</p> <p><strong>do you have difficult, complex or extensive data to manage online?</strong> is your website going to be a hub of information such as reports, minutes, action items or service letters that are constantly being added, updated or edited frequently?</p> <p><strong>does your company have a fully integrated branding program for your image?</strong> do you have a logo design, typography/font requirements, spacing requirements, a specific color scheme, etc.?</p> <p><strong>do you do everything yourself or do you have a staff will specific responsibilities?</strong> do you do everything yourself or do have a staff that does procurement, filing, development, etc.?</p> <p><strong>from a marketing standpoint are image and design important to you or just a thing?</strong> do you want to follow the trends or are you more interested in having your own unique image different from those you have seen online?</p> <p><strong>is your website going to be my primary means of getting your message out to the public?</strong> is your website going to be just a small piece of your marketing program? do you have a have a limited budget?</p> <p>based on your answers to these questions, you should begin to understand what kind of website your business needs and if you should hire a web designer/developer</p> <p>to sum it up, if you plan on designing a website yourself with a cms, the following bullet points should apply.</p> <ul> <li>your website is just a placeholder.</li> <li>not looking to build an online application.</li> <li>customer interaction is not important.</li> <li>you have minimal data to manage online.</li> <li>you manage everything yourself.</li> <li>marketing image is not important.</li> <li>your website is not your primary means of getting your message out to the public.</li> </ul> <p>if you answered no to all or most of the above bullet questions, a cms design is not the solution and you should consider hiring a web designer/developer.</p> <p>there are big differences between designing a website with a cms and having a web designer create one for you. let’s look at the differences.</p> <h3>custom-built websites.</h3> <p>custom design websites are built and coded by a web designer and developer. the design of the website is more artistic than what you will get with a cms. a website designer is a professional that will be able to visualize the layout and ergonomics of a site. a developer is a programmer who focuses on the way a website performs – the functionality of the site on different desktop computers and mobile devices, the interaction of your visitors with the site and the mechanics behind the databases and administrative functions of the site. you will want to find someone who does both design and development competently but also offers reasonable fees. with a custom website, these are the things that you can expect:</p> <ul> <li><strong>expense: </strong>web designers vary in price according to geographic region and level of education/experience. depending on these factors, you may pay anywhere from $50 to $120 an hour.</li> <li><strong>design:</strong> a basic, custom designed website will cost you between $800 and $1500, and upwards of a few thousand depending on your needs. the designer can give you a fairly accurate time/cost quote.</li> <li><strong>user interface: </strong>since you are working with a design/developer you can customize the user interface (user experience) of the website to meet your specific needs and wants.</li> <li><strong>access:</strong> because you are working directly with designer/developer, you will be able to call them whenever you need changes or have technical problems with the website. having direct access to the designer/developer is especially important when there are technical problems. they know the code and its uses intimately so if there is a problem they can usually isolated and fixed.</li> <li><strong>extendability and scalability: </strong>having your website built by a designer/ developer, depending on the development platform they use, results in a website that is much more extendable and scalable than a cms site. a good web designer/developer will consider your future plans for the website as they select the technologies they use to build it.</li> <li><strong>looking down the road: </strong>the future of your website needs to be secure. some cmss have gone “bad” and simply stopped working.</li> <li><strong>adaptability: </strong>if you have specific list of features you eventually want on your website, the designer will be able to prioritize these features to accommodate your current budget with your future one.</li> </ul> <p>it is important to note that none of these points involve online applications, large databases of information or interaction with visitors. all of these scenarios require a custom built website by a designer/developer who knows both html code and programming. no cms can handle these issues in a manageable way.</p> <h3>cms/template built websites.</h3> <p>there is a misconception of how beneficial and economical cmss can be. so, let’s take a closer look at them.</p> <p><strong><em>advantages:</em></strong></p> <ul> <li>lack of funds/low budget. if a budget is what is keeping you from having any online presence at all, then a cms might be your solution.</li> <li>you need to have a website immediately – not in a few weeks or more. using a cms should require less development time but don’t be fooled, this is not always the case. these days, cmss are just as complex as indesign or any other high level design program.</li> <li>looking at cms templates is a great way to find inspiration on colors schemes, layouts and features. a web designer can’t copy these for you, but they do give them an idea of the visual design you would like.</li> </ul> <p><strong><em>downfalls:</em></strong></p> <ul> <li>your design is not going to be original unless you pay the “exclusive” price for a custom template. though, even if you pay the “exclusive” price, there are others who have bought the same template and still have the right to use it.</li> <li>as cms systems try to become a “one-size fits all” application, they actually become more complicated to use. often, the cms comes with a steep learning curve. cms systems are software-based just like microsoft word or adobe indesign and update on a regular basis. and, every time there is an update, the program you are used to using is going to change.</li> <li>you will be limited on the customization of the website template. without web page coding skills, you are still going to have to either spend the time and money to learn how to code a web page or hire someone to help you. some templates are laid out in a very specific way. so, if you incorporate your own graphics or have extensive content, the template could “break.” as well, massive site-wide changes are going to be difficult and you will have to make the changes manually to every page. an experienced web developer will have designed your site with components for common items that are on each page making site-wide changes a lot more manageable.</li> <li>some website templates are not designed to be search engine friendly. as explained above, it is important how the background coding of your website is done. if not done correctly, it could hurt your marketing efforts on the internet.</li> <li>if the website template uses antiquated coding, it might not work with all browsers. some templates incorporate browser specific features that might work in one browser but not the other.</li> <li>customizing javascript is often difficult or next to impossible.</li> </ul> <h3>custom web design or cms website?</h3> <p>when deciding if a custom web design is the way to go or if a cms is a better match, always keep in mind that you want your business to stand out from the crowd and be memorable to the visitor for the right reasons.</p> <p>in either case, you are still going to have to do some homework to increase your standing with search engine results. having a website that is really appealing is only one small part of the internet marketing package. you will have to research the phrases that your target audience will use to find your website and then incorporate those phrases into the content of each of your website pages.</p> <p>to maintain or build a website yourself you are going to have to invest some time (and possibly some money) into learning as much as you can about website design and development. it is a changing technology that has new rules and requirements all the time. you will have to keep up with these changes in order to keep your website active and current.</p> <p>much of the decision comes down to cost and time. you might want to compare the two forms of web design by considering not only the costs but also the amount of time you will invest in designing a website yourself, the skills you have as a designer, how large and complicated your site is going to be and the impact you want your business to make on the world stage.</p> Website Trends Thu, 1 Jun 2017 00:00:00 -0800