Showing posts with label web layout. Show all posts
Showing posts with label web layout. Show all posts

CSS

CSS, Cascading Style Sheets, were created for placing elements on the web page. Before CSS, if there was anything other than text on a web page, it was placed by a clever use of tables and images. CSS style sheets place elements precisely on the page and can do so much more. W3Schools has a tutorial that covers the basics and gives some examples in a screen that allows you to try out different scenarios.The Zen Garden is a website that offer some insight into the beauty of CSS. Graphic artists showcase extraordinary CSS accomplishments. They are all given the same HTML and the only difference between the works is an external CSS file. Zen Garden also references a resource guide that cover hacks, designs and tutorials. Though CSS is fully integrated there is still some debate on wether it makes sense to switch an established site to completely CSS. The Firefox browser offers an addon called Firebug that is a brilliant tool that enables viewing real time effects of changes made to the CSS file. The CSS file is usually called when the page is loaded from a link tag within the head tag set. <head> <link rel="stylesheet" type="text/css" href="mystyle.css"/><head/>

Images

Photo editing software standard for the industry is Adobe Photoshop, however there are several less expensive alternatives that will work just fine for a basic site.
There are a few rules to adhere to when creating and publishing images on the web. Speed , format, and colors. Speed is a function of the size of the image. There is no need to have an image for the web any more detailed than 72-100 ppi(pixels per inch). There is a tool in most photo editing software to save the image for the web. This is one of the best features for optimizing an image. The formats that are compatible with all browsers are JPEG, GIF, and PNG. Images that have vivid contrast and large areas of a single color are better in GIF, and images like photographs that use continuous tones are more suited to JPEG. Most monitors today conform to true color which can display 16 million colors. 16 million colors gives the developer an ability to use any type of photography.Strict xhtml will require text alt tags for photos. It's always a good idea to include keywords in the alt tag to increase searchability.

Menus


Menus can make or break a site. There needs to be a flow to the information that keeps the person visiting interested in what information there is and where to find the information. A totally CSS,javascript menu system makes good sense because there is cross browser compatibility. There are plenty of sites that offer templates or tutorials for navigational menus and most are fully customizable. If time is precious in getting the website functional there is the option of a buying and downloading a ready to go navigational menu creation software. There are many support forums throughout the internet that provide access to many problem solving techniques for CSS menus. Using frames can isolate the menu from the main content but this system has pros and cons. There is the benefit of not rewriting the navigation code to every page, but can get complicated if there are several frames being used,or the person accessing the site is using a browser that is not frames compatible. For example, the index page consisting of a main frame and a navigation frame would be alot less complicated than one with a header, footer, navigation and main frame.

Browsers


The top browswers include Internet Explorer, Firefox, Opera, and Chrome.There is conflicting data about which browser is most widely used. Explorer has always been number one but Firefox use has graduated to a near tie in popularity. The changing useage makes it important that proper testing is done before a site is launched. Internet Explorer renders certain CSS and HTML differently than Firefox. If you test your pages in Chrome and Firefox, then it should be ok with Opera,without many differences, but certain versions of Explorer may be different. One way to work with the differnt style rendering is to publish different CSS files for each browser. Specify in the head tag which CSS to load in relation to the broweser accessing the page. The code that tells the page to load a specific CSS is a conditional comment.

Templates vs Originality


There are two basic foundations in the structure of websites, style and functionality. The developer who can logically flow through lines of code without stopping very often to see what it looks like could be classified stronger in the area of funcionality. Those who take into consideration the color scheme and layout without regard of how it will fit programmically into the implementation are stronger in aesthetics. For a balance, logical thinker will benefit greatly from templates. Any search engine will bring up a multitude of choices to consider. Usually the person purchasing the template can choose between a one time use fee and to purchase the template outright. The aesthetically talented will know what they want the site to look like, and can breeze through css layout and color coordination but may face a hiccup when it comes to elements like data access and javascript. There are a multitude of programming discussion sites with everything from asp to Ruby on Rails. The choices are endless, just Google what your looking for whether templates or code snippets to get impressive balanced results.

.doc ? .txt ? wysiwyg?

The only tools needed to publish a simple web page is a browser and Word Pad, the default text editor that comes with Windows. It is possible, but not as easy as a wysiwyg,What You See is What You Get, program. Considered by many as a top program on the market is Adobe Dreamweaver. The most current available is CS4 version but every rose has a thorn and this software retails around $400. Amazon.com did have CS4 for $359 with free shipping,and CS3, which is a great program as well, for only $99.For a highly rated open source wysiwyg editor, try xstandard. X Standard Lite is freeware, which means there is no cost. There is Xstandard Pro whick does have a fee and the specific differences are listed on the website. Do not try to publish an html page with Microsoft Word, It fills the html with program specific code that enabled Word to create the page.