1. Welcome to TechPowerUp Forums, Guest! Please check out our forum guidelines for info related to our community.

is this even possible?

Discussion in 'Programming & Webmastering' started by Msap14, Aug 29, 2011.

  1. Msap14 New Member

    Joined:
    Nov 11, 2008
    Messages:
    156 (0.07/day)
    Thanks Received:
    10
    Location:
    US
    I am self taught with html, and have used that knowledge to build websites for others. I am trying to put together a website, whose design i have no seen before. To help me expalin this, think of a video game UI...

    in the top left corner i want a box that will update with facebook status automatically, and in the top right I would like to put a ROUND google map surrounded by buttons for different store locations, and at the bottom have the nav bar with icons for each type of service. Of course, in the middle will be a content box which has overflow: scroll enabled. I want the background image to change every few seconds, the website to adjust itself to the screen resolution size of the user's computer, and the map, nav bar, facebook to stay in the right spot.

    An attempt to summarize: video game ui website design with changing background images.

    I am trying to think of where i need to start with this. I am thinking it will be heavy on java scripting (which i don't know how to code myself, ive always just looked up tutorials or used a pre made script) but i don't even know if this is even accomplishable.

    so can i make this happen? or does it not seem possible?

    [​IMG]
  2. Easo

    Easo

    Joined:
    May 19, 2009
    Messages:
    824 (0.43/day)
    Thanks Received:
    78
    Location:
    Latvia
    Mmmm, i suck at it, yet i think with whole page made of Flash that should be possible. Will be heavy though.
  3. Msap14 New Member

    Joined:
    Nov 11, 2008
    Messages:
    156 (0.07/day)
    Thanks Received:
    10
    Location:
    US
    Flash possible

    I'm trying to also make it as search friendly as possible, so i would like to stear away from flash, but flash would for sure work.
  4. DonInKansas

    DonInKansas

    Joined:
    Jun 2, 2007
    Messages:
    5,096 (1.95/day)
    Thanks Received:
    1,265
    Location:
    Kansas
    Sounds like one of those irritating and overly busy looking sites that drive people bananas. You might go for a cleaner approach.
  5. Msap14 New Member

    Joined:
    Nov 11, 2008
    Messages:
    156 (0.07/day)
    Thanks Received:
    10
    Location:
    US
    yea, maybe... ill have to see how it looks if i can get it working.
  6. xbonez New Member

    Joined:
    Nov 29, 2010
    Messages:
    1,182 (0.88/day)
    Thanks Received:
    315
    Location:
    Philly, PA (US)

    Don't go all flash. Your website would be a resource hog, slow down people's browsers and kill little baby seals.

    You can get the FB status box. Look into FB Like Box.
    Similarly, look into the Google Maps Javascript API for the GMaps widget. I have veyr little experience with that.

    For the nav bar at the bottom, one way to do it is to have an empty <div> which is used as a spacer to ensure no matter how big the main content div is, the footer stays at the bottom.
    http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

    To ensure the FB and GMap boxes stay at the edges etc, this is how I do it.
    Have a javascript function that returns the height and width of the user's browser. Call it using the onload attribute of the body tage.

    Code:
    <body id="Body" class="body" onload="browserSize()">
    </body>
    Size the <body> of the page according to the results returned.
    Size all divs within the body as percentages. When a percentage is supplied as the size of a div, it will be a percentage of the first parent that has a specific size supplied, in your case, it will be the body which is sized to the browser's resolution.

    EDIT
    As an alternative to your above design, one thing web designers sometimes do, is develop your site for 1024x768. Very, very rarely do people have resolutions lower than that. For resolutions larger than that, you just get empty spaces on the left and right. It doesn't look bad at all...gives the site a very simplistic and streamlined look. Imdb.com does that.
    <<Onafets>> says thanks.
  7. IlluminAce

    IlluminAce New Member

    Joined:
    Aug 6, 2011
    Messages:
    46 (0.04/day)
    Thanks Received:
    40
    Location:
    UK
    All the above is accomplishable with the standard trio of HTML, CSS and JS. To echo the thoughts of xbonez, do not use Flash. There are too many reasons to mention as to why that would be a terrible idea. Rule of thumb: only use Flash where you absolutely need to use Flash, and even then restrict its use to the smallest section of content possible. Never, under any circumstance, design the main components of your site in Flash, let alone the whole thing.

    Finally, be careful with the changing background. That could be terribly annoying for end users - to make that bearable, you'd want to use smooth transitions, keep a reasonably long time gap between changes, and ensure the images don't contrast too much. Even so, for those with very large resolutions, poor onboard graphics, and slow CPUs, ... personally I'd push back against that requirement.
    qubit says thanks.
  8. <<Onafets>>

    <<Onafets>>

    Joined:
    Nov 8, 2008
    Messages:
    779 (0.37/day)
    Thanks Received:
    77
    Location:
    Sydney, Australia
    Sigged'

    But back on topic. Could you incorporate (just throwing it out there) a moving .gif image for the background with the images already in there? Also for the Facebook you would have to set it to reset at a certain interval, not when new posts appear. I believe you can do this through java script by updating the Facebook app every whatever seconds/minutes. Unfortunately I'm not a web coder but i can only suggest logical ideas from a desktop programmers POV. Could you use a more powerful language? vb .net sounds like a suitable option as it is easy to pickup :D
  9. Mussels

    Mussels Moderprator Staff Member

    Joined:
    Oct 6, 2004
    Messages:
    42,007 (11.72/day)
    Thanks Received:
    9,399
    this aint my thing, but i can honestly tell you websites like this will be bandwidth heavy, and complex. you'll have to test it out on every browser out there because some of them will not like whatever method you end up using.

    (thats not counting the whole tablet/phone market as well, which will complicate things)
  10. FordGT90Concept

    FordGT90Concept "I go fast!1!11!1!"

    Joined:
    Oct 13, 2008
    Messages:
    13,342 (6.31/day)
    Thanks Received:
    3,361
    Location:
    IA, USA
    I think I would use Silverlight to accomplish all that. It would work so long as Silverlight has somewhere to pull the Facebook and Google Maps data from. Hell, you might be able to use some Bing Maps module Microsoft already has released.

    You'd have to make a basic version of it for users who have scripting disabled.
    Crunching for Team TPU
  11. caleb

    Joined:
    Sep 15, 2004
    Messages:
    1,538 (0.43/day)
    Thanks Received:
    204
    Location:
    Poland,Slask
    Theres just one huge problem with Silverlight and we all know what it is.
  12. xbonez New Member

    Joined:
    Nov 29, 2010
    Messages:
    1,182 (0.88/day)
    Thanks Received:
    315
    Location:
    Philly, PA (US)
    I honestly would not recommend you to look at anything beyond HTML/CSS/JS for the frontt end. Everything u need done can be achieved by those three. They are light, standard and carry across browsers pretty well. Also, most mobile browsers will render the page as well.

    For the back end, its really up to you whether you want PHP, ASP.NET or something else

Currently Active Users Viewing This Thread: 1 (0 members and 1 guest)

Share This Page