Category Archive for: jquery

rfp-robotRFP ROBOT: Website Request for Proposal Generator

The time has come for a new website (or website redesign), which means you need to write a website request for proposal or web RFP. A Google search produces a few examples, but they vary wildly and don’t seem to speak really to your goals for developing or redesigning a new website. You need to write a website RFP that will clearly articulate your needs and generate responses from the best website designers and developers out there. But how?

Have no fear, RFP Robot is here. He will walk you through a step-by-step process to help you work through the details of your project and create a PDF formatted website design RFP that will provide the information vendors need to write an accurate bid. RFP Robot will tell you what info you should include, point out pitfalls, and give examples.


The State of Web Animation: Part 2

In Part 2, we’re picking up where I left off with current tools for animation with JavaScript (mostly in the form of JavaScript libraries). Be sure to check out Part One. Javascript is admittedly a more controversial method of animation than the methods I mentioned previously (Video, Gifs, CSS Transitions + Keyframes). There was once a day when we longed for CSS support of animation and, when that day came to pass, many disregarded JavaScript animation as non-performant and outdated. But now, JavaScript animation is making a come-back in a few different forms (and no, none of them are just changing CSS classes). There are far too many libraries out there to cover them all, so I’ll try to cover more broad techniques with some notable libraries: jQuery Using jQuery as an animation tool (with .animate()) is pretty outdated. Unless you really need your animations to work in IE versions 9 or…

Read More →

The State of Web Animation: Part 1

We’re now well into 2018 and I’m thinking it’s time for a check-in. A lot has happened in the world of the web in the last few years, so let’s review a bit: Responsive Design is now the norm. Clients know what User Experience Design is now and not only respect it but expect it on their projects. Concerns for Web Accessibility are growing. Internet Explorer is all but dead and browsers are in a state of constant improvement without being locked into one version or the other. Overall, I’d say things have really taken an amazing turn for the better (for developers anyway). Now that we’ve begun to cover the basics of the availability and understandability of our content and tools, what’s next? I like to think the next era can focus not on technology, but on how we can make the web feel more like our natural world. And don’t worry, I’m…

Read More →

How to use Drupal 8's off-canvas dialog in your modules

The goal of this tutorial is to show how to use Drupal 8.5’s new off-canvas dialog in your own Drupal modules. The term “off-canvas” refers to the ability for a dialog to slide in from the side of the page, in addition to resizing the page so that no part of it is obstructed by the dialog. You can see the off-canvas dialog in action in this animated GIF: This new Drupal 8.5 feature allows us to improve the content authoring and site building experience by turning Drupal outside-in. We can use the off-canvas dialog to enable the content creator or site builder to seamlessly edit content or configuration in-place, and see any changes take effect immediately. There is no need to navigate to the administrative backend to make edits. As you’ll see in this tutorial, it’s easy to use the off-canvas dialog in your own Drupal modules. I use…

Read More →

SANDcamp: Introduction to Site Building

Start:  2018-03-23 09:00 – 17:00 America/Los_Angeles Organizers:  rainbreaw cstauffer Event type:  Training (free or commercial) https://www.sandcamp.org/introduction-drupal-8-site-building Description Learn the basics of building a CMS (content management system) based website using Drupal 8 — a completely customizable, flexible, and scalable open-source framework. This introduction will give you all of the essentials required to produce a straightforward site, customize your content and displays, and enough knowledge to find more targeted information for unique customizations as you progress through your Drupal site building adventures. This training is being offered by STAUFFER – www.stauffer.com – for free as part of the Drupal Global Training Days initiative. Training Agenda Morning: Part I Introduction: What is Drupal? Getting Set Up Quickly Basic Site Configuration Basic Content Creation Navigation / Structure: — The Menu System — Taxonomy Morning: Part II Going beyond OOTB (out of the box) Options — Changing functionality with Contributed Modules — Customizing your…

Read More →

The JavaScript Learning Landscape in 2018

Raise your hand if this sounds like you: You’ve been in the tech industry for a number of years, you know HTML and CSS inside-and-out, and you make a good living. But, you have a little voice in the back of your head that keeps whispering, “It’s time for something new, for the next step in your career. You need to learn programming.” Yep, same here. I’ve served in a variety of roles in the tech industry for close to a decade. I’ve written a bunch of articles on design, coding, HTML, and CSS. Hell, I’ve even written a few books and spoken at conferences around the world. But there’s still that voice that keeps telling me I need to tackle programming; that I’ll never be fulfilled until I learn how to develop my own ideas and projects from scratch. Being a web guy, the obvious language to learn: JavaScript.…

Read More →

Direction Aware Hover Effects

This is a particular design trick that never fails to catch people’s eye! I don’t know the exact history of who-thought-of-what first and all that, but I know I have seen a number of implementations of it over the years. I figured I’d round a few of them up here. Noel Delagado See the Pen Direction-aware 3D hover effect (Concept) by Noel Delgado (@noeldelgado) on CodePen. The detection here is done by tracking the mouse position on mouseover and mouseout and calculating which side was crossed. It’s a small amount of clever JavaScript, the meat of which is figuring out that direction: var getDirection = function (ev, obj) { var w = obj.offsetWidth, h = obj.offsetHeight, x = (ev.pageX – obj.offsetLeft – (w / 2) * (w > h ? (h / w) : 1)), y = (ev.pageY – obj.offsetTop – (h / 2) * (h > w ? (w…

Read More →

Stimulus 1.0: A modest JavaScript framework for the HTML you already have

Modern JavaScript doesn’t have to mean single-page, client-side MVC apps.We write a lot of JavaScript at Basecamp, but we don’t use it to create “JavaScript applications” in the contemporary sense. All our applications have server-side rendered HTML at their core, then add sprinkles of JavaScript to make them sparkle.This is the way of the majestic monolith. Basecamp runs across half a dozen platforms, including native mobile apps, with a single set of controllers, views, and models created using Ruby on Rails. Having a single, shared interface that can be updated in a single place is key to being able to perform with a small team, despite the many platforms.It allows us to party with productivity like days of yore. A throwback to when a single programmer could make rapacious progress without getting stuck in layers of indirection or distributed systems. A time before everyone thought the holy grail was to confine their…

Read More →

Is jQuery still relevant?

Remy Sharp: I’ve been playing with BigQuery and querying HTTP Archive’s dataset … I’ve queried the HTTP Archive and included the top 20 [JavaScript libraries] … jQuery accounts for a massive 83% of libraries found on the web sites. This corroborates other research, like W3Techs: jQuery is used by 96.2% of all the websites whose JavaScript library we know. This is 73.1% of all websites. And BuiltWith that shows it at 88.5% of the top 1,000,000 sites they look at. Even without considering what jQuery does, the amount of people that already know it, and the heaps of resources out there around it, yes, jQuery is still relevant. People haven’t stopped teaching it either. Literally in schools, but also courses like David DeSandro’s Fizzy School. Not to mention we have our own. While the casual naysayers and average JavaScript trolls are obnoxious for dismissing it out of hand, I can…

Read More →

10 Web Design Choices That Can Kill Your Clients’ Search Ranking

As a web designer, there’s no getting away from your responsibility to make design choices with SEO in mind. Your clients want their sites to rank well in search engines – there’s not much point in having one otherwise – and this means we sometimes have to make compromises. Compromise really is the key term, too. There’s no perfect way to design a website for search and your all your other priorities (user experience, conversions, etc.). You have to make the call on a number of design choices and come to the best overall result you can. Here are 10 design choices to avoid for the sake of your clients’ search ranking. Indexability killers The first thing to think about with search optimisation indexability and there are a number of potential issues you can come across as a designer. #1: One page, too much content Even basic apps like IFTTT and Pocket break…

Read More →

10 Web Design Choices That Can Kill Your Clients’ Search Ranking

As a web designer, there’s no getting away from your responsibility to make design choices with SEO in mind. Your clients want their sites to rank well in search engines – there’s not much point in having one otherwise – and this means we sometimes have to make compromises. Compromise really is the key term, too. There’s no perfect way to design a website for search and your all your other priorities (user experience, conversions, etc.). You have to make the call on a number of design choices and come to the best overall result you can. Here are 10 design choices to avoid for the sake of your clients’ search ranking. Indexability killers The first thing to think about with search optimisation indexability and there are a number of potential issues you can come across as a designer. #1: One page, too much content Even basic apps like IFTTT and Pocket break…

Read More →

Dropdown Menus in Drupal 8 with the Superfish Module

If you want to build a large, multi-level drop-down menu in Drupal 8, then the Superfish module is a great choice. The Superfish module makes use of the jQuery Superfish menu plugin, which is useful for multi-level drop-down menus. Superfish has more features than most dropdown menus. It supports touch devices and keyboard interaction. [[ This is a content summary only. Visit http://OSTraining.com for full links, other content, and more! ]] Source: https://www.ostraining.com/

How to Create a Custom jQuery Plugin

jQuery is, in my humble opinion, the best Javascript library. Much of jQuery’s popularity is due to the fact that it considerably reduces development time. Their slogan is “write less, do more”, which is a great summary of jQuery’s benefits. What make jQuery really great are the plugins. Plugins are reusable portions of code which help you write even less Javascript to achieve specific features on the client side. For example, you can use plugins to create slideshows, galleries, popups and more. In this tutorial, you will learn how to create your own custom jQuery plugin in 4 easy steps. Let’s start… [[ This is a content summary only. Visit http://OSTraining.com for full links, other content, and more! ]] Source: https://www.ostraining.com/

Web Developer, Front-End – George Washington University – Foggy Bottom, MD

Drupal 7 experience (required). Experience building responsive websites using Drupal CMS , HTML /HTML5, CSS /CSS3, and JavaScript/jQuery….From George Washington University – Mon, 21 Aug 2017 16:25:18 GMT – View all Foggy Bottom, MD jobs Source: http://rss.indeed.com/rss?q=Drupal+Developer

Improving Conversations using the Perspective API

I recently came across an article by Rory Cellan-Jones about a new technology from Jigsaw, a development group at Google focused on making people safer online through technology. At the time they’d just released the first alpha version of what they call The Perspective API. It’s a machine learning tool that is designed to rate a string of text (i.e. a comment) and provide you with a Toxicity Score, a number representing how toxic the text is. The system learns by seeing how thousands of online conversations have been moderated and then scores new comments by assessing how “toxic” they are and whether similar language had led other people to leave conversations. What it’s doing is trying to improve the quality of debate and make sure people aren’t put off from joining in. As the project is still in its infancy it doesn’t do much more than that. Still, we…

Read More →

Making Better HTML Tables

Inspired Magazine Inspired Magazine – creativity & inspiration daily Strangely enough, one of the most difficult web technologies to master is one of the earliest ones to be available for the browser after plain text and images. The problem is even greater today with so many different device types that need to be thought about. Perfect tables are nearly impossible to create unless they contain so few items that no problems are likely to be triggered. The kinds of errors that can arise include: Text wrapping incorrectly Justification errors Table rendering off screen Scroll problems Row height errors Column width errors General ugliness or untidiness In this article we’ll take a look at how to avoid problems like that, so your tables have the best chance of creating a good impression. Avoidance strategies to avoid Because tables are so difficult to get right, some people try to avoid using them.…

Read More →

More Gotchas Getting Inline SVG Into Production—Part II

The following is a guest post by Rob Levin and Chris Rumble. Rob and Chris both work on the product design team at Mavenlink. Rob is also creator and host of the SVG Immersion Podcast and wrote the original 5 Gotchas article back in ’14. Chris, is a UI and Motion Designer/Developer based out of San Francisco. In this article, they go over some additional issues they encountered after incorporating inline SVGs in to Mavenlink’s flagship application more then 2 years ago. The article illustrations were done by Rob and—in the spirit of our topic—are 100% vector SVGs! Wow, it’s been over 2 years since we posted the 5 Gotchas Getting SVG Into Production article. Well, we’ve encountered some new gotchas making it time for another follow up post! We’ll label these 6-10 paying homage to the first 5 gotchas in the original post 🙂 Gotcha Six: IE Drag &…

Read More →

Back to Top