lewerjason Posted August 3, 2011 Report Share Posted August 3, 2011 Dear members, I'm a beginner in designing and this website caught my attention, can anyone help me how this coding is done http://www.fishrestaurantcharleston.com/ Link to comment Share on other sites More sharing options...
Andrea Posted August 3, 2011 Report Share Posted August 3, 2011 It's done with HTML, CSS, and JavaScript. A "View Source" (right-click) will show you what's 'under the hood'. That's kind of a general reply- do you have a specific question? Link to comment Share on other sites More sharing options...
lewerjason Posted August 3, 2011 Author Report Share Posted August 3, 2011 I did view the source code earlier, and looks like it uses Jquery as well, i would like to duplicate someting like this, what should I do Link to comment Share on other sites More sharing options...
lewerjason Posted August 3, 2011 Author Report Share Posted August 3, 2011 to be more specific, the codes for the layout, the rotating background, the white over lay and the navigation background Link to comment Share on other sites More sharing options...
Andrea Posted August 3, 2011 Report Share Posted August 3, 2011 I'm not sure what kind of answer you are looking for - you can see how that website was done by viewing its code- what more is there to explain? Are you familiar with basic HTML and CSS? Link to comment Share on other sites More sharing options...
lewerjason Posted August 3, 2011 Author Report Share Posted August 3, 2011 Yes, I'm, I was able to get the css, but that alone doesnt solve the problem. Could you just highlinght what all file should i refer to get the source to have someting like this working. <link rel="alternate" type="application/rss+xml" title="Fish Restaurant - Blog and Press" href="http://www.fishrestaurantcharleston.com/feed/rss"> <link rel="shortcut icon" type="image/ico" href="/favicon.ico" /> <link rel="stylesheet" href="http://www.fishrestaurantcharleston.com/assets/css/style.css?v=2"> <link media="print" rel="stylesheet" href="http://www.fishrestaurantcharleston.com/assets/css/print.css?v=2"> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <link rel="apple-touch-icon" href="/touch-icon-iphone.png" /> <link rel="apple-touch-icon" sizes="72x72" href="/touch-icon-ipad.png" /> <link rel="apple-touch-icon" sizes="114x114" href="/touch-icon-iphone4.png" /> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script> <script>!window.jQuery && document.write(unescape('%3Cscript src="http://www.fishrestaurantcharleston.com/assets/js/libs/jquery-1.4.2.js"%3E%3C/script%3E'))</script> Link to comment Share on other sites More sharing options...
lewerjason Posted August 3, 2011 Author Report Share Posted August 3, 2011 Hi Andrea, sorry to keep bugging you, your help in this will be very helpful. If you can guide me to the exact source or recreating that or an tutorial will do. Thanks. Link to comment Share on other sites More sharing options...
Andrea Posted August 3, 2011 Report Share Posted August 3, 2011 I wouldn't think there's a tutorial to recreate this website, but maybe this helps: <link rel="alternate" type="application/rss+xml" title="Fish Restaurant - Blog and Press" href="http://www.fishrestaurantcharleston.com/feed/rss"> This is not something I'm familiar with, but it has to do with RSS feeds - this might help: http://blog.codefront.net/2004/07/13/rss-feed-integration-in-firefox/ <link rel="shortcut icon" type="image/ico" href="/favicon.ico" /> This is just the link to the favicon - the small icon you see next to the address in your browser's address bar (example, Killersites' yellow/black frog) <link rel="stylesheet" href="http://www.fishrestaurantcharleston.com/assets/css/style.css?v=2"> <link media="print" rel="stylesheet" href="http://www.fishrestaurantcharleston.com/assets/css/print.css?v=2"> These are links to stylesheets - the first one is the one for displaying the site online, the second one styles it for printing...... <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> This is a conditional comment that addresses IE9 browser You can probably Google the link and get some more info on what it does. <link rel="apple-touch-icon" href="/touch-icon-iphone.png" /> <link rel="apple-touch-icon" sizes="72x72" href="/touch-icon-ipad.png" /> <link rel="apple-touch-icon" sizes="114x114" href="/touch-icon-iphone4.png" /> These, I've never seen before, but a Google search for 'apple-touch-icon" will probably provide some answers - my guess it it has to do with the site displaying on the iPhone and iPad. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script> <script>!window.jQuery && document.write(unescape('%3Cscript src="http://www.fishrestaurantcharleston.com/assets/js/libs/jquery-1.4.2.js"%3E%3C/script%3E'))</script> These lines insert iquerry codes - again, google the scr link or other parts of those lines (I'd try '!window.jQuery && document.write(unescape('%3Cscript') and you should find more detail. Hope this helps. Link to comment Share on other sites More sharing options...
daddyalfie Posted August 4, 2011 Report Share Posted August 4, 2011 (edited) Your request seems, (to me at least), somewhat like: "Here is a Cadillac, - how do make one?" Not to discourage you, but that is a pretty sophisticated design! Do listen and learn, from Andrea and the other experts in this forum. They have saved my butt many times! Alfie (@ Andrea: your patience and dedication is amazing! You are very quickly approaching the value of "BillyBoy" and LSW!) Edited August 4, 2011 by daddyalfie Link to comment Share on other sites More sharing options...
lewerjason Posted August 4, 2011 Author Report Share Posted August 4, 2011 Thanks Andrea. Link to comment Share on other sites More sharing options...
Guest Danish Posted October 10, 2011 Report Share Posted October 10, 2011 Hey. Yes andrea is right and i am totally agree with him so go with him.... Link to comment Share on other sites More sharing options...
Andrea Posted October 10, 2011 Report Share Posted October 10, 2011 Hey. Yes andrea is right and i am totally agree with him so go with him.... P.S. - Andrea is a girl Link to comment Share on other sites More sharing options...
Guest Danish Posted November 21, 2011 Report Share Posted November 21, 2011 sorry Andrea i really don't know you are a girl.. i am really sorry once again.. Link to comment Share on other sites More sharing options...
Andrea Posted November 21, 2011 Report Share Posted November 21, 2011 sorry Andrea i really don't know you are a girl.. i am really sorry once again.. I don't care, just thought I'd point it out to avoid confusion. I know that the Italians, and who knows who else, have misappropriated my name as a male name, and I also get called "Sir" on the phone a lot. Whatyagonna do????? Link to comment Share on other sites More sharing options...
Guest Danish Posted November 25, 2011 Report Share Posted November 25, 2011 Hi, So Andrea is your real name and you are Italian..? when other people called sir on the phone i think you feel odd.. Link to comment Share on other sites More sharing options...
Andrea Posted November 25, 2011 Report Share Posted November 25, 2011 I'm not Italian, I'm German - but in Italy, Andrea is a male name. And I don't get called 'Sir' on the phone every time, just occasionally, and I find it funny. Maybe my voice is a bit deep at times, but I don't exactly look like a 'Sir' - btw. that avatar is me, just run through a pencil filter. Link to comment Share on other sites More sharing options...
Recommended Posts