Negative Margins - Image Navigation
-
I created a good navigation but can't replicate it with html or css so I might have to stick to images. What would you recommend as a best practice for images in navigation? This site doesn't need to rank really high, it's mostly for a portfolio.
-
Well, if you don't want it to rank, I would at least follow accessiblilty best practices. And those would be:
- Make the images very clear to read
- Provide "Alt Attribute" text for each button that clearly says what each button is for
- Provide "Title" tags that identify the menu button (this is for screen readers that speak the content of a site to blind internet users).
- Make sure that you "map" the area of the button so that when a person hovers over the entire button, they get the little hand that indicates there is a link there.
Having an image menu is definitely not my first choice. I'd really look at the possibility of using Google Fonts, and something like the CSS gradient generator to get dynamic fonts and gradients if that is what you are trying to do before using images.
But, it's not the end of the world, I have done them in the past (years ago). You just want to make sure that it is very clear and readily readable for people that visit the site.
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
-
How to create this image effect for my home page
How do I make a wide, somewhat fast loading image effect like this home page has: 3dcart.com work on my website bobweikel.com I'm asking for how to create the effect (with small enough image kb to load) and what the image should be of in your opinion. Thanks!
Web Design | | BobGW0 -
Does stock art photo attribution negatively impact SEO by leaking Google Page Rank?
Greetings: Companies such as Shutterstock often require that buyers place credit attribution on their web pages when photos you buy from them appear on these pages.. Shutterstock requests that credit attribution links such as these be added: Songquan Deng / Shutterstock.com Do these links negatively impact SEO? Or do search engines view them as a positive? Thanks,
Web Design | | Kingalan1
Alan0 -
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?
Trying to decide on whether placing a link to the blog in our top level navigation would have a better SEO value than just placing it in top or footer navigation. I have an ecommerce site.
Web Design | | RPD0 -
Tips for Panda-Proofing an Image Gallery
I'm currently working on a website that has a video, image and media gallery with over 9,000 items. The gallery can be found here:
Web Design | | Peter264
http://flyawaysimulation.com/images/16/microsoft-flight-simulator-x/ Every image has a page of its own. Therefore, essentially 9,000 pages of very thin content, especially the image pages with no UGC comments. Does anyone here have any tips to "panda-proof" these pages? The images still need to be indexed. What can we do here? The site also hosts videos, which of course the page the video resides on needs to stay in the index too (like youtube). Example of the video page here: http://flyawaysimulation.com/images/media/9371/fsps-3d-real-cockpit-effect-for-fsx/ Really want to hear your thoughts. Thanks in advance!0 -
Live Text in Navigation Vs. Image - Does this affect SEO
I recently was asked the question if having live text in the navigation vs and image affect seo. For example, refer to this link http://markup.io/v/avsaenq856kw the navigation highlighted is seperate images. The html elements read : ![](</span><strong style=)/images/procedures.png"> Live text html reads like this: Breast » What is better for seo value, or does it now matter having live text or an image?
Web Design | | Red_Spot_Interactive0 -
Can including advertising slots have a negative effect on SEO?
Can including advertising slots at the top and side of pages have a negative effect on SEO? Can Google detect these advertising slots? Can they work our advertising pixels to page content pixels ratio? Any ideas, suggestions, comments and opinions are greatly appreciated!
Web Design | | Peter2640 -
Keyword rich footer links negative effect
Based on bits and pieces of information I've read on SEOmoz, am I correct to state that:
Web Design | | Partouter
"Keyword-rich footer links effect pages negatively in terms of the keyword referenced in the anchor text?" This means footer links in Thanks in advance fellow Mozzers!0 -
How WP Themes work with Navigation Structure for SEO and JQuery Headers?
I am trying to find the best WP Theme for our company. I noticed most of them do not offer a left hand side navigation on the home pages, and usually are on the right side on the inside pages. I always thought that Home Page links were very important for SEO. Currenly we have a left drop down navigation with all of our product catagories, keyword optimized. The structure follows for all the pages. Is this not as important to Search Engines anymore? Is it better to have a products link, to all the products and then the inside pages, have just a navigation bar, for that particular catagory? This seems to be very common on all the templates i am seeing. I also noticed, and really like the JQueary Tabs. I would use this for displaying, PDFs and Specifications Charts. Also, some home page images are using a jquery slider with some text, linking to a page. Is Jquery the new javascript and do search engines see what is in the code? I also noticed they all have footers that have links and some other information. Is this a SEO must have?
Web Design | | hfranz0