“50 New Resources and Tools for Web Developers” plus 1 more - Speckyboy Design Magazine Feed |
| 50 New Resources and Tools for Web Developers Posted: 30 May 2012 12:41 AM PDT In this web developer round-up we have chosen 50 recently released resources and tools that offer time-saving solutions to many of the development issues you may come across. So, if you are looking for a tool that will check your Javascript, validate your CSS, help you create an image sprite, or a new HTML5 Canvas library, a new CSS dev framework, or even a parallax scrolling library you will find them all here, and much, much more. As per usual, and due to its huge popularity, we purposely didn’t include any jQuery-related resources in this post. jQuery needs and deserves its own post, so you should check out last months 40 Recently Released jQuery Plugins if that is what you are looking for. This post has been written in collaboration with our sister site CodeVisually. Responsive Grid SystemThe Responsive Grid System is a fluid grid CSS framework for fast, intuitive development of responsive websites. Available in 12, 16 and 24 columns with media queries for all standard devices, clearfix, and optional reset. Gumby 960 Responsive Grid FrameworkGumby 960 Responsive Grid Framework → Box CSS FrameworkBox CSS is a framework based on box-sizing: border-box and display:inline-block building principles. Foldy960 FrameworkFoldy960 is a responsive 960 grid, basically a little kit and some extra classes to get you going on making your 960.gs design responsive. Css2LessWith Css2Less you can quickly convert your old CSS files to fresh new LESS files. As easy as copy/paste. Codeanywhere Code EditorCodeanywhere is a code editor in a browser with support for all popular web formats including HTML, PHP, JavaScript, CSS, and XML. Responsive IE6Responsive IE6 is a small tool to test your media queries on Internet Explorer 6. Dirty MarkupDirty Markup is a web-based tool to tidy and beautify your HTML, CSS & JS code. It combines the power of HTML Tidy, CSS Tidy, JS Beautify, and the Ace editor to effortlessly clean up your messy code. SnipSaveSnipSave lets you save snippets of code online for future reference. It features a very easy-to-use interface where you can quickly create, edit and delete code snippets. RWD CalculatorRWD Calculator is a simple calculator to help turn your PSD web template into the start of your responsive website. In other words, it turns pixels into percentages. The ResponsinatorThe Responsinator helps web designers quickly get an indication of how their responsive site will look on the most popular mobile devices. Timeline JSTimeline, as its name suggest, lets you create beautiful timelines that are easy and intuitive to use. It can pull media from different sources, with built in support for Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud. CSSO (CSS Optimizer)CSSO is a CSS optimizer – more specifically, a CSS minimizer. Use it to improve and streamline your CSS. GrapheneGraphene is a realtime dashboard & graphing toolkit based on D3 and Backbone. It offers a very aesthetic realtime dashboard that lives on top of Graphite (but could be tailored to any back end). CrossfilterCrossfilter is a JavaScript library for exploring large multivariate datasets in the browser. CanJSCanJS is a JavaScript framework that makes building rich web applications easy. CanJS's core supports jQuery, Zepto, Dojo, YUI and Mootools FixieBy interpreting your semantic HTML5 tags, Fixie will automagically add the right type of content in the right places. Headings, paragraphs, links, images, sections… Foresight.jsForesight.js gives webpages the ability to tell if the user's device is capable of viewing high-resolution images (such as the 3rd generation iPad) before the image has been requested from the server. Webshims LibraryWebshims lib is a modular capability-based polyfill-loading library, which focuses on accurate implementations of stable HTML5 features. dhtmlxSpreadsheetdhtmlxSpreadsheet is an open source Ajax spreadsheet widget written in JavaScript and PHP (also available as a plugin for WP, Joomla, etc.) that allows you to quickly add an Excel-like, editable data table on to a web page. heatmap.jsheatmap.js is a JavaScript library that can be used to generate web heatmaps with the html5 canvas element based on your data. KartographKartograph is a lightweight framework for building beautiful, interactive vector map applications without Google Maps or any other mapping service. sigma.jssigma.js is an open-source and lightweight JavaScript library for drawing graphs, using the HTML canvas element. It has been designed to display interactive static graphs exported from a graph visualization software – like Gephi. GruntInstead of being a chore, creating a new project and performing repetitive but necessary tasks such as linting, unit testing, concatenating and minifying files become trivially easy with Grunt. Live ScratchpadLive Scratchpad lets you evaluate your JavaScript functions in real-time while editing. It will inspect objects or DOM elements manipulated during execution, figure out the code path taken inside the function and directly jump to errors. jPagesjPages is a client-side pagination plugin that gives you a lot more features comparing to most of the other similiar plugins, such as auto page turn, key and scroll browse and showing items with delay. dgriddgrid is a lightweight, modular, and easily extensible grid component that takes full advantage of modern browsers and object stores. SpritePadSpritePad is a web-based tool that lets you create your CSS sprites within minutes. Simply drag & drop your images and have them immediately available as a PNG sprite + CSS code. smoke.jssmoke.js is a very easy to use and flexible framework-agnostic styled alert system for Javascript. It uses CSS animations and background, so there are no images or js animation code making it very lightweight. KeymasterKeymaster is a simple micro-library for defining and dispatching keyboard shortcuts. LeafletLeaflet is a lightweight JavaScript library for mobile-friendly interactive maps. Weighing just 22kb of gzipped JS code, it still has all the features most developers ever need for online maps. stroll.jsstroll.js is a collection of CSS list scroll effects. The style of scroll effect is determined via the class that is set on the list. Hammer.jsHammer.js is a JavaScript library for multi-touch gestures, supporting: tap, double tap, hold, drag, and transform. skrollrSkrollr allows you to animate any CSS property of any element depending on the horizontal scrollbar position. Style TilesStyle Tiles are a design deliverable (in PSD format) consisting of fonts, colors and interface elements that help you communicate a web products visual brand. TypedJSTypedJS helps you save your JavaScript code by sanity checking it. Underscore.jsUnderscore.js is a utility-belt library for JavaScript that provides a lot of the functional programming support that you would expect in Prototype.js (or Ruby), but without extending any of the built-in JavaScript objects. KineticJSKineticJS is an HTML5 Canvas JavaScript library that extends the 2d context by enabling canvas interactivity for desktop and mobile applications. Cutter.jsCutter.js truncates HTML code to limit its length. Socialite.jsSocialite provides a very easy way to implement and activate a plethora of social sharing buttons — any time you wish. On document load, on article hover, on any event! Opera Mobile EmulatorMorris.jsMorris.js is a lightweight library that uses jQuery and Raphaël to make drawing time-series graphs easy. dynamo.jsdynamo.js gives offers a simple method to generate dynamic bits of HTML and add subtle effects to your content. IntypeIntype is a fast and easy text editor. It has smart select & edit, snippet insertion and management, auto-paired characters, fast syntax highlighting and code-coloring themes. Chico UIChico UI is a free and open source collection of easy-to-use web tools for developers and designers. Built on top of jQuery, these tools brings known interaction patterns for your website taking advantage of HTML5 and CSS3 features. HTML5 Web NotificationsThe HTML5 Web Notifications come in two flavors: plain text and HTML. Plain text allows you to customize a couple of parameters, HTML shows any .html file you want as a notification. EpicEditorEpicEditor is an embeddable JavaScript Markdown editor with some minor Markdown enhancements such as automatic link creation and code fencing. URI.jsURI.js is a javascript library for working with URLs. It offers a "jQuery-style" API (Fluent Interface, Method Chaining) to read and write all regular components and a number of convenience methods like .directory() and .authority(). Retina.jsRetina.js is an open-source script that makes it easy to serve high-resolution images to devices with retina displays. jq-idealformsjq-idealforms is a small framework to create awesome responsive forms. It's been built on top of jQuery and LESS. Spiffing CSSSpiffing allows you to write your CSS and stylesheets in conformance to proper British English (also known as correct English) grammar and spelling regulations. You might also like…15 Responsive CSS Frameworks Worth Considering →
       |
| Important Tips for Managing a New Tech Startup Posted: 29 May 2012 08:57 AM PDT The tech scene has recently seen booming innovation more than we’ve ever seen before. Startups inside the industry are full of young talent searching for an audience. And it’s no surprise that the current state of our Internet is managed by such a few top-ranking social networking sites. Over time we will adapt to the value of the Internet and how we can connect with any person from all around the world. This opens up a whole new realm for startups to advance with revolutionary ideas on the web and mobile devices. If you are one of these startup guys interested in success, check out some of the tips I’ve offered in this post. Defining a PurposeYour team must be comfortable sitting down and working towards a common goal. Regardless of if you’re working with 2 people or 10 or even 100, everybody needs to push forward towards one finished product. This purpose should be outlined in advance and give the startup some value. Maybe your idea is to revolutionize web hosting with newer green technology. Or building a mobile app for sharing up-to-the-minute news with friends via iOS. Whatever your startup falls into make sure it’s clear, concise, and plausible. Because once everything is in production it’s more difficult to go back and redo major concepts. Get the Team on BoardWhile discussing your product I should also mention another key point – the team. You need to have everybody who’s working on your product super excited. Not even just excited, but dedicated and passionate about the end result. When you have a passionate team it’s only easier to reach goals and complete tasks month after month. Typically tech startups revolve around a single type of digital product. This could be Premium WordPress themes or web graphics/icons. But alternatively your team may be working in the realm of social products – such as a new social network or information sharing center. The Internet is all about connecting people, after all. Though no matter what you’re doing, it’s evident your company will need some web presence. How else can you market any powerful idea all across the world? Even just a small corporate-style website with a couple pages is much better than nothing at all. And typically this works out well since you won’t need to hire any extra web developers for the task. Don’t Try to Reinvent the WheelI notice this all the time with young enthusiastic developers. You look at WordPress and say “I can design a better CMS than this”. And in truth maybe you can – I’ll admit the Admin panel feels bland after looking at it all day long. But the startup scene is ferocious and this kind of attitude just won’t work. The reality of the situation is that WordPress can offer everything you’d need for an online magazine, corporate site, even a social networking feature. And going further you have plenty of other options to build off including Joomla!, Drupal, Pligg, Fork CMS, SMF… the amount of open source code is not slowing down. So it’s important that you take advantage of these backend systems, at least during the early launch phase. In the long run your startup is a business focused on turning a profit and helping the world. The first year is all about getting a product completed and building a recognizable branding. Take pride in your work, but don’t try going back and re-doing features that are already available at your fingertips. Software is easier to build when you use abstraction – basically layers upon layers of pre-determined code. This is why so many app developers can create programs for Windows and Mac without needing extensive knowledge of the Operating System. This case holds true for the Internet as well. You can build a killer website on any of the CMS’ available and slowly create new ideas off their features, without even needing to know all the internal code. Move with a PlanIt’s all too easy falling into a routine schedule every day where each person is working on their own little piece of the project. This is great in the early stages – but after a couple of months it’s important that everybody start working off a master plan. This plan could be a detailed written piece or just a small list of tasks. It should represent all the tasks you need to complete in order of importance. It can be fun to finish off the extra sidebar widget design, but this will not earn you extra money or visitors come end of the day. I always say that marketing is truly #1 above all else. A good marketer can sell a horrible website and probably do a half-okay job. Regardless of what your product is, nobody can use it unless they can find links. The Internet is loaded with opportunities for marketing and you should jump on these quickly after launching. Along with basic marketing you’ll also have to handle public relations. This includes social networking accounts, answering support e-mails, and dealing with other PR media(interviews, articles, phone convos, etc). There is so much more to consider, but that will all change based on your startup’s goals. Maintenance is very important so don’t get too stressed out if things seem to be moving slowly. Just having your website up online each day is a significant feat in itself! Marginalize FailureThis is always a groundbreaking idea which entrepreneurs find difficult to grasp. Failure is inevitable and always part of life. But failure only becomes reality when you give up and let the failure end everything. I recommend using your experiences with failure as lessons in the grander scheme of things. Even if you wake up to realize your startup idea is fundamentally flawed, you do not need to call it quits. Go back to the drawing board and revamp the idea. Remove what isn’t going to work and start focusing on what you need to do. Just make things happen. Because unfortunately nobody else will come in and make things happen for you. ConclusionThe startup world is all about hustling and pushing forward aggressively with your ideas. There is no hard and fast method for building such a profitable company. It often requires years of hard work and dedication to your cause. But startup ideas and small businesses will always be the way of the future, offering regional prosperity and employment options. Try applying these techniques to your own startup vision and you’ll surely come out successful.
     |
| You are subscribed to email updates from Speckyboy Design Magazine To stop receiving these emails, you may unsubscribe now. | Email delivery powered by Google |
| Google Inc., 20 West Kinzie, Chicago IL USA 60610 | |
Keine Kommentare:
Kommentar veröffentlichen