Recent Posts
Woork
Return To Blog Listing
A blog about technology, programming, engineering and my personal interests.
Recent Posts Tagged With 'html'
How to implement a perfect multi-level navigation bar
A question I often receive is what's the best way to implement a multi-level navigation bar for a website. In some cases, some of my readers ask to me a little help and send me "very original" solutions but not so suitable in terms of semantic and u...
HTML lists: what's new in HTML 5?
There is a big and justified interest from the web community about the changes introduced in HTML 5 and in the last weeks I'm frequently receiving a lot of questions and requests about this topic. In this post I want to illustrate a quick roundup of...
Rediscovering HTML tables
I decided to write this post after several conversations I recently had with some of my readers about the use of HTML tables. In general, I noticed there is a preconceived hate about their use due to misleading information. In fact a lot of people s...
10 Useful code snippets for web developers
In this post I want to suggest you 10 useful code snippets for web developers based on some frequetly asked questions I received in the past months for my readers. This collection include several CSS, PHP, HTML, Ajax and jQuery snippets. Take a look...
How to implement a news ticker with jQuery and ten lines of code
After my previous posts about how to implement a news ticker with MooTools I received a lot of emails from my readers that asked to me to implement a similar feature with jQuery, including fade in and fade out effects, in the simpler possible way. S...
Useful Ajax Auto Suggest scripts collection
This post is a collection of some interesting and useful Ajax Auto Suggest scripts ready to use (from beginner or professional web developers) in your web projects. This collection includes standard auto suggest scripts, del.icious tag suggestion, au...
Interesting html FORM Validators for web developers
This post illustrates how to use some interesting HTML Form validators to check FORM fields writing only some lines of HTML and JavaScript code. All these proposal are lightweight, cross-browser and simple to use and customize in your web projects in...
Best Rich Text Editors ready to use in web projects
This post illustrates five interesting rich text editors ready to use in your web projects. I also provided some guidelines regarding how to implement them on your pages using a few lines of HTML code. Try them!1. Yahoo! UI Library: Rich Text EditorT...
File uploaders collection for web developers
After my previous post about Best Image Croppers ready to use for web developers I want to suggest you some interesting resources where you can find useful and free file uploaders ready to use in your web projects.If you know other interesting resour...
Ultra small code to drag everything in HTML pages
A frequent question I receive from my readers is about how to implement a simple script to drag elements in a web page. So in this post I want to illustrate the simplest method I know and use to drag everything in HTML pages, using just three rows of...
Best Image Croppers ready to use for web developers
If you are looking for an image cropper user interface ready to use in your web projects and simple to customize, take a look at this list with the best and free image croppers UI currently in circulation.If you know other interesting resources about...
Useful tips to design horizontal website layout
In the past weeks I received some messages from my readers which asked to me to dedicate a post about horizontal website layout. So in this tutorial I want to illustrate some useful tips to design this kind of layouts using CSS and HTML code, also ad...
Ultra versatile slider for websites
After my previous post about the Art of reusing code in your web projects I received many messages which asked to me to release an improved version of the slider I illustrated in the example number 3 of that post.So, in this tutorial I'll explain a s...
The Art of reusing code in your web projects
If you are a professional web designer you would have know very well the importance to respect development deadlines. Reusing code you already wrote in your past projects it's a good practice to save a lot of time, be more productive and dedicate co...
Super elastic effect to design high impact web menu
This tutorial explais how to design an high impact elastic effect to make original web menu using some lines of Javascript code and MooTools framework. The effect is simple to develope and reuse in your web projects changing only HTML code and CSS. T...
Useful resources to improve the look and features of HTML Forms
Are you looking for some useful tips to improve the look and features of your standard HTML FORM elements? In this post I suggest you some interesting resources about this topics. Take a look around... Read more on http://woork.blogspot.com... ...
Simple ul list with a nice slide-out effect for elements
In the past weeks some readers of this blog asked to me what's a simple way to implement an animated "disappear" effect (using unobtrusive JavaScript code) for an element of a list when an user... Read more on http://woork.blogspot.com... ...
CSS coding: semantic approach in naming convention
Naming convention in CSS coding is an "hot" discussion topic. In this post I want to illustrate some suggests and guidelines to use a semantic approach instead of a structural approach in naming CSS... Read more on http://woork.blogspot.com... ...
MooTools Basic Tips (lesson 3): interaction with HTML Form
This post is the third lesson which I dedicate to MooTools for newbie and illustrates how to implement simple interactions with form input elements using this powerful framework and unobtrusive JavaScript code. Some time ago I wrote this post where ...
Step by step guide for newbie to design a simple web application (part 1)
Design a web application requires hard work and knowledge of HTML, CSS, database and javascript. What is a simple way to start developing PHP web applications for a newbie? In the past months I received frequently this question. Some readers of this...
7 Stunning tutorials to design modern interfaces for websites
Are you looking for some ideas to design an original interface for your next website project using the most popular JavaScript Frameworks such as Prototype, MooTools and Scriptaculous? Take a look at this short compilation which includes a Facebook-...
Elegant glass style navigation bar using CSS and toggle animated effect
This tutorial illustrates how to design an elegant glass style navigation bar with a nice toggle animation effect, using CSS and MooTools. The result is something like this:Moving your mouse over a tab in the main menu, the submenu display several li...
25 Awesome tutorials for web designers
This is a collection of the best tutorials for web designers I found this month browsing some websites I like. It also includes some of my post :) Take a look!1. Most used CSS TricksA nice compilation of the most used CSS tricks in web design (round...
Tips to design your site for mobile devices
Some day ago my friend Lucas asked to me some suggest to design a mobile version of his blog. So, in this post I want to illustrate some simple tips about how to develop a mobile version of your site such as: choosing an URL address for your mobile s...
Useful tips to enrich your HTML Forms
In the past months I already dedicated several post about forms design and usability. In this post I want to share some simple tips useful to enrich your forms with various elements such as suggest messages, autosuggest feature instead of <select&...
Nice login and signup panel Newsvine like using CSS
Yesterday a reader of my blog, Benjamin, asked to me a suggest for an idea to design a simple login/register section for his site. So I suggested him to take inspiration form the panel used on Newsvine which is like the following:It's a simple panel ...
FORM elements design using CSS and list (ul and dl)
After my last post (Clean and pure CSS FORM design) I receive a lot of messages with some suggests, opinions and critics about the method illustrated in these post to design a FORM using pure CSS code. I have to say I prefer to use table to place FOR...
Nice animated menu using CSS and Mootools
This tutorial illustrates how to implement a nice animated menu using Mootools and some lines of CSS and HTML code ready to reuse in your project. This is the basic version with a basic design, but you can customize it how you prefer modifying the CS...
Two CSS vertical menu with show/hide effects
CSS menu and "Web 2.0" transition effects are topics very popular on my site and in general I receive a lot of code requests about these arguments. So I wrote this simple tutorial with two vertical menu examples with show/hide menu effect. First exa...
Nice comments counter style for your blog post
This post illustrates how to design a nice comments counter for your blog post and obtain an elegant post header using just some lines of CSS code. This is the result:You can download the source code and use it immediatly on your blog. Download sourc...
