13 Things Every Web Designer Needs to Know About SEO

SEO tips for web designers

Imagine you’re on vacation and in search of a great restaurant for dinner. Or it’s your sister’s birthday and you have no idea what to buy a teenage girl. Or you’re ready to upgrade your smartphone and want to know which option is best. There is a two-word solution for each of these predicaments: “Google it!”

This is the solution used to answer nearly 12 billion questions every month. The sheer magnitude of consumers turning to search engines to aid them in their decision making means search rankings are more important than ever. In fact, 75 percent of users never even scroll past the first page of search results.

This is where SEO comes in to play. You’ve heard the trio of letters mumbled for quite some time, but what does it mean and what’s the relationship between web design and SEO?  Here are the answers we found from the experts.

What does SEO mean, anyway?

The short answer is this: SEO is an acronym that stands for search engine optimization. But what, exactly, does that mean? SEO is the practice of improving and promoting a website in hopes of increasing traffic from search engines, according to Moz, arguably the biggest online SEO authority.

"[SEO] comes down to three basic things: give access, be recognized & provide value."

Shinhee Son, SEO manager at Collegis Education*, explains that search engines aim to see and analyze content the way we do, looking for visual cues to confirm we’re on the right page. Put simply, SEO helps Google provide an authoritative answer to the questions you search. There are tons of SEO tips and tricks that can impact search rankings, but Son believes it all comes down to three basic things: give access, be recognized and provide value.

13 SEO tips for web designers

“SEO should never be an afterthought; it should always be baked in from the beginning,” Son says. We enlisted some other experts in SEO and web design to share some basic best practices that will help you ensure your websites are well-optimized.

1. Conduct in-depth keyword research

This is one of the most important and effective tips when it comes to improving your search ranking. It’s critical to pinpoint exactly what your target audience is typing in their search query. After all, ranking at the top for a keyword nobody is searching for isn’t going to bring you much business.

2. Design for mobile first

Think about how much you use your smartphone on a daily basis. Mobile searches have officially overtaken desktop searches as of May 2015. This means websites should be redesigned with templates suited for mobile, according to Son. This shift will force you to simplify your website, condensing your content to include only the most important information. Google has responded by releasing its mobile-friendly algorithm, meaning non-responsive websites will suffer.

3. Give each URL a meaningful name

Google reads the words used in URLs, so it’s important to incorporate your keyword phrases within them. This helps Google recognize what your page is all about so it can appropriately match it to a searcher’s intent. Our experts agreed that the most effective way to structure your URL is to use hyphens rather than underscores to separate words.

4. Use relevant title tags

Title tags define the title of an online document and are used to show preview snippets for a webpage. They appear in three places: the browser, the search engine results pages and external websites. Your title tags should include your keywords and be unique and relevant. Aim for less than 65 characters because anything longer will be cut off in Google’s search results.

"SEO should never be an afterthought; it should always be baked in from the beginning."

5. Improve your site speed

Google specifically calls out site speed as part of its algorithm. Why? Because users hate slow websites! The longer a page takes to load, the more likely a user is to bounce. So how can you avoid this? There are several ways to increase site speed, including optimizing your database, using caching when possible and using a content delivery network (CDN).

6. Only include unique content

Every page on your website should be unique and not appear elsewhere. You should strive to have each page of your website address a specific question. By exclusively addressing the concerns of your consumers, Google can clearly identify which pages on your website are most authoritative to a searcher. It’s also important to ensure your content is valuable and regularly updated.

7. Include a clear call-to-action on each page

Whether you’re driving users to sign up for a newsletter, add an item to their shopping cart or schedule a consultation, make sure it’s obvious to your consumers. this tip doesn’t directly lead to more visibility, Son explains, but it will impact how well your traffic performs.

“You can rank first for a high volume keyword, but not drive any sales for your client or company,” he says. “That’s what the C-Suite care most about!”

8. Use descriptive image file names

The more clues you provide Google, the easier it is for the search engine to identify the subject of your content and match it to a user’s intent. Google reads image file names but doesn’t recognize meaningless ones. So don’t use default names like “index01.jpg”. If you have an image of a cat, name it “cat.jpg”—it’s as simple as that!

9. Compress image sizes

Large image files are big contributors to slow site speed, which Google penalizes. Not only that but there’s nothing worse than waiting for an image to load. In fact, one study found the average consumer only waits about five seconds for a mobile site to load before abandoning it. A good rule of thumb is to keep image file sizes below 70kb.

10. Ensure primary content is 'above the fold'

Always make sure the most important information is instantly available. Users want their content immediately and Google has implemented a page layout algorithm to reward websites that are top heavy, according to Son. 

11. Never use Flash intros

Flash technology is becoming outdated, being replaced by more modern languages like HTML5. It’s also not SEO friendly because it is a rich media format. Search engines read text and are unable to digest the information embedded within a Flash file. Our experts agreed that it’s best to avoid Flash altogether.

12. Encourage social sharing

Social networks are a great source of referral traffic to your website, but social shares also act as validation that your content is meeting user expectations. These shares also signal to search engines that you (or your brand) are an expert in the field on which you’re commenting or writing. Integrating social sharing buttons within your website design makes it easy for users to help you build that authority.

13. Don’t buy links … EVER!

This is one of the biggest SEO no-no’s. Anytime an external website links to yours, Google considers it like a vote. Sites with more backlinks tend to rank higher in the search results. But Google has a variety of tactics for identifying bought links and the penalties for offenders are harsh.  

It all starts with SEO

It’s like the age-old saying: If a tree falls in the forest and no one is around to hear it, does it make a sound? You could design the most amazing website the Internet has ever laid eyes on, but it means nothing if nobody can find it.

These 13 tips will help you ensure every masterpiece you design is easily accessible to its intended audience. It’s obvious that web design and SEO go hand-in-hand, so mastering this skill is sure to catch the eye of a client or employer. Learn about other hot web design skills that will stand out on a resume!


*Collegis Education is the marketing vendor for Rasmussen College.

About the author

Callie Malvik

Callie is the Content Manager at Collegis Education, overseeing blog content on behalf of Rasmussen University. She is passionate about creating quality resources that empower others to improve their lives through education.

female writer

Related Content

Related Content

This piece of ad content was created by Rasmussen University to support its educational programs. Rasmussen University may not prepare students for all positions featured within this content. Please visit www.rasmussen.edu/degrees for a list of programs offered. External links provided on rasmussen.edu are for reference only. Rasmussen University does not guarantee, approve, control, or specifically endorse the information or products available on websites linked to, and is not endorsed by website owners, authors and/or organizations referenced. Rasmussen University is accredited by the Higher Learning Commission, an institutional accreditation agency recognized by the U.S. Department of Education.

logo-accreditation-acen logo-accreditation-ccne chart-credential-laddering-associates-bachelors-masters 0 Credits 90 Credits 180 Credits 48 Credits Start Here HIGH SCHOOL GRADS Start Here TRANSFER STUDENTS Start Here SECOND DEGREE PURSUERS End Here ASSOCIATE'S DEGREE Start Here MASTER'S DEGREE PURSUERS End Here BACHELOR'S DEGREE End Here MASTER'S DEGREE chart-credential-laddering-associates-bachelors 0 Credits Start Here HIGH SCHOOL GRADS Start Here TRANSFER STUDENTS 90 Credits Start Here SECOND DEGREE PURSUERS End Here ASSOCIATE'S DEGREE 180 Credits End Here BACHELOR'S DEGREE chart-credential-laddering-msn chart-credential-laddering-nursing-programs chart-credential-laddering-nursing DNP MSN RN to BSN LPN to RN Bridge Accelerated BSN Professional Nursing ADN Practical Nursing Diploma Pre-Licensure Post-Licensure icon-colored-outline-bank icon-colored-outline-certificate icon-colored-outline-circle-dollar-sign icon-colored-outline-folder-search icon-colored-outline-hand-heart icon-colored-outline-head-blocks icon-colored-outline-head-cog icon-colored-outline-head-heart icon-colored-outline-health-plus-leaves icon-colored-outline-hospital icon-colored-outline-lifelong-learning icon-colored-outline-light-bulb-analytics icon-colored-outline-location-pin icon-colored-outline-magnifying-glass icon-colored-outline-monitor-healthcare icon-colored-outline-monitor-paper-search icon-colored-outline-nurse-rays icon-colored-outline-padlock-shield icon-colored-outline-person-presenter-screen icon-colored-outline-scales ras-logo-flame ras-logo-horizontal ras-logo-stacked icon-colored-advance icon-colored-arrows-cross-curve icon-colored-briefcase-star icon-colored-build icon-colored-bulb-analytics icon-colored-certificate icon-colored-continual-development icon-colored-duo-chatbox icon-colored-folder-mortarboard icon-colored-forward-ribbon icon-colored-gears-clock icon-colored-globe-pen icon-colored-growth icon-colored-hand-bubble icon-colored-hand-stars icon-colored-hands-gear icon-colored-head-blocks icon-colored-head-cog icon-colored-health-plus-leaves icon-colored-hospital-building icon-colored-laptop-cbe-skyscraper icon-colored-laptop-checkmark icon-colored-laptop-webpage icon-colored-location-map icon-colored-location-pin icon-colored-monitor-paper-scan icon-colored-mortarboard-dollar icon-colored-national icon-colored-people-chat-bubbles icon-colored-person-cheer-star icon-colored-person-laptop-checkboxes icon-colored-person-screen-instructor icon-colored-person-whiteboard icon-colored-phone-chatbox icon-colored-police-light icon-colored-prep icon-colored-presenter icon-colored-regional icon-colored-save-time icon-colored-shirt-hat icon-colored-skyscraper icon-colored-state icon-colored-student-centered icon-colored-support icon-colored-world-experience icon-triangle-arrow-up-plant icon-triangle-calendar-pencil icon-triangle-clock-rotating-arrows icon-triangle-display-gears icon-triangle-hand-right-speech-bubble icon-triangle-laptop-coding-brackets icon-triangle-mortarboard icon-triangle-paper-ribbon icon-triangle-person-cheer-star icon-triangle-person-juggle icon-triangle-triple-people-chat-bubble icon-modality-campus icon-modality-field icon-modality-online icon-modality-residential icon-arrow icon-bank icon-camera icon-filter icon-general-chart icon-general-connect icon-general-degree icon-general-discuss icon-general-email icon-general-find icon-general-hat icon-general-heart icon-general-laptop-building icon-general-laptop icon-general-leader icon-general-map icon-general-money icon-general-paperwork icon-general-people icon-general-phone icon-general-speak-out icon-head-heart icon-info-circle icon-mail-forward icon-mglass icon-play-solid icon-quote-mark-left icon-quote-mark-right icon-scales icon-share-square-o icon-simple-chat icon-simple-desktop icon-simple-find icon-simple-hamburger icon-simple-phone icon-spinner icon-tag icon-testimonial-quotes icon-util-checkbox-white icon-util-checkbox icon-util-checked-white icon-util-checked icon-util-chevron-down icon-util-chevron-left icon-util-chevron-right icon-util-chevron-up icon-util-circle-arrow-down icon-util-circle-dot icon-util-language-switch icon-util-loading icon-util-open-window-link icon-util-pdf-link icon-util-refresh icon-util-x rebrand-arrows icon-social-facebook-colored icon-social-facebook-square-colored icon-social-facebook-square icon-social-facebook icon-social-google-plus-square icon-social-google-plus icon-social-instagram-colored icon-social-instagram icon-social-linkedin-square-colored icon-social-linkedin-square icon-social-linkedin icon-social-pinterest-p-colored icon-social-pinterest-p icon-social-twitter-colored icon-social-twitter-square icon-social-twitter icon-social-youtube-play-colored icon-social-youtube-play graduate-cap-star-coin hand-coin hand-heart nurse-stethoscope-rays card-send-smile person-yoga-pose suitcase-star