Themes
Plugins
Quit it and forget it.
I have run into this problem so many times: I’m banging away on my OSX rig doing something important in Fireworks CS3 (yeah, I know…) and I’ve got a dozen things open. The client sent me two Word documents and a PowerPoint for the web copy. Meanwhile I’m uploading some YouTube clips for another client, while at the same time I’ve got Illustrator open with the web assets for the self-hosted WordPress site I’m trying to finish for deadline 10 minutes away.
Quick! Make some changes to the slices for my custom content boxes, tab over to the preview, good. Save. Wha-!?
“Fireworks can not save the document because an internal error has occurred.”
Desperately I tab through all the windows I have open. Holy god…I don’t know what changes were in the last save. I mean, I’m good about saving…usually.
I have to grit my teeth and quit fireworks – it’s hell when each window opines “…there are changes to this document that will be lost if you do not save.” Oh cruel dialog box – taunt me no more.
It ends in heartbreak and missed deadlines.
So when it came up today, of all days, nothing else mattered to me other than outsmarting the demon roosting in my favorite graphics app. This time, I resolved, it would be different.
After doing some searches on different things that cause this issue, I kept seeing things about font issues being at the core of it all. I took a break and ranted to my friends about my terrible luck…When I returned it dawned on me: what if simply disabling my font-manager software would let fireworks save without dealing with any of my active fonts?
With a smirk of doubt still on my face, I right-clicked the SuitcaseFusion icon.
“Quit”
And I waited for the lil’ icon light to dim while tapping my foot impatiently.
Finally it went out, and clicked back over to Fireworks. I tried a fast cmd-s.
Holy cmd-s! It worked!
So I’m posting this in case anyone else out there keeps running into this and wants to try an easy fix. You might be able to save your work, even though the error has already cropped up, by simply quitting your font-management software. For me, closing Suitcase Fusion completely elimintated the problem and my documents could ALL be saved.
Take that Fireworks demon! I won, you lost.
The images below are a pixel-accurate view of the spaces web designers consider when they segment designs. We segment them so that the first impression is complete at a glance for our ‘least common denominator’ (the lowest supported resolution) but also takes into account a balanced look on larger screens. Typically, the contemporary trend is to set a fixed-width for the page matching the width of your least common denominator, and all critical content should stay in that width. Horizontal segments then flow down the screen segmented at the termination points of common screen resolutions. Depending on the target market’s technological sophistication these points may be different. In this example, I chose the common practice of supporting 1024 x 768 as the most common low-resolution setting in the general public. I then added some segments for the next common size up, and have the footer still on screen for our 1080p users. However a design can be bottomless.
People are used to scroll bars now. The more content on the home page, and links to news articles, blog posts, promotional pages, features and other highlighted content that we present the better. This gives google and other information centered services lots of hooks to our content and pages. Maximum connectivity of content means maximum web presence and information propagation. This is also an easy format to update and control.
Obviously this is a fake design and not intended as a hard guide for your own work which probably diverges creatively (and in good ways) from a lot of web trends. However usability wise, we should recognize how the amorphous shape of the web browser will re-crop our work constantly, and so we should design from that awareness. I hope this example helps underscore some of what we discussed as we move forward to better alignment of the existing designs and a fun user experience for your customers.
1. How the browser space can change between devices. (Click to Enlarge)
2. How a design can be overlaid on the format-logic of multiple devices.
3. An isolated design shown at maximum supported resolution.
Our friend Alex Williams over at Thermal Exposure has put together this excellent guide on using WordPress. This is a great reference for common WordPress features and the basics of managing your content. If you are wondering what WordPress is like, or can’t remember how to add a PDF file – then this page should be in your bookmarks.
http://www.thermalexposure.com/2011/08/01/wordpress-new-user-tutorial
Wondering where Pair networks keeps bash hidden?
I was frustrated. I had spent the weekend on a bash script for a client hosting with Pair networks and NOTHING was working properly. Their old and moldy MYSQL 5.0 required I come at a certain client-problem from a rather tedious angle that needed bash to parse a lot of lines returned from a MYSQL command-line query in somewhat sophisticated ways. My first problem was that the MYSQL commands wouldn’t run. This is because Pair actually has my MYSQL and database related things going on another machine. So to run a mysql command, I needed to add some info beyond what I needed in my dev setup:
mysql -hYOURDBSERVER.pair.com -uUSERNAME -pPASSWORD -e 'SHOW FULL PROCESSLIST;'
The important part here is your server location at the top of the mysql command. Make sure you don’t miss the -h that leads it. Without a space, you might be confused into thinking your server is hdb123.pair.com, but it’s important to note that the -h part is a flag followed by your db123.pair.com as an argument. Another note is to make sure to add a hyphen before the “e” flag on the MYSQL statement. Pair likes it hyphenated…
My next problem was a stubborn refusal from the shell at bin/sh to process arrays. Whenever I tried array-functions in the shell script, I got this error:
declare: not found
Removing the declare got past that, but then when the array was being split up, I got THIS error:
Syntax error: word unexpected (expecting ")")
Though this worked on my local box, this fails utterly in the pair environment. To work around this, we must make sure to invoke the correct shell: bash.
If you are using the generic /bin/sh path, you might discover things like arrays and executions of mysql from the bash environment aren’t working correctly. Locate the binary by typing:
which bash
Mine was here:
#!/usr/local/bin/bash
Now my shell script is running and my client is protected against a serious error that was killing her app.
My first WordPress plug-in is here!
Ah, a new page and I don't have to uncheck those stupid comment boxes again.
This plug-in unchecks the “allow comments” and “allow trackbacks/pingbacks” checkboxes by default for new pages while leaving the default behavior for posts alone.
I get SO tired of unchecking ‘allow comments’ for pages, and I’m SURE that my clients won’t remember to do this when I use WP as a CMS. So I made a plug-in that disables this by default, saving time and energy.
This is sure to make the must-have list for anyone using WordPress as a CMS solution. It’s easy to use, super simple, and a real time-saver!
Enable the plugin to uncheck the discussion checkboxes by default for pages. Disable the plug-in to remove this behavior.
Q. How do I set the preference to turn the default comment status for pages off or on?
A: There’s nothing fancy here. Just enable or disable the plug-in. That’s it.
Page Comments Off Please V1.0.zip
If you are using this plug-in for a commercial project, or if you just find it useful, I’d really appreciate any donations to help keep the open-source mojo flowing! Thanks!
Pricing a design phase can be difficult in the early stages because there is a range of services that can be offered and a variety of processes to use. Before the project is defined, asking for a price on a website is like asking for a price on a car: It depends what kind of car you want, what warranty, and how soon you want it. With web design, and creative work in general, this is even more the case.
Techism can loop in an executive team of business experts and MBAs to review your organization’s goals and marketing strategies and then dedicate months to custom-tailoring your message and tying it to market-driven metrics to gauge creative success. Techism can also just put a page up, slap on your logos and colors, give you the keys and update your creative as time and budget permit in later iterations. How much to spend on a site design, and when to spend it, will depend on your organization’s internal needs and capabilities – not to mention time and budgets. Some companies need to spend 100k on their website, and others need to spend 100 dollars.
It’s often too hard when a relationship is new, deciding just what those needs might be. To start the conversation I find it’s easiest to group typical tasks and capabilities into three easy to understand ranges of creative service to give customers an idea of what’s on the menu.
Advantages: Safe, assured, verifiable, smart and effective.
Disadvantages: Slower and more expensive.
Techism’s Strategic design service begins with good marketing. Your current messaging is reviewed and contrasted against your competitor’s efforts. A distinctive message is crafted to set you apart from your competitors and fine tuned to produce a creative brief. This may include short paragraphs exemplifying the tone of your message, colors and themes to use, an identity review, and information about your competitors and their messaging. This is reviewed until everyone agrees it’s right. Following the direction established in the brief, an informal set of sketches may be produced demonstrating sample executions of the chosen strategy. Once there’s a consensus on the general approach and a thumbnail sketch is chosen, it’s on to the comping stage where mockups are presented showcasing the design’s proposed final look with sample content in place. The approved version is produced and deployed, thereafter its success is measured through tools that gauge important metrics from net promoter scores, retweet rates, online sentiment, and much more. If desired, lateral efforts involving other mediums may be defined such as direct mail, trade show materials, brochures, facebook and twitter campaigns that all execute the same creative strategy.
Advantages: Fairly quick, range of choices, verifiable, reasonably economic if you know what you want.
Disadvantages: Uncertain, inflexible, arbitrary direction, risk of a trendy but not enduring design, often produces bad UI
A more common approach is to trust your gut and just pick something that you find appealing. In this workflow a designer will spend a few hours getting familiar with your industry by checking out the competition you name. A general creative direction will be hashed out over email, in basecamp, or on the phone. The design is drafted, often picking up and refining themes from your existing materials (logos, brochures, old sites, etc). Usually three distinct versions are presented, though sometimes a strong creative affinity between designer and customer may produce a winning concept right away. This is refined until approval and then finally deployed. Changes to designs produced with this method are fairly common after deployment as real-world data starts coming in.
When time and budget are in short supply and a company just needs a site up and running asap, the risks of a poorly calibrated design seem like very distant concerns. This company often wants it to look “professional” and to “match their stuff”. The shorted path to execution is favored, often leaving creative direction solely to the discretion of the designer with the reservation that minor tweaks may be necessary after launch. Creative projects like these are designed “as you go” and may use stock layouts customized with the company’s colors and logo. Sometimes this has worked very well for customers. It’s particularly good for website design since web designers often know what the latest and best practices are in website layout and design where most reviewers might have to get up to speed to make informed decisions.
Advantages: Fast. Cheap. Assured schedule. Relies on expertise.
Disadvantages: Inflexible, arbitrary direction, spare, risky, will need follow up.
Since every creative project is different, every company needs their own process and a good design staff should know how to tailor the process to fit your needs. It’s unlikely that any of the processes above are perfect, but they do demonstrate the range of creative services that can be found with Techism. Techism can design your site with contemporary looks and usability from scratch or by customizing a wordpress theme in-place. We can spend as much time as you want researching, drafting wireframes and thumbnail sketches and using creative briefs to guide the process. It’s up to you what sort of process you are looking for.
I’m a normal guy…Uh…I don’t know why I find myself sniffing around API documentation on my lunch break, or why I end up staring into the screen at 3:00 am with the door closed and the computer sound turned way down so my wife doesn’t hear the casts from railsenvy . I mean, maybe I learned just a little conversational Japanese from watching fan-subs , but that doesn’t make me … one of those people does it?
Dame ka na?
Ok…so sure, I DO program, but it’s just to get things my clients ask me for up and in place. They need a blog and want it mega simple? Ok…I can find a way to do that. They need a contact form? No problem. Maybe they need a page on their site to list employees pulled from a database? Sure, Can do.
But about a year ago some personnel shakeups at an agency I was contracting for landed a heap of development work in my lap when I didn’t have anything else going on. Added to this was the fact that nobody else could take these projects and they were going to breach contracts if I didn’t personally step up and take them. The clients were depending on these projects being completed and I couldn’t let them down. So I bought Agile Web Development with Rails and got by with a little help from my friends. Thus I stepped onto the platform.
Huff huff, choo choo. I am now on rails, and the train is starting to get a little scary.
Sure: Ruby on Rails the framework, in a vacuum, is fine and easy to understand, but for an average designer/developer getting a site up the “rails way” takes forever. I get the magnificent ideas behind the framework. I gleefully gush “The rails way has taught me a WHOLE LOT” about web dev. Before Ruby on Rails I fled from databases, development, and had no idea what MVC was. Rails has been great to me and I’ve really tried to make it work. I still use Rails and will continue to use it in a variety of projects, but let’s face it: I am an amateur developer who is leaving the world of DreamWeaver Templates and entering the realm of partials and views. I’ve gone from a win XP box with the Adobe Suite as my primary development platform to a fatty mac pro tower where I spend most of my time in TextMate. I love rails…in theory…But I don’t think Rails is right for me.
Only full-time expert unix aware experienced full on web-developers hard core programmers can really appreciate rails. If you don’t quite get OOP in practice, a Rails project is going to take you a long time to get things done. The same thing that makes rails so strong is what makes it impractical for development novices: in each function, each method, each class, is a college course worth of material wrapped into a deceptively simple tag. The simplicity is deceptive…and for a dabbler, it’s going to be a source of frustration.
Rails is great if you want to make a scalable web application that is updated from time to time. It is not, however, a replacement for traditional web scripting, php contact forms, static sites, and all that. Rails is not the solution I’ve been waiting for that lets me put up a client’s store-front website.
But what nobody talks about is that although it takes 15 minutes to code a blog, it takes three days to deploy it the first time.
To use rails for your site you need to depend on these layers:
So given all that, when something changes with any component, module, version, dependency for any of the above…something breaks. If you are managing 50 sites on 20 different hosts, you can’t keep up.
Or when a client proposes a typical change: “Oh, I forgot to mention that the metric support we talked about was actually a new class of “metric product” that has totally different properties, but needs to be mixed in with the other products in these complex ways….is that a problem?” In order to be flexible and propose a solution, I need to be secure in my comprehension of all these things and what they are doing…then I have to know the RIGHT rails way solution to implement for this. Does this mean STI for products with two types, Metric and Imperial? How does such a change affect the dozens of finished interactions with the basic product model I already have? Sorting by imperial-first, size ASC, then Metric size ASC? How do I even do that? Is it even possible?
In a simple framework, there’s always some way to hack it together…in a framework that requires always doing everything the “right way”, that option is gone. Knowing the “right way” to solve every problem is not something I expect to have for years and years.
Compare to a static solution or simple PHP or Perl script:
To solve my clients problem, I make the products into subclasses manually, then write a function to sort and parse it the various ways I need it presented at a given time. It’s time consuming, and code-drudgery, but it’s faster and the time is known. Of course, you spend your time reinventing the wheel and the product is often ugly.
But there are far fewer moving parts in the old way of just coding on new functionality like the new wing of a shanty-town shack. One is beautiful and far too complicated, the other is simple and ugly. I’d rather not use EITHER solution at this point. I’ve worked in crappy PHP shopping systems coded by fly-by-night make-it-work and pray operations. I’ve worked on sophisticated rails apps with other developers through a central SVN repo where we spent more time wasting time with cap, SVN, installing crap in UNIX, coordinating gems versions, etc than we did coding the app.
All this makes me think that the web demands a different kind of framework…something we might not yet have. Is it time for a more versatile framework that can function for applications that are online and contain some static pages and inversely within websites to provide some small functionality within the domain?
The unique nature of web work requires a “Scripting Framework” that can also scale to be used as an application framework? Ruby on Wheels? Perl on a Pogo-stick?
To ask what people like me need and what types of environments are truly versatile in website of any stripe, I’ll be exploring this subject in my next post: “What is a website and what is an application?”
This was holding me up for a while. I asked around online and did some code searches on Google but wasn’t able to find a good rails solution to truncating a string of HTML coming out of Textile without cutting off tags and making a general mess of things. Links in particular were problematic.
In the end I came up with a solution that I think was pretty easy to implement in my application controller and that I could call from any view.
Details below,
Enjoy!
#in application_helper.rb
# Does NOT behave identical to current Rails truncate method
# you must pass options as a hash not just values
# Sample usage: <%= html_truncate(category.description, :length =>
# 120, :omission => "(continued...)" ) -%>...
def html_truncate(html, truncate_length, options={})
text, result = [], []
# get all text (including punctuation) and tags and stick them in a hash
html.scan(/<\/?[^>]*>|[A-Za-z0-9.,\/&#;\!\+\(\)\-"'?]+/).each { |t| text << t }
text.each do |str|
if truncate_length > 0
if str =~ /<\/?[^>]*>/
previous_tag = str
result << str
else
result << str
truncate_length -= str.length
end
else
# now stick the next tag with a that matches the previous
# open tag on the end of the result
if previous_tag && str =~ /<\/([#{previous_tag}]*)>/
result << str
end
end
end
return result.join(" ") + options[:omission].to_s
end
end
I’m open to improvement on this. Perhaps extending “acts_as_textiled” or something. Maybe I could find a neater way to put the two arrays together.
As of the time of this writing, I just finished this and will be putting it into a production environment so that I can evaluate if it’s quick enough to work in production. Since I went with regex, I’m hoping so.
You can see it in action on Seaview Global