Servage Magazine

Data types The values we assign to variables fall under a few distinct data types. Undefined The simplest of these data types is likely “undefined.” If we declare a variable by giving it a name but no value, that variable contains a value of “undefined.” var foo; alert(foo); // This will open a dialog containing "undefined". Odds are you won’t find a lot of use for this right away, but it’s worth knowing some of the errors you’re likely to encounter early on in your JavaScript career for the sake of troubleshooting. If a variable has a value of “undefined” when it shouldn’t, you may want to double-check that it has ...

There seems to be more debate than solutions. Some have proposed new HTML markup that makes it easier to specify image files based on dimensions and screen resolution. Some feel the server needs to play a larger role, particularly to negotiate network speeds. Others think that a new image format that can contain multiple versions of the same image is the answer. The sudden explosion of mobile web use caught our web technologies off-guard. A web search for “responsive images” should help you get up to speed with where things stand currently. Jason Grigsby has written several high-profile articles that effectively describe the dilemma as of 2012. They ...

We almost all, web designers and web developers have some common experiences. For instance, our all projects are not smoothly running as we expect. There are some major or minor obstacles in the way of our web designing and wed development processes. Some time clients create hurdles and sometimes we for us. In most of the cases, our attitude towards the project, our prejudices, and our designing practices put us into somewhat troublesome states. Therefore, I always keep my eyes and ears open during the development process especially when things seems going worst in order to obtain solutions before clients or project showing deadlines. Of course, I am ...

There are plenty of elements playing parts in the success of modern websites, but navigation is grabbing first attention of the web designers and web developers. I am supporting this concept holistically because navigation is a prime concern in performance optimization and grabbing first place in user experiences. If we look at the psychology of our visitors, we will find that once visitor land on home page or any inner page she may start looking at the presented content on that page. If she is not getting whatever she is looking for, she immediately start searching for the navigation menu to find out what site is offering more and ...

  Users are increasingly using smartphones and tablets to access the web. As of December 2013, one in every five web visits is from a mobile device. If your website or app is mobile-aware, that figure could be far higher. Development for multiple devices has its challenges, but there are also possibilities which aren’t typically available on desktop PCs. Consider the vibration mechanism; it’s a simple tactile feedback device which can alert you of new messages or phone calls. It’s especially useful in a noisy environment where sound cannot be heard or in quiet places where a ringtone would be a distraction or nuisance. Wouldn't it be great if you could use vibration in ...

It is true that today we have a queue of the next web development projects ahead of us once we finish one. There is a stiffly competitive era for our next generations and us. Therefore, if someone reads the title and catches the word postmortem some knee jerk reactions are expected, particularly for a freelancer and same for a big organization or web or mobile development company. Freelancers might suffer from stress and some negligence, as they have no apparent reasons to find out pit holes and blame someone else. Whereas giant companies avoid witch-hunts and blame game over project postmortem if success rate is low or moderate. Despite all ...

What is interaction development? And why should we become interaction developers? In order to understand interaction development we need to first acknowledge that we are living in a high tech era and our web audience consists of a tech-savvy generation. The majority of us are using various devices to access information. And today, we do these things rapidly. Therefore, to focus attention and help deliver information swiftly, we need a lot of interactions in our website and web applications. These interactions consist of simple, dynamic form filling to highly interactive animations and communication with others. Why We Need To Become An Interaction Developer The potential of interactions on our web design is ranging from hundreds to thousands and those interactions may be ...

DOM.EXTEND DOM.extend declares a live extension. It accepts a CSS selector as the first argument which defines what elements you want to capture. General advice: try to make the selector simple. Ideally, you should only use a tag name, class or attribute with or without a value or their combinations with each other. These selectors can be tested quicker without calling an expensive matchesSelector method. The second argument is a live extension definition. All properties of the object will be mixed with an element wrapper interface except constructor and event handlers. Let’s look at a simple example. Let’s assume we have such an element on a Web page: <div>...</div> The task is to show it as a ...

  The CSS Animations module allows authors to create real, honest-togoodness keyframe animation. Unlike transitions that go from one state to another, keyframe animation allows you to explicitly specify other states at points along the way, allowing for more granular control of the action. Those “points along the way” are established by keyframes that define the beginning or end of a segment of animation. CSS transitions are animations with two keyframes: a start state and an end state. More complex animations require many keyframes to control property changes in the sequence. Establishing the keyframes The animation process has two parts: first, establish the keyframes with a @keyframes rule, and then add animation properties to the elements that ...

RENDER THE SCENE We have everything we need for a basic scene, so all that’s left is to tell the renderer to run by creating a render loop. We’ll use requestAnimationFrame() to inform the browser of the upcoming animation, and then start the renderer with the scene we’ve created. Note that requestAnimationFrame() has limited support, so check out Paul Irish’s shim to make sure all of your users get the same experience. var render = function () { requestAnimationFrame(render); renderer.render(scene, camera); }; render(); If you open this in your browser, you’ll see the ball in the middle of the canvas with the light reflecting off of it. At this point, play around with the ...