Best Practices for web layout dimensions
-
Hello Moz community,
I have my own ideas...but what are your opinions on best practices for landing page width size in pixels
900px
720px
What is a common pixel height for "above the fold"...my target is North America
-
Ryan, thx for the considered response
-
For width we go right to the edge so to speak, so 960px works great for us. Our best has been 960px wide by 480 to 550 px high.480 to 550 wide depends on how many tool bars are installed. As a landing page we will usually go with 480px.
-
I really like 960px for websites. It stays under 1024px and is very versatile for offering pages of varying even columns. A 960px frame is evenly divisible by 2,3,4,5,6,8,10,12 so you have a great deal of flexibility for columns throughout the page.
Occasionally you have a graphic which you wish to intentionally push past your natural border and 960px also offers a bit of room on each site for such expansion. I spent some time earlier this year researching this topic and in my opinion 960 is the magic number.
-
I'm not sure where this overlay originally came from, but - http://tctechcrunch.files.wordpress.com/2009/12/tcbrowsersize.png - shows user browser sizes.
However your best bet is to investigate responsive websites.
Perhaps try reading - http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/ - http://www.alistapart.com/articles/responsive-web-design/ - and maybe - http://thatcoolguy.github.com/gridless-boilerplate/
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
-
What’s the best tool to visualize internal link structure and relationships between pages on a single site?
I‘d like to review the internal linking structure on my site. Is there a tool that can visualize the relationships between all of the pages within my site?
Web Design | | QBSEO0 -
My news site not showing in "In the news" list on Google Web Search
I got a news website (www.tapscape.com) which is 6 years old and has been on Google News since 2012. However, whenever I publish a news article, it never shows up "In the news" list on Google Web Search. I have already added the schema.org/NewsArticle on the website and have checked it if it's working or not on Google structured data testing tool. I see everything shows on on the structured data testing tool. The site already has a news sitemap (http://www.tapscape.com/news-sitemap.xml) and has been added to Google webmaster tools. News articles show perfectly fine in the News tab, but why isn't the articles being shown on "In the news" list on the Google web search? My site has a strong backlink background already, so I don't think I need to work on the backlinks. Please let me know what I'm doing wrong, and how can I get it to the news articles on "In the news" list. Below is a screenshot that I have attached to this question to help you understand what I mean to say. 1qoArRs
Web Design | | hakhan2010 -
Best CMS for e-commerce
Our website is powered through Magento CMS although I am losing my patience with it. We are completely restricted as to what we can do. The development costs are high and ongoing. We are a fast moving company but we feel that Magento is not the right solution for the companies future. We can not style pages to drive conversions without putting styling requests to our developers which takes months to complete and the end results are not always as we would prefer, we would prefer to style the pages ourselves using blocks etc. Any suggestions would be much appreciated.
Web Design | | Jseddon920 -
Best Way to Re-Direct traffic from existing site to new site?
Good Morning, I have an existing site (http://goo.gl/QKkpi) running on a slow server. We decided to create a new site (http://goo.gl/XUH3f) with the intention of de-commissioning the first one. Both sites are on the same WMT account. What is the best way to permanently redirect any backlinks/traffic (all levels, from home page to product pages) from the old site to the new site (prior to shutting down the first one). Thanks a lot!
Web Design | | Prime850 -
Best hosting solution for linkbait videos
I'm creating a series of link bait videos. I want people to link to the pages on my site hosting the videos. What's the best site to host them on, if my primary concern is to get do-followed links? I'm worried about putting them on YouTube, as I imagine most of the links will be to the page on youtube.com, or worse, just directly embedded.
Web Design | | menachemp0 -
Best E-commerce Solution - SEO Friendly
I need to know thoughts on the best ecommerce solution for our company. We currently have one website with our products, that people call and they purchase over the phone. In the future we are considering adding a different product line, to which we want to be a fully functional online ecommerce site. We eventually are considering having only a portion of our products on our current site to have the ability to purchase online. The reasoning is because we sell very high quality products that range from $1000 - $200,000. We would like to have a consumer section and an industrial sectioin. The consumer section would consist of products from $1000 - $10,000 or so. Then the industrial products you would need to call to purchase. So would it make sense to have a main website that is our corporate site with links to different websites? Or to keep this all in one website and have different directories like so: corporatecompany.com - links to product-line.com corporatecompany.com - links to product-line-two.com or corporatecompany.com/consumer-grade/ corporatecompany.com/industrial-grade/ corporatecompany.com/the-ecommerce-only-section/ Can a shopping cart be used to turn on half of the products for purchasing online, and the other half to be call in only ? What is the best e-commerce solution that is SEO friendly and also can just play a role of a regular website?
Web Design | | hfranz0 -
What's the best was to structure Product page information on my site?
Hi - I run a hobby related niche new / article / resource site (http://tinyurl.com/4eavaj4). One of the most critical components of the site is our product database. We don't actually sell anything directly - instead we monetize them by displaying relevant affiliate product feeds and price comparisons. However since the Panda update was implemented in February my traffic (particularly my long tail, product related traffic) has dropped off considerably. I had about a 20% drop in overall traffic, but have made up some of the ground in the past week. However I want to know once and for all how I should structure my product related information as I have a ton of great content that is ready to be published in this section but want to be sure I structure it the best possible way from a SEO standpoint. Here are a few different options I've come up with for displaying information about products on my site. For the purpose of these examples I am going to refer to all of the information that makes up my product pages collectively as "product profiles". Please let me know which is the best SEO wise (or if you have a better way of doing it let me know): - Option 1 - Current Method - Divide Content Sections into different pages / urls Example: http://tinyurl.com/4tpdlbl This is how the majority of my product profiles are currently structured. I did this to improve load times and to keep the total number of links per page down. In addition to the core product profile subpages: "Product Details","Compare Prices", **"**Product Review", "Hot Auctions", and "Checklists", I have the Checklists area further segmented by subset, each of which is on its own page that is only accessible through the main Checklists tab of the profile. - Option 2 - Everything on one url / page the old fashioned way, with everything available by scrolling vertically. This would make the page go on forever though. - Option 3 - Everything on one url / page, but visually segmented using css / javascript tabs. Example: http://tinyurl.com/4kqhauh I looked at the source code and all the page text is there, so it looks like it would be spider-able but you tell me. Or would another method of tabbing be better? My site is wordpress based so the functionality comes from a plugin. - Option 4 - Use post tabs that are technically all on the same page, but make each individual tab be accessible through its own suburl, all of which share the same core canonical url. Example: http://tinyurl.com/4bs9pjs Clicking on any of the individual tabs will result in something like ?postTabs=2 being appended to the core url. Example: http://tinyurl.com/4gvgufc Any input would be greatly appreciated asap! Thanks Mike
Web Design | | MikeATL0