Using CSS in HTML Emails: The Real Story Should you be sending HTML emails at all? This is surely a debated issue, but ultimately I say if you have a message you feel would benefit from a nicely designed email you should go for it. If you just want to do it because everyone else on your block is doing it too, don't. Only send email to people that opted to receive them.Make sure to create it so that it looks the best it possibly can in all email clients.Don't overdo it. WRITE your email before you design it The first thing you should do is to write the plain-text version of your email. Couple quick tips for your plain-text email: Hard-wrap your lines at 60 characters and write out full URL's instead of using anchor tags. Design for the lowest common denominator first. After the plain text version of your email is done, then start thinking about design. What you CAN'T do: Include a <head> section with styles. There are quite a few more things you should be aware of. What you CAN do. In two words, inline styles. Help! Quick tips!
JavaScript Form Validations Made Easy! Using client side JavaScript is an efficient way to validate the user input in web forms. When there are many fields in the form, the JavaScript validation becomes too complex. The JavaScript class presented here makes the form validations many times easier. Contents How to add JavaScript Form Validation quickly First, download the JavaScript form validation script here. The script has a catalog of almost all the common validation types built-in. The idea is to create a set of “validation descriptors” associated with each element in a form. Each field in the form can have zero one or more validations. In other words, in order to validate a field, you just associate a set of validation descriptors for each input field in the form. Just Choose Validations! Simfatic Forms is a feature-rich web form maker. Using the form validation script Include gen_validatorv4.js in your html file just before closing the HEAD tag Now, add the validations required The format of the addValidation() function is:
47+ Excellent Ajax CSS Forms Forms needs a solid visual structure, a profound hierarchy of form elements (Fields and Labels), powerful techniques and Functionality (AJAX) to make the form look and work creatively. There is a great bunch of creative, outstanding and individually designed from scratch forms. Thanks to AJAX, we can provide real-time feedback to our users using server-side validation scripts and eliminate the need for redundant validation functions and processing data. Let’s take a look, hopefully you’ll find new ideas you can develop further on your own. You might be interested to check some of the designs that was mentioned in the posts below: Styling Forms 1) Uni Form – an attempt to standardize form markup (xhtml) and css, "modularize" it, to get nice looking, well structured, highly customizable, semantic, accessible and usable forms. 2) CSS-Only, Table-less Forms – A great example of a well designed form using modern css techniques. Demo Styling Form Elements Demo : Form Usability and Accessibility Demo:
Sending Nice HTML Email with PHP This is going to be a continuation of the Website Change Request Form demo we've been using around here for a while. If you need to catch up, first I talked about it, then I built it, then I screencasted it, then I secured it. Throughout all of this, the end result has been a boring text-only email that gets sent to a single email address. We're going to improve that output, and make the email into a nicer looking HTML-formatted email. It's Not Much Different Than Text Email Sending HTML Email through PHP uses the exact same mail function as text email: mail($to, $subject, $message, $headers); The last parameter, the headers, are optional for the function but required for sending HTML email, as this is where we are able to pass along the Content-Type declaration telling email clients to parse the email as HTML. In fact, the headers area gives us the opportunity to do lots of important email functions. Now We Can Use HTML Tags $message = '<html><body>'; $message .= '<h1>Hello, World! Concerns
Form field hints with CSS and JavaScript (Ask the CSS Guy) My co-workers pointed out a nice effect on the Vox registration form. As you tab through each input field, some helper text appears in box out to the right. Try it out. Update (4/20/2007): It has been pointed out that Vox has changed their form, and it no longer uses this effect. Vox Registration Form It’s a basic example of how helpful a little JavaScript and CSS can be in a form. View demo; Download zip The HTML We’ll start with a simple form. <dl><dt><label for="firstname">First Name:</label></dt><dd><input name="firstname" id="firstname" type="text" /></dd> ... more <dt>'s and <dd>'s ... Immediately after each input field, add a span with a class of hint and create a hint for each input, like so: <dl><dt><label for="firstname">First Name:</label></dt><dd><input name="firstname" id="firstname" type="text" /><span class="hint">Use your real name! View what we have so far – an unstyled form. Some CSS Let’s give this form some style. It’s coming along. See how it looks. The JavaScript
10 useful techniques to improve your user interface designs Advertisement Web design consists, for the most part, of interface design. There are many techniques involved in crafting beautiful and functional interfaces. Here’s my collection of 10 that I think you’ll find useful in your work. They’re not related to any particular theme, but are rather a collection of techniques I use in my own projects. 1. Links (or anchors) are inline elements by default, which means that their clickable area spans only the height and width of the text. Obviously, the larger the clickable area is, the easier it is to click on the link because there is less of a chance of missing it. Make sure to also add a healthy dose of padding to the links, because converting a link into a block only affects its behavior and width; adding padding ensures that the link is high enough and has some room to breathe. 2. Attention to every detail is what separates a great product from a mediocre one. This gives the whole button a more balanced look and feel. 3. 4. 5. 6. 7. 8. 9. 10.
php - Looking for a some good options to send users reset password emails Practical XML: Form Validation [XML, XSLT & Web Services] I like XML. I really do. Still, my eyes glaze over just as much as the next person’s when I hear about how wonderful it is. Wonderful it may be, but as a Web developer, how does XML help me? I use XHTML on my site, yet that doesn’t provide any advantages above and beyond those I’d gain using HTML. It’s time to be selfish. The Concept One area that always annoys me when I build Web pages is form validation. SitePoint has run a couple of articles (Read and Display Server-Side XML with JavaScript and XML and JavaScript in Mozilla) about loading an XML file with JavaScript, but none that have detailed a practical benefit of the technology. The idea is that, instead of having to include those messy variables in an external JavaScript file, we can create an XML vocabulary, uploading these special XML files to specify the constraints we place upon our forms. The Precepts When building an XML vocabulary, I like to keep a few rules in mind. SimpleEasily understandableConcise The XML The JavaScript
Sliding Labels v2 – Patch « CSSKarma Last week I wrote an article about sliding form labels that got quite a bit of attention. Many of the commenters brought up a couple good points/bug in the Sliding Label code that I wanted to address and provide a patch for: The sliding label was barfing out in Safari when auto-fill was activeThe default scripting didn’t work on textareas I sat down yesterday and wrote a patch/new version of sliding labels which I think addresses these two problems. View the Demo The new jQuery Textarea HTML The HTML for the textarea follows the same convention as the rest of the inputs, in only needing a wrapping element. <div id="comment-wrap" class="slider"><label for="comment">Comment</label><textarea cols="53" rows="10" id="comment"></textarea></div><! There are no major changes to the plugin, just a few tweaks.
PDO Fetch Class In this tutorial we will study about PDO Fetch Class method in PHP, how to access MySQL using PDO Fetch Class method , How to retrieve data etc. Examples will make this clearer. PDO Fetch Class: Using PDO::FETCH_CLASS we can map the fields of a table as properties (fields/variables) of a class. Example: <? class employee public function first_cap() return ucwords($this->emp_last_name); $host='localhost'; $user='root'; $pass=''; try{ $dbh=new PDO("mysql:host=$host;dbname=ajax",$user,$pass); echo "connected<br/>"; $sql="select * from emp_details"; $stmt=$dbh->query($sql); $obj=$stmt->fetchALL(PDO::FETCH_CLASS,'employee'); foreach($obj as $emp){ echo $emp->first_cap()." $dbh=null; catch(PDOException $e) echo $e->getMessage(); Output: connected Tendulkar Dravid Ganguly Related Tags for PDO Fetch Class:
Javascript form validation - doing it right Web Matters When using Javascript for form validation, there is a right way, a wrong way, a very wrong way, and a suicidally wrong way! Unfortunately many sites use one of the wrong ways, including even some which claim to be form-validation tutorials. This page tries to help people in the right direction. The suicidally wrong way is to have the validation in Javascript only, and not on the server. A malicious user can easily bypass it and – depending on what you are doing – may wreak havoc with your database. The essence is thus that Javascript validation is always optional. Having said that, there are actually two right ways, of which the better one is hardly ever used! Acceptable: validate the entered data when the submit button is pressed. Example Here is an example of how Javascript validation should work. It doesn't actually have any server script, so anything you type will be discarded on submission. <P> Javascript is not currently enabled on your browser. How it works Conclusion
Enhancing Forms using jQuery UI What is Framework ? Frameworks are increasingly becoming the de facto standard for web development as well as web design. Framework is a reusable set of libraries or classes used in developing complex software. Microsoft .NET framework, Java Springs framework and entity framework are some of the popular frameworks used in the industry. Creating an appealing UI takes a lot of time and it’s a not a easy task for web developers. This is where jQuery UI dives in. Tutorial Details → Getting started! What is jQuery UI? UI is an important factor while developing any web application or websites. jQuery UI is a powerful UI framework which supplies almost all standard widgets like tabs, accordions, sliders etc. In this tutorial we will be working with the form elements using jQuery UI. Getting started We will need jQuery UI, you can download it from here. jQuery UI provides a collection of powerful css classes that makes the foundations of all the UI elements. Pages: 1 2 3 4 5 6 7 8 9 10 11 12
Transactions and auto-commit Now that you're connected via PDO, you must understand how PDO manages transactions before you start issuing queries. If you've never encountered transactions before, they offer 4 major features: Atomicity, Consistency, Isolation and Durability (ACID). In layman's terms, any work carried out in a transaction, even if it is carried out in stages, is guaranteed to be applied to the database safely, and without interference from other connections, when it is committed. Transactional work can also be automatically undone at your request (provided you haven't already committed it), which makes error handling in your scripts easier. Transactions are typically implemented by "saving-up" your batch of changes to be applied all at once; this has the nice side effect of drastically improving the efficiency of those updates. In other words, transactions can make your scripts faster and potentially more robust (you still need to use them correctly to reap that benefit). Warning
Features | Icebrrg - Web forms made chillingly simple Icebrrg makes forms. What kind of forms? Just about any kind you can imagine. Having trouble imagining forms? Contact Forms Ok, this one’s pretty basic, but every website needs a contact form. Registration Forms Send people to the web to register for events or other activities. Surveys Ask your audience a question and let them respond online. Application Forms Let people apply online. Personal Inventories Why not organize your personal life with Icebrrg?