Posted by K. Scott Allen on Oct 8, 2009 in
Dotnet |
View Original Article Have you ever taken a step back and looked at all the funny characters we use in programming computers?
I did this yesterday. Sometimes, when you look at familiar things in just the right light, they seem so strange.
I use the period to terminate all my sentences. In many programming languages the period is more of a continuation character. It says: “I’m going to act on this thing, and here is what I want it to do”.
boss.MakeMeASandwhich();
That code uses a semicolon to finish a statement; in writing the semicolon joins independent clauses. If symbols are so powerful, how can we juggle the conflicting meanings in our mind? Maybe Perl and C++ had part of it right using –> as a dereferencing operator.*
Sometimes a symbol will mean different things depending on how many times you type it. Like & versus &&. Or the = in JavaScript:
var x = 3; // assignment
if(x == "3") // check for equality
if(x === "3") // check for equality and i really really mean
// equality because i typed an extra = character
Then we use symbols that impart meaning due to their shape.
{
// i'm trapped inside a { } and I can't escape.
}
It’s really not a far stretch from using { } to creating ASCII art.
$$$$$$$$$$$$$$$$$$$$$$$$$
$$$$$$$$$$$$$$$$$$$$$$$$$
$$$$$'`$$$$$$$$$$$$$'`$$$
$$$$$$ $$$$$$$$$$$ $$$$
$$$$$$$ '$/ `/ `$' .$$$$
$$$$$$$$. i i /! .$$$$$
$$$$$$$$$.--'--' $$$$$$
$$^^$$$$$' J$$$$$$
$$$ ~"" `. .$$$$$$$
$$$$$e, ; .$$$$$$$$
$$$$$$$$$$$.' $$$$$$$$$
$$$$$$$$$$$$. $$$$$$$$
$$$$$$$$$$$$$ $by&TL$
In fact, I think you could get the above picture to compile into something useful in APL.
* It’s amusing that the Wikipedia entry for Dereference operator has a single “See also” link at this time, and that link points to Segmentation fault.
Posted by W3Avenue Team on Oct 8, 2009 in
Javascript |
View Original Article This jQuery Plugin allows you to create a bar of real-time stream of information related to your post powered by Collecta search engine. Collecta monitors the streams of news sites, popular blogs and social media. So it can show you results as they happen.
Collecta provides streams of information from a wide variety of sources in five content categories: updates, stories, comments, photos, and videos. Implementation is really straight forward and you can easily customize the look of tweet bar using CSS. Realtime Related Stream Bar jQuery Plugin supports many arguments, all of which are optional.
Features
- Show realtime related stream of information based on your post tags.
- Collecta provides streams of information from a wide variety of sources. you can choose from 5 categories of content: updates, stories, comments, photos, and videos.
- Search by tags in OR or AND operators.
- You can also search using a custom query (Fixed query or based on user input).
- Many transition options like opacity, height, font-size.
- Each part of the result -avatar, author name, link- has its own class for easy style customization.
- Show or hide some parts of the results like avatar, author name, date.
- Use a typical JS call or auto-load div elements that have “related-stream” class.
Developed by Mike at MoreTechTips; this jQuery plugin is available for download under Apache License. You can find further information, demo & download on Realtime Related Stream Bar jQuery Plugin’s Website.
Similar Posts:
Tags: Apache License, Collecta, jquery, Mike, MoreTechTips, Realtime, Social Web
Posted by W3Avenue Team on Oct 8, 2009 in
Javascript,
PHP |
View Original Article Twig is a modern template language for PHP 5.2+ that is flexible, fast, and secure. It supports everything you need to build powerful templates with ease: multiple inheritance, blocks, automatic output-escaping, and much more.
The syntax is easy to learn and has been optimized to allow web designers to get their job done fast without getting in their way. If you have any exposure to other text-based template languages, such as Smarty, Django, or Jinja, you should feel right at home with Twig. It’s both designer and developer friendly by sticking to PHP’s principles and adding functionality useful for templating environments.
Key Features
- Fast: Twig compiles templates down to plain optimized PHP code. The overhead compared to regular PHP code was reduced to the very minimum.
- Secure: Twig has a sandbox mode to evaluate untrusted template code. This allows Twig to be used as a templating language for applications where users may modify the template design.
- Flexible: Twig is powered by a flexible lexer and parser. This allows the developer to define its own custom tags and filters, and create its own DSL.
Twig is brought to you by Fabien Potencier, the creator of the symfony framework. Twig is released under the new BSD license.. You can find further information, documentation & download on Twig’s Website.
Similar Posts:
Tags: BSD, Fabien Potencier, Libraries, Libraries/Frameworks
Posted by Rick Strahl on Oct 8, 2009 in
Dotnet |
View Original Article Ok, so I have one of my applications (Html Help Builder) that will not pin to the taskbar in Windows 7. This is an application I’ve created and have full control over in terms of build, but I can’t figure out why it will not pin to the Windows 7 taskbar. All other applications pin just fine, but this particular one will not pin or be dragged onto the taskbar. Not from a running application, not from a dragged shortcut or by using the context menu to pin it to the taskbar. The Task menu that pops up has nothing more than a Close this Application on it instead of the usual pin options.
Notice that this looks very different from a typical application which shows the actual application instance(s) running plus the Pin this program to taskbar:
I also have this application hooked to a shortcut on the desktop and the desktop shortcut also doesn’t have a Pin to taskbar option like all other icons.
As far as I know there’s nothing particularly special about this application. It’s an EXE launched from either a shortcut or directly from Explorer and it just will not pin. Since this is a distributed application I also installed it on another machine with exactly the same result. The context menu has no pinning options and I can drag the shortcut onto the taskbar either.
This is an old FoxPro based application that uses the Visual FoxPro 9.0sp2 runtimes. Now some of you will jump on that and say “Aha!” – but that’s not it. I have several other applications that are configured pretty much in the same way – and they run fine and have perfectly fine pinning options. In fact the second screen shot you see is another FoxPro EXE application run off a shortcut. And it appears to be working just fine.
So it appears it’s something inside the application that is causing this to occur.
It’s the Filename, Stupid!
So imagine that prior to this section I posted about 10 bullets of things I’d tried that didn’t work to solicit some feedback, when I ran across a Technet post with another guy who had an application named documentation.exe that didn’t work. It was explained to him that there are a few ‘reserved’ words for EXE names that are treated special. documenation.exe was a bad name – and bad names don’t get proper taskbar representation. Bad exe – go stand in the corner!
Windows has a few reserved names that include things like Documentation, Help, Setup, Readme etc. that are not pinned to the taskbar. These are exceptions in Windows (sorry, I couldn’t find a link that provides a complete list).
I dismissed that Technet post initially when I ran into it because the name of my EXE is pretty unique: wwhelp.exe. Not exactly a name you would expect to be on any sort of exception list. But it turns out the rules in Windows aren’t exact matches, but it looks for anything that contains these names. So anything that contains the word Help in the EXE name is considered a special item (presumably a help file).
So I renamed my file to HlpBuilder.exe and lo and behold – I get my Pin to taskbar back and all windows show up on the task context menu. It gets even better though. If I rename the EXE I do get the Pin to taskbar option, but if I create a shortcut and name it West Wind Html Html Help Builder the shortcut again has no Pin to taskbar option and I can’t drag it to the taskbar. Apparently if the reserved word appears in the text of the shortcut it too is limited in functionality.
Man, how retarded is that? If an EXE file contains any of these reserved words it won’t pin? If the Shortcut Text contains one of these reserved words it won’t pin and generally work incorrectly? Really? Why have an arbitrary exception like that? That’s making an awful lot of assumptions and this is likely to break a number of application and they’re standard Windows behavior. This is an EPIC design failure on Microsoft’s part.
It looks like my only alternative is to rename the main EXE. I’m not really married to wwhelp.exe (how old skool of me – uh, this app is going on 15 years)Unfortunately it’s not quite as simple as that. There are update routines in a separate application that have the filename hard coded (and which doesn’t update at customers) and since the EXE is a COM server it needs to be re-registered. An EXE change basically requires a full reinstallation of the product instead of the normal update process I use. But I don’t know what to do about the shortcut. I can’t just erase Help from the name of the shortcut since it’s the freaking product name.
<sigh> It’s never easy on the Windows platform is it? How I hate building desktop apps these days, but this is one app that wouldn’t work well as a Web UI unfortunately.
© Rick Strahl, West Wind Technologies, 2005-2009
Tags: Vista, Windows
Posted by Saud Khan on Oct 8, 2009 in
Javascript |
View Original Article Twitter allows you to customize your profile page by changing background, text and link colors. Anyone can do this very easily; Twitter even allows you to upload your own custom background image, that you can tile or keep fixed on top-left corner. This ability to change background image has allowed designers to create some awesome profile pages.
However there is one problem, your design may be dependent upon screen resolution. If your background image is a pattern or texture that needs to be tiled, you won’t face any problem. But if you try to create a background image (specially using composition) that needs to be fixed on top-left corner; you will soon realize that less desirable results are being produced in different screen resolutions.
Check For Yourself
If you are not sure what I am talking about, try Twitter Background Checker, a very useful online tool that lets you check how any Twitter background will look in different screen resolutions.
Effective Twitter Backgrounds Do Fail
I got interested in Twitter backgrounds when I was compiling a list of resources for W3Avenue post: Resource Kit To Create, Customize & Find Twitter Backgrounds in August. While I was compiling the resource kit; I studied numerous articles, tutorials, tool and backgrounds, and came up with an idea for another post: Effective Twitter Backgrounds: Examples and Current Practices (which was published on Smashing Magazine in September). Like other articles on Smashing Magazine this post received lots of feedback. Overall the response was positive and readers appreciated the list, but there was one common complaint: effective twitter backgrounds were failing on different screen resolutions.
The Solution
Solution lies with Twitter; it is very simple and also allows them to keep all the current backgrounds & settings intact. All Twitter needs to do is, allow users to be able to select one of these three options (instead of two) for their background image:
- Background Position: Fixed Top Left (Default)
- Tile Background
- Background Position: Fixed Top Center (this will make Twitter really designer friendly)
By adding this one extra option, Twitter can easily provide you with the freedom to create background images without worrying about different screen resolutions (although I must admit that lower resolutions will still have issues, but those will be similar to the one you face with any other website).
I am sure that a lot of CSS designers may have already talked about it; I am hoping this post will add one more voice in their support. You can also help by simply tweeting about this post – may be Twitter will listen and actually decide to implement it :)
Similar Posts:
Tags: Articles, Background, design, Twitter
By Angel Wardriver
Web development is time consuming and quite challenging. There are many ways to help combat that challenge, helpful applications from security to traffic analysis as well as CSS-concepts to give us clean, condensed code and faster load times, reducing time efforts and assisting designers and developers with critical improvements to workflows.
Below, we present 30 extremely useful development tools, templates, generators, and security suggestions, hoping you are inspired to utilize these handy tools to make your life easier. Enjoy this fresh Web development goodies bag.
1. CSS and Development Tools
Scaffold
CSScaffold is a CSS framework written in PHP. Rather than try and create a static framework that uses the standard abilities of CSS, like Blueprint, it uses PHP to extend CSS. The syntax looks and feels exactly like CSS, except that you have some new, powerful abilities.
Compass
Compass is a stylesheet authoring tool that uses the Sass stylesheet language to make your stylesheets smaller and your web site easier to maintain.
css_doc
css_doc is a Ruby library and command line tool to extract documentation from CSS files. The format of the documentation is very similar to JavaDoc.
CSSHttpRequest
Like JavaScript includes, this works because CSS is not subject to the same-origin policy that affects XMLHttpRequest. CSSHttpRequest functions similarly to JSONP, and is limited to making GET requests. Unlike JSONP, untrusted third-party JavaScript cannot execute in the context of the calling page.
CSS Sandbox
Say goodbye to trial and error, but say hello to a tool and a toy to test CSS in real time. It’s a fast and simple alternative to reloading a page and viewing the latest tweaks to your code. Roll the mouse over the CODE button and the formatting for the CSS code necessary will be ready for your site.
codeburner
This is a handy tool for Web developers to check CSS properties or HTML elements. After installation, you can run a search or click an item on the page to view browser compatibility information, syntax and code samples. It provides a quick reference available in your browser.
Markup Validator S.A.C.
This stand-alone version of the W3C’s HTML/XHTML Markup Validator requires no installation. Just put the Validator where you need it, like a flash drive, CD or hard drive. It can validate local files, websites, or be setup as a Web service to allow users to validate over the local network. Simply drag and drop files and URLs onto the application icon, or use the File>Open command.
CodeRun
This helpful tool allows us to search and upload runnable code projects, modify or create code with coloring completion, debug client/server code, as well as publish code links. For the cloud, we can deploy with a click, manage cloud resources, and track versions with SVN. It supports numerous languages.
Google Code Playground
Online script development tools let us implement rich, dynamic sites in less time. With this AJAX API playground, we can experiment with new functions like JavaScript or maps or even download feeds. Then these functions can be exported, fully ready to implement. New tools continue to be added, so this is a good place to revisit for language, blogger, charts, and other visualization codes.
Boks
Boks is an AIR application, meaning it works on Windows, Mac and Linux. It provides a user interface for Blueprint CSS framework and can handle grid and baseline rhythm configuration, before exporting grid.png and compressed CSS.
Bluefish
This Open Source editor is geared towards programmers and web designers and will run on most operating systems including Linux, FreeBSD, MacOS-X, OpenBSD and Solaris. Bluefish focuses on editing dynamic and interactive websites and scripts, and supports many programming and markup languages. It will not at this time run on Windows, but a native Bluefish 1.0.7 binary will.
FireCrystal
FireCrystal is a Firefox extension to help programmers and designers figure out how interactive behaviors on the web work. It allows users to “rewind” their interactions with web pages while showing the relevant code. However, it is currently an alpha release and can suffer from long load times or crash on Javascript-intensive pages.
Adobe BrowserLab
This tool is currently available as a free preview, so web professionals should try it while they can. Adobe BrowserLab provides web designers with an exact rendering of their pages in multiple browsers and operating systems. It is a solution for cross-browser compatibility testing and can be customized with preferences, as well as being an online service that can be accessed from virtually any computer connected to the web.
checkmycolors
This tool is for checking foreground and background color combinations of all DOM elements to determine if they provide sufficient contrast when viewed by someone having color deficits. You enter a web address and checkmycolors returns test results based on the algorithms suggested by the W3C.
2. Typography
Typography Keyboard Layout
A simple, yet useful tool that lets you enter characters that are usually unavailable on a keyboard with ease. This thing is a regular keyboard layout, except that with Alt key on Mac or Alt Gr key on Windows it lets you type all these nice characters seamlessly. The layout also supports many kinds of diacritics, so you can type words like naïve or café and have fun.
Typedia
A shared encyclopedia of typefaces, a resource to classify, categorize, and connect typefaces.
fontbook
This web based font viewer lets you look at all your fonts with your sample text by using HTML5’s font embedding. You can view the metrics, glyphs or the font body text. Support should soon be available for tagging, rating and favoriting.
3. Reference tools
Regex Widget
This interactive widget is handy for testing JavaScript, Sed, Ruby, or Perl expressions. The user interface is simple, case insensitive, has global switch, and match index array view for coders to implement tests easily and effectively.
HTML Entity Character Lookup
Using HTML entities is the right way to ensure all the characters on your page are validated. However, often finding the right entity code requires scanning through 250 rows of characters. This lookup allows you to quickly find the entity based on how it looks, e.g. like an < or the letter c.
PHPQuickReference (Mac Dashboard Widget)
PHPQuickReference gives you a handy PHP reference right on Dashboard. Search with autocompletion and hints and copy and paste sample code to your project. You can find more useful Mac Dashboard Widgets for web designers and developers here and here.
4. Image Editing and Optimization
punypng
Punypng is a free tool that dramatically reduces page load times by reducing the file size of an image without any loss of quality.
Smush.it
Smush.it is an image editing optimization tool that takes most types of image formats and converts to smaller PNGs without changing their look or visual quality. It will provide data on how many bytes would be saved by optimizing as well as outputting a downloadable zip file with the minimized image files.
PNG8
Most of us use Photoshop, but Fireworks allows us to use an alpha transparency with PNG8 for a smaller file size while maintaining edges that blend smoothly and look great. Select the number of colors needed or setup a color matte and save a PNG8 image with alpha transparency. In the Optimize pallet, select PNG8 format with alpha transparency selected, and then click “Rebuild” in the lower right corner. Smaller file sizes equal faster page loads and this works the best for logos, shadows and gradients to be fully optimized.
Finetuna
Finetuna image editor can be used for fun or for more serious sites. You can either upload an image or select one from a web page, before quickly adding your comments to any image. The only thing left to do is to share.
iConvert
This tool makes converting images to icons fast and simple. It is a one step process to creating icons for Windows, Mac and Linux.
5. Security
consoleFISH
Security is a concern for us all, but server and system administrators who want to have a backup remote access to their systems without setting up their own SSL certificates can use this free AJAX SSH client to bypass firewalls and proxies on a secure connection. This tool makes it possible to anonymously open secure shell server connections while not revealing the IP address of the connection web client.
PhpSecInfo
Wise security includes a multilayered approach. PhpSecInfo provides an equivalent to the phpinfo() function that reports security information about the PHP environment. Although it’s not a replacement for secure development technique, it does offer suggestions for improvement and is a useful tool in a multilayered security approach.
Lockdown: Secure Your Mac
Lockdown is a security application built from the popular iAlertU and makes securing any Mac with OS X Leopard 10.5 easy. Before you step away from your computer, you can customize its detection features by activating your computer’s motion-sensors, keyboard-sensors, external device sensors, MagSafe sensors, and more to ensure that not even the slightest tap goes unnoticed. Once your alarm has been set off, your computer will sound a loud alarm and prevent the system from being muted or put to sleep. Lockdown will take a snapshot of the offender using your computer’s built in iSight and, if you’ve entered your e-mail address, e-mail the snapshot to the account of your choice.
6. Freelancing
Astuteo
Web designers and site developers can use this simple tool to quickly estimate the time and materials required for a proposed web project. Enter the title of the project and your default hourly rate, then adjust your anticipated hours to generate your total project estimate. The results can be printed or saved to a PDF.
redmark
Redmark is a handy tool for designers and their clients to communicate visually in three simple steps. Upload your design, automatically email to clients who can make comments, make revisions and repeat, before automatically publishing.
7. Improving your workflow
Web Form Factory
Web Form Factory is an open source web form generator which automatically generates the necessary backend code to tie your form to a database.
The Printliminator
The Printliminator is a bookmarklet with some simple tools you can use to makes websites print better. One click to activate, and then click to remove elements from the page, remove graphics, and apply better print styling.
Split browser
Multitasking is mandatory. Depending upon RAM and screen size, this tool allows the FireFox browser to be split infinitely. The split window can be setup in columns or however is needed to compare multiple webpages. Choose the “Split Browser to” menu, and then drag and drop links, bookmarks, calendar, schedules or tabs in split windows.
LiberKey
LiberKey free software is the “Swiss army knife” equivalent to 250 software programs that offer local and/or portable use. The best Open Source or Freeware programs were selected to match most practical needs while maintaining 100% portability.
Would you like to see more similar posts on Noupe?
Your feedback is very important to us. Please let us know how we can improve the quality of Noupe and what kind of articles you would like to see on Noupe.
Would you like to see more similar posts on Noupe in the future?(polling)
No related posts.
Tags: design, development, Tools
