CSS vs Javascript vs JQuery drop down navigation
-
For a user / seo perspective, what is the best way to code a drop down menu nav bar? Is it best to use css, javascript or a scripting library like jquery?
I am thinking about overall best practice that will not have a negative impact on serps.
I am also thinking about what will work best on all types of devices i.e. desk tops, lap tops, smart phones and tablets.
What are the Pro's & Cons of Using CSS for Drop Down Menus.
What are the Pro's & cons of using Javascript for drop down menus.
And the same question for jquery.
Thank you all in advance for your ideas.
-
You can't go wrong with CSS. Endless styling possibilities. Also, I'd stay away from javascript because it's executed in order on the page. Meaning, if the JS doesn't load properly in the menu, the remaining JS below it wont load either.
-
Thumbs up to you too Joel and good luck with your project.
-
Seems like the seo jury has spoken and CSS it is. Thank you all for your help on this matter. Thumbs up to you all.
-
Hands down that CSS is the preferred way make dropdown menus. Google and on a lesser note, other search engines, have improved drastically with their ability to parse JavaScript / jQuery, and you may be able to get away with it, but it really should be avoided if possible. With the "new" CSS3 styles, you get almost any style you'd like with that.
-
Hi Joel,
I echo Marek's comments. However, I'm a great fan of making 100% sure that the bots can access everything that I want them to so if I'm ever in doubt I go with css and html combination as much as possible. We use Ajax and jQuery totally etc only on pages which we believe are 100% to be used primarily for user experience and engagement. E.g. When they're doing searches for specific things and the page needs to be ultra fast and efficient. However, we also try to ensure that we have crawlable pages which output the full content of a search wherever possible so that we can get the SEO benefit too. It also helps for when people have javascript disabled (not many granted).
I've seen so many ecommerce sites with great content but it's often got some kind of blockage that means a button has to be pressed or a form submitted to see it and if I'm not mistaken bots can't access this easily.
Hope this helps.
-
Hi Joel,
In my opinion CSS is "The Best". Simple, easy usage, easy changes, very good speed of page load ... etc...
As I red on many forums on the internet JQuery and JS are are available for robots, so there are no contraindications to employ them.
But
CSS - better code/text ratio (no long scripts in page code)
CSS - simple usage and changes (CSS3, HTML5)
CSS - faster loading (only simple text and html)
In my opinion, now when we have HTML5 and CSS3 there is no better way - it's innovative and simple solution,
Marek
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
New Mobile Site Traffic Drop
With all the talk about how much mobile is important and how it is going to return its own search results, we finally decided to make a mobile site for one of our smaller websites to test the water. We put it up about two weeks ago and did Vary HTTP header method to serve the site. Before the change, on the average week we would get 270-300 mobile visitors from organic search results and we converted 0.78% to sales. Since the change, we are now getting about 70 mobile organic visitors per week but converting 2.47% So what can I say but WOW. We are converting way way better but our organic mobile search traffic has dropped off a ton. Luckily our desktop and tablet traffic(we serve the desktop version of the site to tablets) has stayed the same and has not dipped. Do any of you guys have experience or gone through launching a mobile site before? Did you see the immediate drop in organic mobile traffic and did you recover your traffic back to previous levels? If so, do you know how long it takes to recover? I am thinking it is a big change and will take time for Google to adjust but I am not sure since the mobile version has so much less text now on the home page and on category or product list pages or whatever you guys want to call them.
Web Design | | KurtL0 -
Mobile SEO vs. Usability - SinglePlatform
I have a restaurant client that we're setting up with SinglePlatform.com to distribute their menu and make sure all of the restaurant sites have updated information for their business. As part of SinglePlatform's service, they offer a mobile site. Normally we would just create a mobile site and make sure that it's optimized but this client isn't ready to invest in a customized mobile site yet. The mobile site we can get with SinglePlatform is very simple. Call, Menu, Address, View Full Website, Photos, General Info. I know this would make it much easier for mobile users to find information and contact them but it's not mobile best practices. Whatever main page they land on would redirect them to the home page of the mobile site (i.e. not a 1 to 1). We also won't have any Google Analytics information for this site. The question comes down to usability or SEO? I'm leaning toward the mobile site for now and sell them on a customized solution later. I guess I'm just looking for some verification or any insight. ZRVbARv
Web Design | | JaredDetroit0 -
Responsive Vs Mobile Sites
I know this is some cutting edge technology, but I think that this will be a very important topic in the coming months, as html5/css3 becomses more and more the standard, or at least standardized, I think the topic of this in relation to SEO will also arise much more. My question is simple, is it better to code a responsive site, or a completely mobile site for a small company with no special needs (mobile ordering, ecommerce, etc...) I obviously know the visuall differences, and, personally, I think respomsive websites look better. From an seo perspective, my big thing is for the resizing, for example, with WordPress, when you reach the tablet size you can set the sidebar to basically display:none, can that impact your website? I would really appreciate any feedback
Web Design | | ZacharyRussell0 -
Landing pages vs internal pages.
Hey everyone I have run into a problem and would greatly appreciate anyone that could weigh in on it. I have a web client that went to an outside vendor for marketing. The client asked me to help them target some keywords and since I am new to the SEO world I have proceeded by researching the best keywords for the client. I found 6 that see excellent monthly searches. I then registered the .com and or .net domain names that match these words. I then started building landing pages that make reference to the keyword and then have links to his site to get more info. My customer sent the first of these sites to the marketer and he says I am doing things all wrong. He says rather then having landing pages like this I should just point the domain names at internal pages to the website. He also says that I should not have different looks for the landing pages from the main site and that I should have the full site menu on each landing page. I wanted to here what everyone here has to say about the pros and cons of the way to do this cause the guy giving the advice to me has a lower ranking site then I do and I have only started working on getting my site ranked this year. He has atleast according to him been doing this forever. Thanks, Ron
Web Design | | bsofttech0 -
Drastic rankings drop
SOS SEOMozzers hello all. I woke up this morning to find out our rankings for two main keywords: 1. internet marketing firm
Web Design | | vijayvasu
2. marketing firm dropped from being #8 on google to not being invthe top 50. last week we upgraded the site to HTML5 . We checked the on page via pro tools and everthing seemed fine. We checked Google analytics ( traffic was beginning to fall) and we checked webmaster tools - ( there were not critical issues etc) So now i am bewildered as to what possible happened to wipe us of the search. Please can you help - the site is www.gunshotdigital.com0 -
Do drop caps impact the search value of your content?
A client of mine wants to include drop caps at the start of the first paragraph on the page because they think it looks nice. I found some css techniques for implementing this using a span on the first character to enlarge the size of just that character. First word of the first paragraph. Are there any seo concerns I should have for adding drop caps?
Web Design | | fivelinesmedia0 -
How does the "first link" rule work with the "reasonable surfer patent" when it comes to the main navigation for a website?
In trying to figure out navigation for a new website, I am struggling with the first link rule vs. the reasonable surfer patent where the first link rule implies that Google "counts" the first link to a page including navigation, and the reasonable surfer patent that implies that navigation links carry less weight than body copy links. What is the best solution for creating main navigation so that it doesn't take away from the body copy links?
Web Design | | cindyt-170380 -
The primary search keywords for our news release network have dropped like a rock in Google... we are not sure why.
Hi, On April 11th, a month after the farmer update was released for U.S. users of Google, the primary keywords for ALL our sites significantly dropped in Google. I have some ideas why, but I wanted to get some second opinions also. First off, I did some research if Google did anything on the 11th of April... they did. They implemented the farmer update internationally, but that does not explain why our ranks did not drop in March for U.S. Google users... unless they rolled out their update based on what site the domain is registered in... in our case, Canada. The primary news release site is www.hotelnewsresource.com, but we have many running on the same server. EG. www.restaurantnewsresource.com, www.travelindustrywire.com and many more. We were number 1 or had top ranks for terms like ¨Hotel News¨, ¨Hotel Industry¨, ¨Hotel Financing¨, ¨Hotel Jobs¨, ¨Hotels for Sale¨, etc... and now, for most of these we have dropped in a big way. It seems that Google has issued a penalty for every internal page we link to. Couple obvious issues with the current template we use... too many links, and we intend to change that asap, but it has never been a problem before. The domain hotelnewsresource.com is 10 years old and still holds a page rank of 6. Secondly, the way our news system works, it´s possible to access an article from any domain in the network. E.G. I can read an article that was assigned to www.hotelnewsresource.com on www.restaurantnewsresource.com... we don´t post links to the irrelevant domain, but it does sometimes get indexed. So, we are going to implement the Google source meta tag option. The bottom line is that I think we put too much faith in the maturity of the domain... thinking that may protect us... not the case and it´s now a big mess. Any insight you can offer would be greatly appreciated. Do you think it was farmer or possibly something else? Thanks, Jarrett
Web Design | | jarrett.mackay0