Tuesday, November 25, 2014
Advantages of VoIP PBXes?
Tuesday, June 10, 2014
Tips for a great resume
For people who lack in common sense - and there seems to be a fair share of them - I do recommend searching for tips for a "good" resume. Here are a few: Fix typos, do not use buzzwords that you do not know the meaning of, include relevant information and leave out your favourite eating places. See? Common sense tips.
Sites on the Net offer advice ranging from the motif of the paper that you use to industry happenings that you should include. If you are new in the job market such tips serve only to create a mish mash document that I wrinkle my nose at and store in permanent file (the trash can).
On a more serious note, each person who reads your resume has his/her own preferences; some want details while others do not. Obviously, one can not write individualized documents unless one is in serious lack of a life. On the other hand, industry specific ones is something that can and should be managed. If you are applying to a news agency then items / job experience should be highlighted or moved up relating to them. Those same may or may not (probably not) be the same if you are applying to a software house. You are the applicant here, try to realize this. You are the one who is applying, so spend a few minutes making your resume more relevant (read: interesting) to the person who would be reading it there.
Leave out smiley faces. No, no one other than you finds them cute. Smiley faces are annoying.
You will get an interview if relevant information has been included in complete form. Unfortunately, you'll also get called if not, but only if the interviewer has been "asked" to call you. So, there, you've already alienated him (or her, to be PC). Do yourself the favour of not making your position worse by leaving out important pieces of information, such as the dates / durations of previous experience, or leaving in a bucketful of typographical mistakes.
Another tip: Lie consistently. Eh, what? You read it right. We all lie, the little white ones are still lies by any other name. If someone took a week-long course in skiing a decade back, he sticks it in. Makes the resume that bit fatter. The reader knows it, and politely doesn't mention it. On the other hand, putting in knowledge / experience of things that you have no idea of, is a deal breaker. I'm reminded of a person who added Hindi to language skills. When asked, he said that even though he doesn't actually know it, it being a lot like Urdu should / could / may be considered under some circumstances. Ahem!
So. In conclusion. What tips am I giving about taking / not taking tips? Only the one thing: tips are guidelines to help you, not templates for you to copy blindly.
And just a quick note on cover notes: If you add in it that you want to work for a progressive, industry leading organization like mine, I am going to ask you what you know about my company. If you then admit that you haven't the foggiest, don't sit by the phone waiting for me to call you.
Friday, January 10, 2014
Resizing Navigation Bars on Pages
I normally do not blogs on scripting. Yes, I am well aware that I am not the most prolific blogger on the planet to begin with. Whatever the view on that, here's a scripting tip / blog on website design.
Site / Page Designs That The Designer Really Loves
My common gripe with web page designers is that they love their designs too much; at the cost of functionality. I am of the view that most site visitors are more interested in the content than in the shades of colors applied to frame edges. I guess I'll have to agree to disagree. (It's still a stupid design.)
To be more specific, the designs that I am talking about are those where the top navigation bar fills almost the entire page with the content hidden at the bottom somewhere with the assumption that the user should utilize the scroll wheel on the mouse otherwise it might rust.
Me, I'd rather see some content. So, here's a simple technique. This allows for huge (ugly) header area on the page as well as allowing you to keep a small tidy navigation bar that is always visible even after you scroll down.
For an example, look at the navigation bar on Google+. As you scroll the page, the bar shrinks to a modest size.
The HTML Page
Here's the code to the HTML. You know that this uses JQuery. If you are not familiar with JQuery, oh, well...
<head>
<title>Expanding Menu</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="scripts.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<div id="menubar">
<img id="logo" src="Logo.gif" />
<div id="menuitems">
<a href="#" class="menuitem">Menu 1</a>
<a href="#" class="menuitem">Menu 2</a>
<a href="#" class="menuitem">Menu 3</a>
<a href="#" class="menuitem">Menu 4</a>
</div> <!-- End of menu items div -->
</div> <!-- End of menu bar div -->
<div id="content">
<h1>Heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce egestas et augue sit amet pretium. Aliquam non turpis quis velit venenatis dignissim. Vivamus a ipsum tempor, dignissim nisi sit amet, feugiat felis. In a tortor quam. Pellentesque imperdiet augue at rutrum feugiat. Integer a diam id sem euismod pulvinar vel a mi. Ut lacinia tincidunt tortor, a facilisis purus hendrerit sed. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla accumsan lacus sed leo laoreet facilisis vitae et neque.</p>
<p>Donec auctor cursus purus, a commodo urna aliquet eget. Morbi malesuada hendrerit dui, condimentum tempor ante tempor eget. Nam nisi nisi, tristique faucibus mollis sed, ultricies sed tellus. Suspendisse lacinia felis vitae justo tincidunt, sed placerat nulla viverra. Aliquam commodo odio a lectus tristique malesuada. Quisque cursus dignissim lorem euismod accumsan. Suspendisse at nunc at risus molestie volutpat nec posuere massa. Curabitur sed ullamcorper odio. Quisque id euismod nunc. Nulla facilisi. Sed faucibus mauris vitae eros fringilla congue. Donec porta felis vitae vulputate fermentum. Mauris fermentum est quis est consequat, id egestas mi auctor. Cras non diam purus. Duis fringilla quam enim, sed auctor mauris lobortis ac.</p>
<p>Vestibulum blandit nibh a massa venenatis, nec condimentum arcu porttitor. Pellentesque dictum pretium sem in auctor. Mauris eget arcu eu lorem hendrerit fermentum. Sed ipsum turpis, mollis vitae dignissim sollicitudin, vulputate in metus. Praesent euismod felis eget fermentum blandit. Aenean fermentum viverra fermentum. Mauris sed libero nulla.</p>
<p>Vestibulum eget nulla nibh. Integer vitae libero id mauris porta faucibus. Mauris vitae arcu urna. Suspendisse suscipit cursus lorem, a facilisis sem fermentum eu. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc et accumsan erat. In hac habitasse platea dictumst. In vitae felis dictum, placerat dolor eget, accumsan magna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque in vehicula dolor. Fusce nunc ligula, lacinia at odio eu, porttitor tincidunt risus. Donec porttitor odio et leo feugiat placerat. Vivamus molestie quis dolor bibendum sodales. Sed luctus ullamcorper ante, quis porta turpis.</p>
<p>Nullam pretium, dui vitae facilisis viverra, dolor libero rutrum justo, a pellentesque purus sapien ac quam. Sed dapibus, neque vel adipiscing pellentesque, justo erat ultricies orci, blandit posuere metus turpis ac nulla. Praesent at ligula risus. Phasellus vitae porta lacus. Fusce vestibulum suscipit tincidunt. In sit amet nisl condimentum, euismod velit vitae, mollis nulla. Phasellus lectus elit, hendrerit nec arcu quis, consequat consectetur odio. Mauris in urna mauris. Sed lacinia tincidunt dignissim. Cras et rhoncus nulla. Etiam id malesuada eros. Donec eu velit ultricies, auctor felis vitae, vestibulum libero. Mauris tellus lorem, congue in quam ut, tempus tempor urna. Pellentesque varius cursus erat, nec malesuada elit gravida ac. Aliquam ut tellus id lorem suscipit laoreet.</p>
<h1>Heading 2</h1>
<p>Vestibulum blandit nibh a massa venenatis, nec condimentum arcu porttitor. Pellentesque dictum pretium sem in auctor. Mauris eget arcu eu lorem hendrerit fermentum. Sed ipsum turpis, mollis vitae dignissim sollicitudin, vulputate in metus. Praesent euismod felis eget fermentum blandit. Aenean fermentum viverra fermentum. Mauris sed libero nulla.</p>
<p>Vestibulum eget nulla nibh. Integer vitae libero id mauris porta faucibus. Mauris vitae arcu urna. Suspendisse suscipit cursus lorem, a facilisis sem fermentum eu. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc et accumsan erat. In hac habitasse platea dictumst. In vitae felis dictum, placerat dolor eget, accumsan magna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque in vehicula dolor. Fusce nunc ligula, lacinia at odio eu, porttitor tincidunt risus. Donec porttitor odio et leo feugiat placerat. Vivamus molestie quis dolor bibendum sodales. Sed luctus ullamcorper ante, quis porta turpis.</p>
<p>Nullam pretium, dui vitae facilisis viverra, dolor libero rutrum justo, a pellentesque purus sapien ac quam. Sed dapibus, neque vel adipiscing pellentesque, justo erat ultricies orci, blandit posuere metus turpis ac nulla. Praesent at ligula risus. Phasellus vitae porta lacus. Fusce vestibulum suscipit tincidunt. In sit amet nisl condimentum, euismod velit vitae, mollis nulla. Phasellus lectus elit, hendrerit nec arcu quis, consequat consectetur odio. Mauris in urna mauris. Sed lacinia tincidunt dignissim. Cras et rhoncus nulla. Etiam id malesuada eros. Donec eu velit ultricies, auctor felis vitae, vestibulum libero. Mauris tellus lorem, congue in quam ut, tempus tempor urna. Pellentesque varius cursus erat, nec malesuada elit gravida ac. Aliquam ut tellus id lorem suscipit laoreet.</p>
<h1>Heading 3</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce egestas et augue sit amet pretium. Aliquam non turpis quis velit venenatis dignissim. Vivamus a ipsum tempor, dignissim nisi sit amet, feugiat felis. In a tortor quam. Pellentesque imperdiet augue at rutrum feugiat. Integer a diam id sem euismod pulvinar vel a mi. Ut lacinia tincidunt tortor, a facilisis purus hendrerit sed. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla accumsan lacus sed leo laoreet facilisis vitae et neque.</p>
<p>Donec auctor cursus purus, a commodo urna aliquet eget. Morbi malesuada hendrerit dui, condimentum tempor ante tempor eget. Nam nisi nisi, tristique faucibus mollis sed, ultricies sed tellus. Suspendisse lacinia felis vitae justo tincidunt, sed placerat nulla viverra. Aliquam commodo odio a lectus tristique malesuada. Quisque cursus dignissim lorem euismod accumsan. Suspendisse at nunc at risus molestie volutpat nec posuere massa. Curabitur sed ullamcorper odio. Quisque id euismod nunc. Nulla facilisi. Sed faucibus mauris vitae eros fringilla congue. Donec porta felis vitae vulputate fermentum. Mauris fermentum est quis est consequat, id egestas mi auctor. Cras non diam purus. Duis fringilla quam enim, sed auctor mauris lobortis ac.</p>
<p>Vestibulum blandit nibh a massa venenatis, nec condimentum arcu porttitor. Pellentesque dictum pretium sem in auctor. Mauris eget arcu eu lorem hendrerit fermentum. Sed ipsum turpis, mollis vitae dignissim sollicitudin, vulputate in metus. Praesent euismod felis eget fermentum blandit. Aenean fermentum viverra fermentum. Mauris sed libero nulla.</p>
</div> <!-- End of content div -->
</body>
</html>
The Content div is just fleshed out a bit to allow scrolling to work.
Of interest here is only the div named "menubar". This contains two further div's so that we can see separate but related effects.
The first div contains the page logo while the second contains navigation links. Further div's may be added here with separate behaviors, such as hiding when the page is scrolled.
Note the use of id's and classes. This is simply to differentiate single versus multiple items that would be effected.
The CSS
The CSS for the menu follows:
@CHARSET "ISO-8859-1";
#menubar{
width: 100%;
background-color: black;
padding-bottom: 20px;
position: fixed;
opacity: 0.99;
top: 0;
left: 0;
z-index: 1;
}
#menubar.compact{
height: 50px;
}
#menuitems{
margin-left: 500px;
margin-top: 60px;
/* transition-duration: 300;*/
}
#menuitems.compact{
margin-left: 200px;
margin-top: 20px;
}
.menuitem{
font-size: 1.5em;
color: white;
font-weight: bold;
margin-right: 30px;
}
.menuitem.compact{
font-size: 1.2em;
margin-right: 20px;
}
a.menuitem{
text-decoration: none;
}
a.menuitem:link a.menuitem:visited a.menuitem:active{
color: white;
}
a.menuitem:hover{
color: yellow;
}
#logo{
position: absolute;
width: 250px;
height: 64px;
left: 100px;
margin-top:30px;
/* transition-duration: 300;*/
}
#logo.compact{
width: 125px;
height: 32px;
left: 60px;
margin-top: 10px;
}
#content{
margin-top: 120px;
}
The areas to note are:
The menubar has been given a "fixed" position to keep it on the page.
Note the absence of spaces where the "compact" class is use. This method is employed to indicate that an item has multiple classes.
In the compact items, the sizes have been reduced; the font is smaller, the margin has been reduced and the image has been resized to half its dimensions.
The JavaScript
Finally, we come to the JQuery functions that do the changes.
$(window).scroll(function(){
if ($(window).scrollTop() > 200){
//User has scrolled down. Shrink the menu, if needed
if (!$("#menubar").hasClass("compact")){
$("#menubar,#menuitems,.menuitem,#logo").addClass("compact",400,"easeInSine");
}
}else {
//User has scrolled up. Expand the menu, if needed
if ($("#menubar").hasClass("compact")){
$("#menubar,#menuitems,.menuitem,#logo").removeClass("compact",400,"easeOutSine");
}
}
});
The script uses the window's scroll event to see if it has been scrolled. The nested if is to stop it from continuously reapplying the styles.
Upon scrolling, all the bar-related items are selected to which the "compact" class is applied or removed, as needed.
And that is all it takes.