Website design refresh

Posted on by

It has been nearly 3 years since I first launched the freestyle developments website and it was long overdue for a design and code refresh. Today I finally relaunched the site.

For me, the biggest change has been to move to a HTML5 doctype. The site now utilises many of the new HTML5 tags, such as header, footer, nav, section, article, aside and time as well as some of the new HTML5 forms attributes. Many thanks goes to @rem and @brucel for their fantastic HTML5 book, which I gleaned a lot of useful information from.

I’ve also given it a bit of a visual refresh, to use some CSS3 properties that I’m now regularly using on sites I build: drop shadows, rounded corners – that sort of eye candy. It means that my CSS no longer validates with no errors, but I’m hoping people in the know will be able to see past the vendor specific CSS property prefix errors e.g. “-moz-”, “-webkit-”.

I’ve gone for a Jello Mold layout to give me the flexibility of a fluid layout within parameters I control. I love fluid layouts, but their biggest enemy is widescreen displays, which makes reading text difficult due to the long line lengths, which is minus points for accessibility.

Assuming your default font size is 16px, my site is fluid between 700px and 1280px. Outside of these browser widths the site is rigid. It means that the site never gets so small that the content is unreadable, and never become so wide that the line width is a hindrance to legibility. Another nice thing about the Jello Mold is that between the max and min, the site re-sizes itself in an organic way, which really has to be experienced to be appreciated (give it a go now, go on).

I’ve also updated my CSS to use the YUI reset sylesheet. I don’t agree with absolutely everything that YUI are doing with their CSS stylesheets, but they have some really interesting ideas and valid points. Either way, it is nice to have part of my styles coming off a CDN and is a bit more up to date than the reset I used to use.

In accordance with my post on the EM unit and browser zoom, I’ve updated my stylesheets and removed all references to pixels in favor of EM’s like I have been doing with all my new website builds for a while now. I don’t set a font size for any of my pages html or body elements, allowing the user to choose the size of my website by setting their default font size for their browser, which is 16px for most browsers.

Anyway, I think that is all I have to say for now. Enjoy the new site and all the interesting tech that comes with it. If this all sounds good to you, and you’re looking for a freelancer like me. Get in touch.

1,244 thoughts on “Website design refresh”

  2. Официальный сервисный центр Miele обеспечивает безопасный ремонт техники с учетом всех технических требований. Особое внимание уделяется проверке электробезопасности. После обслуживания проводится контрольное тестирование. Больше сведений можно найти на сайте: ремонт гладильных катков миле

  3. молодёжный круиз с дискотекой 2026 Круизы на премиальных теплоходах-ресторанах: изысканный вкус и безупречный сервис.

  4. лечение тревожного расстройства и панических атак Панические атаки лечение: верните себе спокойствие и контроль.

  7. Мы вдохновляем на изменения и поддерживаем в повседневных заботах. В нашем журнале вы найдёте советы по здоровью подборки модных образов и статьи о развитии детей. Переходите по ссылке https://universewomen.ru/

  14. spark dex SparkDex is redefining decentralized trading with speed security and real earning potential. On spark dex you keep full control of your assets while enjoying fast swaps and low fees. Powered by sparkdex ai the platform delivers smarter insights and optimized performance for confident decision-making. Trade earn from liquidity and grow your crypto portfolio with sparkdex — the future of DeFi starts here.

  21. pravdahub.com.ua/hlybyna-verkhnikh-shkafchykiv-na-kukhni-optymalni-rozmiry-ta-standarty/

  22. sparkdex ai SparkDex is redefining decentralized trading with speed security and real earning potential. On spark dex you keep full control of your assets while enjoying fast swaps and low fees. Powered by sparkdex ai the platform delivers smarter insights and optimized performance for confident decision-making. Trade earn from liquidity and grow your crypto portfolio with sparkdex — the future of DeFi starts here.

  27. казино бонусы без депозита Получи бесплатные вращения и почувствуй себя настоящим асом азартных игр не внося ни копейки.

  28. Фармилки Сочетание этих методов особенно через удобные Telegram-боты позволяет максимизировать ваш потенциальный доход в мире цифровых активов.

  30. Магия изобилия Юлиана Нумерология откроет скрытый смысл чисел связанных с вашим рождением и жизненным путем указывая на ваши сильные стороны и потенциальные испытания.

  31. удаленная работа для женщин удаленные профессии

  32. Aviator India is a guide site on how to play Aviator: download the Aviator app or Aviator APK log in claim bonuses and use UPI deposits via Paytm PhonePe or GPay. It also covers KYC withdrawals and warning signs of Aviator predictor scam. एविएटर गेम नियम

  37. благоустройство Волгоград Новости Волгограда сегодня: оперативно и по делу. Главные события срочные сообщения и криминальная хроника.

  40. установка вентиляции в частном доме цена Установка приточной вентиляции с подогревом и фильтрацией воздуха. Обеспечение комфортного микроклимата в любое время года.

  43. бюджетный лазерный принтер Лазерный принтер – идеальное решение для быстрой и четкой печати документов. Лазерные принтеры превосходят струйные по скорости и экономии тонера. Хотите лазерный принтер купить? Широкий выбор моделей по доступным ценам Лазерные принтеры купить легко в нашем магазине с гарантией качества. Купить лазерный принтер – значит инвестировать в надежность и производительность. Заказать лазерный принтер онлайн – быстро и без лишних хлопот. Лазерный принтер цена радует: от 5000 руб. за базовые модели. Узнайте лазерный принтер стоимость – выгодные акции для всех покупателей. Ищете лазерный принтер недорого? У нас лучшие предложения Лазерный принтер купить недорого – реальность с нашими скидками до 30. Дешевый лазерный принтер не уступает по качеству печати. Бюджетный лазерный принтер для дома и офиса – оптимальный выбор. Лазерный принтер купить онлайн в 2 клика с доставкой. Заказать лазерный принтер онлайн – удобный сервис 24/7. Лазерный принтер интернет магазин с тысячами отзывов. Интернет магазин лазерных принтеров – ваш надежный партнер. Лазерный принтер каталог: фото характеристики отзывы. Лазерный принтер в наличии – забирайте сегодня Лазерный принтер с доставкой по России бесплатно от 5000 руб.

  45. заказать аудиорекламу Профессиональные аудиоролики – ключ к успеху вашего бизнеса в радиоэфире.

  47. Переходи по ссылке на официальный сайт

  48. мегафон официальный сайт Подключение высокоскоростного интернета в Москве — задача решаемая многими провайдерами включая Мегафон предлагающий разнообразные тарифы для домашнего использования.

  50. квартиры в сарове Продажа квартир в Сарове: ваш ключ к комфортной жизни

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>