VF page is not transferring to standard record detail page

Question

I am trying to display contact list in the visualforce page and when user click on the contact or on the detail button VF page should transfer to the standard record detail page.

I am trying both ways using outputlink and button but either ways is not working. please help.

Visualforce

   <apex:page standardController="Contact" extensions="ContacSearch" showHeader="false" standardStylesheets="false" sidebar="false" applyHtmlTag="false" applyBodyTag="false" docType="html-5.0">  
<apex:form >
<apex:pageBlock >

           <div  style="margin-right:10%;" >
             <apex:pageblocksection >
                 <apex:pageblocksectionitem >
                    <apex:outputText style="font-weight:600" value="Search Contact"/>
                 </apex:pageblocksectionitem>
             </apex:pageblocksection><br></br>
           </div>   

                 <tr>               
                   <td>First Name </td>             
                   <td> <apex:inputText value="{!firstname}" /></td>
                 </tr><br></br>

                 <tr>                
                   <td>Last Name </td>            
                   <td><apex:inputText value="{!lastname}" /></td>
                 </tr>
               <br></br> <br></br>

             <div  style="margin-left:5%;" >
                <apex:commandButton value="Search"  action="{!searchContacts}" reRender="contact-table" />
             </div>
               <br></br>

            <div  style="margin-right:70%;" >
             <apex:pageblocksection >
                 <apex:pageblocksectionitem >
                    <apex:outputText style="font-weight:900" value="Contact Details"/>
                 </apex:pageblocksectionitem>
             </apex:pageblocksection>
           </div><br></br> 
                <apex:pageBlock >
                <apex:pageBlockTable style="width:50%" id="contact-table" value="{!contacts}" var="c">

                    <apex:column style="width:100px" >                                
                       <apex:facet name="header">First Name</apex:facet>     
                         {!c.FirstName} 
                    </apex:column>
                    <apex:column style="width:100px" >

                    <apex:outputLink value="{!URLFOR($Action.Contact.View, c.Id)}">
                    {!c.LastName}
                    </apex:outputLink>

                      </apex:column>
                  <apex:column style="width:100px" >
                  <apex:facet name="header">Detail</apex:facet>
                     <apex:commandButton value="Goto DetailPage" action="{!gotoContactDetailPage}" reRender="form">
                     <apex:param name="contactid" value="{!c.Id}" assignTo="{!contactId}"/>
                     </apex:commandButton>

                 </apex:column>  
                </apex:pageBlockTable>

          </apex:pageBlock>



</apex:pageBlock>
</apex:form>
</apex:page>

Controller

public with sharing class ContacSearch{

    public ContacSearch(ApexPages.StandardController controller) { 
    }

    public List<Contact> contacts { get; set; }
    public String firstname { get; set; }
    public String lastname { get; set; }
    public string contactId {get; set;}

    public ContacSearch()
    {
        contacts = new List<Contact>();
    }

    public PageReference searchContacts()
    {
        contacts = [select Id, FirstName, LastName from Contact 
                    where FirstName = :firstname
                    and LastName = :lastname];
        return null;
    }
    public PageReference gotoContactDetailPage()
    {
        return new PageReference('/' + contactId);
    }
}

Answer 1

1. <apex:outputLink/> to navigate to contact details

<apex:outputLink value="{!URLFOR($Action.Contact.View, c.Id)}">
        {!c.LastName}
 </apex:outputLink>

2. <apex:commandLink/> as button to navigate to Contact Detail page without the use of controller method:

<apex:commandLink action="{!URLFOR($Action.Contact.View, c.Id)}" 
value="Goto DetailPage" 
target="_blank" styleClass="btn" style="padding: 4px; text-decoration: none;"/>

3. Navigation with the use of <apex:commandButton/> through Controller method:

<apex:commandButton value="Goto DetailPage" action="{!gotoContactDetailPage}" reRender="form">
    <apex:param name="contactid" value="{!c.Id}" assignTo="{!contactId}"/>
</apex:commandButton>


public PageReference gotoContactDetailPage()
{
    return (new ApexPages.StandardController (new Contact(Id=contactId))).view();
}