Skip to main content

Posts

Showing posts with the label html5

Website complete: presojaidej.com

Presojaidej.com is a service that offers reviews of ideas for a competitive price. This being one of my first websites I developed I want to explain my workflow and reasoning while creating it. Dislaimer: I am only the developer and designer of the website; it is owned by E-amiga, d.o.o. I was given a lot of freedom regarding the look of the website, so it was an enjoying small project. The only guideline I was given is the general form: the client wanted it to be on one page, so that there are fewer clicks required by the user to order a business idea review. I wanted to create a website that looked professional and had a large conversion rate (the percentage of users that order the service after visiting the website). The professional look was achieved with clear lines, and attention to detail: the background patterns, the differences in border colors to imitate slight depth and a snappy feeling on hovering over the buttons among others. The resulting page is easy to scan throug...

Beautiful typography for the web

There are already many websites that have began using custom web fonts using @font-face to beautify their website. getfinch.com Bringing custom fonts to the web increases the range of possibilities for web designers, however it can also be a drawback, if the fonts aren't used carefully. Firstly, novice designer may try to use too many different typefaces on a single website, which can become distracting and disconnecting. It is important to realize when too much is too much. As a general rule, when designing a website I never use more than three fonts. Usually I select a font font the headlines and another for the content. If required I add a third font for lower level headlines, however I prefer to use different alternations of the same font. Secondly, by using too many custom fonts, the size of the website increases. Custom web fonts have the drawback of their size. Using three to five custom fonts on a website can increase its weight by about 0.5MB which is not negligib...

Changing selection color with CSS3

CSS3 is bringing many innovations to web design. One of these is the possibility of customizing the selection color of text, graphics and every other element of the markup. By default, on most browsers, the selection color is a blue and the color of text becomes white. It is now very easy to change this behavior and add a nice touch of color to your website. Changing the selection color can be achieved with the pseudo-element ::selection like this (a vendor prefix is still required for Firefox): ::selection {  background: rgb(131,209,222);       /* Webkit browres*/ color:#336; } ::-moz-selection { background: rgb(131,209,222);       /* Firefox */ color:#336; } This will change the default selection color to a greenish-blue and change the color of the text to a dark blue. The power of ::selection does not end there. It is of equal simplicity to define a different color for each element. In this example  the text of the first para...

IE9 doesn't seem to understand background-color

I have recently created my first website using HTML5. I have used some CSS3 attributes like box-shadow and border-radius , and they render correctly in all browsers except IE. IE is retarded. To enable some HTML5 features in IE I used this code snippet: <!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js" ></script> <![endif]--> While IE8 correctly positioned the elements, it still doesn't support CSS3. Below is a preview of IE8: However, IE9 preview, which brags about it's HTML5 support didn't even render the background-color correctly. What a shame. Surely it's a preview, but it should be better and not worse than IE8. On the bright side, the rest of the CSS, even the CSS3 tags, rendered correctly. See the rounded borders and shadow (looks like a glow) around the image: I am hoping that Microsoft fixes this bug, because regardless this bug the work they have done with hardware ...