Step 1

1) You have to add a form to the frontend phtml file

app/design/frontend/ [package]/[themes]/ template/your_path_template.phtml

<form action="your_controller_action" method="post" enctype="multipart/form-data">
    <ul class="form-list">
        <li>
            <label for="filename"><?php echo $this->__('Browse') ?></label>
            <div class="input-box">
                <input id="filename" name="filename" type="file"/>
            </div>
        </li>
    </ul>
    <button type="submit" class="button" title="<?php echo $this->__('Submit'); ?>"><?php echo $this->__('Submit'); ?></button>
</form>

 

Step 2

2)Then type in your controller the following:

app/code/local/ [Namespace]/[Modulename]/ controllers/IndexController.php 

<?php class Namespace_Modulename_IndexController extends Mage_Core_Controller_Front_Action {
    protected $_logFile = 'your_file_upload.log';
    public function saveUploadFileAction() {
        if ($data = $this->getRequest()->getParams()) {
            $type = 'filename';
            if (isset($_FILES[$type]['name']) && $_FILES[$type]['name'] != '') {
                try {
                    $uploader = new Varien_File_Uploader($type);
                    $uploader
                        ->setAllowedExtensions(array('jpg', 'jpeg', 'gif', 'png'));
                    $uploader->setAllowRenameFiles(true);
                    $uploader->setFilesDispersion(true);
                    $path = Mage::getBaseDir('media') . DS . 'your_path';
                    if (!is_dir($path)) {
                        mkdir($path, 0777, true);
                    }
                    $uploader->save($path, $_FILES[$type]['name']);
                    $filename = $uploader->getUploadedFileName();
                    $this->_saveCustomerFileData($filename);
                } catch (Exception $e) {
                    Mage::log($e->getMessage(), null, $this->_logFile);
                }
            }
        }
        $this->_redirect('*/*/');
    }
    protected function _saveCustomerFileData($filename)
    {
        try {
            $customer_id = Mage::getSingleton('customer/session')
                ->getCustomer()->getId();
            //your model for saving filename of upload file
            $model = Mage::getModel('attacher/avatar');
            $model
                ->addData(array(
                    'customer_id' => $customer_id,
                    'filename' => $filename
                ))
                ->save();
        } catch (Exception $e) {
            Mage::log($e->getMessage(), null, $this->_logFile);
        }
    }
}

You can also save your file using your observer. Or you can use library uploadify (http://www.uploadify.com/). 
You can see an example code on frontend below:

<div class="attacher_button_div">
    <label><?php echo $this->__('Upload your avatar: ') ?></label>
    <div id="attacher_button">
        <input id="file_attacher_avatar" type="file" name="file_attacher_avatar"/>
    </div>
</div>
<script type="text/javascript">
    // <![CDATA[
    jQuery(document).ready(function () {
        jQuery('#file_attacher_avatar').uploadify({
            'uploader': '<?php echo $this->getSkinUrl('your_path/uploadify/uploadify.swf') ?>',
            'cancelImg': '<?php echo $this->getSkinUrl('your_path/uploadify/cancel.png') ?>',
            'script': '<?php echo $this->getUrl('your_controller') ?>',
            'auto': true,
            'buttonText': 'Browse',
            'simUploadLimit': 1,
            'sizeLimit': '100KB',
            'multi': true,
            'fileDataName': 'avatar',
            'fileExt': '*.gif; *.jpg; *.png',
            'fileDesc': 'Image Files',
            'onComplete': function (event, ID, fileObj, response, data) {
                jQuery('.fileName').html('File Uploaded: ' + fileObj.name);
            }
        });
    });
    // ]]>
</script>

Hope my article "How to use Varien_File_Uploader to upload files from the Frontend." was helpful. Cheers!