The Moz Q&A Forum

    • Forum
    • Questions
    • My Q&A
    • Users
    • Ask the Community

    Welcome to the Q&A Forum

    Browse the forum for helpful insights and fresh discussions about all things SEO.

    1. SEO and Digital Marketing Q&A Forum
    2. Categories
    3. Web Design
    4. CSS vs Javascript vs JQuery drop down navigation

    CSS vs Javascript vs JQuery drop down navigation

    Web Design
    7 5 4.5k
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as question
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • bronxpad
      bronxpad last edited by

      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.

      1 Reply Last reply Reply Quote 0
      • mad2k
        mad2k last edited by

        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

        1 Reply Last reply Reply Quote 1
        • dawnieando
          dawnieando last edited by

          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.

          1 Reply Last reply Reply Quote 1
          • Zachary_Russell
            Zachary_Russell last edited by

            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.

            1 Reply Last reply Reply Quote 1
            • bronxpad
              bronxpad last edited by

              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.

              dawnieando WilliamCarr 2 Replies Last reply Reply Quote 1
              • dawnieando
                dawnieando @bronxpad last edited by

                Thumbs up to you too Joel and good luck with your project.

                🙂

                1 Reply Last reply Reply Quote 0
                • WilliamCarr
                  WilliamCarr @bronxpad last edited by

                  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.

                  1 Reply Last reply Reply Quote 0
                  • 1 / 1
                  • First post
                    Last post
                  • CSS Truncate
                    0
                    1
                    139

                  • Login to see more (some text hidden by CSS height and jquery) will it ruin SEO?
                    thinkLukeSEO
                    thinkLukeSEO
                    0
                    8
                    103

                  • Wordpress: Pages vs Posts vs Portfolio
                    DeanAndrews
                    DeanAndrews
                    0
                    13
                    28.7k

                  • Does having a Blog link in the top level navigation provide any better SEO value, or would having it in a footer or top navigation work just as good?
                    toddmumford
                    toddmumford
                    0
                    2
                    164

                  • Rankings Dropped After Redesign
                    diyorgasms
                    diyorgasms
                    0
                    9
                    2.0k

                  • How WP Themes work with Navigation Structure for SEO and JQuery Headers?
                    Hurf
                    Hurf
                    0
                    7
                    1.6k

                  • Javascript Redirects
                    CoolSEOnStuff
                    CoolSEOnStuff
                    0
                    3
                    1.3k

                  Get started with Moz Pro!

                  Unlock the power of advanced SEO tools and data-driven insights.

                  Start my free trial
                  Products
                  • Moz Pro
                  • Moz Local
                  • Moz API
                  • Moz Data
                  • STAT
                  • Product Updates
                  Moz Solutions
                  • SMB Solutions
                  • Agency Solutions
                  • Enterprise Solutions
                  • Digital Marketers
                  Free SEO Tools
                  • Domain Authority Checker
                  • Link Explorer
                  • Keyword Explorer
                  • Competitive Research
                  • Brand Authority Checker
                  • Local Citation Checker
                  • MozBar Extension
                  • MozCast
                  Resources
                  • Blog
                  • SEO Learning Center
                  • Help Hub
                  • Beginner's Guide to SEO
                  • How-to Guides
                  • Moz Academy
                  • API Docs
                  About Moz
                  • About
                  • Team
                  • Careers
                  • Contact
                  Why Moz
                  • Case Studies
                  • Testimonials
                  Get Involved
                  • Become an Affiliate
                  • MozCon
                  • Webinars
                  • Practical Marketer Series
                  • MozPod
                  Connect with us

                  Contact the Help team

                  Join our newsletter
                  Moz logo
                  © 2021 - 2026 SEOMoz, Inc., a Ziff Davis company. All rights reserved. Moz is a registered trademark of SEOMoz, Inc.
                  • Accessibility
                  • Terms of Use
                  • Privacy