Jpgs and background images

Hi gang
I have a slight problem with my site, "Chemin de Nostradamus".
http://www.soli-deo.eu
When I made the background images in Photoshop I saved them as jpgs around 100k in size.
When I upped the site to this domain I noticed slow loading times on each background page, too slow for 100k.
Then when checking on the published files I see they have all been converted to .png around 400k, by iweb.
My image quality is the same but now a much bigger file, 400%, thus 4 times slower on loading.
Is there a workaround for this?
Cheers
Jim
Message was edited by: jimpsky

http://www.soli-deo.eu/chemin-de-nostradamus/LeChemin_De_Nostradamus_files/backgroundimage1.png
Is probably not the file you created. My guess is you started with only the smaller image in the upper right and iWeb added the extra black to fit your page dimensions.
You really don't need to set that image as a background. You should be able to make a 20KB .jpg file from your source and just drop it in the location an size it.
You could also edit the file above to reduce its file size and replace the original on your server with it.

Similar Messages

Please help me!--rendering makes the images or video blurry (very pixelated) deteriorates the image Adobe Premier Elements 13 need help! .jpg and mpeg images, but I have never "rendered" before since I got APE 13 about 6 weeks ago. I am desperate for

Please help me!--rendering makes the images or video blurry (very pixelated) deteriorates the image Adobe Premier Elements 13 need help! .jpg and mpeg images, but I have never "rendered" before since I got APE 13 about 6 weeks ago. I am desperate for assistance!

That's going to be a ridiculous waste of money and energy.
First of all, the current ATI drivers don't support multiple GPUs, so at the moment even a single 4870X2 would be only a 'normal' 4870 (which is quite a speed beast already). GFX drivers evolve rapidly, so things might look different next month, but when it comes to Linux and hardware there's one Golden Rule: stay away from the newest stuff and wait for proper support to get coded.
I also wonder what power supply could possibly cope with the differences between idle and full load; that's way beyond 400W. But then, I'm one of those "quiet&green" types where >100W idle is already a bit much.
I kind of understand that you want to get it done and not worry about hardware for the next 10 years or so, but that's simply not how the hardware world works and never did. At least not for the average consumer.

Ringtones and background images not available after call manager upgrade

Hi,
We have upgraded our call manager from version 8.5 to 10.5. Once after the upgrade we lost all the Ringtones and background images except the two default ringtone and background images. we got 8945 sccp phones(running 9-3-1 firmware) and 9951 sip phones(running 9-4-1 firmware). Both these phones lost these list. However the ringlist.xml is available in the tftp server with all the ringtones and the phones are pointed to the right tftp servers. I tried to restart the tftp servers and tried again, however that didn't help. we are using call manager 10.5 and h323 voice gateway. Could anyone please help on this.
Thanks
Barry

Hi Tony,
I can see the ringtone files in the call manager (osadmin>tftp file mgmt), i have also restarted the tftp services, but it didn't help. I believe you advised to re-upload the ringlist file (Ringlist.xml) and try again. I will try this and update you. Please let me know if you have any other suggestions.
Thanks
Barry

HTML Emails and background images in Dreamweaver

Hello. I created a HTML email in Dreamweaver. The original design came out of Indesign and had very specific background art. I removed all the text out of the Indesign and created a jpg. I took this jpg in Photoship and sliced and optimized it. I imported this HTML into Dreamweaver. Here I need to add in all the text (which is variable). I was originally thinking that you can only place background images with CSS. But I was told that you should not use CSS for HTML emails. So instead I left all the background art as normal images inside of a table. At this point I need to add text over these images. They only way I could figure out to do it was to add a div tag right over the image and type into there. This seemed to work fine but when I tested it in some emails all the div tags with text showed up under the table with images. This needed to display over. What is the best way to handle this issue? Thank you in advance.
Melanie

Sorry, but you cannot layer text over images in emails. Simplify your design or make an image with text on it in Photoshop. Use absolute URLs to images on your web server. And give people who can't see graphics and HTML pages in their email client a link to the HTML page on your web server.
How to Code HTML Emails
http://www.sitepoint.com/article/code-html-email-newsletters/
Chart showing how various email clients handle CSS.
http://www.campaignmonitor.com/css/
Download some HTML Email Templates from the links below to get started.
Mail Chimp
http://www.mailchimp.com/resources/html_email_templates/
Constant Contact
http://www.constantcontact.com/email-marketing/html-email-templates/index.jsp
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

OS 10.4.4, iLife 6 and Background images issue

I upgraded my Mac from 10.4.3 to 10.4.4 (with Automatic Updates) and the same day purchased and installed the iLife 6.0 package (that updated the 5.x version that came with my Mac).
A day or 2 later I decided to change the background photos on my displays. I had been using photos from my iPhoto library and as I scrolled around looking for appropriate pictures and trying them out System Preferences quit on me. I had to restart in order to bring back the ability to alter the background images. Other programs and operations remained unaffected but I was unable to bring up the "Change Background Image" option on the contextaul menu until I restarted the computer. iPhoto was not running at the time. I restarted the computer and the same issue cropped up several more times, always after scrolling thru and trying several images.
These problems never occurred with 10.4.3 or before or iPhoto 5 or before. I don't know if the problem is with iPhoto or not, but I assume that there is interaction between System Preferences and iPhoto, or at least that System Preferences uses the iPhoto database files.
Any ideas?
TIA!

(I thought the hardware listing was posted with the thread...)
Hardware:
PM G5 Dual 2.7, 2.5GB RAM, ATI Radeon 9650 with 256 MB VRAM, and 2 LCD Cinema Displays (1 23 In and the other 20 Inch). Both Cinema Displays are set to the maximum resolution (1920x1200 and 1680x1050).

Main Wrapper, Container and background-image repeat problem-and Footer :-)

Hi everyone,
First off, i tried almost every idea i could get to solve this on my own but now im...aaa...
Well, the problem is i have a main wrapper with a background image repeat. A header,menu, body container - which has a left column and right column. I want that main wrapper,body container and both of the columns to grow auto according to content. I tried the height:100%. When i float the columns the text from left column spills over on to the footer. The left column also does not autogrow towards the footer?! I was able to set the footer at the bottom which i want it to remain at the bottom of the main wrapper, but the main wrapper and the columns do not grow automatically...I guess it has something to do with float and the clear properties but what???
body{
margin: 0;
padding: 0;
font-weight: normal;
font-style: normal;
font-size: 11px;
font-family: verdana;
text-align: center;
background:url(back_index3.png) repeat-x scroll 0 0 #E4E4E4;
#main_wrapper {
width: 959px;
margin:0 auto;
margin-top:80px;
background:url(backslice.png) repeat-y;
height:auto;
min-height:800px;
#header {
width: 959px;
margin-left: auto;
margin-right: auto;
height:119px;
background:red;
padding-top: 0px;
padding-bottom: 0px;
#topmenu {
background-color:#blue;
height:30px;
margin:0px;
width: 959px;
margin-left: auto;
margin-right: auto;
#body_container {
height:100%;
width: 949px;
margin: 0 auto;
#content {
float:left;
width: 645px;
background:yellow;
border-right:1px solid #ffffff;
padding:10px;
height:100%;
text-align:left;
#sidebar {
float:left;
width: 283px;
background:#234234;
height:100%;
#footer {
clear:both;
height:200px;
background-color: #686768;
margin:0 auto;
border-top: 1px solid #F6F6F6;
text-align:center;
width: 100%;
<html xmlns="">
<head>
<title>title</title>
<link rel="stylesheet" type="text/css" href="3css.css" />
<meta http-equiv="content-type" content="text/html" />
</head>
<body>
<div id="main_wrapper">
     <div id="header">
      <span id="header_logo">title</span>
     </div>
     <div id="topmenu">
     menu
     </div>
     <div id="body_container">
      <div id="content">
content to be added
      </div>
      <div id="sidebar">
      hallow2
      </div>
     </div>
</div>
<div id="footer">
asd
</div>
</body>
</html>
Thanks in advance if somebody can help me out here.
you can see an image of the problem in the attachement down thr... thnx

<html xmlns="">
<head>
<title>title</title>
<link rel="stylesheet" type="text/css" href="3css.css" />
<meta http-equiv="content-type" content="text/html" />
</head>
<body>
<div id="main_wrapper">
     <div id="header">
      <span id="header_logo">title</span>
     </div>
     <div id="topmenu">
     menu
     </div>
     <div id="body_container">
      <div id="content">
content to be added
      </div>
      <div id="sidebar">
      hallow2
      </div>
     </div>
</div>
<br clear="all" />
<div id="footer">
asd
</div>
</body>
</html>
Hope this will work well

Load, crop and saving jpg and gif images with JFileChooser

Hello!
I wonder is there someone out there who can help me with a applic that load, (crop) and saving images using JFileChooser with a simple GUI as possible. I'm new to programming and i hope someone can show me.
Tor

import java.awt.*;
import java.awt.event.*;
import java.awt.image.*;
import java.io.*;
import javax.imageio.ImageIO;
import javax.swing.*;
import javax.swing.event.*;
import javax.swing.filechooser.*;
import javax.swing.filechooser.FileFilter;
public class ChopShop extends JPanel {
    JFileChooser fileChooser;
    BufferedImage image;
    Rectangle clip = new Rectangle(50,50,150,150);
    boolean showClip = true;
    public ChopShop() {
        fileChooser = new JFileChooser(".");
        fileChooser.setFileFilter(new ImageFilter());
    public void setClip(int x, int y) {
        clip.setLocation(x, y);
        repaint();
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D)g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                            RenderingHints.VALUE_ANTIALIAS_ON);
        if(image != null) {
            int x = (getWidth() - image.getWidth())/2;
            int y = (getHeight() - image.getHeight())/2;
            g2.drawImage(image, x, y, this);
        if(showClip) {
            g2.setPaint(Color.red);
            g2.draw(clip);
    public Dimension getPreferredSize() {
        int width = 400;
        int height = 400;
        int margin = 20;
        if(image != null) {
            width = image.getWidth() + 2*margin;
            height = image.getHeight() + 2*margin;
        return new Dimension(width, height);
    private void showOpenDialog() {
        if(fileChooser.showOpenDialog(this) == JFileChooser.APPROVE_OPTION) {
            File file = fileChooser.getSelectedFile();
            try {
                image = ImageIO.read(file);
            } catch(IOException e) {
                System.out.println("Read error for " + file.getPath() +
                                   ": " + e.getMessage());
                image = null;
            revalidate();
            repaint();
    private void showSaveDialog() {
        if(image == null || !showClip)
            return;
        if(fileChooser.showSaveDialog(this) == JFileChooser.APPROVE_OPTION) {
            File file = fileChooser.getSelectedFile();
            String ext = ((ImageFilter)fileChooser.getFileFilter()).getExtension(file);
            // Make sure we have an ImageWriter for this extension.
            if(!canWriteTo(ext)) {
                System.out.println("Cannot write image to " + ext + " file.");
                String[] formatNames = ImageIO.getWriterFormatNames();
                System.out.println("Supported extensions are:");
                for(int j = 0; j < formatNames.length; j++)
                    System.out.println(formatNames[j]);
                return;
            // If file exists, warn user, confirm overwrite.
            if(file.exists()) {
                String message = "<html>" + file.getPath() + " already exists" +
                                 "<br>Do you want to replace it?";
                int n = JOptionPane.showConfirmDialog(this, message, "Confirm",
                                                      JOptionPane.YES_NO_OPTION);
                if(n != JOptionPane.YES_OPTION)
                    return;
            // Get the clipped image, if available. This is a subImage
            // of image -> they share the same data. Handle with care.
            BufferedImage clipped = getClippedImage();
            if(clipped == null)
                return;
            // Copy the clipped image for safety.
            BufferedImage cropped = copy(clipped);
            boolean success = false;
            // Write cropped to the user-selected file.
            try {
                success = ImageIO.write(cropped, ext, file);
            } catch(IOException e) {
                System.out.println("Write error for " + file.getPath() +
                                   ": " + e.getMessage());
            System.out.println("writing image to " + file.getPath() +
                               " was" + (success ? "" : " not") + " successful");
    private boolean canWriteTo(String ext) {
        // Support for writing gif format is new in j2se 1.6
        String[] formatNames = ImageIO.getWriterFormatNames();
        //System.out.printf("writer formats = %s%n",
        //                   java.util.Arrays.toString(formatNames));
        for(int j = 0; j < formatNames.length; j++) {
            if(formatNames[j].equalsIgnoreCase(ext))
                return true;
        return false;
    private BufferedImage getClippedImage() {
        int w = getWidth();
        int h = getHeight();
        int iw = image.getWidth();
        int ih = image.getHeight();
        // Find origin of centered image.
        int ix = (w - iw)/2;
        int iy = (h - ih)/2;
        // Find clip location relative to image origin.
        int x = clip.x - ix;
        int y = clip.y - iy;
        // clip must be within image bounds to continue.
        if(x < 0 || x + clip.width > iw || y < 0 || y + clip.height > ih) {
            System.out.println("clip is outside image boundries");
            return null;
        BufferedImage subImage = null;
        try {
            subImage = image.getSubimage(x, y, clip.width, clip.height);
        } catch(RasterFormatException e) {
            System.out.println("RFE: " + e.getMessage());
        // Caution: subImage is not independent from image. Changes
        // to one will affect the other. Copying is recommended.
        return subImage;
    private BufferedImage copy(BufferedImage src) {
        int w = src.getWidth();
        int h = src.getHeight();
        BufferedImage dest = new BufferedImage(w, h, src.getType());
        Graphics2D g2 = dest.createGraphics();
        g2.drawImage(src, 0, 0, this);
        g2.dispose();
        return dest;
    private JPanel getControls() {
        JPanel panel = new JPanel(new GridBagLayout());
        GridBagConstraints gbc = new GridBagConstraints();
        gbc.weightx = 1.0;
        gbc.fill = GridBagConstraints.HORIZONTAL;
        gbc.gridwidth = GridBagConstraints.REMAINDER;
        panel.add(getCropPanel(), gbc);
        panel.add(getImagePanel(), gbc);
        return panel;
    private JPanel getCropPanel() {
        JToggleButton toggle = new JToggleButton("clip", showClip);
        toggle.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                showClip = ((AbstractButton)e.getSource()).isSelected();
                repaint();
        SpinnerNumberModel widthModel = new SpinnerNumberModel(150, 10, 400, 1);
        final JSpinner widthSpinner = new JSpinner(widthModel);
        SpinnerNumberModel heightModel = new SpinnerNumberModel(150, 10, 400, 1);
        final JSpinner heightSpinner = new JSpinner(heightModel);
        ChangeListener cl = new ChangeListener() {
            public void stateChanged(ChangeEvent e) {
                JSpinner spinner = (JSpinner)e.getSource();
                int value = ((Number)spinner.getValue()).intValue();
                if(spinner == widthSpinner)
                    clip.width = value;
                if(spinner == heightSpinner)
                    clip.height = value;
                repaint();
        widthSpinner.addChangeListener(cl);
        heightSpinner.addChangeListener(cl);
        JPanel panel = new JPanel(new GridBagLayout());
        GridBagConstraints gbc = new GridBagConstraints();
        gbc.insets = new Insets(2,2,2,2);
        gbc.weightx = 1.0;
        panel.add(toggle, gbc);
        addComponents(new JLabel("width"), widthSpinner, panel, gbc);
        addComponents(new JLabel("height"), heightSpinner, panel, gbc);
        return panel;
    private void addComponents(Component c1, Component c2, Container c,
                               GridBagConstraints gbc) {
        gbc.anchor = GridBagConstraints.EAST;
        c.add(c1, gbc);
        gbc.anchor = GridBagConstraints.WEST;
        c.add(c2, gbc);
    private JPanel getImagePanel() {
        final JButton open = new JButton("open");
        final JButton save = new JButton("save");
        ActionListener al = new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                JButton button = (JButton)e.getSource();
                if(button == open)
                    showOpenDialog();
                if(button == save)
                    showSaveDialog();
        open.addActionListener(al);
        save.addActionListener(al);
        JPanel panel = new JPanel();
        panel.add(open);
        panel.add(save);
        return panel;
    public static void main(String[] args) {
        ChopShop chopShop = new ChopShop();
        ClipMover mover = new ClipMover(chopShop);
        chopShop.addMouseListener(mover);
        chopShop.addMouseMotionListener(mover);
        JFrame f = new JFrame("click inside rectangle to drag");
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.getContentPane().add(new JScrollPane(chopShop));
        f.getContentPane().add(chopShop.getControls(), "Last");
        f.pack();
        f.setLocation(200,100);
        f.setVisible(true);
class ImageFilter extends FileFilter {
    static String GIF = "gif";
    static String JPG = "jpg";
    static String PNG = "png";
    // bmp okay in j2se 1.5+
    public boolean accept(File file) {
        if(file.isDirectory())
            return true;
        String ext = getExtension(file).toLowerCase();
        if(ext.equals(GIF) || ext.equals(JPG) || ext.equals(PNG))
            return true;
        return false;
    public String getDescription() {
        return "gif, jpg, png images";
    public String getExtension(File file) {
        String s = file.getPath();
        int dot = s.lastIndexOf(".");
        return (dot != -1) ? s.substring(dot+1) : "";
class ClipMover extends MouseInputAdapter {
    ChopShop component;
    Point offset = new Point();
    boolean dragging = false;
    public ClipMover(ChopShop cs) {
        component = cs;
    public void mousePressed(MouseEvent e) {
        Point p = e.getPoint();
        if(component.clip.contains(p)) {
            offset.x = p.x - component.clip.x;
            offset.y = p.y - component.clip.y;
            dragging = true;
    public void mouseReleased(MouseEvent e) {
        dragging = false;
    public void mouseDragged(MouseEvent e) {
        if(dragging) {
            int x = e.getX() - offset.x;
            int y = e.getY() - offset.y;
            component.setClip(x, y);
}

Importing A Combo Banner/Menu Bar And Background Image

Hi,
In one Photoshop file, I've created a banner/menu bar, as well as what I would like to use as the background image for what appears on the remainder of the page. The menu items are not in a box of any sort. And everything is on a separate layer. The image that appears below is one I made up as an example of what I'm talking about. Can I import it into Dreamweaver as one file? Or should I make one file for the banner/menu bar, and one for the rest of the page?
Thank you.

Hi,
I believe it is best to import everything individually in most/all circumstances. When you are talking about banner images or background images think about the size of the file you are exporting from Photoshop. A 'Save for Web' image will be a lot bigger if it includes everything on the page, compared to the individual size of your banner, and therefore will increase the page load times etc.
So, you can create a photoshop file with your whole layout on there, but then crop each of the elements on its own before saving for web. Even each individual menu item.

CSS and Background Images

I am trying to create a page using CSS. I have a background
image that tiles like I want it to. Here is the CSS:
padding: 0;
Margin: 0;
background-image: url(images/background.jpg);
background-repeat: repeat-y;
background-position:center;
I want some of my various other divs to lay on top of this
background but have a different background color that overlays the
page background image. Instead of taking the background color I
specify, the main page background above shows through. For example
below, the dark brown background doesn't show:
#nav {
margin-left: 4px;
width: 802px;
height: 26px;
background-color:#211400;
Thanks in advance for helping.

This is what I did for mine:
background-image: url("../images/background.gif");
Erin
"Mike Dockray" <[email protected]> wrote:
>
Can u put floating background images in the CSS.
eg. background: #fff url(images/backgrd.jpg) bottom right no-repeat fixed;
if so what is the context, find the color but not the image, url is relative
to
what ????
(yes , i'm a newbie, first day on the case :)

Card Layout and Background Images

Hello,
I have an application that uses CardLayout to switch through different layouts. Each layout has a background image. The problem is that since I implemented a CardLayout system, the image has been shifted down about 8 pixels, revealing a grey bar. I have tried setting opacities of my JPanels, but that does not seem to work. What do I need to do to fix this?
Thanks you.

Here is a screenshot of the problem:
http://www.areath.com/images/screen1.bmp
You can see that just below the title bar, there is a grey bar. Before implementing the CardLayout, the placeholder image fit in the frame perfectly. Now, the image and the components on top of it have been shifted down.

XSL-FO and Background Images

I'm using JDK-1.4.2 supplied with XALAN along with Apache FOP to generate PDFs and I'm having trouble adding background images. I want to add the company logo as a background image in the header. My code looks like this:
<fo:static-content flow-name="header"
background-image="url('file:/path/to/company-logo.gif')">
</fo:static-content>But it doesn't seem to work. I scoured the web for info and many sites had various techniques, some of which I tried. None of them worked as they seemed to be be geared towards the commercial FO processors. Are there any good references for FO as it works under FOP? I understand that FOP only covers part of the FO standard. Is it even possible to add background images in FOP?
Cliff

Please help if you can as the problem is not just FOP related. Even if it is these fora are supposed to be general purpose are they not? Would it make a difference if I asked a more general question of how to use XSL-FO to put a background image in a header? If so would it not make sense to follow up if the answer didn't work with the FOP engine? The main reason I don't use the mailing list is that I prefer using a forum. My inbox already gets enough junk from the 10 or so other mailing lists that I'm subscribed to. Also I haven't found a forum dedicated to XSL-FO with enough popularity to ensure resolution o my issue. So I bring the question here hoping to get some good feedback. People stray from the topic all the time and it is up to the moderator to make sure topics do not stray too far. I think my question is on topic enough to warrant an answer.

I'm getting ugly vertical stripes at pictures and background images on my HTC One S.

I like using Firefox on my HTC One S, syncing the browsing history and bookmarks really comes in handy.
But however, sometimes i get ugly stripes above some images. When resizing the site, they sometimes disappear. It happens only with images and css-background images.
A few screenshots: https://www.dropbox.com/sh/tq47ved3p1qe766/0KiMvzEHSD/screenshots/firefoxbug

I think you can thank Apple for this. See this discussion.
Photoshop CC: MacOS 10.10 Yosemite: Graphics driver problem
Nancy O.

Locking div's, banners, and background images

Hello!
I'm trying to figure out how to lock a background image and banner around my body content using div's but am not sure how.
When scrolling I would like only the Header Bar and Body section to move, while the background image and banner always stay put.
In addition, I need to make sure that this happens always, despite screen size and/or zooming.
Any assistance would be greatly appreciated.
Below is a layout of what I am desiring:
1. Header Bar (orange) will move with page scroll.
2. Main Body Area (white) will move with page scroll.
3. BG Image (red) ALWAYS stays put, wrapping around the body area.
4. Banner (blue) sits ATOP the BG Image but AWAYS stays put.
5. BG color (black) in place for when zooming or screen size changes.
I hope this makes sense. And as always, I appreciate the help!

As always, answers to layout questions are contained in your CSS and HTML code. What have you got so far?
Nancy O.

When I try to print, I get one page with a header and the background image, another page with the content, and a third page with a footer and background image. How can I make it print properly?

Also, if I print to a .pdf, the background does not show up even if I have the checkbox checked to print background image.
The site I'm trying to print is:
[http://www.puertovallartatours.net/coupons-discounts.htm http://www.puertovallartatours.net/coupons-discounts.htm]

I did not have the HP printer software for Mac OSX installed properly. Once installed the problem went away.

JTree and background image

How do I put background image into jTree?

I've never tried it in a JTree, but this is how it can be done with other JComponents:
http://forum.java.sun.com/thread.jsp?forum=57&thread=316074

Jpgs and background images

Similar Messages

Maybe you are looking for