Im NEW here, please help

Discussion in 'HTML & Website Design' started by Ed Camacho, Mar 19, 2013.

  1. #1
    Hey guys I just designed a website for my band Audiostrobelight and Im having a hard time making it do what I want. Its an EXTREMELY simple site. You can view it at www.WhatYoureRunningFrom.com

    Its designed to show the images when you hover but I made up code to make it work and now it wont work right on phones or some other browsers

    Suggestions?
     
    Ed Camacho, Mar 19, 2013 IP
  2. webcosmo

    webcosmo Notable Member

    Messages:
    5,840
    Likes Received:
    153
    Best Answers:
    2
    Trophy Points:
    255
    #2
    You have to use a javascript that changes the visibility of that element,- for browsers that do not support opacity property.
     
    webcosmo, Mar 19, 2013 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    First off, "phones" are usually touchscreens, and touchscreens usually don't HAVE hover states because what's the point of having a display state hidden under your finger.

    Second, what you are calling "simple" is really something too complex for web deployment if you actually want people to use the website on phones, mobile, across browsers, etc, etc... Where's your CONTENT? How do these massive bandwidth hogging images with nothing resembling actual content help visitors to your site have ANY clue what it's about, why they should care, etc, etc?

    Text is a first class citizen on the Internet, get some! Everything else may as well have leprosy. This is even more true once you get into the concepts of accessibility, cross browser support, fluid layout, and responsive layout.

    Basically, there's a REASON you don't see websites pulling these types of stunts. In a lot of ways designs like this beg the question: "Have you ever actually seen a website?" Kind of funny in a way as what you've done is made a splash page -- something that every "top ten web design mistakes" list from a decade ago would have had on it. (alongside auto-playing music and gif animated backgrounds)

    Much less what makes those images a paragraph? Why are you absolute positioning the outer DIV? Why can't you describe those IMG with proper ALT? Why are you using the ALIGN attribute, this isn't 1997? Even just trying to set their widths and heights in percent is begging for them to break. Some code formatting that was consistent instead of everything just kind-of slapped in there any old way would be nice too.
     
    deathshadow, Mar 19, 2013 IP
  4. Ed Camacho

    Ed Camacho Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #4
    Well that was said very generously lol.

    Long short I play in the band Audiostrobelight. I'm designing the band page for our new album release "What You're Running From." This is the teaser site just showing the album name with the album cover that appears when you hover.

    I did put random codes in there trying to make it do what I want. My issue is that on a phone the background shows white on the bottom and the album cover images done expand to the bottom of the screen. That's where my issue is. Any suggestions?
     
    Ed Camacho, Mar 19, 2013 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #5
    My advice, lose the goofy hover nonsense, show the ACTUAL cover completely/all the times with the band name, include the release date, include images off fallbacks and actual content so search engines can find it.... and maybe a blurb about the band and it's members... FORGET what you are trying to do, there's a reason you don't see sites like that in the first place! It's just gimmicky nonsense instead of real and practical promotion of the release.
     
    deathshadow, Mar 19, 2013 IP