HTML - Best Practice To Display Images?
Hi,
I have this msql database containing images, when user enter a query, the program needs to display images back, what is the usual practice for this kind of task? copy all those images to a folder and refer to them with img tag? delete all of them later? care to share some of your tips? Thanks, A.C. Similar TutorialsAll right, I've stumbled upon a bit on a design block. I'm not sure what I want to do to display images. I don't know if I want to do a gallery...or just have thumbnails and then you click on them to view a larger image...I just don't know what I want to do. So, I was wondering if someone out there could help me and decide what would be best to use with my layout - which here is what it looks like: http://i46.tinypic.com/jj74hw.png - here is the homepage thus far: http://thexoticzoo.webs.com/home.html Any suggestions and help on coding? In the following code, the image display is inconcsistent: - Firefox: works in all cases - IE7 over Internet: works - IE7 locally: image does not display; I get a placeholder. - IE7 locally on my other computer: works. By "locally", I mean that the HTML file and the image are on my local hard disk; by "Internet", I mean that the HTML file and the image are on the server at my web site service. The image is in the same directory as the HTML file in all cases. Here's the code: <!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN"> <html> <head> <title>My Page</title> </head> <body> <p>Welcome to My Page</p> <img height="231" width="346" border="0" src="roadtrip003.gif"> </body> </html> I suspect an IE7 setting on the offending computer, but I've looked around quite a bit and it ain't obvious to me. Any thoughts? I just started learning HTML, and made a file just to try out the various things I have learned. The below is said file. When I attempt to view it my picture does not appear, and I don't understand why. Help is much appreciated. <html> <head> <title>Test page</title> </head> <body> <center><h1>Yay for me</h1></center> <p>This is cool</p> <p>Bla bla bak</p> <ul> <li>Yay</li> <li>for</li> <li>me</li> </ul> <br> <img src=“Caster.jpg” /> </body> </html> I have list of files in a folder which are to be displayed in html table. Each file should be shown as follows ------------ | image1| | | ------------ <image 1 file name> ------------ | image2| | | ------------ < image 2 file name> its image and name of the file below the image. I am new to this html and needs help! Thank you, Krishna. I am making a page with a load of thumbnails which are links to other pages. The code is essentially... Code: <a href="#"> <img src="thumbnail" /> <span> <img src="larger image with some nice css styling" /> </span> </a> a span has display none and and a:hover span has display block. What I want to know is does the larger image load with the whole page or does it only load when you hover on the link. I.E. does having loads of hidden images effect page load time? Thanks Hello, I have designed sites in the past but am in need of some assistance. I am designing a website for an artist who wants to be able to offer his clients fine art prints for sale. He needs to be able prints with several different product options; i.e. canvas print with 1" stretch, 2" stretch and framed prints. I want to be able to offer check boxes (or equivalent) that will display an image of the different product options available. If the 1" stretch check box is checked I need an image of a canvas on a 1" gallery wrap frame to be displayed. If they click on the "frame" check box, I need an image of a framed painting to be displayed. What is the best method to use to accomplish this? I've researched and experimented but am at a bit of a loss. Any help will be greatly appreciated. Thank you in advance!! -John Hi all, I'm helping a friend out with his website but have come across a bit of an issue which I think may be related to the web server itself although I'm sure there's a way round it? http://www.pixelrite.co.uk/completed/ Basically my friend wants to be able to upload images that he has worked on into this folder so people can then browse to the above url and simply download the images they want. I used to have a similar thing on an old site of my own which was just a load of files I had uploaded into a folder, anyone could then download them from there. I suspect it's some sort of server side security implemented by the host... is there some way to insert a very basic index.html page into the folder that somehow would show any files that were currently in that folder allowing someone to right click and download them? Thanks in advance! Hi, As a newbie html can be a little overwhelming just because of the many different ways a task can be achieved. I'm looking for some advice on the best method to achieve something like this: I have 7 pieces of information about a site user, they are; Avatar 60 x 60px ScreenName DateJoined UserAttribute1 UserAttribute2 UserAttribute3 UserAttribute4 All bar the avatar are text. I would like the outcome to display something like this: Avatar ScreenName DateJoined UserAttribute1 UserAtteribute2 UserAttribute3 UserAttribute4 I'm unsure as to whether to put the avatar and text in 2 divs(left and right), and whether to use spans or lists for the text. Any advice would be appreciated. Thanks in advance. Hi, I've heard it said that using nested Divs is bad practice. Does anyone agree with this? And if so, why? ...just wondering. HH in html, aside from using a table with 1 row and 2 cells..... what is the best way of designing a page where we have a menu system/navbar on the left, and the main content on the right of it? I need to make my site suitable for mobile browsers (small resolution, etc.) and looked at this page which gives tips on how to do it. It seems like a nightmare! I think it would be much simpler just to create a special version of the site and redirect people to it when they go to the main page. Is redirecting considered a bad idea? And if so, why? I'm looking for a lightbox type script that can show an external .html (iframe) on my page. I saw it a while back while I searching for scripts but I can't find it anymore, and I wasn't if it was reliable or not. What I want it to do: Click on a picture or link Opens up a lightbox on top of the Website, but instead of an image it will be an iframe displaying a contact form. Thanks! Hello Reader, I am very new at html (so please no CSS) and this is what Im trying to do 1) Have my logo on the far right and the page 2) Put the website name in the centre of the page Ive done a wrap (I think and it seems to be working) the problem is: the website name is not going in the centre of the whole page but the centre of the page from where the logo ends (on the right of the page). So if you look at the company name its not in the centre of the page but in the centre of the page from where the logo ends. I have decided to work with that as it will actually look good with what I want to do - My question is this: If I did want to centre the company name to the middle of the page could I use   (loads of them!) to position it exactly where I wanted on the page and is that good practice? And if not what can I use in its stead?? Any advice will be very much appreciated!!!! Hi guyz, i have a query Mouse over the datagrid cell display tooltip or panel to display information but only using HTML and CSS not using javascript. can anyone help me. because im gonna use it on htmleditor on c# desktop application thax before Hi, i have an issue with images in that my site was up and running ok, then a computer crash ended my old PC (not sure if relevent). So new PC, now when i go into my ftp and upload an image from my computer, it will be there and i do the normal in that i get properties of image in ftp and add this into my html. At this point all is ok, image shows on website in new window but as soon as i sign out of my ftp any new images will disapear and just leave the box outline and red x. Sorry this is probrably something simple, but it`s been doing my head in for months. Any ideas, help please. Greetings, I just recently started learning HTML and I am currently taking an HTML class in my college. One of my assignments was to create a web page with a certain amount of requirements but for some reason my teacher was not able to view the pictures when she tried to look at my assignment. Can someone please take a look at my source code and let me know what is wrong with it? <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <title>Internet Security</title> <style type="text/css"> h1 {text-align: center} h3 {text-align: center} body {background-color: #FFEBCD} </style> </head> <h1>Security and the Internet</h1> <body> <p>Internet Security has become vital in today's society. With the imposing attempts to breach other computers, it is important to have good anti-virus software. Viruses can come in many different types. First and foremost are your standard <em><strong>trojan viruses</strong></em>. These viruses are used to steal passwords so the hacker can attempt to gain pertinent user information. Another form of a virus is a <em><strong>boot virus</strong></em>. A boot virus infects floppy disk or master boot records on a hard drive. They replace the boot record program (which is responsible for loading the operating system in memory) copying it elsewhere on the hard drive or overwriting it. Boot viruses load into memory if the computer tries to read the disk while it is booting.<hr /></p> <h3>Other Types of Security Dilemmas</h3> <p>Other security problems that are slowly rising include wireless network hacking. In this particular method of breaching, the perpetraitor attempts to steal a wireless connection by using DOS (denial of service attacks), man in the middle, Identity theft or MAC spoofing and sometimes, caffe latte attacks. The most frightening part of this type of breach, or any for that matter is the hackers ability to gain personal information by using the aforementioned methods. It is very important to secure your computer with an anti-virus program as well as, a firewall to ensure you are not a victim. Below is a security checklist which will aid in keeping hackers out of your system.<hr /></p> <h4 style="color:#DC143C">Ways to Stay Internet Safe</h4> <!-- The following six lines represent how ordered list work and would appear on a web page --> <ol> <li>Install an anti-virus program and firewall and, <strong>keep the definitions up to date</strong></li> <li><strong>NEVER</strong> open any attachments unless you know the sender</li> <li>Do not close your anti-virus and firewall. Real time protection is often active while they are open</li> <li><strong>DO NOT</strong> visit un-safe websites. Again, virus protection usually has a site watch plug in to aid in this</li> </ol> <p>Follow these helpful tips and you should remain virus free</p> <p>The following pictures to the right indicate two great antivirus and spyware programs used for Internet security today. I personally use both of these. Each of these particular pieces of software serve their own purpose. The AVG Free is used for scanning for viruses while the SuperAnti-Spyware is used to scan and resolve issues pertaining to spyware and adware. <!-- Picture links are displayed below --> <p><a href="http://free.avg.com/" title="click here to visit AVG's website"> <img src="AVG.gif" alt="photo of anti-virus software" border="0" align="right" width="140" height="140"/></a></p> <p><a href="http://www.superantispyware.com/" title="click here to visit SuperAnti-Spyware's website"> <img src="super.gif" alt="picture of SuperAnti-Spyware" border="0" align="right" width="140" height="140"/></a></p> <br> <br> <br> <br> <br> <br> <br><hr /> <p>In the next few steps I am going to describe how to stay virus free if using a wireless network</p> <h2 style="colorC143C">Instructions For Setting Up a Safe Wireless network</h2><br> </body> </html> Hi, Does anyone know a code that can be used so that if there is no image to go into an image box the box will be invisible, i.e. there won't be a little box with a cross in it. Thanks Colin Hello everyone, I am currently working on a website that will have a simple gradient border (something like an "outer glow" from Photoshop) along the border of a nested table in the page. The final result will be a simple box with data centered in the middle of the page... However, my question is more related to programming in general. I have two options: 1. Have a linear gradient (1 px by 5 px) which is rotated in the 4 cardinal directions, and then tiled all around the page. Also there will be corners (5 px by 5 px) on, you guessed it, the corners. 2. Creating tables, for instance: //"invisible" is a font class with size="1px" <table class="invisible" cellpadding="0" cellspacing="0" width="710"> <tr height="100"> <td width="1" bgcolor="#000000"></td> <td width="1" bgcolor="#333333"></td> <td width="1" bgcolor="#666666"></td> <td width="1" bgcolor="#999999"></td> <td width="1" bgcolor="#CCCCCC"></td> <td width="1" bgcolor="#FFFFFF"></td> <td width="700" bgcolor="#FFFFFF"> <!-- TemplateBeginEditable name="body" --> SITE CONTENT HERE <!-- TemplateEndEditable --> </td> <td width="1" bgcolor="#FFFFFF"></td> <td width="1" bgcolor="#CCCCCC"></td> <td width="1" bgcolor="#999999"></td> <td width="1" bgcolor="#666666"></td> <td width="1" bgcolor="#333333"></td> <td width="1" bgcolor="#000000"></td> </tr> </table> which recreate the same action as tiling the gradient along the outside edges using the simple HTML colors. Which, from the standpoint of REDUCING actual work done by the server, would be the more effective (not my time, which clearly option 2 takes more of). I know very little about image compression, and how the whole process works for calling up images from a server. Any explanation is appreciated. Thanks again, BlitzKampf I'm currently in the process of rebuilding my website and I'm having some trouble. I'm looking to get the page to look like this: http://img170.imageshack.us/img170/5833/designwh9.png This is what I'm at right now: http://www.bclw.ca/content/index2.html The buttons (unlike in the image design) are not touching each other. Is there a way to do this only using HTML? Or am I going to have to purchase one of those Website Design programs? Thanks for any help you can give! Heyya, new here, and still fairly new to html. I just started using SSI includes (for obvious reasons), but I'm having an issue. When I preview the actual include file (menu.html), it looks just like it should. To see what it should look like, check out the front page, which just uses the HTML code rather than an insert. www.armoredchampions.com But when I use the include on a page, there is a gap between the two lines. I was originally using a <br> tag, but it had a gap, as if I was using <p>. I then eliminated the tag and made the table border just a little bit wider than the image in order to solve the issue, but the gap is still there. To see what it looks like you can check out this page: www.armoredchampions.com/staff.shtml Can anyone help me with this? I would really really appreciate it |