Home General Discussion

I need help getting started on my web page

Weiser_Cain
polycounter lvl 18
Offline / Send Message
Weiser_Cain polycounter lvl 18
So I want to put up a web page. Thing is I know next to nothing about what I need to accomplish this task.
Here's what I had in mind...
Super_Slick_Design_Document.jpg
Try not to stunned by my talent.
My question. Is there a way other than doing the whole thing in flash to have an animated logo that overlaps the main text?

Replies

  • JonMurphy
    Options
    Offline / Send Message
    JonMurphy polycounter lvl 18
    I'm sure with some clever CSS positioning and gif manipulation, it's possible. It would take some learning, though
  • Mark Dygert
    Options
    Offline / Send Message
    This is going to sound mean, but I can't help you if I don't know what I am looking at. If you are going to hold the pen in your ass cheeks when you draw, please use your hands to type comments as to what is what.

    Since the goal sounds vaugly complex I vote you Keep It Simple.
  • KDR_11k
    Options
    Offline / Send Message
    KDR_11k polycounter lvl 18
    Strong Bad's advice.

    Bungie does that, might want to look at the source code.
  • notman
    Options
    Offline / Send Message
    notman polycounter lvl 18
    Looks like a treasure map

    Read up on html before you jump into flash.
  • TomDunne
    Options
    Offline / Send Message
    TomDunne polycounter lvl 18
    That's nifty how Bungie did that, just funky rollovers. I'd have totally done that with Flash tongue.gif
  • ElysiumGX
    Options
    Offline / Send Message
    ElysiumGX polycounter lvl 18
    Some advice. Please, please, please do not make a slow loading webpage made entirely of slices. Knowing just the smallest bit of HTML goes a long way towards winning at the interweb.
  • Mark Dygert
    Options
    Offline / Send Message
    Been to my site have ya? I really have to redesign it, maybe after the war is over...
  • ElysiumGX
    Options
    Offline / Send Message
    ElysiumGX polycounter lvl 18
    [ QUOTE ]
    Been to my site have ya?

    [/ QUOTE ]

    Actually, I've seen much worse. I was referring to someone recently who thought he knew everything about anything. The thing that bugs me about Imageready created sites is you get a whole bunch of

    http://www.vigville.com/images/3d_18.gif

    and

    http://www.vigville.com/images/3d_94.gif

    When you could have just used a background color, and a 1x1 resized transparent spacer gif. I bet that's a pain to edit without Imageready. I knew a guy, I think he used Fireworks, and all his pages would be hundreds of image slices. Even the text within the body. Took forever to load. It was his business, and he would charge $400 per page. And these small businesses would fall for it. confused.gif

    Another trick: If you happen to have a splash page, take some of the important navigation and title images from your pages, and place them at the bottom of the splash page...but resize them all as 1x1. like .... . When someone enters your site, the images are already loaded.
  • MoP
    Options
    Offline / Send Message
    MoP polycounter lvl 18
    CSS has a handy little tag you can apply to objects called "z-index", the higher number you give this, the higher the "layer" will be - so if your main page text is on a z-index layer of 1, and your transparent-backgrounded GIF logo is on z-index 2, it will float over the top of the text.

    That said, unless you pick your colours wisely, transparent GIFs often have jaggy edges around the transparent outline, which I think often looks poor.

    Have you considered just putting the logo at the top and not worrying about it overlapping text? That'd be a lot easier.
  • notman
    Options
    Offline / Send Message
    notman polycounter lvl 18
    I'm with you ElysiumGX. Those are some of my pet peeves also. I tend to use fireworks to create my designs graphically, then I will slice in it, just to have the table created. But then I go into notepad and clean up the html so that 1 pixel blanks, fill the page rather than full color squares. It usally requires adjusting the tables out of the scattered mess that fireworks can create.

    There are many ways to optimize a website, unfortunately, there are a lot of people that don't read-up.
  • Slum
    Options
    Offline / Send Message
    Slum polycounter lvl 18
    I'd really like to chime in here with something, albeit not very constructive. Take it how you may.

    Have you thought about stepping out of 1999, and considered maybe the content of your site is a little more important than the 5 layers of animated gifs and flash menus?
  • KDR_11k
    Options
    Offline / Send Message
    KDR_11k polycounter lvl 18
    Ely: Can't you just add a style="bottom-padding:130px" (or something like that) to the element you want to add space to?
  • MoP
    Options
    Offline / Send Message
    MoP polycounter lvl 18
    KDR: Yep, that'd be easier and more sensible than using a big transparent GIF. Also you could use CSS and create a specifically-sized DIV area.
  • notman
    Options
    Offline / Send Message
    notman polycounter lvl 18
    [ QUOTE ]
    Ely: Can't you just add a style="bottom-padding:130px" (or something like that) to the element you want to add space to?

    [/ QUOTE ]

    Hmmm, I haven't seen that suggested before. I'll have to start using that. I'm trying to get into using CSS files more often. I've had problems in the past where they didn't always load (not only on my site), which makes the site turn to crap. Firefox especially, used to have issues with them. These days though, it's gotten much better support from all browsers.
  • poopinmymouth
    Options
    Offline / Send Message
    poopinmymouth polycounter lvl 19
    I just did my entire website using CSS. I was intimidated at first, but after diving in, I LURVE it with my face. Definately superior to plane jane tables and HTML.

    poop.gif
  • ElysiumGX
    Options
    Offline / Send Message
    ElysiumGX polycounter lvl 18
    [ QUOTE ]
    that'd be easier and more sensible than using a big transparent GIF.

    [/ QUOTE ]

    A 1x1 pixel gif isn't that big really. I need to spend more time learning CSS. I just use it to make editing some aspects of several pages all at once. And those cool colored scrollbars OMG!!!
  • poopinmymouth
    Options
    Offline / Send Message
    poopinmymouth polycounter lvl 19
  • Daz
    Options
    Offline / Send Message
    Daz polycounter lvl 18
    I wouldn't have worded it like that but I think Slum might be onto something. Personally speaking I think gauss has a site that works better than most. Nothing sliding, fading, popping up or making neat sounds. Just Art.
    Thanks for that link Poop.
  • Withers
    Options
    Offline / Send Message
    Withers polycounter lvl 18
    Maybe I'm not understanding the question/drawing, but I think your trying too hard.
    It looks to me by "overlap" that you just want that image in the circle to come down into the same area as the text, like the bottom half of the circle is sitting on a different background color. That would all be done with image editing, and it would not require any transparent gifs. You would just create the image with the corresponding background colors behind it, then line it up on the page using tables or css.

    The only real question is how do you want to animate your image. You really only have a couple of choices, a script that changes the image, an animated gif, or Flash.

    Flash is your safest bet of all in my opinion, animated gifs do not work for everyone universally. Some firewalls and internet security programs block them, (like zonealarm for instance, which is pretty popular), and scripting, on top of taking time to learn, can also be a problem for some security/browsers.
  • Rick Stirling
    Options
    Offline / Send Message
    Rick Stirling polycounter lvl 18
    Forget flash. There are a few simple rules to designing a website

    1. unless you pretentious, the design should be discarded at this stage.
    2. What content do you want to show, and who do you want to show the content to?
    3. How easy should it be to find the content? Do you want it to be easy or difficult (here's a clue - make your content easy to find).
    4. Do you ever plan to change the design of your site? Do you want to keep a good portion of the content? Here is the quick answers - yes, yes.

    5. Design the site around your content. Make it easy to navigate, don't confuse the visitor, make things logical. Use CSS to describe everything.


    Here is a CSS TOP SECRET!!!!!111one

    Don't call things names like orange_bit, left, heavygreen or redtext. Why not? Those are descriptive of the style and design. STYLE ABSTRACTION IS THE KEY!

    Call your css things like image_caption, news_date, newsheader -use the css to describe the content, and not the style you want to present it. That way later, when you decide you want all your newsheaders to change you find the newsheader bit and change it - if you have green bold text and want it to be red and italic, it makes more sense for it to be called newsheader and not heavygreen.
  • ElysiumGX
    Options
    Offline / Send Message
    ElysiumGX polycounter lvl 18
    Flash is irritating for webpages. Especially the ones that take 5 minutes to finish tranforming into a webpage. And webdesign would be a little more fun if a certain outdated and problematic web browser would display .PNGs correctly by default.
  • Asthane
    Options
    Offline / Send Message
    Asthane polycounter lvl 18
    [ QUOTE ]
    The only real question is how do you want to animate your image.

    [/ QUOTE ]

    And the only real answer is "you don't" wink.gif

    [edit] Had to be said smile.gif
  • Withers
    Options
    Offline / Send Message
    Withers polycounter lvl 18
    Well, I wasn't suggesting he create a Flash website or splash page.
    I don't think a lot of people realize that you can use it strictly to create animated images, and they will load just as fast as a static image if made correctly.

    As for whether or not he should do it....that's a whole other issue, I'm just trying to help.
  • TomDunne
    Options
    Offline / Send Message
    TomDunne polycounter lvl 18
    Speaking as a multimedia designer and not as a game developer, I think some of these words of wisdom need a bit of tempering wink.gif If it's *just* a game art portfolio site, yeah, the fancy stuff should take a backseat to content delivery. But dimissing Flash, animated graphics and similar tools in general would be throwing the baby out with the bathwater. Think of Flash implementation the way you would a Photoshop filter; there's nothing inherently wrong with the tool, but with how poorly the tool is used. Nested movie clips alone make Flash worth the trouble, but newbies tend to go apeshit with animation and stupidly complicated interfaces - that's bad design, not a bad program.

    *edit*

    If you do dig Flash, I think Eric Jordan is pretty much 'The Man'. 2advanced always rocks.
  • Asthane
    Options
    Offline / Send Message
    Asthane polycounter lvl 18
    [ QUOTE ]
    Nested movie clips alone make Flash worth the trouble

    [/ QUOTE ]

    Don't get me started, I hate-- no-- loathe embedded video. tongue.gif
  • TomDunne
    Options
    Offline / Send Message
    TomDunne polycounter lvl 18
    Nono, I didn't mean video. "Movie Clip" is a technical term within Flash, which I have always thought is very misleading. Basically, a Movie Clip is a length of Flash animation, even a fully separate interactive piece, that operates inside of another Flash piece. This is what allows for multiple levels of animated interactivity to occur without an identical timeline. An example would be a rollover menu that has animated components within the new menu, or dynamic animation that changes in response to user inputs. Kind of hard to explain, I guess. I'm actually laughing a bit, I remember having to have this repeatedly explained to me back in 1999; Macromedia's tech-speak has always sucked!

    Anyway, I agree that embedded video is usually evil, but will say that the video functionality in Flash Professional kicks ass - no worrying about whether a client has the right codec, all he needs is the current Flash plugin and you can detect for that prior to site launch.
  • KDR_11k
    Options
    Offline / Send Message
    KDR_11k polycounter lvl 18
    I have Flash disabled because it's mostly used for annoying ads. If a website requires Flash to display a menu or crap like that I just close it.
  • Weiser_Cain
    Options
    Offline / Send Message
    Weiser_Cain polycounter lvl 18
    Wow, thnks for all the responses. Lots of reading to do.
Sign In or Register to comment.