Weblink India.Net – Blogs

Ideas & Inspiration for web design and web development

Archive for November, 2009

CSS differences in Internet Explorer

Posted by weblinkindia on November 28, 2009

With the coming of CSS, the world of web was refreshed and was breathed with a new life. Color, stylized fonts, borders, margins, etc. were used in order to make a web page or site attractive. There are several browsers on which web sites or pages are opened. The web developers had to test their work in different browsers so that everyone has access to their work. Internet Explorer or IE is the most accessed browsers but there are various differences in its 3 versions especially in their support of CSS.

Why designers should have knowledge of CSS differences?

Every site designed for promotion, aims to receive higher search engine rankings. For achieving it they need to apply numerous CSS tips. Here you are provided with some useful points or differences that are present in different versions of IE.

The major differences that are to be found in different versions of Explorer are:
>> Selectors & Inheritance
>> Property Support
>> Significant Bugs and Incompatibilities
>> Other Miscellaneous Techniques

Selectors & Inheritance:  Selectors are part of CSS techniques that help in optimization and saves on a lot of time. There are numerous kinds of selectors like Child Selectors, Chained Classes, Attribute Selectors, Adjacent Sibling Selectors and General Sibling Selectors. These selectors are supported by one browser and not supported by the other. All these selectors are supported by the latest versions of IE7 and 1E8 and not by IE6.

Property Support:  Different properties of CSS like Fixed-Position Elements, Transparent Border Color, Max-Height & Max-Width, Min-Height & Min-Width, Property Value “inherit”, Border Spacing on Table Cells, Rendering of Empty Cells in Tables, Vertical Position of a Table Caption, Clipping Regions Orphaned and Widowed Text in Printed Pages, Page Breaks Inside Boxes, Outline Properties, Alternative Values for the Display Property and Virtual Dimensions Determined by Position are not supported by all browsers. These properties are responsible for giving a webpage or website a new and appealing appearance. All these are supported by IE7 and IE8 and not by the older version, IE6.

Significant Bugs and Incompatibilities: There are various incompatibilities and bugs in IE6 and IE7 that a web designer must know in order to create a well-designed and optimized site.

Bugs in IE6:

  • It Doesn’t support styling of the element
  • Doesn’t support IDs and classes that begin with an underscore or hyphen.
  • It Offers only fractional support for @font-face
  • Dotted borders appear almost identical to dashed borders, etc.

    • Bugs in IE7:

  • List items for a list that is ordered, its layout will not increment their numbers
  • Offers only fractional support for @font-face.
  • List items don’t support all possible values for list-style-type
  • List items that have a specified list-style-image will not be able to display the floated image.

    • Apart from these many other bugs occur in different situations.

    Other Miscellaneous Techniques: The advanced techniques like Media Types for @import, Incrementing of Counter Values and Quote Characters for Generated Content are only supported by IE8.

    Knowledge of these differences will help a web site developer in framing a browser friendly site that will be supported by all three versions of Internet Explorer. Our CSS guideline will help your site acquire higher search engine rankings.

    Posted in CSS, Internet Browser | Tagged: , , | Leave a Comment »

    Avoid Web Design Mistakes – part 2

    Posted by weblinkindia on November 24, 2009

    In the previous post, we had to leave the discussion in mid as there were lot more to discuss, so once again we are continuing the same. In last discussion we left the on the common mistakesm usually made by web designers. So let’s continue from there…

    • “Drop down” Menus should be avoided: Use of ‘drop down’ menus muddle up things and also tend to hide vital information. It should be strictly avoided so as to make the navigation easier.
    • Text navigation must be used: it is more reliable than any other navigation .also it is a faster means of navigation as compare to image navigation and others.
    • Many versions of the site prove confusing, avoid it: Do not provide the users with different versions (HTML, Flash, etc.) of your site as it will lead to a huge amount of confusion. Only offer your content to the visitors.
    • Advertising should not be blended inside the content: Using advertisements within the content might prove unsuccessful as firstly, it leads to more clicks and secondly, a reader might get infuriated and leave the site.
    • Simple Navigation Structure should be used: Lesser the options on the site more easily will be the navigation. Navigation structure should be simple and clear so as to provide ease to the visitor, searching his information.
    • “Intros” to be avoided: Intros simply add to the bulk of the content. A visitor should be simply presented with the real content. This will make him stay on your site for a longer time, reading things useful to him.
    • Harsh colors are a ‘big no’:  Use of harsh background colors in your website may cause strain to the visitors. It’s wise to choose subtle colors for your site, which will help the user to focus on your content.
    • Pop ups should not be used: Pop ups are very irritating and also they increase the number of Pop blockers.
    • Ensure that you include anchor text on your links: Only relevant anchor texts should be used. Using random anchor texts just to increase the chances of getting higher SEO ranking may prove disappointing.
    • Links on the side should not be concealed: Links should be clearly visible and the user must be able to see as to where the link is pointed. Covering of links might lead to loss of your integrity.
    • Underlining or coloring of the normal text should be avoided: Highlighting the normal text by using colors or underlines might give the users a wrong impression that they are clickable links. This should not be used until its very essential.
    • Clicked links color should change: The links that have been clicked should change color as the readers will not end up visiting it all over again.
    • Animated GIFs should be avoided: The use of animated GIFs should be avoided as it makes a site appear unprofessional. Also its use attracts the attention of the users and the content is neglected.
    • Long and more number of pages must be avoided: More number of pages needs extensive scrolling, which in turn will lead to irritation on the part of the users. So a website or a web page should be designed using minimum number of pages.
    • Spelling or Grammatical mistakes should be avoided: Grammatical errors in the content deflate the overall quality of the website. Ensure at least there are no grammatical or spelling errors in main texts and links.

    All the mistakes that we have highlighted and discussed in this Web Designing tutorial will be of great use to you. Web Design is a vast and popular field and the websites that are created under this have to be of optimum quality. For the sites to be properly promoted these mistakes must be rectified. There will be many more mistakes that will pop up as web designing will raise its bar but the mistakes that are provided to you are basic ones that will help you present a quality website that will acquire high Search Engine rankings.

    Posted in Web Design | Tagged: , | Leave a Comment »

    Avoid Web Design Mistakes – part 1

    Posted by weblinkindia on November 20, 2009

    Web Design is a term that is most commonly associated with the styling of websites and various other web applications. It is the most active field of web world, which is often updated. We will discuss some of the points in this blog, which will act as your Web Design guide. Why do the mistakes occur? The mistakes committed by the web designer are a result of his lack of awareness. Also the mistakes occur because the web designers try to improvise many techniques at one time.

    Below is the list of recurrent mistakes

    • The purpose of the site should be communicated in about in seconds: A site should be designed focusing on the point that the site should communicate its purpose within a couple of seconds. If the visitor is unable to figure out what the site is about within few seconds, then he will be move to other options.
    • Content should be made Scannable: The site should have content that can be read in a single go. Use of Headers, Lists, and Bulleted Points enables the user to filter the stuff he is looking for.
    • Unreadable Fancy Fonts and Tiny Fonts should not be used: Very often, we witness that the sites have some Fancy Fonts and Tiny Fonts that are very difficult to read. So these should be avoided in order to make the read of the visitors comfortable.
    • User’s browser windows should not be resized: Let the control of the browser be in the hands of the user. Resizing of the browser might lead to confusion at the user’s end and he may leave your site.
    • Subscribing the user for something without his permission should be avoided: Subscribing the user for newsletters or any other thing without his permission can annoy him and he might lose trust in you.Overuse of Flash must be avoided: Flash Images eat up a lot of space, increases the loading time of the sites. Also at times they irritate the visitors, so they use should be minimized.
    • Let the user start a music file: If a music file is being inserted to a site, then its control must be left on the user.
    • Do not clutter your website with badges: Use of badges of networks and prizes seems very unprofessional.
    • Contact details must be added: Contact details of the website owner must be added. Its absence might make you lose important feedback.
    • Do not use a homepage that just launches the “real” website: A site should be designed in order to provide ease to the users. There shouldn’t be much steps to reach the main content as it reader’s might lose interest.
    • Ensure that the “Back” button is not broken: Use of some JavaScript Links and new browsers may break the ‘back’ button. After its broken the visitor might not come back to your site.
    • Do not use blinking text: it is an outdated style, simply avoid it.
    • Complex URL structures must be avoided: Simple URL structure with keywords should be used as it helps in improving your search engine rankings and also makes the search and read of the visitor easier.
    • CSS to be preferred HTML Tables: It will allow you save a lot of time and will speed up the downloading time.
    • Ensure that the users can search the whole website: ensure that the users are able to navigate through your whole website easily.

      • We are leaving the discussion in mid, as there are many other common mistakes. We will talk about them in the succeeding part of our blog.

    style=”text-align: center;”

    Posted in Web Design | Tagged: , , | Leave a Comment »

    Allow Search Engine Spider to Spend More Time on Web Page

    Posted by weblinkindia on November 16, 2009

    Search Engines like Google, MSN, Yahoo, etc. have their specialized spiders (most prominent being the Google spider) that are Search Engine Optimizingdesigned to crawl over the net, search for websites and then rank them according to their worth. High ranking on a search engine ensures maximum exposure to the users, which in turn means more business. Websites are designed keeping in mind the parameters that a spider uses while finding a site. The higher rankings on the search Engine depends on the time a spider spends on a website.

    The following are the factors that a web designer should apply while creating a site:
    Ø Optimal Utilization of SEO tactics
    Ø Good link structure and site architecture
    Ø Use of dynamic URLs must be avoided
    Ø WebPages should have a fast download time
    Ø XML Site Map

    Optimal Utilization of SEO tactics :- SEO provides certain guidelines that help the sites to be easily tracked by the search engine spiders. The SEO tactics enables a website to acquire better search engine rankings. The various guidelines that SEO offers us are:-

    1. Keywords and Meta Tags – to be primarily used on the front page
    2. Use of hyperlinks- links that take you to other sites
    3. Images to be marked with keywords
    4. Use of Bookmarking
    5. Use of Blogs

    Good link structure and site architecture : - The site should be designed to ease the spider’s crawling. If there will be more than two or three clicks to reach the main product range or services, there is a possibility that the spider does not reach there. So it is important to design the site carefully, also almost all the pages should contain links that are attached to other pages. This will help the search engine spider to stay longer on your site.

    Use of dynamic URLs must be avoided :-  A URL that is not in plain English mostly traps the spider, which in turns leads to possibility of spider not analyzing your site. So, links in simple and plain English must be used. Also hyphens should be used instead of underscores so as to allow easy navigation of the search engines spiders.

    WebPages should have a fast download time :-  ensure that your site is concise and takes minimum amount of time to be uploaded. This will ease the spider to easily navigate through their site.

    XML Site Map :-  With the help of a Site Map, list of pages in a website is highlighted. Site Map should be submitted to the search engines in order to speed up the navigation process.

    Besides these web designers should also be careful while using flash and should also ensure that the content of the site is not duplicate.

    All the above points are highly beneficial and effective. Their use guarantees the prolong stay of search engine spiders on your website and hence increase the opportunity of your site to be ranked higher.

    Posted in Search Engine Optimization | Tagged: , | Leave a Comment »

    Advance CSS optimization tips and techniques

    Posted by weblinkindia on November 14, 2009

    CSS optimizationIn the present scenario, where ‘Time is Money’, people hardly wait for the sites to open. Internet is flooded with information laden sites, if one takes time to load, people switch to other. In order to avoid this to happen to your webpage or site, various CSS optimization techniques can be improvised. CSS optimization is a process that aims at reducing the extra load of WebPages or Sites, which in turn lead to their speedy loading and hence help them escalate the search engine rankings. It is updated at recurrent intervals of time so as to provide you with tips to design a site that is easy to load.

    Tips and techniques of Advanced Optimization: -
    >> Smaller style sheets
    >> CSS Sprites
    >> CSS layout and positioning control
    >> Faster tables
    >> Substitution

    Smaller style sheets :-   To minimize the loading time of the websites one has to reduce the size of the style sheets. This can be done by using Shorthand Properties, selecting and grouping similar classes that have same CSS declarations.

    > Group Selectors:-
    Selector is one of the CSS syntax, which is usually the HTML tag that we wish to define. By selecting the similar group of selectors we save a lot of time. We separate each selector with the help of a comma.
    > Selector Specificity:-
    It is a method, which is used to determine as to which set of rules should be given priority in CSS when more than one rule can be applied to an element. By using similar level of rules leads to code redundancy and style clashes. If a code is reduced by merging its common properties, lot of weight of style sheets can be lessened.
    > CSS Shorthand:-
    It is a property of CSS that allows us to state various properties using one. It eases the web designers to make concise CSS code and applies style to markup.

    CSS Sprites :-  with the help of CSS sprite, a single image file can be created that consists of many images in a grid form. Only single image is required to be placed on the webpage, while rest of the images can be shown using a property of Background Positioning.

    CSS layout and positioning control: - In order to completely optimize the HTML document one needs to transform the code from tables to CSS layout. This method will lead to faster loading of sites.

    Faster tables:-  CSS can be used to align your table and add background colors, which add style to your sheets and helps in improving the flexibility and speed of the web page or site.

    Substitution:-  CSS based effects can be substituted by JavaScript techniques like menus or rollovers and tables

    These CSS guidelines or tips will let you create a web page which is compact and yet loaded with all the requisite information. Also these speed up techniques will readily allow your sites to upload faster and hence increase the traffic on your site.

    Posted in CSS, Web Design | Tagged: , , | Leave a Comment »

    CSS3-The Future of Web Design

    Posted by weblinkindia on November 11, 2009

    css3With the emergence of Cascading Style Sheets (CSS), the appearance of web pages has revived manifold as they give are equipped with impressive tech features. Now, the boring Web Pages can be replaced with colors and properly aligned tables and graphics. CSS1 and CSS2, officially recommended By W3C, came up with several innovative CSS layouts that changed the face of web designing. The newest version is CSS3, imbibed with countless features that are time saving and are designed in order to satiate the mounting expectations of the new generation. It is giving new dimensions to web designing and taking it to an advanced lap.

    How is CSS3 more advanced than CSS1 and CSS2?
    CSS3 enables the web designers to work in a print-like environment, which is suppler than other existing versions. It lets the webmasters exercise their creativity. As compared to CSS1 and CS2 which have the capability of supporting distinct features like Font Properties, Tables, Margins, Borders, Absolute & Fixed Positioning, Z-Index etc., CSS3 has several new capabilities in store for you.

    Features of CSS3
    >> Multi-column layout
    >> Layered backgrounds
    >> Opacity
    >> RGBA

    Multi Column Layout : -  CSS3 contains a special component that enable us to place content in columns as usually seen in newspapers and magazines. It also gives option to customize the properties (Gaps, Dividers and Rules) of the columns as per requirements. This eases the users to read and understand the content.

    Layered Backgrounds :-  This feature enables numerous background pictures to be applied to the web page or to a small content area. The specialty of the feature lies in its time saving ability and minimum loading time. Also it enables us in creating round-cornered boxes.

    Opacity :-  The existing web pages are opaque and nothing is visible underneath them. With this feature of CSS3 the opacity level can be reduced, offering heaps of design possibilities. This feature has to be implemented as placing plenty of designs can lead to chaos.

    RGBA :- This highly advanced feature is a color mode property, which helps in addition of alpha-bending and shadow blending to our Style Sheets. It also enables us to reorganize our CSS and make use of buttons easier.

    CSS3 is not yet supported by all web browsers but it is huge leap taken in the field of web designing. People are waiting to use these highly advanced features that will allow them to exercise their creative flair. CSS3 will pave the way for the next high-tech lap of web designing.

    Posted in CSS, Web Design | Tagged: , , | Leave a Comment »

    latest trends in SEO?

    Posted by weblinkindia on November 7, 2009

    It is very essential to update the SEO trends because website designers randomly employ the tricks as to how their sites can get higher ranking. To sideline the websites, which frequently use keywords and Meta tags to make themselves easily detected by the search engine spider, search engines have to upgrade themselves. Text optimization, Flash optimization and Image optimization have been the firm pillars of SEO, which have enabled the websites to acquire higher search engine rankings. With the advancing of time, novel and more organized trends have emerged in the market.

    The latest trends adopted by SEO:
      Geographic optimization
      Social Bookmarking
      Article Marketing
      Blogging
      Inbound Links

    seo

    seo

    Geographic optimization:  Besides image, text and flash optimization, geographic optimization is a technique of SEO that a website designer incorporates on the demands of the client. The aim of this optimization method is to include web pages on search engine’s listings for users who streamline their search on the basis of a particular geographical location. This method lets you find the right market for your business and simplifies the marketing strategies.

     Social bookmarking:  It is yet another budding trends in SEO, through which an internet user can search, organize, manage and share bookmarks (internet shortcuts). Descriptions in the form of metadata (text comments and tags) are added to the bookmarks that a user can view without downloading the resource.

    Advantages of social bookmarking:

    1. With the emergence of social bookmarking, more internet users have started using bookmarks in order to share their common interests of pooling web sources.
    2. The bookmarking services allow the users to save and access bookmarks anywhere.
    3. This method is more efficient than many classification software like search engine spiders.
    4. The web pages that remains unnoticed by the web spiders are easily found and bookmarked by the process of social .
    5. bookmarking and also ranks a website on the basis of the number of times it has been bookmarked..

    Thus it has been an effective way by which a site can increase its rankings.

    Article marketing:  Companies, in order to promote their trade have adopted a new trend of article marketing. In this short articles related to the respective businesses are written and released for distribution in the market. Each article comprises of a byline and a bio-box, which include contact information and references of the author’s trade. The articles with well-written content increase the prospects of drawing more clients and also helps escalating the author’s business reliability. The bio box within the article mainly contains backlinks that takes the visitor to the author’s main website. This in turn leads to higher ranking of the website. Article marketing has proved its worth as a strong SEO trend by enabling numerous internet marketing ventures to gain success.

    Blogging:  Quite new and popular trend. In fact putting up your content rich blogs on various blogging sites like blogflux, wordpress, blogspot, etc. has become the latest trend of promoting your business on internet. It has proved to be highly effective to improve your website’s ranking on the leading search engines.

    Inbound links:  They are hyperlinks transiting domains. These links are the references that take the reader to another document, hence promoting it. They are of great significance as several search engines rank web pages based on the number of inbound links it contains.

    If all these trends are followed and incorporated during designing of your website it will definitely make your website crawled faster by the search engine spider and your website will receive higher ranking. Higher ranking in turn means more visitors and more business, actually getting the desired from your website.

    Posted in Search Engine Optimization | Tagged: | Leave a Comment »