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:
work on my website
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!
-
Hi Bob,
This effect is done using a background image.
The image being used is this one:
http://www.3dcart.com/images/5/main-panorama3.jpg
It has a width of 2500 and height of 444. This ensures that it takes up the whole screen on devices less than 2500px wide (which is most of them). The image has feathering on the left and right - which allows it to fade to the same as the black background on devices largest than 2500px.
The site specifies the image, width and background colour in their CSS file:
.panel0 {
height: 444px;
background: #18100d url(../images/5/main-panorama3.jpg) no-repeat center top;
}and to display the background image - they use HTML similar to this:
[SOME STUFF]
I hope that helps.
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
-
Reason for robots.txt file blocking products on category pages?
Hi I have a website with thosands of products. On the category pages, all the products are linked to with the code “?cgid” in the URL. But “?cgid” is also blocked in the robots.txt file for some reason. So I'm thinking it's stopping all my products getting crawled by Google. Am I right here? Is there any reason why a website would want to limit so many URL's? I'm only here a week and the sites getting great traffic, so don't want to go breaking it!!! Thanks
Web Design | | Frankie-BTDublin0 -
Internally linked pages from different subdomain must be well optimised?
Hi all, We have guide/help pages from different subdomain (help.website.com). And we have linked these from 3rd hierarchy level pages of our website (website.com/folder1/topic2). But help.website sumdomain & pages are not well optimised. So, I am not sure linking these subdomain pages from our website pages hurts our rankings? Thanks,
Web Design | | vtmoz0 -
Internal linking: Repeating same low level pages from high hierarchy level pages
Hi all, We have 3 editions of our product we are trying to rank better. Some of our features level pages from these editions are repeating in these 3 editions. Exactly like below example: clothes.com/cotton-fabrics/shirts clothes.com/wool-fabrics/shirts clothes.com/polyester-fabrics/shirts "Shirts" pages repeat in "cotton-fabrics", "wool-fabrics" and "polyester-fabrics". We have added rel=canonical to rank "shirts" in rank only one category. I wonder do we need to take any other measures to make sure that these pages don't affect us negatively. Thanks
Web Design | | vtmoz0 -
How do we get search engine bots to the item detail pages?
The problem we have is that we have lots of inventory pages. These inventory pages have a bunch of links at the top linking to different styles of the item, up to 56 links in some cases. Then each item listed has a link to the item's detail page and a link to the item's shop owner's page. So if a page has 50 items shown, there are really 100 links just for the inventory. This is not taking into account the header links, footer links, sidebar links to other sections on the site. We have all these links to help consumers move through the site. The problem is that every item detail page on the site is not getting indexed and actually I think it's more like over 50% of the item detail pages are not indexed because the search engines are too busy following all these other links. Should we nofollow, index the links to the different styles of the item, the shop owner page? Or what should we do to get the search engine bots to index our item detail pages?
Web Design | | CFSSEO0 -
Site structure- category pages
Hi, I'm relatively new to SEO but have tried to apply all best practices to my site. However, I've hit a stumbling block when it comes to whether or not to index my category pages. http://istudyenglishonline.com/category/expressions-idioms/ General info: the site has been created with Wordpress and has a directory of English idioms. Each idiom is associated with one or more categories that it falls under (emotions, sports, food etc). Each category has its own page where the list of idioms will be. As each idiom often has more than one associated category, the same idiom will appear in different category pages, thus creating duplicate content. However, I have given each category page its own unique description. The issue is, when there are numerous idioms, the category page will have more than 1 page. I don't have the ability to create a unique description for each subsequent page of the main category. I know that the very model for some vertical search engines (such as indeed.com) is to create such landing pages and that the more "categories" that they have assigned to their job ads, in this case, the more pages created and the more pages indexed in Google. This seems to work very well for them. My question is, am I doing things right? Should I be doing anything to the subsequent category pages to avoid duplicate content? My plan was to have so many idioms associated with so many categories that I have a fair number of landing pages indexed in google, thus attacking the long tail keywords. However, I'm not sure if I am going the right way. Any advice would be much appreciated!
Web Design | | villarroel0 -
301 Redirect ! Joomla Pages, Already ranking. ( just wanted to change the url
hey guys hope everyone had a new year. I am ranking for a page on my site that i want to ( not specifically move ), but just change the url name: It is too long i think and i want to move it from one portion of my architecture to another menu. I have never physically done a 301 redirect myself, always had someone do it for me. I wanted some pointers. Since it is a fairly new site 4 months old! What are my options. Do i need to 301 redirect the page, if i am changing the Structure and AI of my site, or can i just change the url as is and it will still get ranked? How do i keep that url put delete the page and redirect it ? Sorry its very simple but i wanted to get the communities help to continue on ! Best Wishes HAmpig
Web Design | | BizDetox0 -
Indexing Dynamic Pages
Hi, I am having an issues among others, regarding indexing dynamic pages. Our website, www.me-by-melia, was just put live and I am concerned the bottom naviagtion pages (http://www.me-by-melia.com/#store, http://www.me-by-melia.com/#facebook, etc) will not be indexed and create duplicate pages. Also, when you open these pages in a new tab, it takes you to homepage. The website was created in HTML5. Please advise.
Web Design | | Melia0 -
Effect of Off-Site Images
I'm getting to start work with a new client, and I've run across something I've never had to deal with before, off-site images. The site I'll be working on is for an appliance retailer, both online and physical. The way they've had their site built (not something I was part of) a third party company maintains the product inventory side of things. They're sourcing from about 35 different manufacturers, and this third party has direct access to the product information streams. They push the weekly updated information to my clients site. What this means, though, is that the product images don't live on the client's site. They're hotlinked from the third party's inventory doohickey. I've never seen something quite like this before. Has anyone else? Any ideas as to what problems I may face when it comes to on-site SEO?
Web Design | | MRCSearch0