How was this site made. Need HELP!

Hi everyone
It's the first time I post here, so I hope some will understand my problem.
I recently came upon this site http://weightshift.com and loved how they had made it dynamic or I think liquid. No mater how much it is scaled it looks great. It can be viewed on an iPhone, perfectly fitting the screen. Also when the site is scaled down and reaches a certain size, the logo jumps above the Contact and about buttons.
I am currently studying at TAFE for Cert. IV and my dreamweaver teacher has no clue. So I have to figure it out by myself.
Does anyone have any clue how this could be achieved. Any help will be appreciated.
Thanks in advanced.
Manuel

No surprise your teacher doesnt get it. when I did the cert IV the 30 html tutorials we did revolved around how great table based layouts are. suffice to say I didnt listen to that rubbish, and unfortunately the curriculum is just a wee bit behind where it really should be.
what you are looking at is responsive design.
you wont get any real relevant information regarding this at w3schools, its more for basics.
it utilises media queries.
http://www.w3.org/TR/css3-mediaqueries/
yes technically you can use the dw fluid grid layout, but i'd advise that you learn the process behind how to style accordingly with media queries before using someones already setup concept of how to do it. (and I've never done a site with just 3 media queries, sorry dreamweaver, thats just wrong.) I personally utilise (and each to their own with this) a min 320+ style, a 320-480 (or therabouts), 480-767 (or therabouts) (3x) 768-1024 (landscape, portrait and for desktops), 1025-1300 (or therabouts), 1301-1440 (or therabouts) and a 1440+. I always start mobile first
essentially the theory is to design your "design" flexible and where it "breaks" add a breakpoint. I try to make it not necessarily based on the device in theory but with the majority of phones sitting around the 320/640 mark, tablets around the 768/1024 mark. then laptops, desktops, and larger screens all seeming to congregate loosely around these higher figures...once youve set your parameters (and the above would cover the majority of devices) test, test, test!!!!
remember good ol' IE will struggle with this. there are many work arounds, some better than other. I usually just offer a fixed width site for IE.

Similar Messages

  • How was this page made? [subject edited by moderator]

    Hi, I am new to making websites so please forgive me my basic questions. I have seen a site that I really like and am wondering how it was made, and whether it can be made with DW. It is called africatravelresource.com. Could some one explain to me whether they have just linked 100s of background images or is this a really cool slider they are using with transparencies? Thank you for your help

    You're asking a weird question there, boiled down it becomes "How do I do what you do, without doing what you do?"
    It's difficult to answer.
    If you're a graphic designer trying to make a quick website for yourself, Adobe Muse would probably be a better fit than Dreamweaver. You might be able to get something similar built there without understanding the underlying code. However, the drag and drop capabilities of Muse can create some exceptionally complex html. If you start your site off in Muse, it should stay there.
    If you're not a designer to begin with, maybe one of those "create your own website" companies has a template you could use by clicking through their build process that has similar features to what you want. I have no experience with them, but some of the things I've seen are actually pretty decent from a few of them.
    WordPress does offer some interesting themes. You might look into that if your hosting company offers WP installations. But if that's the route you choose, DW and Muse would be left out entirely. DW can be used to create a theme (by professional PHP coders), but once the site is "live" you pretty much only use the WP admin panel to make changes.

  • How was this site built ???

    I came across this Flash site and was wondering what product,
    other than Flash, would have been used to build it.
    http://www.mitsubishi-motors.com.au/red/
    What I'm particular interested to know is how the 3d
    transitions were accomplished after a menu item is clicked. I
    imagine it would have been done is some other program and brought
    into Flash.

    This was probably done in a sophisticated 3D program like
    3DStudio Max,
    Maya, or Lightwave, etc. While the 3D is done by highly
    skilled artist(s),
    what's just as important is the planning for the transitions
    between the 3D
    scenes and the overall planning effort which seems to be a
    large effort in
    and of it's own.

  • How was this trailer made?

    http://www.macheist.com/teaser
    I think it looks pretty cool - Apple Motion? Adobe After Effects? Both? If something else, can someone give me their best guess as well as what books to buy to learn how to do this?
    Already have a good 2007 FCP book (Apple Certified) and would like to get all the FCP (and other applications (Motion, Soundtrack, et-cetera) books.
    Thanks.

    Doubt they used Motion. Anything you see with rendered 3d models is usually cinema 4d or maya mixed with AE. Motion doesn't do model rendering (yet). So 3D stuff like walls or bank vaults, or whatever, is probably done with some other modeling software, in conjunction (typically) with AE.

  • When trying to launch iTunes it freezes and I get the message: "Authentication Required. To access this site you need to log in to area "100656 on mellor.co. Your password will be sent in the clear." I am unable to enter a uname or password. Please help!!

    When trying to launch iTunes on my PC running Windows 7 it freezes and I get the message: "Authentication Required. To access this site you need to log in to area "100656 on mellor.co. Your password will be sent in the clear." Because iTunes is frizen at this point I am unable to enter a username or password, or in fact do anything. Please help!! I have uninstalled and reinstalled iTunes numerous times as well as attempting all of the fixes that I could find on-line and still no joy.

    That sounds extremely phishy to me... iTunes does not require authentication simply to launch it. I suspect you've got something nasty intercepting network traffic. That server may be set up to log the Apple ID that you enter so it can be used fraudulently. Try ComboFix from Bleeping Computer.
    FWIW the domain mellor.co is registered to an accountants in Knutsford, Cheshire, UK, and produces the same authentication request if visited with a browser. There is no sign of a "real" publicly visible website at that domain which is a somewhat odd.
    tt2

  • All of my apps on my new ipad2 are not working. I had this iPad about 4 months and nothing bad has happened before this. I need help on how to make my apps stop crashing. All my built in apps are fine though.

    All of my apps on my new ipad2 are not working. I had this iPad about 4 months and nothing bad has happened before this. I need help on how to make my apps stop crashing. All my built in apps are fine though. WHATBCAN I DO TO MAKE MY APPS STOP CRASHING. I ALREADY TURNED IT OFF THEN ON AGAIN AN IT STILL CRASHES. HELPPP!!!!

    Try a reset. Hold the Sleep and Home button down for about 10 seconds until you see the Apple logo. Ignore the red slider.

  • Hi, I am using an iMAC 6.4 and I will need to upgrade the 10.5.8 to a newer version. I am a PC person, so I have no idea of how do this. Can anyone help me please? Thanks!

    e no idea of how do this. Can anyone help me please? Thanks!

    There is no such model as an iMac 6.4. Be sure to check the system requirements for upgrading.
    Upgrade Paths to Snow Leopard, Lion, and/or Mountain Lion
    You can upgrade to Mountain Lion from Lion or directly from Snow Leopard. Mountain Lion can be downloaded from the Mac App Store for $19.99. To access the App Store you must have Snow Leopard 10.6.6 or later installed.
    Upgrading to Snow Leopard
    You can purchase Snow Leopard through the Apple Store: Mac OS X 10.6 Snow Leopard - Apple Store (U.S.). The price is $19.99 plus tax. You will be sent physical media by mail after placing your order.
    After you install Snow Leopard you will have to download and install the Mac OS X 10.6.8 Update Combo v1.1 to update Snow Leopard to 10.6.8 and give you access to the App Store. Access to the App Store enables you to download Mountain Lion if your computer meets the requirements.
         Snow Leopard General Requirements
           1. Mac computer with an Intel processor
           2. 1GB of memory
           3. 5GB of available disk space
           4. DVD drive for installation
           5. Some features require a compatible Internet service provider;
               fees may apply.
           6. Some features require Apple’s iCloud services; fees and
               terms apply.
    Upgrading to Lion
    If your computer does not meet the requirements to install Mountain Lion, it may still meet the requirements to install Lion.
    You can purchase Lion by contacting Customer Service: Contacting Apple for support and service - this includes international calling numbers. The cost is $19.99 (as it was before) plus tax.  It's a download. You will get an email containing a redemption code that you then use at the Mac App Store to download Lion. Save a copy of that installer to your Downloads folder because the installer deletes itself at the end of the installation.
         Lion System Requirements
           1. Mac computer with an Intel Core 2 Duo, Core i3, Core i5, Core i7,
               or Xeon processor
           2. 2GB of memory
           3. OS X v10.6.6 or later (v10.6.8 recommended)
           4. 7GB of available space
           5. Some features require an Apple ID; terms apply.
    Upgrading to Mountain Lion
    To upgrade to Mountain Lion you must have Snow Leopard 10.6.8 or Lion installed. Purchase and download Mountain Lion from the App Store. Sign in using your Apple ID. Mountain Lion is $19.99 plus tax. The file is quite large, over 4 GBs, so allow some time to download. It would be preferable to use Ethernet because it is nearly four times faster than wireless.
         OS X Mountain Lion - System Requirements
           Macs that can be upgraded to OS X Mountain Lion
             1. iMac (Mid 2007 or newer) - Model Identifier 7,1 or later
             2. MacBook (Late 2008 Aluminum, or Early 2009 or newer) - Model Identifier 5,1 or later
             3. MacBook Pro (Mid/Late 2007 or newer) - Model Identifier 3,1 or later
             4. MacBook Air (Late 2008 or newer) - Model Identifier 2,1 or later
             5. Mac mini (Early 2009 or newer) - Model Identifier 3,1 or later
             6. Mac Pro (Early 2008 or newer) - Model Identifier 3,1 or later
             7. Xserve (Early 2009) - Model Identifier 3,1 or later
    To find the model identifier open System Profiler in the Utilities folder. It's displayed in the panel on the right.
         Are my applications compatible?
             See App Compatibility Table - RoaringApps.
         For a complete How-To introduction from Apple see Upgrade to OS X Mountain Lion.

  • How was this SWF created?

    Hi. How was this video created? It displays the name "Joe
    Schmoe" throughout; this could be any text, by the way.
    http://www.cnnbcvideo.com/?nid=lRbWr4wkznBWkEcCraq91zQ5Njc2NA--&referred_by=14859716-SGF0a 4x
    What software would you need? Any examples of how one might
    create this? Thanks.
    [Please note: I'm not responsible for the political content
    of the video; I work for a non-profit who would like to create a
    video like this for fundraising. Thanks.]

    It could be one of the effects in Swish.
    "xJaNx" <[email protected]> wrote in message
    news:e5n44s$le9$[email protected]..
    >i was just curious how was this effect created are there
    online tutorials
    >
    > <a target=_blank class=ftalternatingbarlinklarge
    > href="
    http://www.olmosphoto.com/v2/index.html
    >
    > the">
    http://www.olmosphoto.com/v2/index.html
    >
    > the</a> letters are scrambled and then change so
    fast in the logo to the
    > correct stance
    >
    > how is that done ?
    >
    > can someone help
    >

  • My daughters IPod was stolen and I need help trying to locate it?

    And I dont know how to do this and really need help

    - If you previously turned on FIndMyiPod on the iPod in Settings>iCloud and wifi is on and connected go to iCloud: Find My iPhone, sign in and go to FIndMyiPhone. If the iPod has been restored it will never show up.
    - You can also wipe/erase the iPod and have the iPod play a sound via iCloud.
    - If not shown, then you will have to use the old fashioned way, like if you lost a wallet or purse.
    - Change the passwords for all accounts used on the iPod and report to police
    - There is no way to prevent someone from restoring the iPod (it erases it) using it.
    - Apple will do nothing without a court order                         
    Reporting a lost or stolen Apple product                                        
    - iOS: How to find the serial number, IMEI, MEID, CDN, and ICCID number

  • I'm trying to print some pictures in iPhoto but a error message apears in the screen saying that there is no theme installed and I need to have some theme installed. I don't know how to do that. Need help.

    I'm trying to print some pictures in iPhoto but a error message apears in the screen saying that there is no theme installed and I need to have some theme installed. I don't know how to do that. Need help.

    Reinstall iPhoto.
    To re-install iPhoto
    1. Put the iPhoto.app in the trash (Drag it from your Applications Folder to the trash)
    2a: On 10.5:  Go to HD/Library/Receipts and remove any pkg file there with iPhoto in the name.
    2b: On 10.6: Those receipts may be found as follows:  In the Finder use the Go menu and select Go To Folder. In the resulting window type
    /var/db/receipts/
    2c: on 10.7 or later they're at
    /private/var/db/receipts
    A Finder Window will open at that location and you can remove the iPhoto pkg files.
    3. Re-install.
    If you purchased an iLife Disk, then iPhoto is on it.
    If iPhoto was installed on your Mac when you go it then it’s on the System Restore disks that came with your Mac. Insert the first one and opt to ‘Install Bundled Applications Only.
    If you purchased it on the App Store or have a Recent Mac you can find it in your Purchases List.

  • I need help trying to put all my songs my new computer and it says Not on this computer i need help

    i cant put the songs i purchased i just got a new laptop and it saying not on this computer i need help BAD!

    THIS IS FROM ANOTHER POST.
    PLEASE DON'T POST IN CAPS LOCK, AS IT IS SIMILAR TO
    SCREAMING.
    This sounds like your alarm is set. Go to
    Extras-->Clocks and make sure that the alarms are
    off. Make sure there are no alarms set for your
    calendar either.
    btabz
    THANKS I WILL CHECK THAT OUT. AND IF YOU THINK THAT USING CAPS IS SCREAMING, THEN YOU GOT QUIRKS! EVER THINK THAT I USE CAPS FOR MY POOR VISION? I HAVE TO USE A MAGNIFYING GLASS FOR MY I POD. IT'S NOT ABOUT SCREAMING ALL THE TIME
    MAYBE I SHOULD HAVE SAID APPLE AND NOT I POD. BUT I WENT BACK TO THE "Technical Specifications" AND YOUR RIGHT AVI IS NOT THERE. SORRY I THOUGHT IT WAS, I GUESS I AM **** OUT OF LUCK. WELL AT LEAST I GOT MY I POD NOT TO TURN BY ITS SELF, THANKS ANYWAY.

  • Could Not Find Installation Information for this Machine" I need Help!

    i accidentaly erased the main drive and now i am trying hard to reinstal the OS X again but i constantly keep seeing this "could not find installation information for this machine" i need help....

    hello,
    I had the same problem yesterday, just go to a place with a better internet conncetion, it will work fine...
    good luck

  • I have been able to access a site regularly but in the last few days get a message: "cookies required to access this site." please help, I use this site for work daily:)

    I have been able to access a site regularly but in the last few days get a message: "cookies required to access this site." please help, I use this site for work daily:)

    Goto > Settings > Safari... Enable Cookies > Always
    Good luck!

  • How was this done - movable shape that changes percentage

    I saw a presentation that had a pointer that the user could smoothly drag along a horizontal line, and when moving the pointer, the percentage underneath the pointer automatically changed. The pointer can be moved horizontally along the line, but cannot be moved vertically.
    How was this done --- Is this something that can be accomplished in Captivate, or was it done in another program and inserted into Captivate? See two examples below.

    AFAIK this can be done in Captivate, if you include some widgets (thinking about the Slider component widget of InfoSemantics). But widgets are not compatible with HTML5 output.
    For HTML5, Edge Animate could produce that kind of interactivity as well, and you can embed an OAM package in Captivate, using the App packager in CP7, and right away in CP8.
    Lilybiri

  • How was this "flash" animation done?

    How was this "Flash" animation done?
    http://www.templatemonster.com/flash-templates/15812.html
    There is a "flash" that goes down the sholder of a man in this Flash intro page. It is a series of jpg images. Do you know how this can be done or which program was used? I want to chage the page of it.
    Thanks, Steve

    Hi Steve,
    I'm pretty sure it's done with a mask. You have the man picture layer and the border layout masked by a symbol (maybe a square or rectangle) above it.
    If you want to know how to use mask in Flash, just ask Google. There is a bunch of tutorial on the web.
    Hope it's a good start for you !
    Martin
    http://www.martinc.biz

Maybe you are looking for