![]() |
|
| >> Web Hosting Geeks // Web Hosting Articles // Web Design |
|
|
How to Use Sliced Graphics to Layout Your Web Site
The problem with designing your site as a graphic, is that it would take too long to load. Your visitors would leave your site immediately and move to your competitors web site. How can you resolve this? Slicing graphics into a number of sections, then putting them together in tables is a great way to layout your web site. It cuts down on the time for providing a quick design for a potential client. It also allows you to bring elements of your site together that would be difficult to do with tables. The value of slicing graphics Reduces site loading time - a large graphic or many graphics on one web page will slow down your loading time considerably. Slicing graphics will allow each piece to load separately and at a faster rate. Easy layout and design - web pages usually consist of headlines, photos and text which must all fit together to create a design that is aesthetically pleasing for your visitors. When you create a web graphic it always must have a rectangular space. You are limited to placing graphics and text in a rectangular form. However, if you slice the graphic into pieces, you can then place these pieces into the cells of a table on your web page. How to layout a web page using sliced graphics Please refer to the example: http://www.ihost-websites.com/SLICES/header.htm 1. Create a 730 x 600 graphic in your favorite graphic editor (I use Fireworks from Macromedia). 2. Import a graphic from the harddrive of your computer or from the Web. 3. Create a headline (insert text) above the graphic as a banner for your web page. 4. Switch on "Rulers" to precisely slice your graphic view - rulers) 5. Select the slice tool, and slice your graphic into 6 sections. 6. Save the sliced graphic in a folder in your html editor (file-export wizard-export-save) Use these settings before saving your graphic: File Name: header Fireworks saves you a lot of design time, by creating the necessary tables to hold all your slices. 7. Open up your favorite html editor (I use Dreamweaver) to view your graphic layout. You should now have 6 separate sections (slices). In this case I have the main header banner, the house and a large area of white space to hold the text in place. 8. Delete the slices (white space area) which have no graphics. You will now have 6 tables. 9. Merge together the tables where you will insert the text. 10. Add the text and whatever else you need to fill the web page. That's it! You have now designed a web page using sliced graphics. Remember this slicing method for your future web designs. You'll find that it's much easier to produce dazzling designs. Tip: Herman Drost is the Certified Internet Webmaster (CIW) owner and author of http://www.iSiteBuild.com Affordable Web Site Design and Web Hosting. Subscribe to his "Marketing Tips" newsletter for more original articles at subscribe@isitebuild.com. You can read more of his in-depth articles at: http://www.isitebuild.com/articles
MORE RESOURCES:
Web-Design - Google News |
RELATED ARTICLES
Web Page Building for Beginners 4 Page ranking by search engines such as Google are not only overrated but unusually explained by "experts" in the SEO field. SEO stands for search engine optimization and is needed to get your website placed at the top of a web search. How Not To Get Web Design Work I get the occasional web design lead from my website. I wanted to find a company I could pass these onto. Is Your Website Color As Inviting as Your Home? Does Color Really Matter? We've all read the countless publications about effective web site design, outstanding written content and the never ending need for search engine optimization. But often the importance of color for a web site is overlooked. Offshore Web Design and Development - Use Great Opportunities Sooner or later every small or medium business owner realizes that he needs a web site for his business. And almost everybody wants to have great web site for affordable price because usually web site design budget is quite limited. Quality Web Copy is the Key to Success Many websites make the mistake of being all flash and no substance. Nothing irritates potential customers more than visiting your website hoping to find information and instead seeing only blinding color and flashing borders. Is Your Website's Copy Up to the Mark? The Internet is a relatively new medium. What works for you in your printed offline brochures and advertising materials may or may not work on your web page. How to Use Sliced Graphics to Layout Your Web Site The problem with designing your site as a graphic, is that it would take too long to load. Your visitors would leave your site immediately and move to your competitors web site. Web Usability: The Basics What is web usability & why is it important?Web usability is about making your website in such a way that your site users can find what they're looking for quickly and efficiently. A usable website can reap huge benefits on to your website and your business. Content - the Key to Long Term Success Every day internet marketers are inundated with the latest fad or must have program. But the one tried and true asset which is vitally important to the long term success of your online business is valuable CONTENT. Building Your Website to Save You Money Does your website make you any money? Does it SAVE you any money?Websites are more than just marketing tools, out there in Cyber-Land effortlessly promoting you and your products. While that's great, why not use that same website to save yourself some money?How? Well, while I don't know your particular situation, I can provide you with some thought-provoking ideas that you can take back to your web designer for more input. Power of Squeeze Pages for Realtors Squeeze pages are a very hot topic in the internet marketing scene. What a squeeze page is is a page that is built to get someone to take an action. How To Attract People To Your Web Site and Leave Their Contact If you have a website, you want your visitors to stay longer on your website and get more sales. Here are 10 ways you can do to improve it. Custom Web Site Design Strategies Web site design has certainly, in the past decade, evolved tremendously. More clients now are demanding custom design, as opposed to the 'cookie cutter' sites of yesteryear. Breathe New Life Into Your Half-dead Website By Using Words That Sell This article may come as a surprise to you.Especially since it is written by a web designer. 14 Ways to Add Content to Your Web Site - Part 2 7. Create high quality content - make clear points with each paragraph you write. How To Design A Web Site I'm not a professional web site designer and openly admit there is a lot that I don't know. But if you're a beginner I probably know more than you do, so listen up. 11 Steps to Sticky Web Site! An attractive and user-friendly Web site is crucial to attracting prospects and holding their interest. Seems obvious, yet poor design and even more poorly written content clutter the Web. Banner Enchancement - Designing Your Banner A well designed web site is great to have, but what if no one ever comes to it? Most web sites either rely on advertising, or have used advertising at some point in their existence, to get people to come to view the site. This means that your going to have to have not only a well designed web site but also well designed banners to attract your visitors. Website Design Firm Website design firms come in all shapes and sizes.When choosing which firm you would like to build your website, there are many factors which you need to take into consideration. Creating Personal Web Sites (Part 2) This is the second part of a two-part article about creating a web site on the Internet and the tools that you will need to do it.Some basic terminology that you should take a look at before proceeding further:Web Page: A document that contains information created with the help of HTML. |
|
|
|
|
| © 2004 - 2008 "Web Hosting Geeks" | Web Hosting Reviews | Customer Reviews | RealMetrics Reviews | Hosting Articles | Directory | Partners | Contacts Over 7000 articles: web hosting, web development, domain names, ecommerce, web design, site promotion, ppc advertising, seo, site promotion and many others. Web hosting reviews, ratings and awards are not based on any incentives or commissions. Names and trademarks are the properties of their respective owners. A direct link to Web Hosting Geeks (http://webhostinggeeks.com) must be provided in order to use any of the above information. Contact us for more info. Partners: Hosts by speed, Cheap Website Hosting, Free Website Hosting, Cheap Web Hosting, Top 10 Web Hosts, Top 10 Web Hosting Deals, Best Website Hosting, Free Web Hosting, Free Web Hosting, Dedicated Server Hosting, Adult Web Hosting, Web Hosting Discussions, Dedicated Server Reviews, Best Web Hosting, Web Hosting Discounts, HostProfessor.com, rsuog, halyava, PHP Website Hosting Services, Web Hosting Reviews, Hosting Uptime, Best Web Hosting Reviews, Cheap Webhosting, Web Hosting, Flash Templates, CMS Templates, Web Hosting Reviews, Website Hosting Reviews, Web Hosting Providers, Best Web Hosting, Top Web Hosting, RSUOG Web Hosting |