I was working on share point 2013 publishing site. There was a requirement to create a Responsive Layout.
For this it is required to create a new Customize Master Page. I wanted to use bootstrap files to make them responsive.
A Master Page Associated with Styles, scripts, fonts, images remains same from page to page.
I am going to create a Master Page Using share point designer.
Step 1. Open a share point site using a Share point designer.
Step 2. On the Left Nav Click on Master Pages Link.

Step 3. Create a new Folder like bootstrapMaster .
Step4. Inside this folder create a folder for Style sheet, JavaScript, images, fonts & put the Specified files on their folders.
Step 5. Paste a New .html page in to this folder. (Example – M4.html)
Step 6. Open the Share Point Site - > Go to the Site Setting.
Step 7. Under the Look & Feel Tab Click on Design Manager.
Step 8. On Left Nav Click on Edit Master Page.
Step 9. Click on Convert an html file to a SharePoint master page.

Step 10. Brouse the Specified html page & Convert it to an Share point Master Page.
Step 11 . Open Share Point Designer & you will see your Newly Created Master Page under the Master Page Tab.
Step 12. Here there are two Extensions of the Master Page, .master & .html. to change or Edit Master Page right click on the .html page & Click on Edit in Advanced Mode.

Add all the required reference like style sheet, JavaScript files into the Master Page.
To preview the Master Page Double click on the .html file & Click on Preview in Browser.

You can add Snippet Gallery in to your Custom Master Page. & preview if required.
To add a new Snippet Click on Preview in Browser & Click on Snippet Tab on Top Nav.
Create a Required Snippet from the given options, Copy & Paste it in to the Master Page.
