We just added a separate page for our Blog Posts using this guideline found here :
Most important step is to create two pages, one called ‘Home’ as entry for your static Homepage and one called ‘Blog’ for listing all your blog posts.
Then set the two pages under > Settings > Readings in your Dashboard:
- Enable Frontpage displays ‘A static page (select below)’
- Set Front Page to ‘Home’
- Set Posts Page to ‘Blog’
There are several tools, you may find, to test if your page is mobile friendly but I think it’s also very important to get a good ranking at Google and maybe not yet but for sure in the future mobile friendliness will also be a big criteria ….
So I recommend using Google’s mobile friendliness test:
More and more people are surfing the internet by mobile phones, pads, … and of course this devices have different (smaller) screen sizes.
There are some general basics you have to follow to render your site(s) well on this new devices, all of this techniques is often called “Responsive Web Design”.
Let’s start with “Configure the Viewport”:
A viewport setting controls how a page is displayed on a mobile device. Without a viewport specified, mobile devices will render the page at a typical desktop screen width and scale them to fit the real screen width. The setting of “width=device-width” avoids this, the real width is used.
Some browsers will keep the page’s width constant when rotating to landscape mode, and zoom rather than reflow to fill the screen. Adding the attribute “initial-scale=1″ instructs browsers to establish a 1:1 relationship between CSS pixels and device independent pixels regardless of device orientation, and allows the page to take advantage of the full landscape width.
Resolution: Pages optimized to display well on mobile devices should include a meta viewport in the head of the document specifying “width=device-width” and “initial-scale=1”:
<meta name=viewport content=”width=device-width, initial-scale=1″>