Web Developers Mock You - Site Dev for Artists
 
View testimonialsView Artwork
Results 1 to 2 of 2
  1. #1
    Join Date
    Jun 2003
    Location
    Olympia, WA USA
    Posts
    2,021
    Thanks
    1,874
    Thanked 490 Times in 328 Posts
    Follows
    0
    Following
    0

    Web Developers Mock You - Site Dev for Artists

    I was working on the CSS for my website this morning and thought I would create a thread to share important information about various problems I encounter in the web development process. I do all of my own coding and understand the basics of web design from working on professional Web Dev teams as the artist, doing a tiny bit of cleanup code and overhearing frustrations voice by the programmers. I would love to hear other artists talk about code wrangling or about other problems they see unique to the artist web presence situation. Good examples, bad examples, etc.

    What I understand now for the 2011 year is "CSS GOOD, OPENING NEW WINDOWS BAD"

    About my website:

    Even though my website features art from more than one person, since we are a design team, it's still my main link to refer customers to. My files are labelled "templatemo_26.jpg" etc. like a total noob. (it's ok, I don't build websites for a living, I just make graphics for them sometimes) Looking at "my" source code reveals a slick little site built on the shoulders of CSS geniuses (well they are geniuses to me). The free template itself was named "Fruit Art" and had this silly color scheme of red and black, with a bowl of fruit. "Diamond in the rough!" I mentally shrieked, downloading it greedily to find out how I could corrupt it with my art.

    Here's a before and after shot:

    Fruit Art:

    http://www.templatemo.com/preview/te..._199_fruit_art

    Ningishzidda Art:

    http://www.ningishzidda.com/mutationalalchemytarot.htmlEdit: (this link was edited due to the following post!)

    The top two scripts artists need to know about for implementing into their site are Lightbox and Mootools.

    Lightbox and Mootools

    Lightbox is the script conceptart.org uses in the galleries at the top of the forums. I've used it before, it's safe and sane and not too hard to implement. I use Mootools for their Slideit feature, a simple and sleek slideshow bar that actually came with the template . I found it a little too n00bish to just link straight to the jpeg from the Slideit bar.

    I thought I would try to incorporate Lightbox into my Slideit bar, but after an hour of research, uploading test html files, swearing, mumbling to self, and code editing I found out Mootools and Lightbox have known compatibility issues and can't mesh unless you're some kind of programming genius I guess. (if anyone has any ideas on how to make this work simply let me know)

    Good Example

    For now I'm just going to have to decide if I want a bloated set of html pages for each individual image. Ken Wong has an excellent and simple example of this time consuming setup right here, however it's also a very professional looking result if you're not staring at the wall of insurmountable .html files on your server behind the scenes. Anyone can build a website like this if you know basic HTML.

    http://www.kenart.net/index.htm


    I love that when I click on an image, I get art, instead of an awful eternal loading bar or other nonsensical result as I do on most other artist's websites. Updates are simple and relevant on the side. Even though it doesn't have a lot of bells and whistles, it's one of the few artist websites I don't leave out of sheer frustration (without seeing a single piece of art)

    Bad Example

    To illustrate, recently a movie premiered in the Pacific Northwest about occultism. The website is horrible, but functional, I was able to view the trailer, find out about the producer and the name of the artist who designed the sets. (You can view the website here.) I decided not to go see the premier, but I wanted to know more about the artist, his shit was pretty cool.

    Here's the link:

    http://beaucaughlan.com/

    The first thing you get is an odd little yellow and green animation in the top left (depending on your connection speed). You have to be quick to notice it, but it's there. Like a lemon and lime conducting some sort of exhibitionist sex crime.

    The website loads, and at the top a weird animated banner greets you. I have not a lot against animated banners, if the artist really wants them, and if they are attractive and load quickly. This grainy, pixelated mish mosh of "distressed" imagery looks like a website from the late 90's when animated gif's were in and "gigantic" 320Mb.tif files of naked girls wern't so daunting - we had bandwidth and it didn't take 3 hours to download one image.

    Then we have a lovely tiny photo image of a gallery that the artist has presumably shown in. With green pancakes all over it. I sigh.

    This artist has really lovely art. If you can get to it. Guarding the easy access to images is an evil slideshow that tries to load an autoplay feature if you try to wrest control for yourself. There is no visible pause function. Images are tiny and hoarded - the gorgeous photos of murals flit away, replaced by something else. Try to go back, the slideshow feature will start loading again with an annoying fadein effect.

    Argh.

    To be honest, the only reason I am revisiting this website is because it is the most recent bad example that I could locate again in recent memory. I didn't even bother trying to load the images the first time. The lemon and lime having sex followed by green pancakes and memories of web surfing in High School didn't have my hopes very high. It's sad because his stuff is really decent.



    Today I'll be deciding if I want to go ahead and make an html file for each image on the site to link to. I have done this before and it's not fun. I might just leave it alone and let people find out more from Deviantart or whatever.

    I am breaking the "open new window" rule in the links from images in my Slideit bar. Reluctantly I edited out the target=blank and put in the parent rule when I realized you can definately choose "open in new tab" on right clicking in the Slideit bar. I have to admit this is one web faux pas I should never have been guilty of...

    Last edited by Izi; June 19th, 2011 at 06:21 PM.
    ---- -
    sehertu mannu narāṭu ina pānāt šagapīru ningishzidda
    abrahadabra
    Reply With Quote Reply With Quote


  2. Hide this ad by registering as a member
  3. #2
    Join Date
    Jun 2003
    Location
    Olympia, WA USA
    Posts
    2,021
    Thanks
    1,874
    Thanked 490 Times in 328 Posts
    Follows
    0
    Following
    0

    Wordpress is amazing - if you have someone to help figure it out!

    Ok lesson learned: do not create a great CSS site if what you REALLY need is a wordpress site. I should have known this, since a lot of my favorite artists use blog format anyways. Sites like blogger, livejournal or blogspot didn't offer the kind of functionality we needed. Blog support offered for free by my awesome hosting company, 9th Node Networks was a complete mystery to me.

    My partner (who is a totally amazing web dev in his own right) had the patience to hack away at WordPress world. The result (below) is MUCH easier to maintain, no making multiple bloody pages server side.

    www.ningishzidda.com (we simply put in a redirect to the blog right away, we liked the format so much)

    Updating a post is handled by the WordPress and plugins itself - and there are a ton of plugins. WordPress isn't actually worth anything without them in my opinion. Here's a list of ones we used with descriptions by the developers:

    1 Flash Gallery: 1 Flash Gallery is a Photo Gallery with slideshow function, many skins and powerfull admin to manage your image galleries without any program skills

    Akismet:Used by millions, Akismet is quite possibly the best way in the world to protect your blog from comment and trackback spam. It keeps your site protected from spam even while you sleep.

    Avatars: A plugin to manage public and private avatars.

    BuddyPress Sliding Login Panel: Adds a sliding login panel with account center and user menu to BuddyPress.

    cbnet Ping Optimizer: Saves your wordpress blog from getting tagged as ping spammer.

    Greg's High Performance SEO: Configure over 100 separate on-page SEO characteristics. Fewer than 700 lines of code per page view. No junk: just high performance SEO at its best.

    HeadSpace2:Meta-data manager on steroids, allowing complete control over all SEO needs such as keywords/tags, titles, description, stylesheets, and many many other goodies. (THIS IS A KILLER APP, It made us pop on google's #1 result in less than 24 hours!)

    NextGEN Gallery: A NextGENeration Photo Gallery for WordPress

    Pages Posts: Amend pages and put posts inside them - either by category or tag

    Theme My Login:Themes the WordPress login, registration and forgot password pages according to your theme.

    WP-DBManager: Manages your WordPress database. Allows you to optimize database, repair database, backup database, restore database, delete backup database , drop/empty tables and run selected queries. Supports automatic scheduling of backing up, optimizing and repairing of database.

    WP-PageNavi: Adds a more advanced paging navigation to your WordPress blog

    WP DB Optimizer: Optimize your database tables without phpMyAdmin in one clic for high performance.

    WP Spry Menu: Automatically create spry dropdown menu for Wordpress Category (AWESOME)

    All of these plugins are free or donation-only, making them doubly awesome.

    Ok so the CSS site wasn't a total waste, either. Since the banner piece is from The Mutational Alchemy Tarot, we are going to use it as the official site of the Tarot once it is published, and change the five categories into the categories of the Tarot: Major Arcana, Court Cards, Minor Arcana or maybe Major Arcana, Fire, Air, Earth and Water respectively.

    ---- -
    sehertu mannu narāṭu ina pānāt šagapīru ningishzidda
    abrahadabra
    Reply With Quote Reply With Quote

Members who have read this thread: 2

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Register

Developed Actively by vBSocial.com
SpringOfSea's Sketchbook