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
-
Why is google still crawling my old website pages?
Why is google still looking at my old indexed pages and not my new index. ? Why are they crawling my old website links when none of them are available? How do I overcome these problems?
Web Design | | optimalspaces0 -
Log-in page ranking but not homepage
Our homepage is outranked by log-in page for "primary keyword" in Google search results; for which actually our homepage was optimised. I have gone through the other answers for the same question here. But I couldn't find them related with our website. We are not over optimised. We have link from top navigation menu of blog to our homepage. Does this causing this?
Web Design | | vtmoz1 -
Joomla Core Pages Delisted
Hey Everyone, This query may be more for a Joomla developer or someone that has had a similar issue. I'm not really looking for answers like, "check Google Search Console" or anything like that. We have a client who recently had all of their core pages delisted in Google but the blog is still being displayed in search results. For example, if you search "company name" they have a blog post that ranks #13 or so organically. I tested Google Search Console and Google is saying that the site is temporarily unavailable. We haven't made any changes or updates to Joomla's core structure so I'm unsure as to where this change is coming from. Here are some items we've checked: 1. Site searches within Google, resulted in seeing core pages are not indexed but blog pages are 2. Google Search Console - looked for manual actions (none found), looked at sitemap errors (nothing mentioned), looked at robots.txt (no issues here), attempted to fetch the site as Google (temporarily unavailable). 3. Called the hosting company (Rackspace) to discuss potential issues. They were extremely helpful but we were unable to find anything. The blog is actually a Module that was added so I'm thinking something has changed to block Google bots from the core Joomla structure but it hasn't blocked them from the blog structure. Without putting the company name or url on blast, has anyone heard of or experienced anything like this? Any help or insights would be much appreciated!
Web Design | | Leadhub0 -
No-index part of page
Hi All, I want to copy articles from CNN/Bloomberg/etc and I want to show the content to my users in Lightbox (CSS), but the problem is duplicate content. Do you have any idea how can I no-index part of page/content?
Web Design | | JohnPalmer0 -
Can Image File Names be Masked?
If we "mask" file names for our website but they are left their original name on the server, will Google notice this? Client wants to mask them in order to name them with keywords but not change on the actual server.
Web Design | | Atlanta-SMO0 -
Do pages with low PA effect DA?
I was looking into raising my firm's Domain Authority and I had a thought. I was wondering if our very low PA pages are bringing the overall DA down? Our homepage is at 43 currently and the DA is 32. We have quite a few pages and I am trimming a little fat in the deep pages currently. I was wondering what would be the result in terms of DA I am also starting an aggressive initiative to blog more and try to attract links through guest posting and HARO (Hep A Reporter Out). I understand that many people will say DA is not a metric your should necessarily build around. But, while I am fighting for rankings in a very competitive vertical, I assume a higher DA is better, no? From everything I have read on Moz over the years, they say that the DA metric is the one that tries to encompass a multitude of factors, similar to the way something more complex like the Google algorithm does. So, I assumed finding small gains in DA could be beneficial to the site's rankings and traffic I tried to go into detail and get specific here because I know how many bad questions are asked daily. Thanks anyone and everyone for the help, I do thoroughly appreciate the Moz community
Web Design | | BossArrighi0 -
Wordpress Pages not indexing in Google
Hi, I've created a Wordpress site for my client. I've produced 4 content pages and 1 home page but in my sitemap it only says I have 1 page indexed. Also SEOmoz only finds 1 page. I'm lost on what the problem could be. The domain name is www.dobermandeen.co.uk Many thanks for any help. Alex
Web Design | | SeoSheikh0 -
Sudden dramatic drops in SERPs along with no snippet and no cached page?
We are a very stable, time tested domain (over 15 yrs old) with thousands of stable, time tested inbound links. We are a large catalog/e commerce business and our web team has over a decade's experience with coding, seo etc. We do not engage in link exchanges, buying links etc and adhere strictly to best white hat seo practices. Our SERPs have generally been very stable for years and years. We continually update content, leverage user generated content etc, and stay abreast of important algorithm and policy changes on Google's end. On Wednesday Jan 18th, we noticed dramatic, disturbing changes to our SERPs. Our formerly very stable positions for thousands of core keywords dropped. In addition, there is no snippet in the SERPs and no cached page for these results. Webmaster tools shows our sitemap most recently successfully downloaded by Google on Jan 14th. Over the weekend and monday the 16th, our cloud hosted site experienced some downtime here and there. I suspect that the sudden issues we are seeing are being caused by one of three possibilities: 1. Google came to crawl when the site was unavailable.
Web Design | | jamestown
However, there are no messages in the account or crawl issues otherwise noted to indicate this. 2. There is a malicious link spam or other attack on our site. 3. The last week of December 2011, we went live with Schema.org rich tagging on product level pages. The testing tool validates all but the breadcrumb, which it says is not supported by Schema. Could Google be hating our Schema.org microtagging and penalizing us? I sort of doubt bc category/subcategory pages that have no such tags are among those suffering. Whats odd is that ever since we went live with Schema.org, Google has started preferring very thin content pages like video pages and articles over our product pages. This never happened in the past. the site is: www.jamestowndistributors.com Any help or ideas are greatly, greatly appreciated. Thank You DMG0