Кар'єра в IT: посада HTML coder (верстальник)

Представляємо нову статтю із серії «Кар'єра в IT» . Вона присвячена посади верстальника, чия робота виступає сполучною ланкою між роботою дизайнера і програмістів. HTML coder — це фахівець, який з намальованого дизайнером макета створює web-сторінку, використовуючи HTML/CSS. За даними ДОУ , середньому українському верстальщику 26 років, він має зарплату $300-800 і досвід роботи 1,5 роки. Завдання та обов'язки Основне завдання верстальника — перетворення дизайну у зовнішнє оформлення сайту, тобто з формату PSD (рідше — з Sketch або інших форматів) — в код. Таким чином, він створює HTML-сторінку, яка повинна виглядати в точності як затверджений замовником макет дизайнера, і з якої далі працюють front-end і back-end розробники. Головні інструменти при верстці HTML і CSS, а також JavaScript для створення більш складних елементів, наприклад, слайдерів, анімацій, паралаксів, модальних вікон, реалізації простої логіки (наприклад, валідація форм).

Опубліковано: 03/11/16 @ 08:00
Розділ html та css Читати далі...

17 вересня, Харків — KharkivCSS

17 вересня в Fabrika.space пройде конференція KharkivCSS . Будуть порушені тільки найцікавіші теми: сучасні стандарти, технології, архітектурні підходи та методології. Мета конференції — за один день розглянути все що стосується верстки. Початківці дізнаються, на що слід в першу чергу звернути увагу, з чого почати і що є актуальним на сьогоднішній день.
Розробники з досвідом зможуть покращити свої знання та отримають багато корисних порад від кращих front-end розробників України.
А ті, хто уникають верстки, дізнаються, наскільки вона може бути простою і, одночасно, захоплюючою.

Опубліковано: 19/07/16 @ 05:36
Розділ html та css Читати далі...

Frontend дайджест #16: Реактивні Redux, PostCSS в Facebook, React-Router від TJ

У випуску: опен-сорсный CI на Node.js, вчимося ставити питання у Дена Абрамова, чекаємо Typescript 2.0 і Webpack 2.x. Почитати Як працюють в флексбоксе z-index і автоотступы. Asking Good Questions — задаємо правильні питання, поради від Дена Абрамова. Як ми розробляємо новий фронтенд Tinkoff.ru . Pixel Density, Demystified — як щільність пікселів змінила світ. Bootstrap 4: A Visual Guide — порівнюємо бутстрапы. Recreating the Twitter Heart Animation (with One Element, No Images, and No JavaScript) . Writing for all people: how to use alternative text well — як правильно використовувати alt-теги. requestAnimationFrame Scheduling For Nerds . Flex Layout Attribute — декларативне опис розкладки з допомогою HTML-атрибутів. Autofill : чого не знають веб-розробники, хоча повинні знати. Дуже простий алгоритм підбору кольору, який працює. Improving CSS quality at Facebook and beyond — PostCSS в Facebook. The Progress of Web Apps — веб-додатки з'являться в Windows Store.

Опубліковано: 15/07/16 @ 09:59
Розділ html та css Читати далі...

Як ми запустили свій pet -проект : перший успіх

Всім привіт . У цей важкий і неспокійний час , поки одні готують трактор, інші пробують себе в політиці , а решта підкорюють жіночі серця , ми , програмісти подрібніше , продовжуємо працювати, в тому числі і над своїми власними проектами . Цей пост - розповідь про нашому домашньому проекті. Ми створювали його паралельно з основною роботою , буквально на колінах , а через 2 місяці успішно запустили на кікстартера . Ідея Все почалося близько двох років тому, коли мені подарували arduino ( апаратно- програмна платформа для швидкого прототипування ) . Ще в студентські роки мені хотілося спорудити якесь робочий пристрій і запрограмувати його , але мене завжди лякали всі ці паяльники, вольти -ампер і складність мікросхем . Та й часу якось особливо і не було, бо дівчата , алкоголь, доту і робота. З Ардуїнов ж моя мрія збулася : я міг створювати примітивні пристрої , просто займаючись улюбленою справою - програмуванням.

Опубліковано: 16/02/15 @ 11:09
Розділ html та css Читати далі...

Дайджест: проблеми рекрутингу, CSS- каламбури , що означає « робити», війна дронів

Новини Фонд BrainBasket запустив сайт про IT -освіті Open IT .Українські ІТ- інтегратори заснували Асоціацію digital Ukraine . Опублікований Рейтинг найвпливовіших персон уанету .Вийшло дослідження Ukraine Dealbook IT and Internet Market 2012-14 .Odesk закриває акаунти користувачів в Криму і заморожує кошти . Нові версії Go 1.4 QEMU 2.2.0Ruby 2.2.0Rails 4.2Qt 5.4PostgreSQL 9.4Fedora 21 Розробка R language for programmers . The Worst Programming Language Ever . A Formula for the Number of Days in Each Month . Howto Що значить " зробити " і що означає" робити ".Секрети найму : Рекомендації співробітників . Як " айтішників " переїхати в Америку : 6 Лайфхак від Олександра Пацая з Parallels . А також 10 best countries to live for software engineers . How to Send Email Like a Startup . Why Side Projects Should Be Stupid .Paul Graham : How to Be an Expert in a Changing World . Війна Інтелігенція у бліндажі .

Опубліковано: 26/12/14 @ 07:38
Розділ html та css Читати далі...

Які сайти піднялися / опустилися в Google в 2014 році?

Спонсор поста - PropellerAds - рекламна
мережу для RU, SE, AU , FI , NO, DK , FR, GB, UA , US сайтів Чим Google відрізняється від Яндекса ? Чи не нове питання, але все не так вже й складно. Яндекс любить трастові та/або узкотематічние сайти, а Google в кінцевому підсумкуволіє хороші . Ситуація, в общем-то, хрінова . Оскільки ніякої визначеності немає. Чогось там гарантовано лише лідерам не за обсягами інформації, а по цінності цієї інформації , типу woman.ru (сильний форум) або banki.ru . На сьогодні тільки лише в G. може бути така ситуація, що величезний трастовий портал з купою оптимізованих (але без перебору ) статей йде в попу. Ось як виглядає графік kakprosto.ru з semrush : Таких прикладів багато. Щось схоже у fb.ru , з тією лише різницею, що у нього в G. завжди було не дуже . За джерелами трафіку зараз кращий аналізатор це similarweb - http://www.similarweb.com/website/fb.ru Але це не означає, що G. цілеспрямовано мочить сайти з різношерстої інфою (робити йому нічого) .

Опубліковано: 14/12/14 @ 01:11
Розділ html та css Пошуковики Читати далі...

Дайджест: інтерв'ю із засновником WhatsApp , архітектура CSS, чим хороша 60 -годинний робочий тиждень

Добрий день , шановні читачі. Новини GitHub представив Atom - новий редактор коду. Поки що йде бета -тестування . ВКонтакте виклав у відкритий доступ код KPHP . Розкрито особистість творця Bitcoin Сатоши Накамото . StackOverflow запустився на португальській мові і розповідає , чому одного англійського мало. Стівен Вольфрам розповів про свій новий мова програмування. Історія James Iry's history of programming languages ??( illustrated with pictures and large fonts ) . Інтерактивна інфографіка про історію компанії EPAM . Яків Файн про розробку сьогодні і 20 років тому . Інструменти 10 tools to help open source cities maintain transparency . Sublimall - плагін для синхронізації налаштувань SublimeText на всіх пристроях.   Visual Programming Languages ?? (великий список з скріншот ) . Методологія Complaint - Driven Development . Архітектура CSS і Культ карго CSS . Як почати займатися opensource - розробкою . HR Ігор Кононученко : як я найняв Юру Богданова .

Опубліковано: 07/03/14 @ 11:25
Розділ html та css Інтерв'ю Читати далі...

Дайджест: статистика HTML5 , Андрій Хорс про формальності , " алкочувствітельний " Git

Добрий день, шановні читачі. НовиниОдин з головних лобістів податкових пільг для IT-галузі - молодший син президента країни Віктор Янукович - покинув профільний парламентський комітет . Аналітика Як розробники використовують HTML5 - аналітика і інфографіка . Хроніка одного троллінгу: «Чи потрібні білоруським програмістам європейські цінності »та деталі до портрета «будіміровского айтішника» . Погляди Про перспективи JavaScript . Програмування як мистецтво і думки про вічне . Система STEPS : двадцять тисяч рядків коду, які змінять програмування, операційні системи та інтернет - альтернативний підхід до архітектурі ПЗ від Алана Кея. Інтерв'юАндрій Хорс: «Не можна довіряти людям, які не знають Сашу Грей » ТеоріяЯк навчитися не спізнюватися . Практика Doppio - браузеронезавісімая JVM, написана на Coffeescript Нові версіїРеліз http-сервера nginx 1.4.0 Цікаве Інноваційний маніпулятор від Thalmic Labs.
Як роблять планшети на китайських заводах.

Опубліковано: 26/04/13 @ 08:33
Розділ html та css Читати далі...

Maxymiser запустив курси по JavaScript / HTML / CSS

Компанія Maxymiser запустила ІТ-академію в своєму Дніпропетровському офісі по напрямку JavaScript/HTML/CSS . Перша група у складі 40 студентів розпочала навчання 7 листопада, повідомили у HR-відділі. «Ми стартували поки з однієї групи і лише у напрямку JavaScript/HTML/CSS, і вже час покаже, як швидко ми будемо розширюватися», - сказано в повідомленні. Двогодинні заняття будуть проходити по середах і суботах в офісі компанії «Maxymiser» за адресою вул. Барикадна, 1-а. Курс Maxymiser Academy включає в себе вивчення роботи чистого JavaScript, HTML і CSS. Крім того, будуть розглянуті питання, які стосуються пошуку помилок, організації коду, оптимізації та налагодження. Набір в першу групу закритий, але заявки приймаються на наступну групу, яка буде стартувати в лютому-березні. Реєстрація проходить через email hr@maxymiser.com , у відповідь прийде тестове завдання. «Попит на актуальне освіта в сфері ІТ-технологій набагато перевищує пропозицію.

Опубліковано: 14/11/12 @ 08:40
Розділ html та css javascript Читати далі...

16 листопада, Вінниця - Speakers ' Corner : Використання сучасний технологій та фреймворків з JavaScript і HTML5 для розробки прототипу додатку всього за кілька годин

Якщо Ви стежите за трендами в веб - розробці , Вам цікаві нові і випробувані можливості JavaScript і HTML5 , ви живете або тимчасово перебуваєте у Вінниці - то у нас чудові новини саме для Вас! Юрій Сильвестров і Михайло Валків представляють свій нашумілий доповідь на тему « Використання сучасний технологій та фреймворків з JavaScript і HTML5 для розробки прототипу додатку всього за кілька годин » у вівторок 16 листопада всім бажаючим в рамках чергового заходу серії Ciklum Speakers ' Corner . У доповіді будуть детально розглянуті такі поняття як : • MVC в JavaScript
• jQuery і плагіни jQuery
• AngularJS
• RequireJS
• Модулі та AMD
• Twitter Bootstrap
• Простір імен JavaScript
• Чуйний веб - дизайн ( Responsive design ) • аспектно- орієнтоване програмування Запрошуємо всіх бажаючих прийняти участь у сесії і задати всі питання . Участь безкоштовно за умови обов'язковій реєстрації тут - > goo.

Опубліковано: 12/11/12 @ 08:39
Розділ html та css javascript Читати далі...

jQuery - плагін для стилізації елементів html - форм ( input [ type = checkbox ] , input [ type = radio ] , input [ type = file ] , select )

У даному плагіні я об'єднав 3 своїх попередніх jQuery - плагина, плюс додав можливість стилізації полів для відправки файлів . Таким чином , він дозволяє стилізувати за допомогою CSS наступні html - елементи : список, що розкривається ( окремий плагін ) . прапорець ( окремий плагін ) ; перемикач ( окремий плагін ) ; поле для вибору файлу ; Демонстрація роботи плагіна Живі приклади можна подивитися на окремої сторінки . Варто зауважити, що при оформленні елементів форм я не використовував жодного зображення .

Опубліковано: 09/10/12 @ 11:18
Розділ html та css javascript Читати далі...

Дайджест : компанії йдуть до Дніпропетровська, Qt куплений, типізація розробників, CSS Blending

Добрий день, шановні читачі. Минулий тиждень ознаменувався підвищеною увагою вітчизняних IT-компаній до Дніпропетровська: там відкрилися офіси відразу двох гравців ринку - SoftServe і DataArt . Також варто згадати 79-сторінкову брошуру під назвою Exploring Ukraine. IT Outsourcing Industry , яку випустила асоціація Hi-Tech Initiative. Любителям цифр і статистики має сподобатися. Новини Випущений Sqitch 0.80 , простий засіб управління змінами в базах даних; закони Німеччини викладені на Github з обіцянкою подальших оновлень; компанія Digia купує Qt у Nokia представлений Jython 2.5.3rc1 , імплементація Python для запуску на Java- машині. Практика In-app-proxy - код для емуляції системи покупок з додатків в AppStore; плагін Zen Coding 0.8 для редактора Sublime Text 2.

Опубліковано: 10/08/12 @ 08:12
Розділ html та css Блоги Читати далі...

Приклад верстки пошукової форми для сайту на HTML5 та CSS3

Після публікації вчорашньої статті з верстці пошукової форми мене розкритикували, мовляв верстка відстій , є ж сучасні HTML5 та CSS3 . Я, звичайно , розумію , останні стандарти це круто і все таке. Але справа в тому, що верстаю я, як правило , під замовлення , а там в більшості випадків важлива повна ідентичність в різних браузерах, що не дозволяє використовувати останні технології. Тому я орієнтуюся в першу чергу на кросбраузерність і пошукову форму за звичкою зверстав "по- старому". Загалом , цим постом виправляю ситуацію ( на догоду незадоволеним минулого статтею =) і пропоную свій варіант верстки тієї ж самої пошукової форми, але вже з використанням технологій HTML5 та CSS3 .

Опубліковано: 19/07/12 @ 09:09
Розділ html та css Пошуковики Читати далі...

Почастішали зломи сайтів

Участілісь зломи сайтов Почастішали зломи сайтів Злом сайтів і розсилка з їх допомогою спаму стала не такою вже великою рідкістю на просторах інтернету. Також злом сайтів може проводитися для того щоб з їх допомогою переправляти користувачів на сторонні ресурси - для цього на зламаному сайті поширюються різні посилання, зацікавившись якими користувач виявляється зовсім не там, куди очікував потрапити. І основна проблема полягає в тому, що часто навіть самі власники сайтів або майстра, чиєю професійним обов'язком є ??створення сайтів , не можуть визначити, що їхній сайт був зламаний. Дізнаються вони про це лише за те, що в пошуковій системі Google з'являється позначка про те, що сайт може містити шкідливі програми. Причому, самі віруси навіть досвідчені веб-майстри далеко не завжди можуть виявити або знешкодити. Тому подібну позначку Google вони розцінюють, як помилку пошукового робота, про що і повідомляють Google у своїй претензії.

Опубліковано: 14/06/12 @ 08:57
Розділ html та css Безпека Читати далі...

jQuery - скрипт для стилізації селект ( тег select ) html -форм

Одна з найнеприємніших (і я б навіть сказав жахливих) речей в веб-розробки - це верстка html-форм. На жаль, не існує єдиного стандарту відображення елементів форм, незалежно від браузера та операційної системи, так само, як і немає можливості довільно оформити деякі з цих елементів, використовуючи каскадні таблиці стилів. Не піддаються повної стилізації наступні елементи html-форм: розкривається ; прапорець ; перемикач . поле для відправки файлу . Як вже зрозуміло з заголовка поста, тут мова піде тільки про селект. Існує немало готових рішень у вигляді jQuery-плагінів для стилізації розкривних списків. Але я (з огляду на те, що жоден з плагінів мене не влаштував з тих чи інших причин) вирішив піти шляхом винаходу свого колеса і написав власний jQuery-скрипт (не плагін), яким і ділюся в даній статті. Відразу хочу помітити, що даний скрипт не підходить для всіх можливих випадків застосування селек (читайте недоліки).

Опубліковано: 02/04/12 @ 05:28
Розділ html та css javascript Читати далі...

Елегантна форма авторизації з використанням CSS3

Продовжую ділитися версткою елементів інтерфейсу для сайтів. Як і в своїй попередній статті , я взяв цікавий приклад з сайту PremiumPixels.com і зверстав його, використовуючи CSS3 . На цей раз це форма авторизації . У дизайні цієї форми використовуються приємні ніжні кольори , тому виглядає вона дійсно елегантно. Дивлячись на подібну красу , у мене завжди виникає думка про те , як же здорово бути дизайнером і вміти витворяти такі речі. Я для себе вже знайшов застосування цієї форми. Якщо і вам вона теж сподобалася, то ви також можете використовувати її на своїх сайтах. Далі в статті, пройшовши за відповідними посиланнями , ви знайдете необхідний вихідний код.

Опубліковано: 23/01/12 @ 07:17
Розділ html та css Читати далі...

Красиві 3D -кнопки за допомогою CSS3

Чудова технологія CSS3 дозволяє в ряді випадків при оформленні сайту відмовитися від використання зображень, які замінює чистий CSS- код. Наприклад , подібним чином можна вчинити з будь-якими кнопками, використовуваними на сайті. Є один чудовий дизайнерський англомовний блог PremiumPixels.com , автор якого безкоштовно ділиться гарними елементами інтерфейсу для сайтів. Мені дуже подобається стиль цього дизайнера, він малює обалденно . Я вже неодноразово використовував на своїх блогах його полезняшкі , і однією з цих полезняшек став набір красивих 3D -кнопок . За допомогою CSS3 я " намалював " практично копії цих кнопок , кодом яких і поділюся в даній статті.

Опубліковано: 02/01/12 @ 02:19
Розділ html та css Блоги Читати далі...

Сайти на голому html

При створенні мануала по роботі з однією біржею в якості оптимізатора для публікації на terehoff.ru зіткнувся з такою проблемою як голий html. В принципі відкриваючи вихідний код різних сайтів я все розумію, а от коли сам починаєш чогось там витворяти - особисто в мене виникають питання. Я знаю як працює CSS і для чого він потрібен. Я знаю html теги, в першу чергу під SEO. Але особисто мені простіше поставити завдання верстальщику, проконтролювати її виконання і заплатити йому за роботу. Тому що верстальщик зробить це за 5 хвилин, а я витрачу 30, перш ніж розберуся що до чого. А мої 30 хвилин коштуватимуть мені набагато дорожче, ніж 5 хвилин верстальника. З іншого боку, досить один раз розібратися, щоб потім оформляти статті так само швидко, як писати пости на движку wordpress - написав у блог клієнта і залив. Всі плюси сайтів на голому html є мінусами сайтів на движках (в даному випадку порівнюю з wordpress).

Опубліковано: 13/09/11 @ 07:30
Розділ html та css Блоги Читати далі...

Значення HTML 5 для пошукової оптимізації

Як HTML 5 може впливати на SEO? Які можливі дії HTML 5 на алгоритми пошукової системи? Цим питанням присвячена ця замітка. Значення HTML для пошукової оптимізації Хоча робота над ним ще в процесі, HTML5 - наступний основний крок для перегляду стандарту HTML. HTML, який є мовою розмітки і дозволяє вебмайстрам структурувати і надавати веб-контент, дуже важливий для пошукової оптимізації. Саме HTML дає пошуковим системам розуміння того, що знаходиться на веб-сторінці. Сегментація веб-сторінки і розширена семантика Один з ключових компонентів HTML5 - додавання нових елементів. Це допомагає покращити сегментацію веб-сторінки так, щоб різні області - такі як header, footer, район основного змісту і т.д, можна бути легко відрізнити один від одного. Як тільки HTML5 отримає більш широке поширення, пошукові системи зможуть використовувати ці нові елементи, щоб знайти цікавлять області сторінки. Зараз ми використовуємо для організації веб-сторінки.

Опубліковано: 12/07/11 @ 03:00
Розділ html та css seo Пошуковики Читати далі...

Цифровий годинник на чистому CSS і jQuery

Дивлячись днями на циферки на лічильнику Лі.ру, в моїй голові несподівано зародилася дуже погана ідея - мені захотілося створити цифровий годинник, які б точно повторювали ті самі циферки з того самого лічильника. Ця ідея ніяк не давала мені спокою, поки я не втілив її в реальність. Чесно кажучи, я смутно уявляю користь від присутності таких годинників на сайті, але час бездарно витрачено, і не пропадати ж добру, тому викладаю в паблік те, що в мене вийшло. Не виключено ж, що кому-небудь знадобиться. Приклади Зробив окрему сторінку з десятком прикладів. Через те, що вони всі на одній сторінці, процесор вашого комп'ютера може трохи напружитися. У другому прикладі я зробив точну копію цифр з лічильника лі.ру. Як це працює Годинники працюють повністю на jQuery. Самі ж цифри малюються на чистому CSS (тобто ніяких картинок і ніякого тексту). Кожна цифра складається з 25 блоків, які за допомогою CSS шикуються в квадрат 5 ? 5.

Опубліковано: 29/04/11 @ 12:33
Розділ html та css javascript Читати далі...

1 2