50 Time-Saving Web Design – Developer Tools. In our field it is important to know how to do specific tasks and use creativity to achieve our goals, however it is necessary to have the right tools in order to get our aims in a more efficient way.
Here you have several tools for different steps on our daily work, from scratch to production: Mock Up Tools MockFlow MockFlow is an application based on Flash which allow you to create a wireframe with simple elements to develop a prototype so you can show your concepts to colleagues and clients. The points in favor to this service are a fast wireframing tool and its collaborative purpose. FrameBox FrameBox is a drag and drop application which aloud you making fast wireframes using ui elements, resize them and even you can set layout width for making low quality prototypes for responsive web design.
Icons Iconizer This site has a collection of icons, you type on the search bar and then it retrieves you the result. Iconmonstr This is the right place for someone who is looking minimalistic icons. Code School - Try Git.
Rich interactive wireframes to define web and mobile applications. Bcosca/fatfree. Dsfc - Denis Szalkowski Formateur Consultant - Conseil et formation informatique. 5 More HTML5 APIs You Didn’t Know Existed. The HTML5 revolution has provided us some awesome JavaScript and HTML APIs.
Some are APIs we knew we've needed for years, others are cutting edge mobile and desktop helpers. Regardless of API strength or purpose, anything to help us better do our job is a step in the right direction. I recently shared with you 5 HTML5 APIs You Didn’t Know Existed in the hope that some of them would inspire you to improve your own web apps. I'd like to share with you 5 more lessor known HTML5 APIs -- hopefully you find some of them useful! Fullscreen API The awesome Fullscreen API allows developers to programmatically launch the browser into fullscreen mode, pending user approval: Any element can be pushed to fullscreen, and there's even a CSS pseudo-class to allow some control over the screen while in fullscreen mode.
Page Visibility API var hidden, state, visibilityChange; if (typeof document.hidden ! Cours d'Algorithmique - Christophe Darmangeat. PARTIE 9 Corrigés des Exercices Exercice 9.1.
Can I use... Support tables for HTML5, CSS3, etc. WebPlatform.org — Your Web, documented.
HTML. Banner. Floating a banner or content definitely increases the visibility of them.
But have some limitations (which we’ll remove). In general, floating banners are used when there is no other content at their column as they are always at the "float" (position:fixed) state. This is a better & smarter solution that will float the banners when needed, re-position them and can be used in any type of banner – content combinations. And, best of all, you don’t need to set any fixed heights in the code. We’ll be using jQuery but these simple functions can easily be ported to other JavaScript frameworks. Before reading further, here are the examples.
Logic of this smart floating banners: The HTML: A standard 2 column webpage. 03. Body { background:none; @font-face { font-family: 'BebasRegular'; src: url('fonts/BEBAS___-webfont.eot'); src: local('âº'), url('..
Css. A Fancy AJAX Contact Form. Introduction Providing a simple and reliable means of feedback from site visitors is a crucial part of any web presence.
The most simple and common feedback channel are contact forms. In this tutorial we are going to make an AJAX contact form which leverages modern web development techniques. We are using PHP, CSS and jQuery with the help of the formValidator plugin for form validation and the JQTransform plugin, which will style all the input fields and buttons of the form. In addition we are using the PHPMailer class to send out the contact form emails. For the page background we are using a fantastic dark wood texture by Matt Hamm. The form degrades gracefully, which means it is perfectly usable even with JavaScript turned off.
*Edit: Also make sure you are running PHP 5. So lets start with the tutorial. Step 1 - XHTML First, we are going to take a look at the XHTML markup behind the form. demo.php. Like Box. Chained AJAX Selects. Martin Angelov In today’s tutorial, we will build a set of chained select elements.
Selecting an option in one of them will trigger an update on the page, showing you more choices to refine your selection. We will describe the options server side with PHP, so it is easy for you to hook today’s example to a database. The idea for this tutorial was suggested by Casper Hansen from Denmark. The HTML As you can see from the screenshot below, the select box is accompanied by a title that explains what the selection is about. Chained AJAX Selects with jQuery and PHP When adding more questions, additional LIs are created by jQuery.
Index.html – generated code <ul id="questions"><li><p>What would you like to purchase? You might notice in the demo page that we aren’t using the default browser select controls. The jQuery code In the code, this is achieved using two JavaScript functions: You can see them below. assets/js/script.js.
How to use Geolocation and Yahoo’s APIs to build a simple weather webapp. Martin Angelov Today we will be using the HTML5 geolocation API to present the user with a personalized weather forecast.
Using jQuery, we will issue AJAX request to two of Yahoo’s popular APIs to obtain additional geographical information and a weather forecast. This example also makes use of the wonderful climacons icon set. Update: Yahoo have discontinued their free geolocation api, which means that this tutorial will no longer work. However we created an improved version which uses the APIs provided by OpenWeatherMap.