Relying On Grids Can Limit Your Content

,

Designing with grids is common practice online. Every template is based around grids which let you input what you want, and most popular websites have their pages broken up along a grid. There are some issues with relying on grids for your design however.

The biggest practical issue with putting your faith into a pre-made grid is that the internet is not static, and boundaries are vague at best. Sure, every device has a set width and height, but those measurements vary wildly and there are uncountable other variables. Images are shown at different densities, text can be resized, and there are constant updates to how the web is processed.

This issue only hints at the bigger problem with relying on templates. If you aren’t making the active decisions of how your content needs to be presented, you are instead molding your content to fit the grids. Web pages are supposed to exist to present information, not the other way around. Your design affects everything on the screen, including the information you are putting out there.

Taking control and shaping your design around your content lets you decide how your design enhances your content. Adhering to a strict grid limits your content by confining it. This isn’t to say using grids in your layouts is bad.

Grids are tools, and should be used to highlight your content, and visually group related items, establish a hierarchy of importance, and create a sense of rhythm on the webpage. The issue is when webpage owners decide that using a premade gridded template rather than trusting a professional. Ben Gremillion thinks grids can even be used to bring new life to webpages, but you have to be actively deciding how to use grids and not simply slapping some information into slots.

/0 Comments

Why You Should Be Using Web IDEs For Your Coding

,

Think about the programs you use for design. You probably think of Photoshop, Illustrator, or one of a few prominent desktop code editors. You probably didn’t immediately think of your web browser, and the numerous online tools you can use that a large amount of your workflow relies on. While there aren’t any web based graphic design tools that rival Photoshop (yet), the same can’t be said for the code editors that developers use.

While in the past, the web was just where you went to see simple HTML and find the vast number of programs you would have to use offline, now only extremely specific things require actually installing programs. Web development is one of the few arenas that has been slow on taking up web integrated tools, but that has changed significantly over the past year.

Now, I understand anyone’s reluctance to shift from a program they have been using for years to a web based coding interface, but it actually makes a lot of sense. Online tools allow for faster and easier collaboration, and they can help keep things much more organized than the endless folders could ever do. Matt Pass breaks down why you should make the switch over at Webdesigner Depot. Change is hard, but sometimes it is very worth it.

/0 Comments

Matt Cutts Explains Negative SEO

,

There is more than enough talk out there about negative SEO, and how to prevent it or fight back against it, but Matt Cutts says the actual number of occurrences of people trying to use negative SEO is extremely low. He explains that Google designs their algorithms to try to ensure that they can avoid penalizing innocent sites and now that Google has added the Disavow Links tool to their repertoire, it is very easy to shut down “black hat” SEO if it does happen to you.

Cutts, the head of the Google Webspam team took to YouTube to answer the huge number of questions he has received about negative SEO, and also further explain the Disavow Links tool, clearing up any misconceptions there could be. Cutts doesn’t think negative SEO should be a concern for the vast amount of website owners out there, unless you are in extremely competitive spheres. “There’s a lot of people who talk about negative SEO, but very few people who actually try it, and fewer still who actually succeed,” he said.

/0 Comments

jQuery Plugins To Make Typography Easier

,

Source: Flickr

Web typography is blossoming right now thanks to new font solutions like @font-face and Google Fonts, but we still often feel limited by how much control we have over the typography in designs and publishing apps. There are some jQuery plugins out there however that are beginning to catch up to the other new font solutions gaining popularity.

Chris Spooner compiled some of the best jQuery plugins for web typography that help offer the precise control designers desire, and any designer concerned about their text can benefit from them.

The Lettering.js plugin is a super simple plugin, and that simplicity has also assisted it in gaining huge popularity. The plugin splits up text and wraps each letter in a custom <span> element giving you exact control over kerning, or even customizing CSS styles for individual letters.

Other plugins like FitText.js help solve issues that responsive design has created for typography. Responsive design changes the containers for text, which makes the text reformat to match the size, but that often makes headings and titles looking worse for wear. The FitText.js plugin allows you to scale your headings and titles just like responsive images, keeping everything on the same line.

My favorite plug Spooner has found is great for its name as well as its function. Bacon is a plug in the allows you to shape your text around a bezier curve directly within the design. InDesign has allowed designers to easily shape text around images, but HTML and CSS has traditionally made text flow in square blocks. Now, rather than using tedious and dirty HTML markups, Bacon makes it easy to easily, and cleanly, design your text around shapes with just a series of coordinates.

If you are a stickler about typography like I am, all of the plugins offered in Spooner’s article will seem like life-savers, as well as huge time-savers. Designers have struggled to take control over fonts and text since the invention of the internet, but only recently has web typography become fun rather than tiresome.

/0 Comments

Dispelling Some Of The Crazier Linking Beliefs

, ,

The amount of talk about SEO coming from blogs and experts help make SEO one of the more discussed aspects of the internet behind the scenes. You won’t see search engine optimization coming up on the news, but just one search can lead to dozens of resources filled with writers offering their opinions and ideas.

In many ways, this is great because it keeps the community up to date with continuous changes, and delivers a wealth of free knowledge to anyone trying to get involved. However, it also creates an echo chamber where misconceptions run rampant, and there is always a need to clear up the bad information out there.

This time around, it was Eric Ward over at Search Engine Land who took it upon himself to dispel the rumors and lies surrounding linking. Links are a hugely important part of SEO, and many don’t understand exactly how they are used and evaluated. Add to this the never-ending changes to search rank signals, and bad ideas grow into monsters.

Many of these bad ideas come in the form of absolute statements, such as “anchor text will stop being used as a ranking signal altogether” in the next year. Google has done work to spot people misusing anchor texts, especially those attached to purchased links that say anything you want. But, as with most Google changes, they haven’t disavowed the practice altogether, they have only tried to punish those who take advantage and misuse the practice.

As Ward puts it, “Are you really going to tell me that if the Library Of Congress site links to Consumer Reports magazine’s site using the words “Consumer Product Reviews” that this would be a useless signal? No way.”

Another preposterous statement is that linking will no longer be the most important ranking signal, dethroned by social media signals. This concept ignores the number of Google searches done without being signed in, and not only that, Google uses tons of signals, and social media is one of them. But, relying on one user generated signal to return results to that one user doesn’t make any sense, when Google considers tons of signals as of now to return results.

The reason social signals will never be the primary signal for search engines is, quite simply, people like to do some things anonymously. They don’t want questions about body hygiene, marital issues, or personal problems being associated with their Facebook.

While linking may not be the clear-cut MVP it once was for SERPs, claiming that it is going away altogether doesn’t make any sense. It is this type of misinformation that leads to confused clients and well-intentioned but misinformed bloggers spreading the information far and wide.

/0 Comments

Is SEO Really Bad For User Experiences On Your Site

,

One of the most common criticisms hurled at SEO is that is manipulates sites based on what Google or Bing want rather than what users would like to see. Many perceive this as a conflict between SEO and good user experiences, almost as if SEO is antagonistic to an enjoyable website visit.

On the surface, this assumption makes sense, as SEO’s do tend to get wrapped up in pleasing algorithms rather than people, but good SEO and quality user experience don’t have to be mutually exclusive. There are plenty of times where focusing on both aspects of the web page create great sites that are popular for search engines, and many SEO practices actually benefit the user.

Sitemaps, for example, are an essential part of SEO strategy, as search engines do limited crawls, where many sites do not have all of their pages indexed by the engine. Having a well organized and updated sitemap, as well as simple navigation, you make sure the search engines index the pages most important for you.

Source: Flickr

These sitemaps and navigation systems have the added bonus of making users able to easily navigate a site. Nobody enjoys having to scour a website for the specific page they are looking for, and a well done navigation system quickly erases that issue.

Keyword based SEO practices also help both parties, as long as you keep your readers in mind while optimizing your text. All text-based content should be easy to read, but search engines rely on keywords in the blocks of text to understand what your site is about.

The problem is, this makes some SEOs starting placing the keyword every other word which is going to drive readers crazy. The general rules are to include the keyword in the title, headline tag, and body content, but no more than once in the headline tag and title. You can use it a few times in your content as needed, but not overdoing it is important. In fact, including the keyword too many times could actually hurt your site.

Sujan Patel over at Search Engine Journal has even more ways you can combine SEO and a user-experience focus to make web sites that make both the search engines and your visitors happy.

/0 Comments

Great Resources: Chrome Add-Ons For Designers And Developers

, ,

Source: Flickr

Browser plug-ins can be a huge help or a major hassle, depending on what is installed. Many of us still have nightmares about asking to use a friend’s computer, only finding Internet Explorer, and opening the program to see toolbars and add-ons clogging up half of the window space.

With time (and better browsers) however, many browser extensions have risen that actually help improve productivity. Google Chrome, for example, has tons of great free extensions in the Chrome Web Store, and Awwwards.com has cherry-picked some of the best for designers and developers.

One extension seems almost magical for us designers who have seen a fantastic font online, and then spent hours looking through collections of typefaces trying to find the closest match. WhatFont quickly inspects fonts on webpages just by hovering over them, no fuss or hassle.

Resolution Test, on the other hand, is an extension that allows developers to test web pages in different screen resolutions, simulating testing on various devices.

Some plug-ins aren’t meant to replace tools like the two listed above, but instead are intended to add to other tools. Firebug Lite for Google Chrome isn’t intended to replace Firebug or Chrome Developer Tools. It works together with them to provide rich visual representations developers are used to seeing in Firebug.

Awwwards have twelve more tools many designers and developers will find useful. Everyone loves free tools and resources, and these plug-ins can help streamline your work process without taking up hardly any space on your computer.

/0 Comments

Skeuomorphism vs. Flat Design

,

Lately, some designers have been championing flat design as the new frontier for layouts and interfaces, opposed to the skeuomorphism we have all come to know and love (even if we didn’t know the name for it). Since flat design may be a new bandwagon in the next year, let’s talk about what the two terms mean.

Flat design is basically what it sounds like. It is a style of interface and design that makes no attempts to cross into three dimensional realism. Microsoft 8 is the easiest example, because it is truly entirely flat. Flat design uses no gradients, bevels, shadows, or any other ways of simulating depth, instead relying on strictly designing for the two dimensional screen.

Of course, flat design has been around a while. Facebook and Google both use the style to different extents, but why are some thinking it is the best, “honest” approach to screen-based design? Wouldn’t you think designs that simulate familiar real world objects seem more user-friendly?

As Mike Redaelli puts it in his comparison of the two, “Why not make the notepad look like a legal pad if that will help your average tech user to understand the concept of the application in one glance?”

The answer to this whole debate is sadly the same as it is to most cases where someone claims a certain style is the savior we’ve all been waiting for who will revolutionize web design. Both styles are entirely valid, and can be used in wonderful exciting ways, but it really relies on what you are trying to accomplish, and who you are designing for. If your audience can’t use the design, no matter how cool it looks, it is a failure.

/0 Comments

Blog Post Formats You Can Rely On For Content Marketing

, ,

Yep, it’s time again for a post about content marketing! It looks like there will be plenty of these throughout the next year as content marketing stays on the tip of everyone’s tongue when talking about SEO or digital marketing.

But, pumping out quality content continuously takes a lot of time and effort, which can be difficult for a site or marketing team to maintain for a long time. This causes most to get burnt out and ideas for new content stop coming as quickly. If you’re having trouble coming up with new things to talk about and ways to present your content, Sujan Patel has some suggested formats which might help you get started at Search Engine Journal.

  • List Posts – You’ve almost certainly seen lists before unless you stay away from almost all forms of media and information. If that is the case, thanks for reading this before picking up a newspaper or looking at “the cutest 25 cats sitting on things”. Yes, lists are a super common choice for bloggers and writers of all kinds. They are easy to write, and they tend to be more shared than most blog posts.
  • Interviews – Interviews have also always been popular for media, and SEO benefits for the same reasons. When you get an interview with a subject, you will automatically gain exposure to that figure’s followers and draw traffic to your own content. Interviews are also fairly easy. Make sure you understand the technology you would be using to record the interviews, like audio recorders, cameras, etc., then all you have to do is start asking anyone you would be interested on interviewing. You’ll get a bite faster than you know.
  • Reviews – If you have writer’s block when it comes to coming up with topics, reviews are a great way to keep content coming regularly while keeping it interesting for your viewers. Try to be objective and fair with your reviews, and use specific details to keep others from thinking you are just attacking other writers and creators.
  • Link Round-ups – Similarly to reviews, this is a go-to for those who can’t figure out what to talk about. Gathering collections of links has the upsides of collecting resources you might use on your own, while also earning goodwill for other creators’ content you are sharing.

Obviously, the best way to get traffic to come to your site is to just offer quality content filled blog posts informing peers in the industry. These formats shouldn’t replace the standard blog post, but when you are at a total loss for topics, these formats are handy to have in your back pocket.

/0 Comments

Correcting Misunderstandings About Retina Displays And Design

,

Retina Displays have become a buzzword for design and Apple alike, as it has managed to become synonymous with any display able to show high definition graphics, but many don’t actually understand what Retina means. For starters, “Retina Display” is just Apple’s term for any devices that can put out the high quality graphics, but almost every other brand of mobile device has devices with the same capability.

In other words, asking if your PC has a Retina capable display is like asking if HP makes an iPad.

The misunderstanding, combined with Apple’s penchant for promoting the capability without stating what it actually means in their ads, has made a huge number of people think they understand the term, without knowing the details.

Retina Display is Apple’s brand name for liquid crystal displays that show pixels at higher densities than ever before. These high definition displays pack twice the number of pixels in the same amount of space a normal display would show. This causes text, icons, and even even optimized pictures to look crisper and less blurry than before.

Source: Designmodo

This raises a couple problem however. Most websites haven’t optimized for Retina Displays, so instead many pictures and text will appear pixelated, and the new set of display capabilities adds to the already huge variance of screen resolutions and sizes accessing websites.

Paula Borowska knows how to fix these issues though, and the solution is already one of the most popular design methods available right now. Her article at Designmodo covers the different ways you can create Retina graphics and text that utilize responsive design.If you want your site to look as crisp and beautiful as it can, creating Retina level graphics is the way to go, and it can be surprisingly easy.

/0 Comments