How to add a user interface to Sales Force
Here's how you can customize your page user interface in two simple steps: 1. Add attributes to your page element to remove the header, sidebar, and default stylesheets attached to the page. 2. Add CSS and jQuery, if required, from static resources. This is an optional step, but very useful when working with large CSS and jQuery code.
Adding attributes:
<apex:page id="thePage" controller="yourController" action="{!yourAction}" docType="html-5.0" standardStylesheets="false" sidebar="false" showHeader="false">
Adding static resources:
<apex:includeScript value="{!$Resource.yourJS}" />
<apex:stylesheet value="{!$Resource.yourCSS}" />
source to share
You can develop a complete user interface in Visualforce Pages and Controllers. First, you can remove the standard components (tabs, headers and footers) from the page using options like this in the tag:
<apex:page sidebar="false" showHeader="false" standardStylesheets="false">
So, you will have a clear page where you can add your markup. You can also create template pages that will include common parts of the application interface. Learn more about Visualforce templates here . You can also use custom Salesforce components .
You can also use popular CSS and JS frameworks. This way, there will be more front-end development, and on the server side, you just create action methods in the page controllers for the user interface.
source to share