Объединение HTML, CSS и JavaScript


Надеюсь, этот вопрос не слишком широк...

Я компетентный программист iOS и имею некоторый опыт работы с Java (инструменты командной строки). За последние год или два я увлекся HTML, CSS и JavaScript. Изучая iOS и Java, я начал с книги ( Программирование на Objective-C (Кочан) - это был мой первый язык, кроме крошечного кусочка C), и как только я разберусь с синтаксисом, я просто перейду к источнику документации и разберусь. Я знаю синтаксис HTML, CSS и JavaScript, но я не знаю, как объединить все это в "современную"/хорошо оформленную веб-страницу. Я могу выполнить простое форматирование, запустить несколько сценариев, но макет по-прежнему выглядит так, как будто он был разработан 90-летним руководителем банка в дешевом костюме. Я не вижу, как объединить языки на веб-странице…Учитывая статические изображения, я не смог бы собрать макет сайта SO, например. Я знаю о тегах <img> и базовой позиции CSS, но это просто не собираются вместе ради меня. Я также нахожу, что та небольшая "официальная" документация (W3Schools), которая существует, довольно поверхностна и не очень хорошо объединяет все вместе... но это может быть просто потому, что я не знаком со всем.

Может ли кто-нибудь порекомендовать какие-либо действительно хорошие ресурсы (веб- или печатные, предпочтительно не видео, так как я хотел бы работать в своем собственном темпе), которые могут мне помочь?


Добавление: Исходя из настольной платформы, я привык к тому, что вещи находятся там, где они имеют гораздо больший контроль над аспектами, в первую очередь над макетом пользовательского интерфейса, но также над методами ввода и обработки данных - iOS и Java имеют гораздо более богатые библиотеки, чем JavaScript. Как мне обойти этот менталитет? У кого-нибудь есть какой-нибудь личный опыт?

Обновление 1: Спасибо за ответы (это больше для комментариев; ответ Давео довольно полезен). Тем не менее, я хочу сказать, что мне нужна помощь не в реальном дизайне - это преобразование дизайна в код, а не только в форма макета/макета, но также и в фактическом удобстве использования.

Author: FeifanZ, 2011-08-17

2 answers

Большинство комментариев верны, хотя W3Schools появляется в поисковых системах Google почти так же часто, как википедия, ни один из них на самом деле не является тем, что вам нужно изучить. С полными спецификациями можно ознакомиться по адресу W3.org где есть страницы для HTML 4.01, XHTML-файл, CSS1 и CSS2, а также такие предстоящие вещи, как HTML5 и CSS3 черновики. Это места, куда можно обратиться за точными описаниями того, как все работает.

В дополнение к трем навыки, которые вы упомянули, html, css и javascript, вам также следует подумать о добавлении языка на стороне сервера в свой набор инструментов и базу данных. Есть из чего выбрать, но так как вы говорите, что знакомы с C, я бы предложил попробовать PHP для серверных сценариев и MySQL для баз данных. Эти пять предметов я использую каждый день.

Вы упомянули, что привыкли иметь библиотеки на Java, к которым вы можете обращаться. Такие вещи действительно существуют в мире html/css/javascript. Существуют библиотеки javascript и фреймворки, такие как jQuery, Учебные курсы и Додзе включают другие. Для CSS также существуют фреймворки, такие как Blueprint, ЮИ, jQueryUI (джкерьюи, 960 и даже больше. Это может помочь вам продвинуться по пути к созданию удобного, современного дизайна для вашего сайта.

Что касается того, как учиться. Довольно сложно начать с чистой страницы и проработать все с нуля. Это было бы похоже на то, как если бы новому строителю дома дали пустой участок земли и велел попытаться построить дом. Первый дом, который он построит, будет ужасным, второй немного лучше. Вместо этого строитель изучает одну профессию за раз. В первый год он мог только таскать кирпичи. Тогда он мог бы научиться смешивать цемент и так далее. Ему может быть 40 или 50 лет, прежде чем он узнает все аспекты и сможет работать над целым проектом от начала до конца, и даже тогда он будет полагаться на опыт других людей для выполнения многих задач.

Вместо этого начните с сайт, который уже в значительной степени завершен. Затем вы можете поиграть с CSS и узнать, что происходит. Измените значения и добавьте стили. Когда вы все испортите, вернитесь к началу и начните сначала. То же самое с html и javascript. Играйте по существующему шаблону и изучайте по одному навыку за раз. Возможно, было бы неплохо начать с CMS, такой как Drupal или Wordpress, и создать простой сайт, затем попробуйте отредактировать CSS, написать свои собственные файлы шаблонов или создать свои собственные плагины из них системы. Как только вы порежете зубы, вы можете попробовать построить свой собственный сад с нуля.

 3
Author: Rincewind42, 2011-08-18 14:43:29

Во-первых, вам, вероятно, следует задать этот вопрос по адресу http://webmasters.stackexchange.com

Во-вторых, W3Schools учит синтаксису и правилам, но не аспектам дизайна веб-сайтов. Вы должны посмотреть, как покрыть документ PhotoShop в CSS и HTML

Например, см.

Http://csshowto.com/layout/psd-to-csshtml-in-easy-steps-part-1/

Http://designm.ag/resources/converting-psd-to-html/

 1
Author: Daveo, 2011-08-17 23:20:55